@loczer/storefront-sdk 0.165.0 → 0.167.0

package/dist/pages/HomePage.js

@@ -1,80 +1,80 @@
-import { jsxs as r, jsx as e, Fragment as le } from "react/jsx-runtime";
-import { useMemo as h, useState as b, useRef as He, useEffect as je } from "react";
-import { useMediaQuery as Ue } from "@rpcbase/client";
-import { useParams as Ve, useLocation as ze, useSearchParams as Ye, useNavigate as Qe, Link as V } from "@rpcbase/router";
+import { jsxs as r, jsx as e, Fragment as oe } from "react/jsx-runtime";
+import { useMemo as h, useState as b, useRef as Ue, useEffect as je } from "react";
+import { useMediaQuery as Ve } from "@rpcbase/client";
+import { useParams as ze, useLocation as Ye, useSearchParams as Qe, useNavigate as We, Link as M } from "@rpcbase/router";
 import { cn as m } from "@rpcbase/ui";
-import { Clock as We, MapPin as Ke, CheckCircle2 as Ge, ShieldCheck as Je, Truck as Xe, ArrowRight as z, Bike as oe } from "lucide-react";
-import { useTranslation as Ze } from "react-i18next";
+import { Clock as Ke, MapPin as Ge, ShieldCheck as Je, Umbrella as Xe, Truck as Ze, ArrowRight as z, Bike as de } from "lucide-react";
+import { useTranslation as et } from "react-i18next";
 import W from "../chunks/assets/playground-hero-preview.svg-DNbSwXV5.js";
-import { getAvailabilityVariant as et } from "../lib/utils.js";
-import { getStorefrontPreset as tt } from "../data/config.js";
+import { getAvailabilityVariant as tt } from "../lib/utils.js";
+import { getStorefrontPreset as at } from "../data/config.js";
 import { getLocalizedValue as A } from "../localization.js";
-import { AboutSection as at } from "../components/AboutSection/index.js";
-import { BikeProductCard as rt } from "../components/BikeProductCard/index.js";
-import { ContactSection as st } from "../components/ContactSection/index.js";
-import { ProductPriceBadge as de } from "../components/ProductPriceBadge/index.js";
-import { ProductWarningNotice as it } from "../components/ProductWarningNotice/index.js";
-import { resolveStorefrontCancellationPolicyTeaserTier as nt, StorefrontCancellationPolicyNotice as lt } from "../components/StorefrontCancellationPolicyNotice/index.js";
-import { TestimonialsSection as ot } from "../components/TestimonialsSection/index.js";
-import { BookingPeriodProvider as dt } from "../components/BookingPeriodSelector/BookingPeriodContext.js";
-import { BookingStartDateField as ct } from "../components/BookingPeriodSelector/components/BookingStartDateField.js";
-import { BookingStartTimeField as mt } from "../components/BookingPeriodSelector/components/BookingStartTimeField.js";
-import { BookingEndDateField as ht } from "../components/BookingPeriodSelector/components/BookingEndDateField.js";
-import { BookingEndTimeField as pt } from "../components/BookingPeriodSelector/components/BookingEndTimeField.js";
+import { AboutSection as rt } from "../components/AboutSection/index.js";
+import { BikeProductCard as st } from "../components/BikeProductCard/index.js";
+import { ContactSection as it } from "../components/ContactSection/index.js";
+import { ProductPriceBadge as ce } from "../components/ProductPriceBadge/index.js";
+import { ProductWarningNotice as lt } from "../components/ProductWarningNotice/index.js";
+import { resolveStorefrontCancellationPolicyTeaserTier as nt, StorefrontCancellationPolicyNotice as ot } from "../components/StorefrontCancellationPolicyNotice/index.js";
+import { TestimonialsSection as dt } from "../components/TestimonialsSection/index.js";
+import { BookingPeriodProvider as ct } from "../components/BookingPeriodSelector/BookingPeriodContext.js";
+import { BookingStartDateField as mt } from "../components/BookingPeriodSelector/components/BookingStartDateField.js";
+import { BookingStartTimeField as ht } from "../components/BookingPeriodSelector/components/BookingStartTimeField.js";
+import { BookingEndDateField as pt } from "../components/BookingPeriodSelector/components/BookingEndDateField.js";
+import { BookingEndTimeField as gt } from "../components/BookingPeriodSelector/components/BookingEndTimeField.js";
 import "../components/BookingPeriodSelector/components/BookingMobileDateDrawer.js";
 import { Badge as Y } from "../ui/badge.js";
-import { Button as ce } from "../ui/button.js";
-import { Card as me } from "../ui/card.js";
-import { resolveBookingSearchParamsFromSessionStorage as gt, createBookingPeriodConfigFromStorefrontConfiguration as ut, getDefaultBookingParamsForStorefrontConfiguration as ft, getBookingParamsFromSearch as xt, applyBookingParamsToSearch as vt, writeBookingSearchParamsToSessionStorage as bt } from "../lib/booking.js";
-import { createStorefrontTimeSlotsFetcher as Nt } from "../lib/fetchStorefrontTimeSlots.js";
-import { resolveProductImageContainerStyle as he } from "../lib/productImageStyles.js";
-import { usePlaygroundDevSettings as _t } from "../lib/playgroundDevSettings.js";
-import { useStorefront as kt, useStorefrontProducts as yt } from "../StorefrontProvider.js";
-import { FulfillmentSection as pe } from "../components/FulfillmentSection/index.js";
-import { DeliveryAddressSelector as wt } from "../components/DeliveryAddressSelector/index.js";
-const ge = (a) => String(a).padStart(2, "0"), ue = "text-2xs font-semibold uppercase tracking-wide text-slate-600", fe = "h-10", St = 6, xe = 5, ve = [15, 25, 42, 66, 33, 54], Q = ["4 / 5", "1 / 1", "3 / 4", "5 / 4", "7 / 9", "4 / 3", "9 / 16", "6 / 7"], be = (a) => `${a.getFullYear()}-${ge(a.getMonth() + 1)}-${ge(a.getDate())}`, E = (a) => {
+import { Button as me } from "../ui/button.js";
+import { Card as he } from "../ui/card.js";
+import { resolveBookingSearchParamsFromSessionStorage as ut, createBookingPeriodConfigFromStorefrontConfiguration as ft, getDefaultBookingParamsForStorefrontConfiguration as xt, getBookingParamsFromSearch as vt, applyBookingParamsToSearch as bt, writeBookingSearchParamsToSessionStorage as Nt } from "../lib/booking.js";
+import { createStorefrontTimeSlotsFetcher as _t } from "../lib/fetchStorefrontTimeSlots.js";
+import { resolveProductImageContainerStyle as pe } from "../lib/productImageStyles.js";
+import { usePlaygroundDevSettings as kt } from "../lib/playgroundDevSettings.js";
+import { useStorefront as yt, useStorefrontProducts as wt } from "../StorefrontProvider.js";
+import { FulfillmentSection as ge } from "../components/FulfillmentSection/index.js";
+import { DeliveryAddressSelector as St } from "../components/DeliveryAddressSelector/index.js";
+const ue = (a) => String(a).padStart(2, "0"), fe = "text-2xs font-semibold uppercase tracking-wide text-slate-600", xe = "h-10", Pt = 6, ve = 5, be = [15, 25, 42, 66, 33, 54], Q = ["4 / 5", "1 / 1", "3 / 4", "5 / 4", "7 / 9", "4 / 3", "9 / 16", "6 / 7"], Ne = (a) => `${a.getFullYear()}-${ue(a.getMonth() + 1)}-${ue(a.getDate())}`, E = (a) => {
   if (!a)
     return;
   const i = a.match(/^(\d{4})-(\d{2})-(\d{2})$/);
   if (!i)
     return;
-  const n = Number(i[1]), p = Number(i[2]), d = Number(i[3]), o = new Date(n, p - 1, d);
-  if (!(Number.isNaN(o.getTime()) || o.getFullYear() !== n || o.getMonth() !== p - 1 || o.getDate() !== d))
+  const l = Number(i[1]), p = Number(i[2]), d = Number(i[3]), o = new Date(l, p - 1, d);
+  if (!(Number.isNaN(o.getTime()) || o.getFullYear() !== l || o.getMonth() !== p - 1 || o.getDate() !== d))
     return o;
 }, Ct = (a) => {
   const i = a.length > 0 ? a : [W];
-  return Array.from({ length: St }, (n, p) => Array.from({ length: xe }, (d, o) => {
-    const u = p * xe + o;
+  return Array.from({ length: Pt }, (l, p) => Array.from({ length: ve }, (d, o) => {
+    const u = p * ve + o;
     return {
       aspectRatio: Q[(u + p) % Q.length] ?? Q[0],
       src: i[u % i.length] ?? W
     };
   }));
 };
-function oa() {
-  const { t: a, i18n: i } = Ze(), { storeSlug: n } = Ve(), p = ze(), { storefrontConfiguration: d } = kt(), o = d.workspace?.workspaceLanguage, { bikes: u, accessories: K } = yt(), [T] = Ye(), Ne = Qe(), f = h(
-    () => gt(T, n),
-    [T, n]
-  ), x = h(() => tt(n), [n]), _e = h(
-    () => ut(d),
+function da() {
+  const { t: a, i18n: i } = et(), { storeSlug: l } = ze(), p = Ye(), { storefrontConfiguration: d } = yt(), o = d.workspace?.workspaceLanguage, { bikes: u, accessories: K } = wt(), [R] = Qe(), _e = We(), f = h(
+    () => ut(R, l),
+    [R, l]
+  ), x = h(() => at(l), [l]), ke = h(
+    () => ft(d),
     [d]
   ), c = h(
-    () => ft(d),
+    () => xt(d),
     [d]
-  ), N = h(() => E(c.start_date), [c.start_date]), ke = h(
+  ), N = h(() => E(c.start_date), [c.start_date]), ye = h(
     () => E(c.end_date) ?? N,
     [c.end_date, N]
-  ), v = d.settings.fulfillmentModes.includes("delivery"), G = d.settings.deliveryDisabledReason.trim(), ye = !!nt(d.bookingEngine.cancellationPolicy), M = h(
-    () => xt(f, c),
+  ), v = d.settings.fulfillmentModes.includes("delivery"), G = d.settings.deliveryDisabledReason.trim(), we = !!nt(d.bookingEngine.cancellationPolicy), q = h(
+    () => vt(f, c),
     [c, f]
   ), [w, J] = b(
-    () => M.fulfillment === "delivery" && v ? "delivery" : "pickup"
-  ), [R, we] = b(
+    () => q.fulfillment === "delivery" && v ? "delivery" : "pickup"
+  ), [L, Se] = b(
     () => E(f.get("start_date")) ?? N
-  ), [q, Se] = b(() => f.get("start_time") ?? c.start_time), [L, Ce] = b(() => {
+  ), [F, Pe] = b(() => f.get("start_time") ?? c.start_time), [O, Ce] = b(() => {
     const t = E(f.get("start_date")) ?? N;
-    return E(f.get("end_date")) ?? t ?? ke;
-  }), [F, Pe] = b(() => f.get("end_time") ?? c.end_time), [S, O] = b(() => M.start_address), [C, $] = b(() => M.end_address), I = He(null), De = h(() => u.slice(0, 4), [u]), { heroMode: X } = _t(), P = X === "vertical_marquee_hero", _ = X === "booking_bar_overlay_hero" || P, Z = Ue("(min-width: 1024px)"), Ae = Nt(n), Ee = h(
+    return E(f.get("end_date")) ?? t ?? ye;
+  }), [$, De] = b(() => f.get("end_time") ?? c.end_time), [S, I] = b(() => q.start_address), [P, H] = b(() => q.end_address), U = Ue(null), Ae = h(() => u.slice(0, 4), [u]), { heroMode: X } = kt(), C = X === "vertical_marquee_hero", _ = X === "booking_bar_overlay_hero" || C, Z = Ve("(min-width: 1024px)"), Ee = _t(l), Be = h(
     () => ({
       startDate: a("booking_start_date"),
       pickStartDate: a("booking_start_date"),
@@ -86,134 +86,134 @@ function oa() {
     }),
     [i.language, a]
   ), B = h(() => {
-    const l = R ?? (N ?? /* @__PURE__ */ new Date()), s = L ?? l;
-    return vt(new URLSearchParams(), {
+    const n = L ?? (N ?? /* @__PURE__ */ new Date()), s = O ?? n;
+    return bt(new URLSearchParams(), {
       fulfillment: w === "delivery" && v ? "delivery" : "pickup",
-      start_date: be(l),
-      start_time: q || c.start_time,
-      end_date: be(s),
-      end_time: F || c.end_time,
+      start_date: Ne(n),
+      start_time: F || c.start_time,
+      end_date: Ne(s),
+      end_time: $ || c.end_time,
       start_address: S,
-      end_address: C
+      end_address: P
     });
   }, [
     c.end_time,
     c.start_time,
     N,
     v,
-    C,
-    L,
-    F,
+    P,
+    O,
+    $,
     w,
     S,
-    R,
-    q
-  ]), ee = B.toString(), Be = ee ? `?${ee}` : "";
+    L,
+    F
+  ]), ee = B.toString(), Te = ee ? `?${ee}` : "";
   je(() => {
-    bt(n, B);
-  }, [B, n]);
-  const Te = {
-    startDate: R,
-    onStartDateChange: we,
-    startTime: q,
-    onStartTimeChange: Se,
-    endDate: L,
+    Nt(l, B);
+  }, [B, l]);
+  const Me = {
+    startDate: L,
+    onStartDateChange: Se,
+    startTime: F,
+    onStartTimeChange: Pe,
+    endDate: O,
     onEndDateChange: Ce,
-    endTime: F,
-    onEndTimeChange: Pe,
+    endTime: $,
+    onEndTimeChange: De,
     onEndTimeCommit: () => {
-      I.current?.focus({ preventScroll: !0 });
+      U.current?.focus({ preventScroll: !0 });
     },
-    bookingPeriodConfig: _e,
-    fetchTimeSlots: Ae,
-    labels: Ee,
+    bookingPeriodConfig: ke,
+    fetchTimeSlots: Ee,
+    labels: Be,
     localeCode: i.language
-  }, H = () => {
-    const t = new URLSearchParams(T);
-    for (const [l, s] of B.entries())
-      t.set(l, s);
-    Ne(`/${n ?? ""}/booking?${t.toString()}#booking-products`);
-  }, j = (t) => `/${n ?? ""}/products/${t}`, U = {
+  }, j = () => {
+    const t = new URLSearchParams(R);
+    for (const [n, s] of B.entries())
+      t.set(n, s);
+    _e(`/${l ?? ""}/booking?${t.toString()}#booking-products`);
+  }, te = (t) => `/${l ?? ""}/products/${t}`, T = {
     backTo: `${p.pathname}${p.search}${p.hash}`
-  }, te = /* @__PURE__ */ r("div", { children: [
+  }, ae = /* @__PURE__ */ r("div", { children: [
     /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
       /* @__PURE__ */ r(Y, { variant: "secondary", children: [
-        /* @__PURE__ */ e(We, { className: "h-3 w-3", "aria-hidden": "true" }),
+        /* @__PURE__ */ e(Ke, { className: "h-3 w-3", "aria-hidden": "true" }),
         /* @__PURE__ */ e("span", { children: a("status_open") })
       ] }),
       /* @__PURE__ */ r(Y, { variant: "outline", children: [
-        /* @__PURE__ */ e(Ke, { className: "h-3 w-3", "aria-hidden": "true" }),
+        /* @__PURE__ */ e(Ge, { className: "h-3 w-3", "aria-hidden": "true" }),
         /* @__PURE__ */ e("span", { children: x.address })
       ] })
     ] }),
     /* @__PURE__ */ e("h1", { className: "mt-4 text-3xl font-semibold tracking-tight sm:text-4xl", children: /* @__PURE__ */ e("span", { children: a("hero_title", { fallback: x.hero_title }) }) }),
     /* @__PURE__ */ e("p", { className: "mt-3 text-sm text-slate-700 sm:text-base", children: /* @__PURE__ */ e("span", { children: a("hero_description", { fallback: x.hero_description }) }) }),
     /* @__PURE__ */ e("div", { className: m("mt-6", !_ && "rounded-xl border bg-white/70 p-3"), children: /* @__PURE__ */ r("ul", { className: m("space-y-3", _ && "space-y-2"), children: [
-      /* @__PURE__ */ e(lt, { policy: d.bookingEngine.cancellationPolicy }),
-      !_ && /* @__PURE__ */ r("li", { className: m("flex items-start gap-3", ye && "border-t border-slate-200/70 pt-3"), children: [
-        /* @__PURE__ */ e(Ge, { className: "mt-0.5 h-5 w-5 text-slate-900", "aria-hidden": "true" }),
+      /* @__PURE__ */ e(ot, { policy: d.bookingEngine.cancellationPolicy }),
+      /* @__PURE__ */ r("li", { className: m("flex items-start gap-3", !_ && we && "border-t border-slate-200/70 pt-3"), children: [
+        /* @__PURE__ */ e(Je, { className: "mt-0.5 h-5 w-5 text-emerald-600", "aria-hidden": "true" }),
         /* @__PURE__ */ r("div", { className: "flex flex-col gap-0.5", children: [
-          /* @__PURE__ */ e("p", { className: "text-sm font-medium text-slate-950", children: /* @__PURE__ */ e("span", { children: a("feature_ready_in_minutes_title") }) }),
-          /* @__PURE__ */ e("p", { className: "text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: a("feature_ready_in_minutes_description") }) })
+          /* @__PURE__ */ e("p", { className: "text-sm font-medium text-slate-950", children: /* @__PURE__ */ e("span", { children: a("feature_secure_payment_title") }) }),
+          /* @__PURE__ */ e("p", { className: "text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: a("feature_secure_payment_description") }) })
         ] })
       ] }),
-      /* @__PURE__ */ r("li", { className: m("flex items-start gap-3", !_ && "border-t border-slate-200/70 pt-3"), children: [
-        /* @__PURE__ */ e(Je, { className: "mt-0.5 h-5 w-5 text-slate-900", "aria-hidden": "true" }),
+      !_ && /* @__PURE__ */ r("li", { className: "flex items-start gap-3 border-t border-slate-200/70 pt-3", children: [
+        /* @__PURE__ */ e(Xe, { className: "mt-0.5 h-5 w-5 text-emerald-600", "aria-hidden": "true" }),
         /* @__PURE__ */ r("div", { className: "flex flex-col gap-0.5", children: [
-          /* @__PURE__ */ e("p", { className: "text-sm font-medium text-slate-950", children: /* @__PURE__ */ e("span", { children: a("feature_secure_payment_title") }) }),
-          /* @__PURE__ */ e("p", { className: "text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: a("feature_secure_payment_description") }) })
+          /* @__PURE__ */ e("p", { className: "text-sm font-medium text-slate-950", children: /* @__PURE__ */ e("span", { children: a("feature_guarantee_insurance_title") }) }),
+          /* @__PURE__ */ e("p", { className: "text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: a("feature_guarantee_insurance_description") }) })
         ] })
       ] }),
       v ? /* @__PURE__ */ r("li", { className: m("flex items-start gap-3", !_ && "border-t border-slate-200/70 pt-3"), children: [
-        /* @__PURE__ */ e(Xe, { className: "mt-0.5 h-5 w-5 text-slate-900", "aria-hidden": "true" }),
+        /* @__PURE__ */ e(Ze, { className: "mt-0.5 h-5 w-5 text-slate-900", "aria-hidden": "true" }),
         /* @__PURE__ */ r("div", { className: "flex flex-col gap-0.5", children: [
           /* @__PURE__ */ e("p", { className: "text-sm font-medium text-slate-950", children: /* @__PURE__ */ e("span", { children: a("feature_delivery_title") }) }),
           /* @__PURE__ */ e("p", { className: "text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: a("feature_delivery_description") }) })
         ] })
       ] }) : null
     ] }) })
-  ] }), ae = ({
+  ] }), re = ({
     className: t,
-    showSubmitButton: l = !1,
+    showSubmitButton: n = !1,
     submitButtonClassName: s
   }) => /* @__PURE__ */ e(
-    dt,
+    ct,
     {
-      ...Te,
-      labelClassName: ue,
-      inputClassName: fe,
+      ...Me,
+      labelClassName: fe,
+      inputClassName: xe,
       children: /* @__PURE__ */ r("div", { className: t, children: [
-        /* @__PURE__ */ e("div", { className: "min-w-0", children: /* @__PURE__ */ e(ct, {}) }),
-        /* @__PURE__ */ e(mt, {}),
-        /* @__PURE__ */ e("div", { className: "min-w-0", children: /* @__PURE__ */ e(ht, {}) }),
-        /* @__PURE__ */ e(pt, {}),
-        l ? /* @__PURE__ */ r(ce, { ref: I, className: m("gap-2", s), onClick: H, children: [
+        /* @__PURE__ */ e("div", { className: "min-w-0", children: /* @__PURE__ */ e(mt, {}) }),
+        /* @__PURE__ */ e(ht, {}),
+        /* @__PURE__ */ e("div", { className: "min-w-0", children: /* @__PURE__ */ e(pt, {}) }),
+        /* @__PURE__ */ e(gt, {}),
+        n ? /* @__PURE__ */ r(me, { ref: U, className: m("gap-2", s), onClick: j, children: [
           /* @__PURE__ */ e("span", { children: a("booking_submit") }),
           /* @__PURE__ */ e(z, { className: "h-4 w-4", "aria-hidden": "true" })
         ] }) : null
       ] })
     }
-  ), re = (t) => v ? /* @__PURE__ */ e(
-    wt,
+  ), se = (t) => v ? /* @__PURE__ */ e(
+    St,
     {
       open: w === "delivery",
       className: "sm:min-h-[6.75rem]",
-      inputClassName: `${fe} bg-white`,
-      labelClassName: ue,
+      inputClassName: `${xe} bg-white`,
+      labelClassName: fe,
       startAddress: S,
-      onStartAddressChange: O,
-      returnAddress: C,
-      onReturnAddressChange: $,
+      onStartAddressChange: I,
+      returnAddress: P,
+      onReturnAddressChange: H,
       testIdPrefix: t
     }
-  ) : null, Me = re("storefront-home-fulfillment-delivery-address"), Re = re("storefront-home-compact-fulfillment-delivery-address"), qe = /* @__PURE__ */ r(me, { className: "border-slate-200 bg-white/80 shadow-sm", children: [
+  ) : null, Re = se("storefront-home-fulfillment-delivery-address"), qe = se("storefront-home-compact-fulfillment-delivery-address"), Le = /* @__PURE__ */ r(he, { className: "border-slate-200 bg-white/80 shadow-sm", children: [
     /* @__PURE__ */ r("div", { className: "border-b border-slate-200 px-4 py-4", children: [
       /* @__PURE__ */ e("p", { className: "text-sm font-semibold text-slate-950", children: /* @__PURE__ */ e("span", { children: a("booking_title") }) }),
       /* @__PURE__ */ e("p", { className: "mt-1 text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: a("booking_subtitle") }) })
     ] }),
     /* @__PURE__ */ r("div", { className: "grid gap-4 px-4 py-4", children: [
       /* @__PURE__ */ e(
-        pe,
+        ge,
         {
           value: w,
           onValueChange: J,
@@ -221,26 +221,26 @@ function oa() {
           deliveryEnabled: v,
           deliveryDisabledReason: G,
           startAddress: S,
-          onStartAddressChange: O,
-          endAddress: C,
-          onEndAddressChange: $,
+          onStartAddressChange: I,
+          endAddress: P,
+          onEndAddressChange: H,
           showDeliveryAddressSelector: !1,
           testIdPrefix: "storefront-home-fulfillment"
         }
       ),
-      ae({
+      re({
         className: "grid grid-cols-1 gap-3 md:grid-cols-2 xl:grid-cols-[minmax(0,1fr)_150px_minmax(0,1fr)_150px] xl:items-start"
       }),
-      Me,
+      Re,
       /* @__PURE__ */ e("p", { className: "text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: a("booking_minimum_duration", { hours: 4 }) }) }),
-      /* @__PURE__ */ r(ce, { ref: I, className: "h-11 rounded-xl text-sm font-semibold gap-2", onClick: H, children: [
+      /* @__PURE__ */ r(me, { ref: U, className: "h-11 rounded-xl text-sm font-semibold gap-2", onClick: j, children: [
         /* @__PURE__ */ e("span", { children: a("booking_submit") }),
         /* @__PURE__ */ e(z, { className: "h-4 w-4", "aria-hidden": "true" })
       ] })
     ] })
-  ] }), se = /* @__PURE__ */ e(me, { className: "border-slate-200 bg-white/95 shadow-xl", children: /* @__PURE__ */ r("div", { className: "grid gap-3 p-4", children: [
+  ] }), ie = /* @__PURE__ */ e(he, { className: "border-slate-200 bg-white/95 shadow-xl", children: /* @__PURE__ */ r("div", { className: "grid gap-3 p-4", children: [
     /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
-      pe,
+      ge,
       {
         value: w,
         onValueChange: J,
@@ -248,20 +248,20 @@ function oa() {
         deliveryEnabled: v,
         deliveryDisabledReason: G,
         startAddress: S,
-        onStartAddressChange: O,
-        endAddress: C,
-        onEndAddressChange: $,
+        onStartAddressChange: I,
+        endAddress: P,
+        onEndAddressChange: H,
         showDeliveryAddressSelector: !1,
         testIdPrefix: "storefront-home-compact-fulfillment"
       }
     ) }),
-    ae({
+    re({
       className: "grid gap-3 md:grid-cols-2 xl:grid-cols-[minmax(0,1fr)_150px_minmax(0,1fr)_150px_auto] xl:items-end",
       showSubmitButton: !0,
       submitButtonClassName: "h-10 rounded-xl text-sm font-semibold xl:self-end"
     }),
-    Re
-  ] }) }), Le = [...u, ...K].flatMap((t) => Array.isArray(t.images) ? t.images : []).filter((t) => typeof t == "string" && t.trim().length > 0).map((t) => t.trim()).slice(0, 12), Fe = Ct(Le), Oe = P ? /* @__PURE__ */ e("style", { children: `
+    qe
+  ] }) }), Fe = [...u, ...K].flatMap((t) => Array.isArray(t.images) ? t.images : []).filter((t) => typeof t == "string" && t.trim().length > 0).map((t) => t.trim()).slice(0, 12), Oe = Ct(Fe), $e = C ? /* @__PURE__ */ e("style", { children: `
       @keyframes storefront-hero-marquee-up {
         0% { transform: translateY(0); }
         100% { transform: translateY(calc(-50% - (var(--storefront-hero-marquee-gap) / 2))); }
@@ -284,7 +284,7 @@ function oa() {
           transform: none !important;
         }
       }
-    ` }) : null, ie = (t) => /* @__PURE__ */ e(
+    ` }) : null, le = (t) => /* @__PURE__ */ e(
     "div",
     {
       className: m("relative h-full min-h-[340px] overflow-hidden", t),
@@ -297,8 +297,8 @@ function oa() {
         maskSize: "100% 100%"
       },
       "aria-hidden": "true",
-      children: /* @__PURE__ */ e("div", { className: "absolute inset-0 grid grid-cols-2 gap-3 md:grid-cols-3 lg:grid-cols-6", children: Fe.map((l, s) => {
-        const k = ve[s % ve.length] ?? 32, y = [...l, ...l];
+      children: /* @__PURE__ */ e("div", { className: "absolute inset-0 grid grid-cols-2 gap-3 md:grid-cols-3 lg:grid-cols-6", children: Oe.map((n, s) => {
+        const k = be[s % be.length] ?? 32, y = [...n, ...n];
         return /* @__PURE__ */ e(
           "div",
           {
@@ -331,7 +331,7 @@ function oa() {
                           src: g.src,
                           alt: "",
                           className: "absolute inset-0 h-full w-full object-cover opacity-90 saturate-[1.05] transition-transform duration-700 group-hover:scale-[1.04]",
-                          loading: D < l.length ? "eager" : "lazy"
+                          loading: D < n.length ? "eager" : "lazy"
                         }
                       ),
                       /* @__PURE__ */ e("div", { className: "absolute inset-0 bg-linear-to-t from-slate-950/40 via-slate-950/10 to-white/10" })
@@ -346,11 +346,11 @@ function oa() {
         );
       }) })
     }
-  ), $e = P ? /* @__PURE__ */ e("div", { className: "pointer-events-none absolute inset-0 hidden lg:block", "aria-hidden": "true", children: /* @__PURE__ */ r("div", { className: "mx-auto grid h-full max-w-7xl grid-cols-12 gap-8 px-4 sm:px-6", children: [
+  ), Ie = C ? /* @__PURE__ */ e("div", { className: "pointer-events-none absolute inset-0 hidden lg:block", "aria-hidden": "true", children: /* @__PURE__ */ r("div", { className: "mx-auto grid h-full max-w-7xl grid-cols-12 gap-8 px-4 sm:px-6", children: [
     /* @__PURE__ */ e("div", { className: "lg:col-span-5" }),
-    /* @__PURE__ */ e("div", { className: "lg:col-span-7", children: ie() })
-  ] }) }) : null, Ie = P ? /* @__PURE__ */ r(le, { children: [
-    /* @__PURE__ */ e("div", { className: "lg:hidden", children: ie() }),
+    /* @__PURE__ */ e("div", { className: "lg:col-span-7", children: le() })
+  ] }) }) : null, He = C ? /* @__PURE__ */ r(oe, { children: [
+    /* @__PURE__ */ e("div", { className: "lg:hidden", children: le() }),
     /* @__PURE__ */ e("div", { className: "hidden min-h-[510px] lg:block", "aria-hidden": "true" })
   ] }) : /* @__PURE__ */ r("div", { className: "relative min-h-[340px] overflow-hidden rounded-3xl border border-slate-200 bg-slate-900 shadow-sm lg:min-h-[510px]", children: [
     /* @__PURE__ */ e(
@@ -363,7 +363,7 @@ function oa() {
     ),
     /* @__PURE__ */ e("div", { className: "absolute inset-0 bg-linear-to-t from-slate-900/45 via-slate-900/15 to-transparent", "aria-hidden": "true" })
   ] });
-  return /* @__PURE__ */ r(le, { children: [
+  return /* @__PURE__ */ r(oe, { children: [
     /* @__PURE__ */ r("section", { className: "relative overflow-hidden border-b border-slate-200", children: [
       /* @__PURE__ */ e("div", { className: "absolute inset-0 bg-linear-to-b from-slate-50 to-white", "aria-hidden": "true" }),
       /* @__PURE__ */ e(
@@ -376,20 +376,20 @@ function oa() {
           "aria-hidden": "true"
         }
       ),
-      Oe,
       $e,
+      Ie,
       _ ? /* @__PURE__ */ r("div", { className: "relative mx-auto grid max-w-7xl gap-8 px-4 py-10 sm:px-6 lg:grid-cols-12 lg:py-14", children: [
         /* @__PURE__ */ r("div", { className: "lg:col-span-5", children: [
-          te,
-          Z ? /* @__PURE__ */ e("div", { className: "mt-7", children: /* @__PURE__ */ e("div", { className: "relative z-20 w-[calc(100%+24rem)] max-w-none", children: se }) }) : null
+          ae,
+          Z ? /* @__PURE__ */ e("div", { className: "mt-7", children: /* @__PURE__ */ e("div", { className: "relative z-20 w-[calc(100%+24rem)] max-w-none", children: ie }) }) : null
         ] }),
-        /* @__PURE__ */ r("div", { className: m("lg:col-span-7", !P && "lg:pt-4"), children: [
-          Ie,
-          Z ? null : /* @__PURE__ */ e("div", { className: "mt-4", children: se })
+        /* @__PURE__ */ r("div", { className: m("lg:col-span-7", !C && "lg:pt-4"), children: [
+          He,
+          Z ? null : /* @__PURE__ */ e("div", { className: "mt-4", children: ie })
         ] })
-      ] }) : /* @__PURE__ */ r("div", { className: "relative mx-auto grid max-w-7xl gap-8 px-4 py-10 sm:px-6 lg:grid-cols-12 lg:py-14", children: [
-        /* @__PURE__ */ e("div", { className: "lg:col-span-5", children: te }),
-        /* @__PURE__ */ e("div", { className: "lg:col-span-7", children: qe })
+      ] }) : /* @__PURE__ */ r("div", { className: "relative mx-auto grid max-w-7xl gap-8 px-4 py-10 sm:px-6 lg:grid-cols-12 lg:items-center lg:py-14", children: [
+        /* @__PURE__ */ e("div", { className: "lg:col-span-5", children: ae }),
+        /* @__PURE__ */ e("div", { className: "lg:col-span-7", children: Le })
       ] })
     ] }),
     /* @__PURE__ */ r("section", { id: "featured", className: "mx-auto max-w-7xl scroll-mt-16 px-4 py-10 sm:scroll-mt-20 sm:px-6", children: [
@@ -399,10 +399,10 @@ function oa() {
           /* @__PURE__ */ e("p", { className: "text-sm text-slate-600", children: /* @__PURE__ */ e("span", { children: a("featured_description") }) })
         ] }),
         /* @__PURE__ */ r(
-          V,
+          M,
           {
             className: "hidden items-center gap-2 text-sm font-medium text-slate-700 hover:text-slate-950 sm:inline-flex",
-            to: `/${n ?? ""}/booking${Be}`,
+            to: `/${l ?? ""}/booking${Te}`,
             children: [
               /* @__PURE__ */ e("span", { children: a("featured_view_all") }),
               /* @__PURE__ */ e(z, { className: "h-4 w-4", "aria-hidden": "true" })
@@ -410,46 +410,58 @@ function oa() {
           }
         )
       ] }),
-      /* @__PURE__ */ e("div", { className: "mt-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-4", children: De.map((t) => {
-        const l = t.id, s = t.slug, k = A(t.name, i.language, o), y = A(t.description, i.language, o), g = typeof t.images?.[0] == "string" ? t.images[0].trim() : "", D = he(t.primaryImageStyle), ne = et(t.availabilityStatus);
+      /* @__PURE__ */ e("div", { className: "mt-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-4", children: Ae.map((t) => {
+        const n = t.id, s = t.slug, k = A(t.name, i.language, o), y = A(t.description, i.language, o), g = typeof t.images?.[0] == "string" ? t.images[0].trim() : "", D = pe(t.primaryImageStyle), ne = tt(t.availabilityStatus), V = te(s);
         return /* @__PURE__ */ r(
           "div",
           {
             className: "group flex h-full flex-col gap-2 rounded-xl border border-slate-200 bg-white p-3 text-left shadow-sm transition hover:border-slate-400",
             children: [
               /* @__PURE__ */ e(
-                V,
+                M,
                 {
-                  to: j(s),
-                  state: U,
+                  to: V,
+                  state: T,
                   className: "block",
                   children: /* @__PURE__ */ e(
                     "span",
                     {
                       className: m("relative block aspect-[1618/1000] overflow-hidden rounded-xl", D.className),
                       style: D.style,
-                      children: g ? /* @__PURE__ */ e("img", { src: g, alt: k, className: "absolute inset-0 h-full w-full object-contain p-1", loading: "lazy" }) : /* @__PURE__ */ e("span", { className: "absolute inset-0 flex items-center justify-center text-slate-400", children: /* @__PURE__ */ e(oe, { className: "h-8 w-8", "aria-hidden": "true" }) })
+                      children: g ? /* @__PURE__ */ e("img", { src: g, alt: k, className: "absolute inset-0 h-full w-full object-contain p-1", loading: "lazy" }) : /* @__PURE__ */ e("span", { className: "absolute inset-0 flex items-center justify-center text-slate-400", children: /* @__PURE__ */ e(de, { className: "h-8 w-8", "aria-hidden": "true" }) })
                     }
                   )
                 }
               ),
               /* @__PURE__ */ r("span", { className: "flex flex-1 flex-col gap-1", children: [
                 /* @__PURE__ */ e(
-                  V,
+                  M,
                   {
-                    to: j(s),
-                    state: U,
+                    to: V,
+                    state: T,
                     className: "text-sm font-semibold text-slate-950 hover:text-slate-700",
                     children: /* @__PURE__ */ e("span", { children: k })
                   }
                 ),
-                /* @__PURE__ */ e(de, { prices: t.prices, className: "self-start" }),
+                /* @__PURE__ */ e(ce, { prices: t.prices, className: "self-start" }),
                 /* @__PURE__ */ e("span", { className: "line-clamp-2 text-xs text-slate-600", children: y })
               ] }),
-              /* @__PURE__ */ e("span", { className: "flex items-center gap-2", children: /* @__PURE__ */ e(Y, { variant: ne.variant, children: /* @__PURE__ */ e("span", { children: a(ne.labelKey) }) }) })
+              /* @__PURE__ */ r("span", { className: "flex flex-wrap items-center gap-x-2 gap-y-1", children: [
+                /* @__PURE__ */ e(Y, { variant: ne.variant, children: /* @__PURE__ */ e("span", { children: a(ne.labelKey) }) }),
+                /* @__PURE__ */ e("span", { className: "text-slate-400", children: "·" }),
+                /* @__PURE__ */ e(
+                  M,
+                  {
+                    to: V,
+                    state: T,
+                    className: "text-xs font-medium text-slate-700 hover:text-slate-950",
+                    children: /* @__PURE__ */ e("span", { children: a("product_details_link") })
+                  }
+                )
+              ] })
             ]
           },
-          l
+          n
         );
       }) })
     ] }),
@@ -459,13 +471,13 @@ function oa() {
         /* @__PURE__ */ e("p", { className: "text-sm text-slate-600", children: /* @__PURE__ */ e("span", { children: a("products_description") }) })
       ] }) }),
       /* @__PURE__ */ e("div", { className: "mt-6 grid gap-4 md:grid-cols-2", children: u.map((t) => /* @__PURE__ */ e(
-        rt,
+        st,
         {
           bike: t,
-          detailsPath: j(t.slug),
-          productDetailsLinkState: U,
+          detailsPath: te(t.slug),
+          productDetailsLinkState: T,
           fallbackLanguage: o,
-          onAction: H
+          onAction: j
         },
         t.id
       )) })
@@ -476,30 +488,30 @@ function oa() {
         /* @__PURE__ */ e("p", { className: "text-sm text-slate-600", children: /* @__PURE__ */ e("span", { children: a("accessories_description") }) })
       ] }) }),
       /* @__PURE__ */ e("div", { className: "mt-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-4", children: K.slice(0, 4).map((t) => {
-        const l = A(t.name, i.language, o), s = A(t.description, i.language, o), k = A(t.warning, i.language, o), y = typeof t.images?.[0] == "string" ? t.images[0].trim() : "", g = he(t.primaryImageStyle);
+        const n = A(t.name, i.language, o), s = A(t.description, i.language, o), k = A(t.warning, i.language, o), y = typeof t.images?.[0] == "string" ? t.images[0].trim() : "", g = pe(t.primaryImageStyle);
         return /* @__PURE__ */ r("div", { className: "flex h-full flex-col gap-2 rounded-xl border border-slate-200 bg-white p-3 shadow-sm", children: [
           /* @__PURE__ */ e(
             "div",
             {
               className: m("relative aspect-[1618/1000] overflow-hidden rounded-xl", g.className),
               style: g.style,
-              children: y ? /* @__PURE__ */ e("img", { src: y, alt: l, className: "absolute inset-0 h-full w-full object-contain p-1", loading: "lazy" }) : /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center text-slate-400", children: /* @__PURE__ */ e(oe, { className: "h-8 w-8", "aria-hidden": "true" }) })
+              children: y ? /* @__PURE__ */ e("img", { src: y, alt: n, className: "absolute inset-0 h-full w-full object-contain p-1", loading: "lazy" }) : /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center text-slate-400", children: /* @__PURE__ */ e(de, { className: "h-8 w-8", "aria-hidden": "true" }) })
             }
           ),
           /* @__PURE__ */ r("div", { className: "flex flex-1 flex-col gap-1", children: [
-            /* @__PURE__ */ e("p", { className: "text-sm font-semibold text-slate-950", children: /* @__PURE__ */ e("span", { children: l }) }),
+            /* @__PURE__ */ e("p", { className: "text-sm font-semibold text-slate-950", children: /* @__PURE__ */ e("span", { children: n }) }),
             /* @__PURE__ */ e("p", { className: "line-clamp-2 text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: s }) }),
-            /* @__PURE__ */ e(it, { warning: k, className: "mt-1" })
+            /* @__PURE__ */ e(lt, { warning: k, className: "mt-1" })
           ] }),
-          /* @__PURE__ */ e("div", { className: "flex items-center justify-between gap-2", children: /* @__PURE__ */ e(de, { prices: t.prices }) })
+          /* @__PURE__ */ e("div", { className: "flex items-center justify-between gap-2", children: /* @__PURE__ */ e(ce, { prices: t.prices }) })
         ] }, t.id);
       }) })
     ] }),
-    /* @__PURE__ */ e(at, { preset: x }),
-    /* @__PURE__ */ e(ot, {}),
-    /* @__PURE__ */ e(st, { preset: x, storeSlug: n ?? "" })
+    /* @__PURE__ */ e(rt, { preset: x }),
+    /* @__PURE__ */ e(dt, {}),
+    /* @__PURE__ */ e(it, { preset: x, storeSlug: l ?? "" })
   ] });
 }
 export {
-  oa as default
+  da as default
 };