@thorprovider/blocks 1.0.0 → 3.0.0

package/dist/blocks/e-commerce/reviews/review-summary.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/blocks/e-commerce/reviews/review-summary.tsx"],"sourcesContent":["import { Star } from 'lucide-react'\nimport { cn } from '../../../lib/utils'\nimport { clampRating } from './review-card'\n\n/** The rating values the aggregate reports, from worst to best. */\nexport type ReviewRatingValue = 1 | 2 | 3 | 4 | 5\n\n/**\n * A complete 1–5 count distribution. Every value is required: a partial\n * distribution would let the summary render a total it cannot account for.\n */\nexport type ReviewDistribution = Record<ReviewRatingValue, number>\n\n/** Every user-facing string the summary renders. All are overridable. */\nexport interface ReviewSummaryLabels {\n  title: string\n  basedOnLabel: string\n  ratingLabel: string\n  distributionLabel: string\n  rowLabel: string\n  /** Singular form for a one-star row; falls back to `rowLabel`. */\n  rowSingularLabel?: string\n}\n\nexport interface ReviewSummaryProps {\n  /** Host-supplied average. The summary never computes one from reviews. */\n  averageRating: number\n  /** Host-supplied total the distribution accounts for. */\n  totalReviews: number\n  /** Complete 1–5 counts. Required: the summary never invents a value. */\n  distribution: ReviewDistribution\n  labels?: Partial<ReviewSummaryLabels>\n  /** Locale used to format the average and the percentages. */\n  locale?: string\n  className?: string\n}\n\nexport const defaultReviewSummaryLabels: ReviewSummaryLabels = {\n  title: 'Valoración general',\n  basedOnLabel: 'Basado en {n} reseñas',\n  ratingLabel: '{n} de 5',\n  distributionLabel: 'Distribución de valoraciones',\n  rowLabel: '{rating} estrellas: {count}',\n  rowSingularLabel: '{rating} estrella: {count}',\n}\n\nconst RATING_VALUES: ReviewRatingValue[] = [5, 4, 3, 2, 1]\n\nconst interpolate = (template: string, values: Record<string, string | number>) =>\n  template.replace(/\\{(\\w+)\\}/g, (match, key: string) =>\n    key in values ? String(values[key]) : match,\n  )\n\n/**\n * Percentage of the total a count represents.\n *\n * A zero total renders `0`, never `NaN`: the denominator is the host's\n * `totalReviews`, never the largest count in the distribution.\n */\nexport function reviewPercentage(count: number, total: number): number {\n  if (!Number.isFinite(count) || !Number.isFinite(total) || total <= 0) return 0\n  return Math.round((count / total) * 100)\n}\n\nfunction formatAverage(value: number, locale: string | undefined): string {\n  if (!Number.isFinite(value)) return '0'\n  return new Intl.NumberFormat(locale, {\n    minimumFractionDigits: 1,\n    maximumFractionDigits: 1,\n  }).format(value)\n}\n\n/**\n * The canonical aggregate unit of the review family.\n *\n * It renders exactly the aggregate it is given: `averageRating`, `totalReviews`\n * and a complete 1–5 `distribution` are required, so the summary can never\n * derive an average from review content, fill five stars by default, or divide\n * a bar by the largest count. Composition with the review collection is the\n * host's decision; this unit accepts no reviews.\n */\nexport function ReviewSummary({\n  averageRating,\n  totalReviews,\n  distribution,\n  labels,\n  locale,\n  className,\n}: ReviewSummaryProps) {\n  const copy: ReviewSummaryLabels = { ...defaultReviewSummaryLabels, ...labels }\n  const average = formatAverage(averageRating, locale)\n  const filled = clampRating(averageRating)\n\n  return (\n    <div\n      className={cn('flex flex-col gap-4', className)}\n      data-slot='review-summary'\n      aria-label={copy.title}\n      role='group'\n    >\n      <div className='flex flex-col gap-1'>\n        <h3 className='text-base font-semibold' data-slot='review-summary-title'>\n          {copy.title}\n        </h3>\n        <p className='text-3xl font-semibold tabular-nums' data-slot='review-summary-average'>\n          {average}\n        </p>\n        <div\n          role='img'\n          aria-label={interpolate(copy.ratingLabel, { n: average })}\n          className='flex items-center gap-0.5'\n          data-slot='review-summary-rating'\n        >\n          {Array.from({ length: 5 }, (_, index) =>\n            index < filled ? (\n              <span key={index} data-slot='review-summary-star-filled'>\n                <Star aria-hidden='true' className='size-4 fill-current text-foreground' />\n              </span>\n            ) : (\n              <span key={index} data-slot='review-summary-star-empty'>\n                <Star aria-hidden='true' className='text-muted-foreground size-4' />\n              </span>\n            ),\n          )}\n        </div>\n        <p className='text-muted-foreground text-sm' data-slot='review-summary-total'>\n          {interpolate(copy.basedOnLabel, { n: totalReviews })}\n        </p>\n      </div>\n\n      <div className='flex flex-col gap-2' data-slot='review-distribution'>\n        <p className='text-sm font-medium'>{copy.distributionLabel}</p>\n        {RATING_VALUES.map((rating) => {\n          const count = distribution[rating] ?? 0\n          const percentage = reviewPercentage(count, totalReviews)\n          return (\n            <div\n              key={rating}\n              className='flex items-center gap-2'\n              data-slot='review-distribution-row'\n              data-rating={rating}\n            >\n              <span className='text-muted-foreground w-24 text-xs tabular-nums'>\n                {interpolate(rating === 1 ? (copy.rowSingularLabel ?? copy.rowLabel) : copy.rowLabel, {\n                  rating,\n                  count,\n                })}\n              </span>\n              <span\n                aria-hidden='true'\n                className='bg-muted relative h-2 flex-1 overflow-hidden rounded-full'\n              >\n                <span\n                  className='bg-primary absolute inset-y-0 left-0 rounded-full'\n                  style={{ width: `${percentage}%` }}\n                />\n              </span>\n              <span\n                className='w-9 text-right text-xs tabular-nums'\n                data-slot='review-distribution-percentage'\n              >\n                {percentage}%\n              </span>\n            </div>\n          )\n        })}\n      </div>\n    </div>\n  )\n}\n\nexport default ReviewSummary\n"],"mappings":"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","names":[]}

package/dist/blocks/e-commerce/shopping-carts/shopping-cart.d.ts

@@ -0,0 +1,98 @@
+import type { LucideIcon } from 'lucide-react';
+import type { Money } from '@thorprovider/types';
+import type { CartTotals, ShoppingCartItem, ShoppingCartSuggestion } from '../../../lib/contracts';
+/** Host-supplied promotion definition. Icons are React-side only. */
+export interface ShoppingCartPromotion {
+    threshold: number;
+    reward: string;
+    icon: LucideIcon;
+}
+export type ShoppingCartTotalsState = 'idle' | 'pending' | 'error';
+export type ShoppingCartPresentation = 'compact' | 'page';
+export interface ShoppingCartProps {
+    /** Canonical cart lines keyed by backend cart line-item id. */
+    items: ShoppingCartItem[];
+    promotions?: ShoppingCartPromotion[];
+    recentlyViewed?: ShoppingCartSuggestion[];
+    /**
+     * Layout presentation. `compact` (default) is the collapsible quick-cart
+     * card; `page` is a wide, always-expanded review layout with a primary
+     * heading, no collapse control, and normal page scrolling. Both use the same
+     * line controls and authoritative monetary rendering.
+     */
+    presentation?: ShoppingCartPresentation;
+    /**
+     * Backend-authoritative totals. The cart renders these verbatim; it never
+     * computes subtotal/tax/shipping/total locally.
+     */
+    totals?: CartTotals;
+    /** Controlled state of the totals fetch/mutation. */
+    totalsState?: ShoppingCartTotalsState;
+    totalsErrorLabel?: string;
+    /** Shown when a required total amount is absent or malformed (never as zero). */
+    totalsUnavailableLabel?: string;
+    /** Shown for a line whose supplied line total is absent or malformed. */
+    amountUnavailableLabel?: string;
+    retryLabel?: string;
+    onRetryTotals?: () => void;
+    /** Override money formatting (locale, currency). Defaults to `Money.currencyCode`. */
+    formatMoney?: (money: Money) => string;
+    titleLabel?: string;
+    subtotalLabel?: string;
+    discountLabel?: string;
+    taxLabel?: string;
+    shippingLabel?: string;
+    shippingFreeLabel?: string;
+    totalLabel?: string;
+    totalsPendingLabel?: string;
+    awayFromLabel?: string;
+    activatedLabel?: string;
+    itemsLabel?: string;
+    expressCheckoutLabel?: string;
+    expressLabel?: string;
+    standardLabel?: string;
+    estimatedDeliveryLabel?: string;
+    secureCheckoutLabel?: string;
+    recentlyViewedLabel?: string;
+    promoPromptLabel?: string;
+    promoPlaceholderLabel?: string;
+    promoApplyLabel?: string;
+    collapseLabel?: string;
+    expandLabel?: string;
+    checkoutLabel?: string;
+    quickCheckoutLabel?: string;
+    checkoutNowLabel?: string;
+    emptyLabel?: string;
+    removeLabel?: string;
+    decreaseLabel?: string;
+    increaseLabel?: string;
+    continueShoppingLabel?: string;
+    /** Suppress the checkout action (e.g. the checkout feature is not installed). */
+    checkoutUnavailable?: boolean;
+    /** Disable checkout while the cart is not ready (pending/error/invalid totals). */
+    checkoutDisabled?: boolean;
+    /**
+     * ABSOLUTE quantity for a backend cart line-item id (distinct from the
+     * Navbar's DELTA). The boundary mutates the cart by line-item id.
+     */
+    onQuantityChange?: (id: string, quantity: number) => void;
+    /** Remove the backend cart line-item id. */
+    onRemove?: (id: string) => void;
+    onCheckout?: () => void;
+    onQuickCheckout?: () => void;
+    onPayWithApple?: () => void;
+    onPayWithGoogle?: () => void;
+    /**
+     * Report an entered promotion code to the host. The block never validates
+     * or resolves codes; the authoritative result arrives through `totals`
+     * (discount) and `promotions`. When absent, the promo affordance is not
+     * rendered.
+     */
+    onApplyPromo?: (code: string) => void;
+    onRecentlyViewedClick?: (id: string) => void;
+    /** Page presentation only: navigate back to browsing. */
+    onContinueShopping?: () => void;
+}
+export declare function ShoppingCart({ items, promotions, recentlyViewed, presentation, totals, totalsState, totalsErrorLabel, totalsUnavailableLabel, amountUnavailableLabel, retryLabel, onRetryTotals, formatMoney: formatMoneyProp, titleLabel, subtotalLabel, discountLabel, taxLabel, shippingLabel, shippingFreeLabel, totalLabel, totalsPendingLabel, awayFromLabel, activatedLabel, itemsLabel, expressCheckoutLabel, expressLabel, standardLabel, estimatedDeliveryLabel, secureCheckoutLabel, recentlyViewedLabel, promoPromptLabel, promoPlaceholderLabel, promoApplyLabel, collapseLabel, expandLabel, checkoutLabel, quickCheckoutLabel, checkoutNowLabel, emptyLabel, removeLabel, decreaseLabel, increaseLabel, continueShoppingLabel, checkoutUnavailable, checkoutDisabled, onQuantityChange, onRemove, onCheckout, onQuickCheckout, onPayWithApple, onPayWithGoogle, onApplyPromo, onRecentlyViewedClick, onContinueShopping, }: ShoppingCartProps): import("react").JSX.Element;
+export default ShoppingCart;
+//# sourceMappingURL=shopping-cart.d.ts.map

package/dist/blocks/e-commerce/shopping-carts/shopping-cart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shopping-cart.d.ts","sourceRoot":"","sources":["../../../../src/blocks/e-commerce/shopping-carts/shopping-cart.tsx"],"names":[],"mappings":"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"}

package/dist/blocks/e-commerce/shopping-carts/shopping-cart.js

@@ -0,0 +1,417 @@
+"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 shopping_cart_exports = {};
+__export(shopping_cart_exports, {
+  ShoppingCart: () => ShoppingCart,
+  default: () => shopping_cart_default
+});
+module.exports = __toCommonJS(shopping_cart_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
+var import_lucide_react = require("lucide-react");
+var import_card = require("../../../ui/card.js");
+var import_button = require("../../../ui/button.js");
+var import_input = require("../../../ui/input.js");
+var import_separator = require("../../../ui/separator.js");
+var import_progress = require("../../../ui/progress.js");
+var import_utils = require("../../../lib/utils.js");
+var import_money = require("../../../lib/money.js");
+const fallbackFormatter = new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" });
+const interpolate = (template, values) => template.replace(/\$\{(\w+)\}|\{(\w+)\}/g, (match, dollarKey, braceKey) => {
+  const key = dollarKey ?? braceKey;
+  return values[key] ?? match;
+});
+function ShoppingCart({
+  items,
+  promotions,
+  recentlyViewed,
+  presentation = "compact",
+  totals,
+  totalsState = "idle",
+  totalsErrorLabel = "No se pudieron actualizar los totales.",
+  totalsUnavailableLabel = "Totales no disponibles.",
+  amountUnavailableLabel = "\u2014",
+  retryLabel = "Reintentar",
+  onRetryTotals,
+  formatMoney: formatMoneyProp,
+  titleLabel = "Carrito de compras",
+  subtotalLabel = "Subtotal",
+  discountLabel = "Descuento",
+  taxLabel = "Impuestos",
+  shippingLabel = "Env\xEDo",
+  shippingFreeLabel = "Gratis",
+  totalLabel = "Total",
+  totalsPendingLabel = "Actualizando totales\u2026",
+  awayFromLabel = "Te faltan ${amount} para",
+  activatedLabel = "\xA1{reward} activada!",
+  itemsLabel = "art\xEDculos",
+  expressCheckoutLabel = "Compra r\xE1pida",
+  expressLabel = "R\xE1pido",
+  standardLabel = "Est\xE1ndar",
+  estimatedDeliveryLabel,
+  secureCheckoutLabel = "Pago seguro \u2022 SSL cifrado",
+  recentlyViewedLabel = "Vistos recientemente",
+  promoPromptLabel = "\xBFTienes un c\xF3digo de descuento?",
+  promoPlaceholderLabel = "Introduce tu c\xF3digo",
+  promoApplyLabel = "Aplicar",
+  collapseLabel = "Contraer carrito",
+  expandLabel = "Expandir carrito",
+  checkoutLabel = "Ver carrito y finalizar",
+  quickCheckoutLabel = "Compra r\xE1pida",
+  checkoutNowLabel = "Finalizar ahora",
+  emptyLabel = "Tu carrito est\xE1 vac\xEDo",
+  removeLabel = "Quitar",
+  decreaseLabel = "Disminuir cantidad",
+  increaseLabel = "Aumentar cantidad",
+  continueShoppingLabel = "Seguir comprando",
+  checkoutUnavailable,
+  checkoutDisabled,
+  onQuantityChange,
+  onRemove,
+  onCheckout,
+  onQuickCheckout,
+  onPayWithApple,
+  onPayWithGoogle,
+  onApplyPromo,
+  onRecentlyViewedClick,
+  onContinueShopping
+}) {
+  const [isExpanded, setIsExpanded] = (0, import_react.useState)(true);
+  const [quickCheckout, setQuickCheckout] = (0, import_react.useState)(false);
+  const [promoCode, setPromoCode] = (0, import_react.useState)("");
+  const promoInputId = (0, import_react.useId)();
+  const isPage = presentation === "page";
+  const expanded = isPage ? true : isExpanded;
+  const format = formatMoneyProp ? (value) => {
+    const money2 = { amount: String(value), currencyCode: totals?.subtotal?.currencyCode ?? "USD" };
+    return formatMoneyProp(money2);
+  } : totals?.subtotal?.currencyCode && totals.subtotal.currencyCode !== "USD" ? (value) => new Intl.NumberFormat("en-US", { style: "currency", currency: totals.subtotal.currencyCode }).format(value) : (value) => fallbackFormatter.format(value);
+  const money = (value) => (0, import_money.formatMoney)(value, formatMoneyProp);
+  const subtotalAmount = (0, import_money.isAvailableMoney)(totals?.subtotal) ? Number(totals.subtotal.amount) : 0;
+  const itemCount = items.reduce((sum, item) => sum + item.quantity, 0);
+  const hasExpress = Boolean(onQuickCheckout || onPayWithApple || onPayWithGoogle);
+  const mutationsDisabled = totalsState === "pending";
+  const sortedPromotions = [...promotions ?? []].sort((a, b) => a.threshold - b.threshold);
+  const currentPromo = (() => {
+    if (!(0, import_money.isAvailableMoney)(totals?.subtotal)) return null;
+    for (let i = sortedPromotions.length - 1; i >= 0; i--) {
+      if (subtotalAmount >= sortedPromotions[i].threshold) {
+        return { ...sortedPromotions[i], achieved: true };
+      }
+    }
+    const next = sortedPromotions.find((p) => subtotalAmount < p.threshold);
+    return next ? { ...next, achieved: false } : null;
+  })();
+  const progressPercentage = currentPromo && !currentPromo.achieved ? Math.min(100, subtotalAmount / currentPromo.threshold * 100) : 100;
+  const lineAmount = (item) => {
+    if (item.lineTotal === void 0) return null;
+    return money(item.lineTotal);
+  };
+  const renderTotals = () => {
+    if (totalsState === "pending") {
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-col gap-2", "aria-live": "polite", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-muted-foreground text-sm", children: totalsPendingLabel }) });
+    }
+    if (totalsState === "error") {
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-2", role: "alert", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-destructive text-sm", children: totalsErrorLabel }),
+        onRetryTotals ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button.Button, { variant: "outline", size: "sm", className: "w-fit", onClick: onRetryTotals, children: retryLabel }) : null
+      ] });
+    }
+    if (!totals) return null;
+    const subtotalText = money(totals.subtotal);
+    const totalText = money(totals.total);
+    if (subtotalText === null || totalText === null) {
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-2", role: "status", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-muted-foreground text-sm", children: totalsUnavailableLabel }),
+        onRetryTotals ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button.Button, { variant: "outline", size: "sm", className: "w-fit", onClick: onRetryTotals, children: retryLabel }) : null
+      ] });
+    }
+    const shippingText = money(totals.shipping);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex justify-between text-sm", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: subtotalLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "tabular-nums", children: subtotalText })
+      ] }),
+      (0, import_money.isAvailableMoney)(totals.discount) ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex justify-between text-sm", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: discountLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "tabular-nums", children: money(totals.discount) })
+      ] }) : null,
+      (0, import_money.isAvailableMoney)(totals.tax) ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex justify-between text-sm", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: taxLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "tabular-nums", children: money(totals.tax) })
+      ] }) : null,
+      shippingText !== null ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex justify-between text-sm text-success", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: shippingLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "tabular-nums", children: Number(totals.shipping?.amount) === 0 ? shippingFreeLabel : shippingText })
+      ] }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_separator.Separator, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex justify-between font-semibold", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: totalLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "tabular-nums", children: totalText })
+      ] })
+    ] });
+  };
+  const renderPromoEntry = () => onApplyPromo ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "form",
+    {
+      className: "flex flex-col gap-2",
+      onSubmit: (event) => {
+        event.preventDefault();
+        const code = promoCode.trim();
+        if (!code) return;
+        onApplyPromo(code);
+        setPromoCode("");
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("label", { className: "text-sm", htmlFor: promoInputId, children: promoPromptLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            import_input.Input,
+            {
+              id: promoInputId,
+              value: promoCode,
+              onChange: (event) => setPromoCode(event.target.value),
+              placeholder: promoPlaceholderLabel,
+              className: "h-9 flex-1"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button.Button, { type: "submit", variant: "outline", size: "sm", className: "h-9", disabled: mutationsDisabled, children: promoApplyLabel })
+        ] })
+      ]
+    }
+  ) : null;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("section", { className: "py-8", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: (0, import_utils.cn)("mx-auto px-4", isPage ? "max-w-3xl" : "max-w-md"), children: [
+    isPage ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", { className: "mb-6 text-2xl font-semibold tracking-tight", children: titleLabel }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_card.Card, { className: isPage ? "shadow-sm" : "shadow-lg", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_card.CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-3", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_card.CardTitle, { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ShoppingCart, { className: "size-5" }),
+          titleLabel,
+          " (",
+          itemCount,
+          ")"
+        ] }),
+        !isPage ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_button.Button,
+          {
+            variant: "ghost",
+            className: "h-8 cursor-pointer px-3 text-xs",
+            size: "sm",
+            onClick: () => setIsExpanded(!isExpanded),
+            "aria-expanded": isExpanded,
+            "aria-label": isExpanded ? collapseLabel : expandLabel,
+            children: isExpanded ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.X, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Plus, {})
+          }
+        ) : null
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_card.CardContent, { className: "flex flex-col gap-6", children: items.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col items-center justify-center gap-4 py-6 text-center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ShoppingCart, { className: "text-muted-foreground/50 size-10" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-muted-foreground text-sm", children: emptyLabel }),
+        isPage && onContinueShopping ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button.Button, { variant: "outline", onClick: onContinueShopping, children: continueShoppingLabel }) : null
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+        currentPromo && !currentPromo.achieved ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between text-sm", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-muted-foreground", children: interpolate(awayFromLabel, {
+              amount: format(currentPromo.threshold - subtotalAmount)
+            }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-1", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(currentPromo.icon, { className: "text-primary size-4" }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-primary font-medium", children: currentPromo.reward })
+            ] })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_progress.Progress, { value: progressPercentage, className: "h-2" })
+        ] }) : null,
+        currentPromo?.achieved ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "rounded-lg bg-success/10 p-3", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2 text-success", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(currentPromo.icon, { className: "size-4" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-sm font-medium", children: interpolate(activatedLabel, { reward: currentPromo.reward }) })
+        ] }) }) : null,
+        expanded && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "div",
+            {
+              className: (0, import_utils.cn)(
+                "flex flex-col gap-4",
+                !isPage && "scrollbar-thin scrollbar-thumb-gray-300 dark:scrollbar-thumb-gray-600 scrollbar-track-transparent max-h-64 overflow-y-auto"
+              ),
+              children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-start gap-3", children: [
+                item.image ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", { src: item.image || void 0, alt: "", className: "h-12 w-12 rounded-md object-cover" }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { "aria-hidden": "true", className: "bg-muted h-12 w-12 shrink-0 rounded-md" }),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-1 flex-col gap-1", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", { className: "line-clamp-2 text-sm font-medium", children: item.name }),
+                  item.variant ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-muted-foreground text-xs", children: item.variant }) : null,
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-sm font-semibold", children: lineAmount(item) ?? amountUnavailableLabel }),
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center", children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                        import_button.Button,
+                        {
+                          variant: "ghost",
+                          size: "sm",
+                          className: "size-6 h-8 cursor-pointer p-0 px-3 text-xs",
+                          onClick: onQuantityChange ? () => onQuantityChange(item.id, item.quantity - 1) : void 0,
+                          disabled: item.quantity <= 1 || mutationsDisabled,
+                          "aria-label": `${decreaseLabel}, ${item.name}`,
+                          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Minus, {})
+                        }
+                      ),
+                      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "mx-2 w-6 text-center text-sm", children: item.quantity }),
+                      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                        import_button.Button,
+                        {
+                          variant: "ghost",
+                          size: "sm",
+                          className: "size-6 h-8 cursor-pointer p-0 px-3 text-xs",
+                          onClick: onQuantityChange ? () => onQuantityChange(item.id, item.quantity + 1) : void 0,
+                          "aria-label": `${increaseLabel}, ${item.name}`,
+                          disabled: mutationsDisabled,
+                          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Plus, {})
+                        }
+                      ),
+                      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                        import_button.Button,
+                        {
+                          variant: "ghost",
+                          size: "sm",
+                          className: "text-destructive hover:text-destructive ms-2 size-6 h-8 cursor-pointer p-0 px-3 text-xs",
+                          onClick: onRemove ? () => onRemove(item.id) : void 0,
+                          disabled: mutationsDisabled,
+                          "aria-label": `${removeLabel} ${item.name}`,
+                          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.X, {})
+                        }
+                      )
+                    ] })
+                  ] })
+                ] })
+              ] }, item.id))
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_separator.Separator, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-col gap-2", children: renderTotals() }),
+          renderPromoEntry(),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-3", children: [
+            hasExpress ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between text-sm", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: expressCheckoutLabel }),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+                  import_button.Button,
+                  {
+                    variant: "outline",
+                    size: "sm",
+                    onClick: () => setQuickCheckout(!quickCheckout),
+                    className: "h-8 cursor-pointer",
+                    "aria-pressed": quickCheckout,
+                    children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Zap, {}),
+                      quickCheckout ? standardLabel : expressLabel
+                    ]
+                  }
+                )
+              ] }),
+              quickCheckout ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "grid grid-cols-2 gap-2", children: [
+                onPayWithApple ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_button.Button, { size: "sm", variant: "outline", className: "h-8 cursor-pointer px-3 text-xs", onClick: onPayWithApple, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Wallet, {}),
+                  "Apple Pay"
+                ] }) : null,
+                onPayWithGoogle ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_button.Button, { size: "sm", variant: "outline", className: "h-8 cursor-pointer px-3 text-xs", onClick: onPayWithGoogle, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.CreditCard, {}),
+                  "Google Pay"
+                ] }) : null
+              ] }) : null
+            ] }) : null,
+            !checkoutUnavailable ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              import_button.Button,
+              {
+                size: "lg",
+                className: "h-10 w-full cursor-pointer px-8",
+                onClick: hasExpress && quickCheckout ? onQuickCheckout : onCheckout,
+                disabled: checkoutDisabled || totalsState === "pending",
+                children: hasExpress && quickCheckout ? quickCheckoutLabel : checkoutLabel
+              }
+            ) : null,
+            isPage && onContinueShopping ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              import_button.Button,
+              {
+                variant: "outline",
+                size: "lg",
+                className: "h-10 w-full cursor-pointer px-8",
+                onClick: onContinueShopping,
+                children: continueShoppingLabel
+              }
+            ) : null,
+            estimatedDeliveryLabel ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "text-muted-foreground flex items-center justify-center gap-2 text-xs", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Clock, { className: "size-3" }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: estimatedDeliveryLabel })
+            ] }) : null
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "bg-muted/50 rounded-lg p-3 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "text-muted-foreground flex items-center justify-center gap-2 text-xs", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "size-2 rounded-full bg-success", "aria-hidden": "true" }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: secureCheckoutLabel })
+          ] }) })
+        ] }),
+        !expanded && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-muted-foreground text-sm", children: [
+              itemCount,
+              " ",
+              itemsLabel
+            ] }),
+            (0, import_money.isAvailableMoney)(totals?.total) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "font-semibold tabular-nums", children: money(totals.total) }) : null
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button.Button, { size: "sm", className: "h-8 w-full cursor-pointer px-3 text-xs", onClick: onCheckout, children: checkoutNowLabel })
+        ] }),
+        expanded && recentlyViewed && recentlyViewed.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h4", { className: "text-sm font-medium", children: recentlyViewedLabel }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "grid grid-cols-3 gap-2", children: recentlyViewed.map((item) => {
+            const suggestionPrice = money(item.unitPrice);
+            return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+              "button",
+              {
+                type: "button",
+                className: (0, import_utils.cn)(
+                  "group text-start",
+                  onRecentlyViewedClick && "cursor-pointer"
+                ),
+                onClick: onRecentlyViewedClick ? () => onRecentlyViewedClick(item.id) : void 0,
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "bg-muted mb-1 aspect-square overflow-hidden", children: item.image ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    "img",
+                    {
+                      src: item.image || void 0,
+                      alt: item.name,
+                      className: "size-full rounded-md object-cover"
+                    }
+                  ) : null }),
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-muted-foreground truncate text-xs", children: item.name }),
+                  suggestionPrice !== null ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs font-medium tabular-nums", children: suggestionPrice }) : null
+                ]
+              },
+              item.id
+            );
+          }) })
+        ] })
+      ] }) })
+    ] })
+  ] }) });
+}
+var shopping_cart_default = ShoppingCart;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ShoppingCart
+});
+//# sourceMappingURL=shopping-cart.js.map