@loczer/storefront-sdk 0.164.0 → 0.165.0

package/dist/pages/ProductPage.js

@@ -1,222 +1,222 @@
-import { jsx as t, jsxs as s } from "react/jsx-runtime";
-import { useMemo as g, useState as N, useEffect as T } from "react";
-import { useParams as Nt, useSearchParams as kt, useLocation as St, useNavigate as wt, Link as Z } from "@rpcbase/router";
-import { cn as k } from "@rpcbase/ui";
-import { ArrowLeft as tt, ArrowRight as B, Bike as It, CheckCircle2 as Pt } from "lucide-react";
+import { jsx as t, jsxs as r } from "react/jsx-runtime";
+import { useMemo as b, useState as k, useEffect as O } from "react";
+import { useParams as _t, useSearchParams as St, useLocation as kt, useNavigate as wt, Link as tt } from "@rpcbase/router";
+import { cn as w } from "@rpcbase/ui";
+import { ArrowLeft as at, ArrowRight as R, Bike as It, CheckCircle2 as Pt } from "lucide-react";
 import { useTranslation as Vt } from "react-i18next";
 import { apiPost as At } from "../lib/apiCall.js";
 import { getAvailabilityVariant as Ct } from "../lib/utils.js";
-import { resolveBookingSearchParamsFromSessionStorage as Lt, getBookingParamsFromSearch as Tt, writeBookingSearchParamsToSessionStorage as Bt } from "../lib/booking.js";
-import { getLocalizedValue as S } from "../localization.js";
+import { resolveBookingSearchParamsFromSessionStorage as Lt, getBookingParamsFromSearch as Bt, writeBookingSearchParamsToSessionStorage as Tt } from "../lib/booking.js";
+import { getLocalizedValue as I } from "../localization.js";
 import { Badge as et } from "../ui/badge.js";
-import { Button as b } from "../ui/button.js";
+import { Button as v } from "../ui/button.js";
 import { Card as Ot } from "../ui/card.js";
 import { Input as Rt } from "../ui/input.js";
 import { RadioGroup as $t, RadioGroupItem as Ft } from "../ui/radio-group.js";
 import { useStorefrontCart as zt } from "../lib/cart.js";
-import { findStorefrontProductBySlug as jt, getStorefrontCheckoutProductId as O } from "../lib/products.js";
-import { ROUTE as Mt, responseSchema as Kt, buildStorefrontAvailabilityKey as m, getStorefrontAvailabilityStatus as at, isStorefrontAvailabilityInsufficient as it, getStorefrontAvailabilityIssue as Dt } from "../lib/storefrontAvailability.js";
-import { getProductVariantAttributeValue as Et, getStorefrontProductVariantDisplay as qt } from "../lib/productVariants.js";
-import { resolveProductImageContainerStyle as Gt } from "../lib/productImageStyles.js";
-import { useStorefront as Ut, useStorefrontProducts as Wt } from "../StorefrontProvider.js";
-import { ProductPriceBadge as Qt } from "../components/ProductPriceBadge/index.js";
-import { ProductWarningNotice as Ht } from "../components/ProductWarningNotice/index.js";
-const rt = (e, n = () => !0) => {
-  if (!e) return null;
-  if (e.representedVariantId?.trim()) return e.representedVariantId.trim();
-  const a = e.productVariants ?? [];
-  return a.find((o) => n(o.id))?.id ?? a[0]?.id ?? null;
-}, Jt = (e, n) => {
-  if (!e) return [];
-  const a = O(e), l = /* @__PURE__ */ new Map();
-  l.set(m(a), { productId: a, quantity: n });
-  for (const v of e.productVariants ?? [])
-    l.set(m(a, v.id), {
-      productId: a,
-      productVariantId: v.id,
-      quantity: n
+import { findStorefrontProductBySlug as jt, getStorefrontCheckoutProductId as P } from "../lib/products.js";
+import { getValidStorefrontAvailabilitySchedule as Mt, ROUTE as Kt, responseSchema as Et, buildStorefrontAvailabilityKey as d, getStorefrontAvailabilityStatus as it, isStorefrontAvailabilityInsufficient as rt, getStorefrontAvailabilityIssue as qt } from "../lib/storefrontAvailability.js";
+import { getProductVariantAttributeValue as Gt, getStorefrontProductVariantDisplay as Ut } from "../lib/productVariants.js";
+import { resolveProductImageContainerStyle as Wt } from "../lib/productImageStyles.js";
+import { useStorefront as Dt, useStorefrontProducts as Qt } from "../StorefrontProvider.js";
+import { ProductPriceBadge as Ht } from "../components/ProductPriceBadge/index.js";
+import { ProductWarningNotice as Jt } from "../components/ProductWarningNotice/index.js";
+const st = (a, s = () => !0) => {
+  if (!a) return null;
+  if (a.representedVariantId?.trim()) return a.representedVariantId.trim();
+  const e = a.productVariants ?? [];
+  return e.find((o) => s(o.id))?.id ?? e[0]?.id ?? null;
+}, Xt = (a, s) => {
+  if (!a) return [];
+  const e = P(a), l = /* @__PURE__ */ new Map();
+  l.set(d(e), { productId: e, quantity: s });
+  for (const x of a.productVariants ?? [])
+    l.set(d(e, x.id), {
+      productId: e,
+      productVariantId: x.id,
+      quantity: s
     });
-  const o = e.representedVariantId?.trim();
-  return o && l.set(m(a, o), {
-    productId: a,
+  const o = a.representedVariantId?.trim();
+  return o && l.set(d(e, o), {
+    productId: e,
     productVariantId: o,
-    quantity: n
+    quantity: s
   }), Array.from(l.values());
-}, Xt = (e, n) => {
-  const a = O(e), l = e.representedVariantId?.trim();
+}, Yt = (a, s) => {
+  const e = P(a), l = a.representedVariantId?.trim();
   if (l) {
-    const o = n.get(m(a, l));
+    const o = s.get(d(e, l));
     if (o) return o;
   }
-  return n.get(m(a));
-}, Yt = (e, n, a) => a.get(m(O(e), n)), st = (e, n, a) => {
-  const l = Dt(n);
-  return l === "quantity_unavailable" ? e("availability_quantity_unavailable") : l === "unavailable" || a === "OUT_OF_STOCK" ? e("availability_out_of_stock") : n?.remaining !== void 0 ? e("availability_remaining_count", { count: n.remaining }) : n?.fewRemaining || a === "LOW_STOCK" ? e("availability_low_stock") : e("availability_in_stock");
-}, Zt = (e) => "availabilityStatus" in e ? e.availabilityStatus ?? "AVAILABLE" : "AVAILABLE";
-function ke() {
-  const { t: e, i18n: n } = Vt(), { storeSlug: a, productSlug: l } = Nt(), [o] = kt(), v = St(), nt = wt(), { addItem: lt, itemCount: R } = zt(), { storefrontConfiguration: ot } = Ut(), x = ot.workspace?.workspaceLanguage, { bikes: $, accessories: F } = Wt(), i = g(
-    () => l ? jt(l, { bikes: $, accessories: F }) : null,
-    [F, $, l]
-  ), p = g(
-    () => Lt(o, a),
-    [o, a]
-  ), d = g(() => Tt(p), [p]), z = p.toString(), j = `/${a ?? ""}/checkout${z ? `?${z}` : ""}`, M = `/${a ?? ""}`, ct = M, w = v.state, dt = typeof w?.backTo == "string" && w.backTo.startsWith(M) ? w.backTo : ct, [I, K] = N(1), [u, P] = N(() => rt(i)), V = Number.isFinite(I) ? Math.max(1, Math.min(99, Math.floor(I))) : 1, A = g(
-    () => Jt(i, V),
-    [V, i]
-  ), [D, y] = N([]), [mt, C] = N(!1);
-  T(() => {
-    if (K(1), !i) {
-      P(null);
+  return s.get(d(e));
+}, Zt = (a, s, e) => e.get(d(P(a), s)), nt = (a, s, e) => {
+  const l = qt(s);
+  return l === "quantity_unavailable" ? a("availability_quantity_unavailable") : l === "unavailable" || e === "OUT_OF_STOCK" ? a("availability_out_of_stock") : s?.remaining !== void 0 ? a("availability_remaining_count", { count: s.remaining }) : s?.fewRemaining || e === "LOW_STOCK" ? a("availability_low_stock") : a("availability_in_stock");
+}, ta = (a) => "availabilityStatus" in a ? a.availabilityStatus ?? "AVAILABLE" : "AVAILABLE";
+function ka() {
+  const { t: a, i18n: s } = Vt(), { storeSlug: e, productSlug: l } = _t(), [o] = St(), x = kt(), lt = wt(), { addItem: ot, itemCount: $ } = zt(), { storefrontConfiguration: ct } = Dt(), y = ct.workspace?.workspaceLanguage, { bikes: F, accessories: z } = Qt(), i = b(
+    () => l ? jt(l, { bikes: F, accessories: z }) : null,
+    [z, F, l]
+  ), u = b(
+    () => Lt(o, e),
+    [o, e]
+  ), p = b(() => Bt(u), [u]), j = u.toString(), M = `/${e ?? ""}/checkout${j ? `?${j}` : ""}`, K = `/${e ?? ""}`, dt = K, V = x.state, mt = typeof V?.backTo == "string" && V.backTo.startsWith(K) ? V.backTo : dt, [A, E] = k(1), [m, C] = k(() => st(i)), L = Number.isFinite(A) ? Math.max(1, Math.min(99, Math.floor(A))) : 1, B = b(
+    () => Xt(i, L),
+    [L, i]
+  ), [q, N] = k([]), [ut, _] = k(!1);
+  O(() => {
+    if (E(1), !i) {
+      C(null);
       return;
     }
-    P(rt(i));
-  }, [l, i]), T(() => {
-    Bt(a, p);
-  }, [p, a]), T(() => {
-    if (!a || A.length === 0) {
-      y([]), C(!1);
+    C(st(i));
+  }, [l, i]), O(() => {
+    Tt(e, u);
+  }, [u, e]), O(() => {
+    if (!e || B.length === 0) {
+      N([]), _(!1);
       return;
     }
-    let r = !1;
-    return C(!0), y([]), (async () => {
+    const n = Mt(p);
+    if (!n) {
+      _(!1);
+      return;
+    }
+    let c = !1;
+    return _(!0), N([]), (async () => {
       try {
-        const c = await At(
-          Mt,
+        const f = await At(
+          Kt,
           {
-            storeSlug: a,
-            schedule: {
-              startDate: d.start_date,
-              endDate: d.end_date,
-              startTime: d.start_time,
-              endTime: d.end_time
-            },
-            products: A
+            storeSlug: e,
+            schedule: n,
+            products: B
           }
-        ), _ = Kt.parse(c);
-        if (r) return;
-        y(_.success ? _.availability ?? [] : []);
-      } catch (c) {
-        if (r) return;
-        console.error("Failed to load storefront product availability", c), y([]);
+        ), S = Et.parse(f);
+        if (c) return;
+        N(S.success ? S.availability ?? [] : []);
+      } catch (f) {
+        if (c) return;
+        console.error("Failed to load storefront product availability", f), N([]);
       } finally {
-        r || C(!1);
+        c || _(!1);
       }
     })(), () => {
-      r = !0;
+      c = !0;
     };
   }, [
-    A,
-    d.end_date,
-    d.end_time,
-    d.start_date,
-    d.start_time,
-    a
+    B,
+    p.end_date,
+    p.end_time,
+    p.start_date,
+    p.start_time,
+    e
   ]);
-  const E = g(() => new Map(
-    D.map((r) => [
-      m(r.productId, r.productVariantId),
-      r
+  const G = b(() => new Map(
+    q.map((n) => [
+      d(n.productId, n.productVariantId),
+      n
     ])
-  ), [D]), q = () => {
-    nt(dt);
+  ), [q]), U = () => {
+    lt(mt);
   };
   if (!i)
-    return /* @__PURE__ */ t("div", { className: "mx-auto max-w-3xl px-4 py-10 sm:px-6", children: /* @__PURE__ */ s("div", { className: "rounded-xl border border-slate-200 bg-white p-4 shadow-sm", children: [
-      /* @__PURE__ */ t("h1", { className: "text-xl font-semibold tracking-tight text-slate-950", children: /* @__PURE__ */ t("span", { children: e("product_not_found_title") }) }),
-      /* @__PURE__ */ t("p", { className: "mt-2 text-sm text-slate-600", children: /* @__PURE__ */ t("span", { children: e("product_not_found_description") }) }),
-      /* @__PURE__ */ t("div", { className: "mt-6", children: /* @__PURE__ */ s(b, { type: "button", className: "gap-2", onClick: q, children: [
-        /* @__PURE__ */ t(tt, { className: "h-4 w-4", "aria-hidden": "true" }),
-        /* @__PURE__ */ t("span", { children: e("go_back") })
+    return /* @__PURE__ */ t("div", { className: "mx-auto max-w-3xl px-4 py-10 sm:px-6", children: /* @__PURE__ */ r("div", { className: "rounded-xl border border-slate-200 bg-white p-4 shadow-sm", children: [
+      /* @__PURE__ */ t("h1", { className: "text-xl font-semibold tracking-tight text-slate-950", children: /* @__PURE__ */ t("span", { children: a("product_not_found_title") }) }),
+      /* @__PURE__ */ t("p", { className: "mt-2 text-sm text-slate-600", children: /* @__PURE__ */ t("span", { children: a("product_not_found_description") }) }),
+      /* @__PURE__ */ t("div", { className: "mt-6", children: /* @__PURE__ */ r(v, { type: "button", className: "gap-2", onClick: U, children: [
+        /* @__PURE__ */ t(at, { className: "h-4 w-4", "aria-hidden": "true" }),
+        /* @__PURE__ */ t("span", { children: a("go_back") })
       ] }) })
     ] }) });
-  const G = S(i.name, n.language, x), ut = S(i.description, n.language, x), pt = S(i.warning, n.language, x), U = typeof i.images?.[0] == "string" ? i.images[0].trim() : "", W = Gt(i.primaryImageStyle), h = Xt(i, E), Q = Zt(i), H = h ? at(h) : Q, ht = Ct(H), ft = mt ? e("availability_checking") : st(e, h, H), J = h ? it(h) : Q === "OUT_OF_STOCK", L = i.productVariants ?? [], gt = L.some((r) => !!Et(r, "size")), bt = e(gt ? "product_size_label" : "product_variant_label"), vt = !!u, xt = () => {
-    u && lt({
+  const W = I(i.name, s.language, y), pt = I(i.description, s.language, y), ht = I(i.warning, s.language, y), D = typeof i.images?.[0] == "string" ? i.images[0].trim() : "", Q = Wt(i.primaryImageStyle), h = Yt(i, G), H = ta(i), J = h ? it(h) : H, ft = Ct(J), gt = ut ? a("availability_checking") : nt(a, h, J), X = h ? rt(h) : H === "OUT_OF_STOCK", T = i.productVariants ?? [], bt = T.some((n) => !!Gt(n, "size")), vt = a(bt ? "product_size_label" : "product_variant_label"), xt = !!m, yt = () => {
+    m && ot({
       kind: i.kind,
-      productId: i.id,
-      ...u ? { productVariantId: u } : {},
-      quantity: V
+      productId: P(i),
+      ...m ? { productVariantId: m } : {},
+      quantity: L
     });
   };
-  return /* @__PURE__ */ t("div", { className: "mx-auto max-w-7xl px-4 py-8 sm:px-6", children: /* @__PURE__ */ s("div", { className: "flex flex-col gap-6", children: [
-    /* @__PURE__ */ s("div", { className: "flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between", children: [
-      /* @__PURE__ */ s(
-        b,
+  return /* @__PURE__ */ t("div", { className: "mx-auto max-w-7xl px-4 py-8 sm:px-6", children: /* @__PURE__ */ r("div", { className: "flex flex-col gap-6", children: [
+    /* @__PURE__ */ r("div", { className: "flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between", children: [
+      /* @__PURE__ */ r(
+        v,
         {
           type: "button",
           variant: "ghost",
           className: "h-auto justify-start gap-2 self-start px-0 text-sm font-medium text-slate-700 hover:bg-transparent hover:text-slate-950",
-          onClick: q,
+          onClick: U,
           children: [
-            /* @__PURE__ */ t(tt, { className: "h-4 w-4", "aria-hidden": "true" }),
-            /* @__PURE__ */ t("span", { children: e("go_back") })
+            /* @__PURE__ */ t(at, { className: "h-4 w-4", "aria-hidden": "true" }),
+            /* @__PURE__ */ t("span", { children: a("go_back") })
           ]
         }
       ),
-      /* @__PURE__ */ t(Z, { to: j, className: k(R > 0 ? "inline-flex" : "hidden"), children: /* @__PURE__ */ s(b, { size: "sm", className: "gap-2", children: [
-        /* @__PURE__ */ t("span", { children: e("checkout_button") }),
-        /* @__PURE__ */ t(B, { className: "h-4 w-4", "aria-hidden": "true" })
+      /* @__PURE__ */ t(tt, { to: M, className: w($ > 0 ? "inline-flex" : "hidden"), children: /* @__PURE__ */ r(v, { size: "sm", className: "gap-2", children: [
+        /* @__PURE__ */ t("span", { children: a("checkout_button") }),
+        /* @__PURE__ */ t(R, { className: "h-4 w-4", "aria-hidden": "true" })
       ] }) })
     ] }),
-    /* @__PURE__ */ s("div", { className: "grid gap-6 lg:grid-cols-12", children: [
-      /* @__PURE__ */ s("div", { className: "lg:col-span-7", children: [
+    /* @__PURE__ */ r("div", { className: "grid gap-6 lg:grid-cols-12", children: [
+      /* @__PURE__ */ r("div", { className: "lg:col-span-7", children: [
         /* @__PURE__ */ t(
           "div",
           {
-            className: k("relative aspect-[1618/1000] overflow-hidden rounded-2xl", W.className),
-            style: W.style,
-            children: U ? /* @__PURE__ */ t(
+            className: w("relative aspect-[1618/1000] overflow-hidden rounded-2xl", Q.className),
+            style: Q.style,
+            children: D ? /* @__PURE__ */ t(
               "img",
               {
-                src: U,
-                alt: G,
+                src: D,
+                alt: W,
                 className: "absolute inset-0 h-full w-full object-contain p-2",
                 loading: "lazy"
               }
             ) : /* @__PURE__ */ t("div", { className: "absolute inset-0 flex items-center justify-center text-slate-400", children: /* @__PURE__ */ t(It, { className: "h-12 w-12", "aria-hidden": "true" }) })
           }
         ),
-        /* @__PURE__ */ s("div", { className: "mt-5 flex flex-col gap-3", children: [
-          /* @__PURE__ */ s("div", { className: "flex flex-wrap items-center gap-2", children: [
-            /* @__PURE__ */ t(et, { variant: ht.variant, children: /* @__PURE__ */ t("span", { children: ft }) }),
-            /* @__PURE__ */ t(Qt, { prices: i.prices })
+        /* @__PURE__ */ r("div", { className: "mt-5 flex flex-col gap-3", children: [
+          /* @__PURE__ */ r("div", { className: "flex flex-wrap items-center gap-2", children: [
+            /* @__PURE__ */ t(et, { variant: ft.variant, children: /* @__PURE__ */ t("span", { children: gt }) }),
+            /* @__PURE__ */ t(Ht, { prices: i.prices })
           ] }),
-          /* @__PURE__ */ t("h1", { className: "text-2xl font-semibold tracking-tight text-slate-950", children: /* @__PURE__ */ t("span", { children: G }) }),
-          /* @__PURE__ */ t("p", { className: "text-sm text-slate-600", children: /* @__PURE__ */ t("span", { children: ut }) }),
-          i.features?.length ? /* @__PURE__ */ s("div", { className: "mt-2 space-y-2", children: [
-            /* @__PURE__ */ t("p", { className: "text-sm font-semibold text-slate-950", children: /* @__PURE__ */ t("span", { children: e("product_features_title") }) }),
-            /* @__PURE__ */ t("ul", { className: "grid gap-1 text-sm text-slate-700", children: i.features.map((r, c) => /* @__PURE__ */ s("li", { className: "inline-flex items-start gap-2", children: [
+          /* @__PURE__ */ t("h1", { className: "text-2xl font-semibold tracking-tight text-slate-950", children: /* @__PURE__ */ t("span", { children: W }) }),
+          /* @__PURE__ */ t("p", { className: "text-sm text-slate-600", children: /* @__PURE__ */ t("span", { children: pt }) }),
+          i.features?.length ? /* @__PURE__ */ r("div", { className: "mt-2 space-y-2", children: [
+            /* @__PURE__ */ t("p", { className: "text-sm font-semibold text-slate-950", children: /* @__PURE__ */ t("span", { children: a("product_features_title") }) }),
+            /* @__PURE__ */ t("ul", { className: "grid gap-1 text-sm text-slate-700", children: i.features.map((n, c) => /* @__PURE__ */ r("li", { className: "inline-flex items-start gap-2", children: [
               /* @__PURE__ */ t(Pt, { className: "mt-0.5 h-4 w-4 text-emerald-600", "aria-hidden": "true" }),
-              /* @__PURE__ */ t("span", { children: S(r, n.language, x) })
+              /* @__PURE__ */ t("span", { children: I(n, s.language, y) })
             ] }, `${i.id}-${c}`)) })
           ] }) : null,
-          /* @__PURE__ */ t(Ht, { warning: pt })
+          /* @__PURE__ */ t(Jt, { warning: ht })
         ] })
       ] }),
-      /* @__PURE__ */ t("div", { className: "lg:col-span-5", children: /* @__PURE__ */ s(Ot, { className: "border-slate-200 bg-white shadow-sm", children: [
-        /* @__PURE__ */ s("div", { className: "border-b border-slate-200 px-4 py-4", children: [
-          /* @__PURE__ */ t("p", { className: "text-sm font-semibold text-slate-950", children: /* @__PURE__ */ t("span", { children: e("add_to_cart_title") }) }),
-          /* @__PURE__ */ t("p", { className: "mt-1 text-xs text-slate-600", children: /* @__PURE__ */ t("span", { children: e("add_to_cart_description") }) })
+      /* @__PURE__ */ t("div", { className: "lg:col-span-5", children: /* @__PURE__ */ r(Ot, { className: "border-slate-200 bg-white shadow-sm", children: [
+        /* @__PURE__ */ r("div", { className: "border-b border-slate-200 px-4 py-4", children: [
+          /* @__PURE__ */ t("p", { className: "text-sm font-semibold text-slate-950", children: /* @__PURE__ */ t("span", { children: a("add_to_cart_title") }) }),
+          /* @__PURE__ */ t("p", { className: "mt-1 text-xs text-slate-600", children: /* @__PURE__ */ t("span", { children: a("add_to_cart_description") }) })
         ] }),
-        /* @__PURE__ */ s("div", { className: "grid gap-4 px-4 py-4", children: [
-          L.length > 1 ? /* @__PURE__ */ s("div", { className: "grid gap-2", children: [
-            /* @__PURE__ */ t("p", { className: "text-xs font-medium text-slate-700", children: /* @__PURE__ */ t("span", { children: bt }) }),
-            /* @__PURE__ */ t($t, { value: u ?? "", onValueChange: P, className: "grid gap-2", children: L.map((r) => {
-              const c = `variant-${i.id}-${r.id}`.toLowerCase(), _ = `storefront-product-variant-option-${i.id}-${r.id}`.toLowerCase(), { label: yt, description: X } = qt(r), f = Yt(i, r.id, E), _t = f ? it(f) : J, Y = f ? st(e, f, at(f)) : J ? e("availability_out_of_stock") : null;
-              return /* @__PURE__ */ s(
+        /* @__PURE__ */ r("div", { className: "grid gap-4 px-4 py-4", children: [
+          T.length > 1 ? /* @__PURE__ */ r("div", { className: "grid gap-2", children: [
+            /* @__PURE__ */ t("p", { className: "text-xs font-medium text-slate-700", children: /* @__PURE__ */ t("span", { children: vt }) }),
+            /* @__PURE__ */ t($t, { value: m ?? "", onValueChange: C, className: "grid gap-2", children: T.map((n) => {
+              const c = `variant-${i.id}-${n.id}`.toLowerCase(), f = `storefront-product-variant-option-${i.id}-${n.id}`.toLowerCase(), { label: S, description: Y } = Ut(n), g = Zt(i, n.id, G), Nt = g ? rt(g) : X, Z = g ? nt(a, g, it(g)) : X ? a("availability_out_of_stock") : null;
+              return /* @__PURE__ */ r(
                 "label",
                 {
                   htmlFor: c,
-                  "data-testid": _,
-                  className: k(
+                  "data-testid": f,
+                  className: w(
                     "flex items-start gap-3 rounded-xl border p-3 transition",
-                    u === r.id ? "border-slate-900 bg-slate-50" : "border-slate-200 bg-white"
+                    m === n.id ? "border-slate-900 bg-slate-50" : "border-slate-200 bg-white"
                   ),
                   children: [
-                    /* @__PURE__ */ t(Ft, { id: c, value: r.id, className: "mt-1" }),
-                    /* @__PURE__ */ s("span", { className: "flex flex-1 flex-col gap-0.5", children: [
-                      /* @__PURE__ */ t("span", { className: "text-sm font-medium text-slate-950", children: yt }),
-                      X ? /* @__PURE__ */ t("span", { className: "text-xs text-slate-600", children: X }) : null,
-                      Y ? /* @__PURE__ */ t("span", { className: "pt-1", children: /* @__PURE__ */ t(et, { variant: _t ? "destructive" : "outline", children: /* @__PURE__ */ t("span", { children: Y }) }) }) : null
+                    /* @__PURE__ */ t(Ft, { id: c, value: n.id, className: "mt-1" }),
+                    /* @__PURE__ */ r("span", { className: "flex flex-1 flex-col gap-0.5", children: [
+                      /* @__PURE__ */ t("span", { className: "text-sm font-medium text-slate-950", children: S }),
+                      Y ? /* @__PURE__ */ t("span", { className: "text-xs text-slate-600", children: Y }) : null,
+                      Z ? /* @__PURE__ */ t("span", { className: "pt-1", children: /* @__PURE__ */ t(et, { variant: Nt ? "destructive" : "outline", children: /* @__PURE__ */ t("span", { children: Z }) }) }) : null
                     ] })
                   ]
                 },
@@ -224,26 +224,26 @@ function ke() {
               );
             }) })
           ] }) : null,
-          /* @__PURE__ */ s("div", { className: "grid gap-2", children: [
-            /* @__PURE__ */ t("p", { className: "text-xs font-medium text-slate-700", children: /* @__PURE__ */ t("span", { children: e("quantity_label") }) }),
+          /* @__PURE__ */ r("div", { className: "grid gap-2", children: [
+            /* @__PURE__ */ t("p", { className: "text-xs font-medium text-slate-700", children: /* @__PURE__ */ t("span", { children: a("quantity_label") }) }),
             /* @__PURE__ */ t(
               Rt,
               {
                 type: "number",
                 min: 1,
                 max: 99,
-                value: I,
-                onChange: (r) => K(Number(r.target.value))
+                value: A,
+                onChange: (n) => E(Number(n.target.value))
               }
             )
           ] }),
-          /* @__PURE__ */ s(b, { className: "h-11 rounded-xl text-sm font-semibold gap-2", onClick: xt, disabled: !vt, children: [
-            /* @__PURE__ */ t("span", { children: e("add_to_cart") }),
-            /* @__PURE__ */ t(B, { className: "h-4 w-4", "aria-hidden": "true" })
+          /* @__PURE__ */ r(v, { className: "h-11 rounded-xl text-sm font-semibold gap-2", onClick: yt, disabled: !xt, children: [
+            /* @__PURE__ */ t("span", { children: a("add_to_cart") }),
+            /* @__PURE__ */ t(R, { className: "h-4 w-4", "aria-hidden": "true" })
           ] }),
-          /* @__PURE__ */ t(Z, { to: j, className: k(R > 0 ? "block" : "hidden"), children: /* @__PURE__ */ s(b, { variant: "outline", className: "h-11 w-full rounded-xl gap-2", children: [
-            /* @__PURE__ */ t("span", { children: e("go_to_checkout") }),
-            /* @__PURE__ */ t(B, { className: "h-4 w-4", "aria-hidden": "true" })
+          /* @__PURE__ */ t(tt, { to: M, className: w($ > 0 ? "block" : "hidden"), children: /* @__PURE__ */ r(v, { variant: "outline", className: "h-11 w-full rounded-xl gap-2", children: [
+            /* @__PURE__ */ t("span", { children: a("go_to_checkout") }),
+            /* @__PURE__ */ t(R, { className: "h-4 w-4", "aria-hidden": "true" })
           ] }) })
         ] })
       ] }) })
@@ -251,5 +251,5 @@ function ke() {
   ] }) });
 }
 export {
-  ke as default
+  ka as default
 };

package/dist/pages/checkout/components/CheckoutCouponCard.js

@@ -8,8 +8,8 @@ function A({
   className: p,
   code: l,
   appliedCode: o,
-  discountLabel: n,
-  message: c,
+  discountLabel: c,
+  message: n,
   error: s,
   loading: r,
   disabled: i,
@@ -49,8 +49,8 @@ function A({
         }
       )
     ] }),
-    o && n ? /* @__PURE__ */ a("div", { className: "flex items-center justify-between gap-3 rounded-md border border-emerald-200 bg-emerald-50 px-3 py-2 text-sm text-emerald-800", children: [
-      /* @__PURE__ */ e("span", { children: t("checkout_coupon_applied", { code: o, amount: n }) }),
+    o && c ? /* @__PURE__ */ a("div", { className: "flex items-center justify-between gap-3 rounded-md border border-emerald-200 bg-emerald-50 px-3 py-2 text-sm text-emerald-800", children: [
+      /* @__PURE__ */ e("span", { children: t("checkout_coupon_applied", { code: o, amount: c }) }),
       /* @__PURE__ */ e(
         d,
         {
@@ -64,8 +64,8 @@ function A({
         }
       )
     ] }) : null,
-    c ? /* @__PURE__ */ e("p", { className: "text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: c }) }) : null,
-    s ? /* @__PURE__ */ e("p", { className: "text-xs text-red-700", children: /* @__PURE__ */ e("span", { children: s }) }) : null
+    n ? /* @__PURE__ */ e("p", { className: "text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: n }) }) : null,
+    s ? /* @__PURE__ */ e("p", { className: "text-xs text-destructive", children: /* @__PURE__ */ e("span", { children: s }) }) : null
   ] });
 }
 export {

package/dist/pages/checkout/components/CheckoutPaymentSummaryCard.js

@@ -1,28 +1,28 @@
 import { jsxs as a, jsx as e } from "react/jsx-runtime";
-import { Loader2 as k, AlertTriangle as v } from "lucide-react";
+import { Loader2 as y, AlertTriangle as k } from "lucide-react";
 import { useTranslation as w } from "react-i18next";
 import { Button as C } from "../../../ui/button.js";
 import { Card as j } from "../../../ui/card.js";
 function F({
   estimatedTotalLabel: m,
   couponCode: o,
-  discountAmountLabel: s,
+  discountAmountLabel: d,
   totalExcludingTaxLabel: h,
   vatAmountLabel: p,
   vatRateLabel: u,
   depositAmountLabel: r,
   amountToCollectMinor: x,
   amountToCollectLabel: _,
-  paymentSummaryHelper: n,
-  paymentDecisionLoading: c,
-  paymentDecisionError: d,
+  paymentSummaryHelper: c,
+  paymentDecisionLoading: n,
+  paymentDecisionError: s,
   canChoosePaymentMethod: i,
   showAmountDueNowRow: g,
   selectedPaymentMethod: b,
   submitting: N,
   onSelectPaymentMethod: f
 }) {
-  const { t } = w(), y = [
+  const { t } = w(), v = [
     { id: "card", label: t("checkout_payment_method_card") },
     { id: "apple_pay", label: t("checkout_payment_method_apple_pay") },
     { id: "other", label: t("checkout_payment_method_other") }
@@ -38,9 +38,9 @@ function F({
           /* @__PURE__ */ e("dt", { className: "text-slate-700", children: /* @__PURE__ */ e("span", { children: t("checkout_estimated_total") }) }),
           /* @__PURE__ */ e("dd", { className: "font-semibold tabular-nums text-slate-900", children: /* @__PURE__ */ e("span", { children: m }) })
         ] }),
-        s ? /* @__PURE__ */ a("div", { className: "grid grid-cols-[minmax(0,1fr)_auto] items-center gap-x-4 border-t border-slate-100 py-2.5", children: [
+        d ? /* @__PURE__ */ a("div", { className: "grid grid-cols-[minmax(0,1fr)_auto] items-center gap-x-4 border-t border-slate-100 py-2.5", children: [
           /* @__PURE__ */ e("dt", { className: "text-emerald-700", children: /* @__PURE__ */ e("span", { children: t("checkout_coupon_discount", { code: o ?? "" }) }) }),
-          /* @__PURE__ */ e("dd", { className: "font-medium tabular-nums text-emerald-700", children: /* @__PURE__ */ e("span", { children: s }) })
+          /* @__PURE__ */ e("dd", { className: "font-medium tabular-nums text-emerald-700", children: /* @__PURE__ */ e("span", { children: d }) })
         ] }) : null,
         /* @__PURE__ */ a("div", { className: "grid grid-cols-[minmax(0,1fr)_auto] items-center gap-x-4 border-t border-slate-100 py-2.5", children: [
           /* @__PURE__ */ e("dt", { className: "text-slate-600", children: /* @__PURE__ */ e("span", { children: t("checkout_payment_total_excluding_tax") }) }),
@@ -59,16 +59,16 @@ function F({
           /* @__PURE__ */ e("dd", { className: `text-base font-bold tabular-nums tracking-tight ${x > 0 ? "text-slate-950" : "text-slate-800"}`, children: /* @__PURE__ */ e("span", { children: _ }) })
         ] }) : null
       ] }),
-      n ? /* @__PURE__ */ e("p", { className: "text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: n }) }) : null,
-      c ? /* @__PURE__ */ a("div", { className: "flex items-center gap-2 text-sm text-slate-600", children: [
-        /* @__PURE__ */ e(k, { className: "h-4 w-4 animate-spin", "aria-hidden": "true" }),
+      c ? /* @__PURE__ */ e("p", { className: "text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: c }) }) : null,
+      n ? /* @__PURE__ */ a("div", { className: "flex items-center gap-2 text-sm text-slate-600", children: [
+        /* @__PURE__ */ e(y, { className: "h-4 w-4 animate-spin", "aria-hidden": "true" }),
         /* @__PURE__ */ e("span", { children: t("checkout_payment_loading") })
       ] }) : null,
-      d ? /* @__PURE__ */ e("div", { className: "grid gap-3 rounded-xl border border-red-200 bg-red-50 p-4", children: /* @__PURE__ */ a("div", { className: "flex items-start gap-2 text-sm text-red-700", children: [
-        /* @__PURE__ */ e(v, { className: "mt-0.5 h-4 w-4", "aria-hidden": "true" }),
-        /* @__PURE__ */ e("span", { children: d })
+      s ? /* @__PURE__ */ e("div", { className: "grid gap-3 rounded-xl border border-destructive/25 bg-destructive/5 p-4", children: /* @__PURE__ */ a("div", { className: "flex items-start gap-2 text-sm text-destructive", children: [
+        /* @__PURE__ */ e(k, { className: "mt-0.5 h-4 w-4", "aria-hidden": "true" }),
+        /* @__PURE__ */ e("span", { children: s })
       ] }) }) : null,
-      !c && !d && i ? /* @__PURE__ */ e("div", { className: "grid gap-2 sm:grid-cols-3", children: y.map((l) => /* @__PURE__ */ e(
+      !n && !s && i ? /* @__PURE__ */ e("div", { className: "grid gap-2 sm:grid-cols-3", children: v.map((l) => /* @__PURE__ */ e(
         C,
         {
           type: "button",