@loczer/storefront-sdk 0.188.0 → 0.190.0

package/dist/pages/BookingPage.js

@@ -69,20 +69,20 @@ var D = (e) => String(e).padStart(2, "0"), O = "product_modal", De = (e) => `${e
 	}
 	return Array.from(t.values());
 };
-function Pe({ product: e, selectedVariantId: t, onSelect: n, onConfirm: r, onCancel: i, getVariantAvailabilityLabel: a, isVariantOutOfCapacity: c }) {
-	let { t: l } = Se(), u = e.productVariants ?? [];
+function Pe({ product: e, selectedVariantId: t, onSelect: n, onConfirm: r, onCancel: i, getVariantAvailabilityLabel: a, isVariantOutOfCapacity: c, confirmDisabled: l = !1 }) {
+	let { t: u } = Se(), d = e.productVariants ?? [];
 	return /* @__PURE__ */ w("div", {
 		className: "grid gap-3 rounded-xl border border-slate-200 bg-slate-50 p-3",
 		children: [
 			/* @__PURE__ */ C("p", {
 				className: "text-xs font-medium text-slate-700",
-				children: /* @__PURE__ */ C("span", { children: u.some((e) => !!o(e, "size")) ? l("product_size_label") : l("product_variant_label") })
+				children: /* @__PURE__ */ C("span", { children: d.some((e) => !!o(e, "size")) ? u("product_size_label") : u("product_variant_label") })
 			}),
 			/* @__PURE__ */ C(v, {
 				value: t,
 				onValueChange: n,
 				className: "grid gap-2",
-				children: u.map((n) => {
+				children: d.map((n) => {
 					let r = `booking-variant-${e.id}-${n.id}`.toLowerCase(), i = `storefront-booking-variant-option-${e.id}-${n.id}`.toLowerCase(), { label: o, description: l } = s(n), u = c(n.id), d = a(n.id);
 					return /* @__PURE__ */ w("label", {
 						htmlFor: r,
@@ -121,8 +121,9 @@ function Pe({ product: e, selectedVariantId: t, onSelect: n, onConfirm: r, onCan
 					type: "button",
 					size: "sm",
 					className: "rounded-full gap-2",
+					disabled: l,
 					onClick: r,
-					children: [/* @__PURE__ */ C("span", { children: l("add_to_cart") }), /* @__PURE__ */ C(we, {
+					children: [/* @__PURE__ */ C("span", { children: u("add_to_cart") }), /* @__PURE__ */ C(we, {
 						className: "h-4 w-4",
 						"aria-hidden": "true"
 					})]
@@ -132,21 +133,19 @@ function Pe({ product: e, selectedVariantId: t, onSelect: n, onConfirm: r, onCan
 					variant: "outline",
 					className: "rounded-full",
 					onClick: i,
-					children: /* @__PURE__ */ C("span", { children: l("booking_select_variant_cancel") })
+					children: /* @__PURE__ */ C("span", { children: u("booking_select_variant_cancel") })
 				})]
 			})
 		]
 	});
 }
 function j() {
-	let { t: o, i18n: s } = Se(), { storeSlug: v } = be(), y = ye(), { storefrontConfiguration: D } = oe(), j = D.workspace?.workspaceLanguage, { bikes: Fe, accessories: Ie } = ce(), { bikes: M, accessories: N } = se(), [P, F] = xe(), { items: Le, itemCount: I, addItem: Re, clear: ze, removeItem: Be, setQuantity: Ve } = l(), He = x(() => t(D), [D]), L = x(() => r(D), [D]), R = D.settings.fulfillmentModes.includes("delivery"), Ue = D.settings.deliveryDisabledReason.trim(), We = D.shop.address?.trim() ?? "", z = x(() => i(P, v), [P, v]), [B, Ge] = S(() => ke(n(z, L), R));
+	let { t: o, i18n: s } = Se(), { storeSlug: v } = be(), y = ye(), { storefrontConfiguration: D } = oe(), j = D.workspace?.workspaceLanguage, { bikes: Fe, accessories: Ie } = ce(), { bikes: M, accessories: N } = se(), [P, F] = xe(), { items: Le, itemCount: I, addItem: Re, clear: ze, removeItem: Be, setQuantity: Ve } = l(), He = x(() => t(D), [D]), L = x(() => r(D), [D]), R = D.settings.fulfillmentModes.includes("delivery"), Ue = D.settings.deliveryDisabledReason.trim(), We = D.shop.address?.trim() ?? "", z = x(() => i(P, v), [P, v]), [B, Ge] = S(() => ke(n(z, L), R)), [Ke, qe] = S(void 0);
 	b(() => {
 		Ge((e) => {
 			let t = {
 				...L,
-				...e,
-				start_time: e.start_time.trim() ? e.start_time : L.start_time,
-				end_time: e.end_time.trim() ? e.end_time : L.end_time
+				...e
 			}, r = ke(n(z, t), R);
 			return Oe(e, r) ? e : r;
 		});
@@ -164,14 +163,17 @@ function j() {
 	]), b(() => {
 		a(v, B);
 	}, [B, v]);
-	let V = x(() => Ne([...M, ...N]), [N, M]), [Ke, qe] = S([]);
+	let V = x(() => Ne([...M, ...N]), [N, M]), [Je, H] = S([]);
 	b(() => {
 		if (!v || V.length === 0) {
-			qe([]);
+			H([]);
 			return;
 		}
 		let e = h(B);
-		if (!e) return;
+		if (!e) {
+			H([]);
+			return;
+		}
 		let t = !1;
 		return (async () => {
 			try {
@@ -181,7 +183,7 @@ function j() {
 					products: V
 				}), r = ne.parse(n);
 				if (t) return;
-				qe(r.success ? r.availability ?? [] : []);
+				H(r.success ? r.availability ?? [] : []);
 			} catch (e) {
 				if (t) return;
 				console.error("Failed to load storefront availability", e);
@@ -197,27 +199,31 @@ function j() {
 		B.start_time,
 		v
 	]);
-	let H = x(() => new Map(Ke.map((e) => [p(e.productId, e.productVariantId), e])), [Ke]), Je = x(() => M.map((e) => {
-		let t = Ae(e, H);
+	let U = x(() => new Map(Je.map((e) => [p(e.productId, e.productVariantId), e])), [Je]), Ye = x(() => M.map((e) => {
+		let t = Ae(e, U);
 		return {
 			...e,
 			availabilityStatus: t ? m(t) : e.availabilityStatus ?? "AVAILABLE"
 		};
-	}), [H, M]), Ye = (e, t) => {
-		let n = je(e, t, H);
+	}), [U, M]), Xe = (e, t) => {
+		let n = je(e, t, U);
 		return n ? te(n) : e.availabilityStatus === "OUT_OF_STOCK";
-	}, Xe = (e) => (e.productVariants ?? []).length > 0, Ze = (e, t) => {
-		let n = je(e, t, H);
+	}, Ze = (e) => (e.productVariants ?? []).length > 0, Qe = (e, t) => {
+		let n = je(e, t, U);
 		return n ? Me(o, n, m(n)) : e.availabilityStatus === "OUT_OF_STOCK" ? o("availability_out_of_stock") : null;
-	}, Qe = ge(v), $e = x(() => ({
+	}, $e = ge(v), et = x(() => ({
 		startDate: o("booking_start_date"),
 		pickStartDate: o("booking_start_date"),
 		startTime: o("booking_start_time"),
 		endDate: o("booking_end_date"),
 		pickEndDate: o("booking_end_date"),
 		endTime: o("booking_end_time"),
-		selectedDaysTooltip: ({ count: e }) => o("booking_selected_days_tooltip", { count: e })
-	}), [s.language, o]), U = (e) => {
+		selectedDaysTooltip: ({ count: e }) => o("booking_selected_days_tooltip", { count: e }),
+		timeSlotsLoading: o("booking_time_slots_loading"),
+		timeSlotsUnavailable: o("booking_time_slots_unavailable"),
+		timeSlotsLoadError: o("booking_time_slots_load_error"),
+		retryTimeSlots: o("booking_time_slots_retry")
+	}), [s.language, o]), W = (e) => {
 		Ge((t) => {
 			let n = {
 				...t,
@@ -225,24 +231,27 @@ function j() {
 			};
 			return Oe(t, n) ? t : n;
 		});
-	}, et = {
+	}, tt = `${B.start_date}:${B.end_date}`, nt = {
 		startDate: k(B.start_date),
 		onStartDateChange: (e) => {
-			e && U({ start_date: De(e) });
+			e && W({ start_date: De(e) });
 		},
 		startTime: B.start_time,
-		onStartTimeChange: (e) => U({ start_time: e }),
+		onStartTimeChange: (e) => W({ start_time: e }),
 		endDate: k(B.end_date) ?? k(B.start_date),
 		onEndDateChange: (e) => {
-			e && U({ end_date: De(e) });
+			e && W({ end_date: De(e) });
 		},
 		endTime: B.end_time,
-		onEndTimeChange: (e) => U({ end_time: e }),
+		onEndTimeChange: (e) => W({ end_time: e }),
 		bookingPeriodConfig: He,
-		fetchTimeSlots: Qe,
-		labels: $e,
+		fetchTimeSlots: $e,
+		onTimeSlotsAvailabilityChange: (e) => {
+			qe(e ? tt : void 0);
+		},
+		labels: et,
 		localeCode: s.language
-	}, W = x(() => d({
+	}, G = x(() => d({
 		items: Le,
 		language: s.language,
 		fallbackLanguage: j,
@@ -256,28 +265,31 @@ function j() {
 		s.language,
 		Le,
 		j
-	]), G = x(() => W.lines.map((e) => ({
+	]), K = x(() => G.lines.map((e) => ({
 		productId: e.checkoutProductId,
 		productVariantId: e.productVariantId,
 		quantity: e.quantity
-	})), [W.lines]), [tt, nt] = S([]);
+	})), [G.lines]), [rt, q] = S([]);
 	b(() => {
-		if (!v || G.length === 0) {
-			nt([]);
+		if (!v || K.length === 0) {
+			q([]);
 			return;
 		}
 		let e = h(B);
-		if (!e) return;
+		if (!e) {
+			q([]);
+			return;
+		}
 		let t = !1;
 		return (async () => {
 			try {
 				let n = await he(f, {
 					storeSlug: v,
 					schedule: e,
-					products: G
+					products: K
 				}), r = ne.parse(n);
 				if (t) return;
-				nt(r.success ? r.availability ?? [] : []);
+				q(r.success ? r.availability ?? [] : []);
 			} catch (e) {
 				if (t) return;
 				console.error("Failed to load storefront cart availability", e);
@@ -290,59 +302,59 @@ function j() {
 		B.end_time,
 		B.start_date,
 		B.start_time,
-		G,
+		K,
 		v
 	]);
-	let rt = x(() => new Map(tt.map((e) => [p(e.productId, e.productVariantId), e])), [tt]), it = x(() => ({
-		...W,
-		lines: W.lines.map((e) => {
-			let t = rt.get(p(e.checkoutProductId, e.productVariantId)), n = t ? ee(t) : e.availabilityStatus === "OUT_OF_STOCK" ? "unavailable" : void 0;
+	let it = x(() => new Map(rt.map((e) => [p(e.productId, e.productVariantId), e])), [rt]), at = x(() => ({
+		...G,
+		lines: G.lines.map((e) => {
+			let t = it.get(p(e.checkoutProductId, e.productVariantId)), n = t ? ee(t) : e.availabilityStatus === "OUT_OF_STOCK" ? "unavailable" : void 0;
 			return {
 				...e,
 				insufficientCapacity: n !== void 0,
 				availabilityIssue: n
 			};
 		})
-	}), [rt, W]), K = e(new URLSearchParams(), B).toString(), at = `/${v ?? ""}${K ? `?${K}` : ""}`, ot = `/${v ?? ""}/booking${K ? `?${K}` : ""}`, q = `/${v ?? ""}/checkout${K ? `?${K}` : ""}`, J = { backTo: `${y.pathname}${y.search}${y.hash}` }, [st, Y] = S(null), [ct, lt] = S({}), X = (e) => {
-		let t = ct[e.id];
+	}), [it, G]), J = e(new URLSearchParams(), B).toString(), Y = Ke === tt && h(B) !== null, ot = `/${v ?? ""}${J ? `?${J}` : ""}`, st = `/${v ?? ""}/booking${J ? `?${J}` : ""}`, X = `/${v ?? ""}/checkout${J ? `?${J}` : ""}`, ct = { backTo: `${y.pathname}${y.search}${y.hash}` }, [lt, Z] = S(null), [ut, dt] = S({}), ft = (e) => {
+		let t = ut[e.id];
 		return t && e.productVariants?.some((e) => e.id === t) ? t : A(e);
-	}, ut = P.get(O)?.trim() ?? "", Z = ut ? Je.find((e) => e.id === ut) ?? null : null, Q = (e) => {
+	}, pt = P.get(O)?.trim() ?? "", Q = pt ? Ye.find((e) => e.id === pt) ?? null : null, mt = (e) => {
 		let t = new URLSearchParams(P);
 		e?.trim() ? t.set(O, e) : t.delete(O), F(t, { replace: !0 });
-	}, dt = (e) => {
+	}, ht = (e) => {
 		let t = A(e);
-		t && (lt((n) => n[e.id] ? n : {
+		t && (dt((n) => n[e.id] ? n : {
 			...n,
 			[e.id]: t
-		}), Y(e.id));
-	}, ft = (e) => {
-		A(e) && (Y(null), Q(e.id));
+		}), Z(e.id));
+	}, gt = (e) => {
+		A(e) && (Z(null), mt(e.id));
 	}, $ = (e, t, n = 1) => {
-		Re({
+		Y && Re({
 			kind: e.kind,
 			productId: c(e),
 			...t ? { productVariantId: t } : {},
 			quantity: n
 		});
-	}, pt = (e) => {
+	}, _t = (e) => {
 		let t = A(e), n = e.productVariants ?? [];
 		if (t && n.length <= 1) {
 			$(e, t);
 			return;
 		}
-		ft(e);
-	}, mt = (e) => {
-		let t = e.productVariants ?? [], n = X(e);
+		gt(e);
+	}, vt = (e) => {
+		let t = e.productVariants ?? [], n = ft(e);
 		if (n) {
 			if (t.length > 1) {
-				dt(e);
+				ht(e);
 				return;
 			}
 			$(e, n);
 		}
-	}, ht = (e) => {
-		let t = X(e);
-		t && ($(e, t), Y((t) => t === e.id ? null : t));
+	}, yt = (e) => {
+		let t = ft(e);
+		t && ($(e, t), Z((t) => t === e.id ? null : t));
 	};
 	return /* @__PURE__ */ w("div", {
 		className: "mx-auto max-w-7xl px-4 py-8 sm:px-6",
@@ -351,22 +363,22 @@ function j() {
 			children: [
 				/* @__PURE__ */ C(ae, {
 					currentStep: "booking",
-					bookingPath: ot,
-					checkoutPath: q,
-					checkoutEnabled: I > 0
+					bookingPath: st,
+					checkoutPath: X,
+					checkoutEnabled: I > 0 && Y
 				}),
 				/* @__PURE__ */ w("div", {
 					className: "flex items-center justify-between gap-3",
 					children: [/* @__PURE__ */ w(E, {
-						to: at,
+						to: ot,
 						className: "inline-flex items-center gap-2 text-sm font-medium text-slate-700 hover:text-slate-950",
 						children: [/* @__PURE__ */ C(Ce, {
 							className: "h-4 w-4",
 							"aria-hidden": "true"
 						}), /* @__PURE__ */ C("span", { children: o("back_to_home") })]
 					}), /* @__PURE__ */ C(E, {
-						to: q,
-						className: T(I > 0 ? "inline-flex" : "hidden"),
+						to: X,
+						className: T(I > 0 && Y ? "inline-flex" : "hidden"),
 						children: /* @__PURE__ */ w(g, {
 							size: "sm",
 							className: "gap-2",
@@ -392,21 +404,21 @@ function j() {
 											title: o("booking_summary_title")
 										}),
 										/* @__PURE__ */ C(ie, {
-											...et,
+											...nt,
 											className: "gap-3",
 											labelClassName: "text-xs font-medium text-slate-700",
 											inputClassName: "h-10"
 										}),
 										/* @__PURE__ */ C(_e, {
 											value: B.fulfillment,
-											onValueChange: (e) => U({ fulfillment: e }),
+											onValueChange: (e) => W({ fulfillment: e }),
 											pickupAddress: We,
 											deliveryEnabled: R,
 											deliveryDisabledReason: Ue,
 											startAddress: B.start_address,
-											onStartAddressChange: (e) => U({ start_address: e }),
+											onStartAddressChange: (e) => W({ start_address: e }),
 											endAddress: B.end_address,
-											onEndAddressChange: (e) => U({ end_address: e }),
+											onEndAddressChange: (e) => W({ end_address: e }),
 											testIdPrefix: "storefront-booking-fulfillment"
 										})
 									]
@@ -424,15 +436,15 @@ function j() {
 								}),
 								/* @__PURE__ */ C("div", {
 									className: "grid gap-4 md:grid-cols-2",
-									children: Je.map((e) => {
-										let t = `/${v ?? ""}/products/${e.slug}`, n = !!A(e) || Xe(e);
+									children: Ye.map((e) => {
+										let t = `/${v ?? ""}/products/${e.slug}`, n = !!A(e) || Ze(e);
 										return /* @__PURE__ */ C(me, {
 											bike: e,
 											detailsPath: t,
-											productDetailsLinkState: J,
+											productDetailsLinkState: ct,
 											actionLabelKey: "add_to_cart",
-											onAction: () => pt(e),
-											actionDisabled: !n,
+											onAction: () => _t(e),
+											actionDisabled: !n || !Y,
 											fallbackLanguage: j,
 											variant: "booking",
 											testId: `storefront-booking-bike-card-${e.id}`.toLowerCase()
@@ -452,7 +464,7 @@ function j() {
 								/* @__PURE__ */ C("div", {
 									className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-3",
 									children: N.map((e) => {
-										let t = u(e.name, s.language, j), n = u(e.description, s.language, j), r = u(e.warning, s.language, j), i = typeof e.images?.[0] == "string" ? e.images[0].trim() : "", a = pe(e.primaryImageStyle), c = `/${v ?? ""}/products/${e.slug}`, l = A(e), d = X(e), f = m(Ae(e, H)) === "OUT_OF_STOCK", p = !!l || Xe(e);
+										let t = u(e.name, s.language, j), n = u(e.description, s.language, j), r = u(e.warning, s.language, j), i = typeof e.images?.[0] == "string" ? e.images[0].trim() : "", a = pe(e.primaryImageStyle), c = `/${v ?? ""}/products/${e.slug}`, l = A(e), d = ft(e), f = m(Ae(e, U)) === "OUT_OF_STOCK", p = !!l || Ze(e);
 										return /* @__PURE__ */ C(le, {
 											className: "h-full border-slate-200 bg-white shadow-sm",
 											children: /* @__PURE__ */ w("div", {
@@ -501,31 +513,32 @@ function j() {
 															})
 														]
 													}),
-													e.productVariants?.length && e.productVariants.length > 1 && st === e.id && d ? /* @__PURE__ */ C(Pe, {
+													e.productVariants?.length && e.productVariants.length > 1 && lt === e.id && d ? /* @__PURE__ */ C(Pe, {
 														product: e,
 														selectedVariantId: d,
-														onSelect: (t) => lt((n) => ({
+														onSelect: (t) => dt((n) => ({
 															...n,
 															[e.id]: t
 														})),
-														onConfirm: () => ht(e),
-														onCancel: () => Y((t) => t === e.id ? null : t),
-														getVariantAvailabilityLabel: (t) => Ze(e, t),
-														isVariantOutOfCapacity: (t) => Ye(e, t)
+														onConfirm: () => yt(e),
+														onCancel: () => Z((t) => t === e.id ? null : t),
+														getVariantAvailabilityLabel: (t) => Qe(e, t),
+														isVariantOutOfCapacity: (t) => Xe(e, t),
+														confirmDisabled: !Y
 													}) : null,
 													/* @__PURE__ */ w("div", {
 														className: "mt-auto flex items-center gap-2",
 														children: [/* @__PURE__ */ C(E, {
 															to: c,
-															state: J,
+															state: ct,
 															className: "text-xs font-medium text-slate-700 hover:text-slate-950",
 															children: /* @__PURE__ */ C("span", { children: o("product_details_link") })
 														}), /* @__PURE__ */ w(g, {
 															type: "button",
 															size: "sm",
 															className: "ml-auto rounded-full gap-2",
-															onClick: () => mt(e),
-															disabled: !p,
+															onClick: () => vt(e),
+															disabled: !p || !Y,
 															children: [/* @__PURE__ */ C("span", { children: o("add_to_cart") }), /* @__PURE__ */ C(we, {
 																className: "h-4 w-4",
 																"aria-hidden": "true"
@@ -542,11 +555,11 @@ function j() {
 					}), /* @__PURE__ */ C("div", {
 						className: "lg:col-span-4",
 						children: /* @__PURE__ */ C(de, {
-							lines: it.lines,
+							lines: at.lines,
 							itemCount: I,
-							totalPerDayMinor: it.totalPerDayMinor,
-							checkoutPath: q,
-							showCheckoutAction: !0,
+							totalPerDayMinor: at.totalPerDayMinor,
+							checkoutPath: X,
+							showCheckoutAction: Y,
 							showClearAction: !0,
 							editable: !0,
 							stickyTopClassName: "top-32",
@@ -558,15 +571,16 @@ function j() {
 				})
 			]
 		}), /* @__PURE__ */ C(ve, {
-			open: !!Z,
-			product: Z,
+			open: !!Q,
+			product: Q,
 			onOpenChange: (e) => {
-				e || Q(null);
+				e || mt(null);
 			},
-			getVariantAvailabilityLabel: (e) => Z ? Ze(Z, e) : null,
-			isVariantOutOfCapacity: (e) => Z ? Ye(Z, e) : !1,
+			getVariantAvailabilityLabel: (e) => Q ? Qe(Q, e) : null,
+			isVariantOutOfCapacity: (e) => Q ? Xe(Q, e) : !1,
+			addDisabled: !Y,
 			onAddVariant: (e, t) => {
-				Z && ($(Z, e, t), Q(null));
+				Q && ($(Q, e, t), mt(null));
 			}
 		})]
 	});

package/dist/pages/CheckoutPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CheckoutPage.d.ts","sourceRoot":"","sources":["../../src/pages/CheckoutPage.tsx"],"names":[],"mappings":"AAwGA,MAAM,CAAC,OAAO,UAAU,YAAY,4CAkmBnC"}
+{"version":3,"file":"CheckoutPage.d.ts","sourceRoot":"","sources":["../../src/pages/CheckoutPage.tsx"],"names":[],"mappings":"AAwGA,MAAM,CAAC,OAAO,UAAU,YAAY,4CA8lBnC"}