@loczer/storefront-sdk 0.147.0 → 0.149.0

package/dist/lib/whatsapp.js

@@ -0,0 +1,60 @@
+import { getLocalizedValue as u } from "../localization.js";
+const i = (t) => t?.replace(/\D/g, "") ?? "", l = (t) => t.match(/.{1,2}/g)?.join(" ") ?? t, d = (t) => i(t.phone_href) || i(t.phone_display), c = (t) => t ? t.match(/(?:wa\.me\/|[?&]phone=)(\d+)/)?.[1] ?? "" : "", a = (t, r) => {
+  const n = i(t);
+  if (!n) return t.trim();
+  if (r?.preset && n === d(r.preset))
+    return r.preset.phone_display;
+  const e = r?.country?.trim().toUpperCase() ?? "";
+  if ((e === "FR" || n.startsWith("33")) && n.startsWith("33") && n.length === 11) {
+    const o = n.slice(2);
+    return `+33 (0)${o.slice(0, 1)} ${l(o.slice(1))}`;
+  }
+  return (e === "US" || e === "CA" || n.startsWith("1")) && n.startsWith("1") && n.length === 11 ? `+1 (${n.slice(1, 4)}) ${n.slice(4, 7)}-${n.slice(7)}` : t.trim();
+};
+function m(t, r) {
+  const n = i(t);
+  if (!n) return;
+  const e = r?.trim() ?? "", o = e ? `?text=${encodeURIComponent(e)}` : "";
+  return `https://wa.me/${n}${o}`;
+}
+function y({
+  preset: t,
+  storefrontConfiguration: r,
+  language: n
+}) {
+  if (!r) {
+    const s = c(t.whatsapp_href);
+    return {
+      href: t.whatsapp_href,
+      phoneDisplay: s ? a(`+${s}`, { preset: t }) : t.phone_display
+    };
+  }
+  const { content: e, shop: o } = r;
+  if (!e) {
+    const s = c(t.whatsapp_href);
+    return {
+      href: t.whatsapp_href,
+      phoneDisplay: s ? a(`+${s}`, { country: o.country, preset: t }) : t.phone_display
+    };
+  }
+  const p = u(e?.whatsappMessage, n).trim(), f = [
+    e.whatsappPhone1Enabled ? o.contactPhone1 : void 0,
+    e.whatsappPhone2Enabled ? o.contactPhone2 : void 0
+  ];
+  for (const s of f) {
+    const h = m(s, p);
+    if (h)
+      return {
+        href: h,
+        phoneDisplay: a(s ?? "", { country: o.country, preset: t })
+      };
+  }
+}
+function D(t) {
+  return y(t)?.href;
+}
+export {
+  m as buildWhatsAppHref,
+  y as resolveStorefrontWhatsAppContact,
+  D as resolveStorefrontWhatsAppHref
+};

package/dist/localization.d.ts

@@ -0,0 +1,13 @@
+export declare const getLocalizedEntry: <Value>(localizedValue: Record<string, Value> | undefined, currentLanguage: string, fallbackLanguage?: string) => Value | undefined;
+
+export declare const getLocalizedValue: (localizedString: LocalizedString | undefined, currentLanguage: string, fallbackLanguage?: string) => string;
+
+export declare type LocalizedString<TExtra extends Record<string, unknown> = Record<string, unknown>> = Record<string, LocalizedStringEntry<TExtra>>;
+
+export declare type LocalizedStringEntry<TExtra extends Record<string, unknown> = Record<string, unknown>> = {
+    value: string;
+    updatedAt: Date;
+    autoTranslated?: boolean;
+} & TExtra;
+
+export { }

package/dist/localization.js

@@ -0,0 +1,16 @@
+const s = (t, r) => {
+  const e = [t], n = t.split("-")[0];
+  return n && n !== t && e.push(n), r && e.push(r), Array.from(new Set(e.filter(Boolean)));
+}, f = (t, r, e = "fr") => {
+  if (t) {
+    for (const n of s(r, e)) {
+      const o = t[n];
+      if (o) return o;
+    }
+    return Object.values(t)[0];
+  }
+}, c = (t, r, e = "fr") => t ? f(t, r, e)?.value ?? "" : "";
+export {
+  f as getLocalizedEntry,
+  c as getLocalizedValue
+};

package/dist/mollieComponentStyles.d.ts

@@ -0,0 +1,3 @@
+export declare const getMollieCardStyles: () => Record<string, unknown>;
+
+export { }

package/dist/pages/BookingPage.d.ts

@@ -0,0 +1,2 @@
+export default function BookingPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=BookingPage.d.ts.map

package/dist/pages/BookingPage.js

@@ -0,0 +1,535 @@
+import { jsxs as c, jsx as i } from "react/jsx-runtime";
+import { useMemo as p, useState as S, useEffect as P } from "react";
+import { useParams as ne, useLocation as re, useSearchParams as oe, Link as it } from "@rpcbase/router";
+import { cn as ct } from "@rpcbase/ui";
+import { ArrowLeft as se, ShoppingCart as le, Bike as de, ArrowRight as Rt } from "lucide-react";
+import { useTranslation as Ft } from "react-i18next";
+import { apiPost as Vt } from "../lib/apiCall.js";
+import { getProductVariantAttributeValue as ce, getStorefrontProductVariantDisplay as me } from "../lib/productVariants.js";
+import { getStorefrontCheckoutProductId as mt } from "../lib/products.js";
+import { ROUTE as Pt, responseSchema as At, buildStorefrontAvailabilityKey as h, getStorefrontAvailabilityStatus as K, getStorefrontAvailabilityIssue as Kt, isStorefrontAvailabilityInsufficient as ue } from "../lib/storefrontAvailability.js";
+import { getLocalizedValue as nt } from "../localization.js";
+import { Badge as Et } from "../ui/badge.js";
+import { Button as E } from "../ui/button.js";
+import { Card as pe } from "../ui/card.js";
+import { RadioGroup as fe, RadioGroupItem as ge } from "../ui/radio-group.js";
+import { createBookingPeriodConfigFromStorefrontConfiguration as he, getDefaultBookingParamsForStorefrontConfiguration as be, resolveBookingSearchParamsFromSessionStorage as _e, getBookingParamsFromSearch as Tt, applyBookingParamsToSearch as wt, writeBookingSearchParamsToSessionStorage as ve, TIME_OPTIONS as ye } from "../lib/booking.js";
+import { useStorefrontCart as Se } from "../lib/cart.js";
+import { buildStorefrontCartSummary as ke } from "../lib/cartSummary.js";
+import { resolveProductImageContainerStyle as xe } from "../lib/productImageStyles.js";
+import { BookingFlowSteps as Ne } from "../components/BookingFlowSteps/index.js";
+import { StepSectionTitle as rt } from "../components/StepSectionTitle/index.js";
+import { BookingPeriodSelector as Ie } from "../components/BookingPeriodSelector/index.js";
+import { BikeProductCard as Ce } from "../components/BikeProductCard/index.js";
+import { StorefrontCartPanel as Ve } from "../components/StorefrontCartPanel/index.js";
+import { BookingBikeVariantDialog as Pe } from "../components/BookingBikeVariantDialog/index.js";
+import { FulfillmentSection as Ae } from "../components/FulfillmentSection/index.js";
+import { ProductPriceBadge as Te } from "../components/ProductPriceBadge/index.js";
+import { ProductWarningNotice as we } from "../components/ProductWarningNotice/index.js";
+import { useStorefront as Oe, useStorefrontProducts as Be } from "../StorefrontProvider.js";
+const Ot = (e) => String(e).padStart(2, "0"), ot = "product_modal", Bt = (e) => `${e.getFullYear()}-${Ot(e.getMonth() + 1)}-${Ot(e.getDate())}`, st = (e) => {
+  if (!e) return;
+  const n = e.match(/^(\d{4})-(\d{2})-(\d{2})$/);
+  if (!n) return;
+  const o = Number(n[1]), d = Number(n[2]), l = Number(n[3]), m = new Date(o, d - 1, l);
+  if (!(Number.isNaN(m.getTime()) || m.getFullYear() !== o || m.getMonth() !== d - 1 || m.getDate() !== l))
+    return m;
+}, Dt = (e, n) => e.fulfillment === n.fulfillment && e.start_date === n.start_date && e.start_time === n.start_time && e.end_date === n.end_date && e.end_time === n.end_time && e.start_address === n.start_address && e.end_address === n.end_address, I = (e, n = () => !0) => {
+  if (e.representedVariantId?.trim()) return e.representedVariantId.trim();
+  const o = e.productVariants ?? [], l = o.find((m) => n(m.id))?.id ?? o[0]?.id;
+  return typeof l == "string" && l.trim().length > 0 ? l : null;
+}, Lt = (e, n) => e.fulfillment === "delivery" && !n ? { ...e, fulfillment: "pickup" } : e, lt = (e, n) => {
+  const o = mt(e), d = e.representedVariantId?.trim();
+  if (d) {
+    const l = n.get(h(o, d));
+    if (l) return l;
+  }
+  return n.get(h(o));
+}, $t = (e, n, o) => o.get(h(mt(e), n)), dt = (e, n, o) => {
+  const d = Kt(n);
+  return d === "quantity_unavailable" ? e("availability_quantity_unavailable") : d === "unavailable" || o === "OUT_OF_STOCK" ? e("availability_out_of_stock") : n?.remaining !== void 0 ? e("availability_remaining_count", { count: n.remaining }) : n?.fewRemaining || o === "LOW_STOCK" ? e("availability_low_stock") : e("availability_in_stock");
+}, De = (e) => {
+  const n = /* @__PURE__ */ new Map();
+  for (const o of e) {
+    const d = mt(o);
+    n.set(h(d), { productId: d });
+    for (const m of o.productVariants ?? [])
+      n.set(h(d, m.id), {
+        productId: d,
+        productVariantId: m.id
+      });
+    const l = o.representedVariantId?.trim();
+    l && n.set(h(d, l), {
+      productId: d,
+      productVariantId: l
+    });
+  }
+  return Array.from(n.values());
+};
+function Le({
+  product: e,
+  selectedVariantId: n,
+  onSelect: o,
+  onConfirm: d,
+  onCancel: l,
+  getVariantAvailabilityLabel: m,
+  isVariantOutOfCapacity: k
+}) {
+  const { t: f } = Ft(), g = e.productVariants ?? [], C = g.some((u) => !!ce(u, "size")), A = f(C ? "product_size_label" : "product_variant_label");
+  return /* @__PURE__ */ c("div", { className: "grid gap-3 rounded-xl border border-slate-200 bg-slate-50 p-3", children: [
+    /* @__PURE__ */ i("p", { className: "text-xs font-medium text-slate-700", children: /* @__PURE__ */ i("span", { children: A }) }),
+    /* @__PURE__ */ i(fe, { value: n, onValueChange: o, className: "grid gap-2", children: g.map((u) => {
+      const T = `booking-variant-${e.id}-${u.id}`.toLowerCase(), M = `storefront-booking-variant-option-${e.id}-${u.id}`.toLowerCase(), { label: z, description: w } = me(u), U = k(u.id), b = m(u.id);
+      return /* @__PURE__ */ c(
+        "label",
+        {
+          htmlFor: T,
+          "data-testid": M,
+          className: ct(
+            "flex items-start gap-3 rounded-xl border p-3 transition",
+            n === u.id ? "border-slate-900 bg-white" : "border-slate-200 bg-white"
+          ),
+          children: [
+            /* @__PURE__ */ i(ge, { id: T, value: u.id, className: "mt-1" }),
+            /* @__PURE__ */ c("span", { className: "flex flex-1 flex-col gap-0.5", children: [
+              /* @__PURE__ */ i("span", { className: "text-sm font-medium text-slate-950", children: z }),
+              w ? /* @__PURE__ */ i("span", { className: "text-xs text-slate-600", children: w }) : null,
+              b ? /* @__PURE__ */ i("span", { className: "pt-1", children: /* @__PURE__ */ i(Et, { variant: U ? "destructive" : "outline", children: /* @__PURE__ */ i("span", { children: b }) }) }) : null
+            ] })
+          ]
+        },
+        u.id
+      );
+    }) }),
+    /* @__PURE__ */ c("div", { className: "flex flex-wrap items-center gap-2", children: [
+      /* @__PURE__ */ c(
+        E,
+        {
+          type: "button",
+          size: "sm",
+          className: "rounded-full gap-2",
+          onClick: d,
+          children: [
+            /* @__PURE__ */ i("span", { children: f("add_to_cart") }),
+            /* @__PURE__ */ i(Rt, { className: "h-4 w-4", "aria-hidden": "true" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ i(E, { type: "button", size: "sm", variant: "outline", className: "rounded-full", onClick: l, children: /* @__PURE__ */ i("span", { children: f("booking_select_variant_cancel") }) })
+    ] })
+  ] });
+}
+function ma() {
+  const { t: e, i18n: n } = Ft(), { storeSlug: o } = ne(), d = re(), { storefrontConfiguration: l } = Oe(), m = l.workspace?.workspaceLanguage, { bikes: k, accessories: f } = Be(), [g, C] = oe(), { items: A, itemCount: u, addItem: T, clear: M, removeItem: z, setQuantity: w } = Se(), U = p(
+    () => he(l),
+    [l]
+  ), b = p(
+    () => be(l),
+    [l]
+  ), O = l.settings.fulfillmentModes.includes("delivery"), Mt = l.settings.deliveryDisabledReason.trim(), zt = l.shop.address?.trim() ?? "", j = p(
+    () => _e(g, o),
+    [g, o]
+  ), [s, ut] = S(
+    () => Lt(Tt(j, b), O)
+  );
+  P(() => {
+    ut((t) => {
+      const a = {
+        ...b,
+        ...t,
+        start_time: t.start_time.trim() ? t.start_time : b.start_time,
+        end_time: t.end_time.trim() ? t.end_time : b.end_time
+      }, r = Lt(Tt(j, a), O);
+      return Dt(t, r) ? t : r;
+    });
+  }, [j, b, O]), P(() => {
+    const t = wt(g, s);
+    t.toString() !== g.toString() && C(t, { replace: !0 });
+  }, [s, g, C]), P(() => {
+    ve(o, s);
+  }, [s, o]);
+  const W = p(
+    () => De([...k, ...f]),
+    [f, k]
+  ), [pt, B] = S([]), [ft, q] = S(!1);
+  P(() => {
+    if (!o || W.length === 0) {
+      B([]), q(!1);
+      return;
+    }
+    let t = !1;
+    return q(!0), B([]), (async () => {
+      try {
+        const a = await Vt(
+          Pt,
+          {
+            storeSlug: o,
+            schedule: {
+              startDate: s.start_date,
+              endDate: s.end_date,
+              startTime: s.start_time,
+              endTime: s.end_time
+            },
+            products: W
+          }
+        ), r = At.parse(a);
+        if (t) return;
+        B(r.success ? r.availability ?? [] : []);
+      } catch (a) {
+        if (t) return;
+        console.error("Failed to load storefront availability", a), B([]);
+      } finally {
+        t || q(!1);
+      }
+    })(), () => {
+      t = !0;
+    };
+  }, [
+    W,
+    s.end_date,
+    s.end_time,
+    s.start_date,
+    s.start_time,
+    o
+  ]);
+  const x = p(() => new Map(
+    pt.map((t) => [
+      h(t.productId, t.productVariantId),
+      t
+    ])
+  ), [pt]), D = p(() => k.map((t) => {
+    const a = lt(t, x);
+    return {
+      ...t,
+      availabilityStatus: a ? K(a) : t.availabilityStatus ?? "AVAILABLE"
+    };
+  }), [x, k]), gt = (t, a) => {
+    const r = $t(t, a, x);
+    return r ? ue(r) : t.availabilityStatus === "OUT_OF_STOCK";
+  }, ht = (t) => (t.productVariants ?? []).length > 0, bt = (t, a) => {
+    const r = $t(t, a, x);
+    return r ? dt(e, r, K(r)) : t.availabilityStatus === "OUT_OF_STOCK" ? e("availability_out_of_stock") : null;
+  }, _t = p(
+    () => ye.map((t) => ({ value: t, label: t })),
+    []
+  ), Ut = p(
+    () => ({
+      startDate: e("booking_start_date"),
+      pickStartDate: e("booking_start_date"),
+      startTime: e("booking_start_time"),
+      endDate: e("booking_end_date"),
+      pickEndDate: e("booking_end_date"),
+      endTime: e("booking_end_time"),
+      selectedDaysTooltip: ({ count: t }) => e("booking_selected_days_tooltip", { count: t })
+    }),
+    [n.language, e]
+  ), y = (t) => {
+    ut((a) => {
+      const r = { ...a, ...t };
+      return Dt(a, r) ? a : r;
+    });
+  }, jt = {
+    startDate: st(s.start_date),
+    onStartDateChange: (t) => {
+      t && y({ start_date: Bt(t) });
+    },
+    startTime: s.start_time,
+    onStartTimeChange: (t) => y({ start_time: t }),
+    endDate: st(s.end_date) ?? st(s.start_date),
+    onEndDateChange: (t) => {
+      t && y({ end_date: Bt(t) });
+    },
+    endTime: s.end_time,
+    onEndTimeChange: (t) => y({ end_time: t }),
+    startTimeOptions: _t,
+    endTimeOptions: _t,
+    bookingPeriodConfig: U,
+    labels: Ut,
+    localeCode: n.language
+  }, V = p(
+    () => ke({
+      items: A,
+      language: n.language,
+      fallbackLanguage: m,
+      products: { bikes: D, accessories: f }
+    }),
+    [f, D, n.language, A, m]
+  ), G = p(
+    () => V.lines.map((t) => ({
+      productId: t.checkoutProductId,
+      productVariantId: t.productVariantId,
+      quantity: t.quantity
+    })),
+    [V.lines]
+  ), [vt, L] = S([]), [Q, Y] = S(!1);
+  P(() => {
+    if (!o || G.length === 0) {
+      L([]), Y(!1);
+      return;
+    }
+    let t = !1;
+    return Y(!0), L([]), (async () => {
+      try {
+        const a = await Vt(
+          Pt,
+          {
+            storeSlug: o,
+            schedule: {
+              startDate: s.start_date,
+              endDate: s.end_date,
+              startTime: s.start_time,
+              endTime: s.end_time
+            },
+            products: G
+          }
+        ), r = At.parse(a);
+        if (t) return;
+        L(r.success ? r.availability ?? [] : []);
+      } catch (a) {
+        if (t) return;
+        console.error("Failed to load storefront cart availability", a), L([]);
+      } finally {
+        t || Y(!1);
+      }
+    })(), () => {
+      t = !0;
+    };
+  }, [
+    s.end_date,
+    s.end_time,
+    s.start_date,
+    s.start_time,
+    G,
+    o
+  ]);
+  const yt = p(() => new Map(
+    vt.map((t) => [
+      h(t.productId, t.productVariantId),
+      t
+    ])
+  ), [vt]), St = p(
+    () => ({
+      ...V,
+      lines: V.lines.map((t) => {
+        const a = yt.get(h(t.checkoutProductId, t.productVariantId)), r = a ? Kt(a) : t.availabilityStatus === "OUT_OF_STOCK" ? "unavailable" : void 0;
+        return {
+          ...t,
+          insufficientCapacity: !Q && r !== void 0,
+          availabilityIssue: Q ? void 0 : r
+        };
+      })
+    }),
+    [yt, Q, V]
+  ), N = wt(new URLSearchParams(), s).toString(), Wt = `/${o ?? ""}${N ? `?${N}` : ""}`, qt = `/${o ?? ""}/booking${N ? `?${N}` : ""}`, H = `/${o ?? ""}/checkout${N ? `?${N}` : ""}`, kt = {
+    backTo: `${d.pathname}${d.search}${d.hash}`
+  }, [Gt, $] = S(null), [Qt, xt] = S({}), J = (t) => {
+    const a = Qt[t.id];
+    return a && t.productVariants?.some((r) => r.id === a) ? a : I(t);
+  }, Nt = g.get(ot)?.trim() ?? "", _ = Nt ? D.find((t) => t.id === Nt) ?? null : null, X = (t) => {
+    const a = new URLSearchParams(g);
+    t?.trim() ? a.set(ot, t) : a.delete(ot), C(a, { replace: !0 });
+  }, Yt = (t) => {
+    const a = I(t);
+    a && (xt((r) => r[t.id] ? r : { ...r, [t.id]: a }), $(t.id));
+  }, Ht = (t) => {
+    I(t) && ($(null), X(t.id));
+  }, R = (t, a, r = 1) => {
+    T({
+      kind: t.kind,
+      productId: t.id,
+      ...a ? { productVariantId: a } : {},
+      quantity: r
+    });
+  }, Jt = (t) => {
+    const a = I(t), r = t.productVariants ?? [];
+    if (a && r.length <= 1) {
+      R(t, a);
+      return;
+    }
+    Ht(t);
+  }, Xt = (t) => {
+    const a = t.productVariants ?? [], r = J(t);
+    if (r) {
+      if (a.length > 1) {
+        Yt(t);
+        return;
+      }
+      R(t, r);
+    }
+  }, Zt = (t) => {
+    const a = J(t);
+    a && (R(t, a), $((r) => r === t.id ? null : r));
+  };
+  return /* @__PURE__ */ c("div", { className: "mx-auto max-w-7xl px-4 py-8 sm:px-6", children: [
+    /* @__PURE__ */ c("div", { className: "flex flex-col gap-4", children: [
+      /* @__PURE__ */ i(Ne, { currentStep: "booking", bookingPath: qt, checkoutPath: H, checkoutEnabled: u > 0 }),
+      /* @__PURE__ */ c("div", { className: "flex items-center justify-between gap-3", children: [
+        /* @__PURE__ */ c(it, { to: Wt, className: "inline-flex items-center gap-2 text-sm font-medium text-slate-700 hover:text-slate-950", children: [
+          /* @__PURE__ */ i(se, { className: "h-4 w-4", "aria-hidden": "true" }),
+          /* @__PURE__ */ i("span", { children: e("back_to_home") })
+        ] }),
+        /* @__PURE__ */ i(it, { to: H, className: ct(u > 0 ? "inline-flex" : "hidden"), children: /* @__PURE__ */ c(E, { size: "sm", className: "gap-2", children: [
+          /* @__PURE__ */ i(le, { className: "h-4 w-4", "aria-hidden": "true" }),
+          /* @__PURE__ */ i("span", { children: e("checkout_button") })
+        ] }) })
+      ] }),
+      /* @__PURE__ */ c("div", { className: "grid gap-6 lg:grid-cols-12", children: [
+        /* @__PURE__ */ i("div", { className: "lg:col-span-8", children: /* @__PURE__ */ c("div", { className: "space-y-6", children: [
+          /* @__PURE__ */ c("div", { className: "space-y-3", children: [
+            /* @__PURE__ */ i(rt, { stepNumber: 1, title: e("booking_summary_title") }),
+            /* @__PURE__ */ i(
+              Ie,
+              {
+                ...jt,
+                className: "gap-3",
+                labelClassName: "text-xs font-medium text-slate-700",
+                inputClassName: "h-10"
+              }
+            ),
+            /* @__PURE__ */ i(
+              Ae,
+              {
+                value: s.fulfillment,
+                onValueChange: (t) => y({ fulfillment: t }),
+                pickupAddress: zt,
+                deliveryEnabled: O,
+                deliveryDisabledReason: Mt,
+                startAddress: s.start_address,
+                onStartAddressChange: (t) => y({ start_address: t }),
+                endAddress: s.end_address,
+                onEndAddressChange: (t) => y({ end_address: t }),
+                testIdPrefix: "storefront-booking-fulfillment"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ c("div", { id: "booking-products", className: "space-y-2 scroll-mt-32", children: [
+            /* @__PURE__ */ i(rt, { stepNumber: 2, title: e("products_title") }),
+            /* @__PURE__ */ i("p", { className: "text-sm text-slate-600", children: /* @__PURE__ */ i("span", { children: e("products_description") }) })
+          ] }),
+          /* @__PURE__ */ i("div", { className: "grid gap-4 md:grid-cols-2", children: D.map((t) => {
+            const a = lt(t, x), r = K(a), Z = `/${o ?? ""}/products/${t.slug}`, F = !!I(t) || ht(t), et = ft ? e("availability_checking") : dt(e, a, r);
+            return /* @__PURE__ */ i(
+              Ce,
+              {
+                bike: t,
+                detailsPath: Z,
+                productDetailsLinkState: kt,
+                actionLabelKey: "add_to_cart",
+                onAction: () => Jt(t),
+                actionDisabled: !F,
+                availabilityLabel: et,
+                fallbackLanguage: m,
+                testId: `storefront-booking-bike-card-${t.id}`.toLowerCase()
+              },
+              t.id
+            );
+          }) }),
+          /* @__PURE__ */ c("div", { className: "space-y-2 pt-4", children: [
+            /* @__PURE__ */ i(rt, { stepNumber: 3, title: e("accessories_title") }),
+            /* @__PURE__ */ i("p", { className: "text-sm text-slate-600", children: /* @__PURE__ */ i("span", { children: e("accessories_description") }) })
+          ] }),
+          /* @__PURE__ */ i("div", { className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-3", children: f.map((t) => {
+            const a = nt(t.name, n.language, m), r = nt(t.description, n.language, m), Z = nt(t.warning, n.language, m), tt = typeof t.images?.[0] == "string" ? t.images[0].trim() : "", F = xe(t.primaryImageStyle), et = `/${o ?? ""}/products/${t.slug}`, te = I(t), It = J(t), Ct = lt(t, x), at = K(Ct), ee = !!te || ht(t), ae = ft ? e("availability_checking") : dt(e, Ct, at);
+            return /* @__PURE__ */ i(
+              pe,
+              {
+                className: "border-slate-200 bg-white shadow-sm",
+                children: /* @__PURE__ */ c("div", { className: "flex flex-col gap-3 p-4", children: [
+                  /* @__PURE__ */ i(
+                    "div",
+                    {
+                      className: ct("relative aspect-[1618/1000] overflow-hidden rounded-xl", F.className),
+                      style: F.style,
+                      children: tt ? /* @__PURE__ */ i("img", { src: tt, alt: a, className: "absolute inset-0 h-full w-full object-contain p-1", loading: "lazy" }) : /* @__PURE__ */ i("div", { className: "absolute inset-0 flex items-center justify-center text-slate-400", children: /* @__PURE__ */ i(de, { className: "h-8 w-8", "aria-hidden": "true" }) })
+                    }
+                  ),
+                  /* @__PURE__ */ c("div", { className: "flex flex-1 flex-col gap-1", children: [
+                    /* @__PURE__ */ i("p", { className: "text-sm font-semibold text-slate-950", children: /* @__PURE__ */ i("span", { children: a }) }),
+                    /* @__PURE__ */ i("p", { className: "line-clamp-2 text-xs text-slate-600", children: /* @__PURE__ */ i("span", { children: r }) }),
+                    /* @__PURE__ */ i(we, { warning: Z, className: "mt-1" })
+                  ] }),
+                  /* @__PURE__ */ c("div", { className: "flex flex-wrap items-center gap-2", children: [
+                    /* @__PURE__ */ i(Et, { variant: at === "OUT_OF_STOCK" ? "destructive" : at === "LOW_STOCK" ? "outline" : "secondary", children: /* @__PURE__ */ i("span", { children: ae }) }),
+                    /* @__PURE__ */ i(Te, { prices: t.prices })
+                  ] }),
+                  t.productVariants?.length && t.productVariants.length > 1 && Gt === t.id && It ? /* @__PURE__ */ i(
+                    Le,
+                    {
+                      product: t,
+                      selectedVariantId: It,
+                      onSelect: (v) => xt((ie) => ({ ...ie, [t.id]: v })),
+                      onConfirm: () => Zt(t),
+                      onCancel: () => $((v) => v === t.id ? null : v),
+                      getVariantAvailabilityLabel: (v) => bt(t, v),
+                      isVariantOutOfCapacity: (v) => gt(t, v)
+                    }
+                  ) : null,
+                  /* @__PURE__ */ c("div", { className: "flex items-center gap-2", children: [
+                    /* @__PURE__ */ i(
+                      it,
+                      {
+                        to: et,
+                        state: kt,
+                        className: "text-xs font-medium text-slate-700 hover:text-slate-950",
+                        children: /* @__PURE__ */ i("span", { children: e("product_details_link") })
+                      }
+                    ),
+                    /* @__PURE__ */ c(
+                      E,
+                      {
+                        type: "button",
+                        size: "sm",
+                        className: "ml-auto rounded-full gap-2",
+                        onClick: () => Xt(t),
+                        disabled: !ee,
+                        children: [
+                          /* @__PURE__ */ i("span", { children: e("add_to_cart") }),
+                          /* @__PURE__ */ i(Rt, { className: "h-4 w-4", "aria-hidden": "true" })
+                        ]
+                      }
+                    )
+                  ] })
+                ] })
+              },
+              t.id
+            );
+          }) })
+        ] }) }),
+        /* @__PURE__ */ i("div", { className: "lg:col-span-4", children: /* @__PURE__ */ i(
+          Ve,
+          {
+            lines: St.lines,
+            itemCount: u,
+            totalPerDayMinor: St.totalPerDayMinor,
+            checkoutPath: H,
+            showCheckoutAction: !0,
+            showClearAction: !0,
+            editable: !0,
+            stickyTopClassName: "top-32",
+            onQuantityChange: w,
+            onRemove: z,
+            onClear: M
+          }
+        ) })
+      ] })
+    ] }),
+    /* @__PURE__ */ i(
+      Pe,
+      {
+        open: !!_,
+        product: _,
+        onOpenChange: (t) => {
+          t || X(null);
+        },
+        getVariantAvailabilityLabel: (t) => _ ? bt(_, t) : null,
+        isVariantOutOfCapacity: (t) => _ ? gt(_, t) : !1,
+        onAddVariant: (t, a) => {
+          _ && (R(_, t, a), X(null));
+        }
+      }
+    )
+  ] });
+}
+export {
+  ma as default
+};

package/dist/pages/CheckoutPage.d.ts

@@ -0,0 +1,2 @@
+export default function CheckoutPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CheckoutPage.d.ts.map