@loczer/storefront-sdk 0.209.0 → 0.211.0

package/dist/components/PlaygroundDevFloatingButton/index.js

@@ -1,12 +1,13 @@
 import { cn as e } from "../../lib/utils.js";
 import { Button as t } from "../../ui/button.js";
 import n from "../../chunks/assets/dev-D2oG3j7S.js";
-import { resetPlaygroundDevSettings as r, usePlaygroundDevSettings as i, writePlaygroundDevSettings as a } from "../../lib/playgroundDevSettings.js";
-import { useCallback as o, useEffect as s, useMemo as c, useRef as l, useState as u } from "react";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
-import p from "interactjs";
+import { registerFloatingButtonCollisionParticipant as r, resolveFloatingButtonCollisions as i } from "../../lib/floatingButtonCollision.js";
+import { resetPlaygroundDevSettings as a, usePlaygroundDevSettings as o, writePlaygroundDevSettings as s } from "../../lib/playgroundDevSettings.js";
+import { useCallback as c, useEffect as l, useMemo as u, useRef as d, useState as f } from "react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import h from "interactjs";
 //#region src/components/PlaygroundDevFloatingButton/index.tsx
-var m = [
+var g = [
 	{
 		value: "current_booking_hero",
 		label: "Current booking hero",
@@ -22,58 +23,58 @@ var m = [
 		label: "Vertical marquee hero",
 		hint: "Keep the overlay booking bar and swap the static image for a vertical animated gallery"
 	}
-], h = () => {
-	let h = i(), [g, _] = u(!1), [v, y] = u({
+], _ = () => {
+	let _ = o(), [v, y] = f(!1), [b, x] = f({
 		horizontal: "left",
 		vertical: "above"
-	}), b = l(null), x = l(null), S = l(null), C = l(!1), w = l(!1), T = l({
+	}), S = d(null), C = d(null), w = d(null), T = d(!1), E = d(!1), D = d({
 		x: 0,
 		y: 0
-	}), E = l(null), D = l(null), O = h.heroMode !== null, k = o((e) => {
-		a({
-			...h,
+	}), O = d(null), k = d(null), A = _.heroMode !== null, j = c((e) => {
+		s({
+			..._,
 			heroMode: e
 		});
-	}, [h]), A = o(() => {
-		b.current != null && (window.clearTimeout(b.current), b.current = null);
-	}, []), j = o(() => {
-		let e = x.current, t = S.current;
+	}, [_]), M = c(() => {
+		S.current != null && (window.clearTimeout(S.current), S.current = null);
+	}, []), N = c(() => {
+		let e = C.current, t = w.current;
 		if (!e || !t || typeof window > "u") return;
 		let n = e.getBoundingClientRect(), r = t.getBoundingClientRect(), i = window.innerWidth, a = n.left + r.width + 16 > i ? "right" : "left", o = n.top - r.height - 16 < 0 ? "below" : "above";
-		y((e) => e.horizontal === a && e.vertical === o ? e : {
+		x((e) => e.horizontal === a && e.vertical === o ? e : {
 			horizontal: a,
 			vertical: o
 		});
-	}, []), M = o(() => {
-		C.current || w.current || (A(), _(!0), window.requestAnimationFrame(() => {
-			j();
+	}, []), P = c(() => {
+		T.current || E.current || (M(), y(!0), window.requestAnimationFrame(() => {
+			N();
 		}));
-	}, [A, j]), N = o(() => {
-		C.current || w.current || (A(), b.current = window.setTimeout(() => {
-			_(!1), b.current = null;
+	}, [M, N]), F = c(() => {
+		T.current || E.current || (M(), S.current = window.setTimeout(() => {
+			y(!1), S.current = null;
 		}, 120));
-	}, [A]), P = o(() => {
-		A(), _(!1);
-	}, [A]);
-	return s(() => {
-		if (!g) return;
-		j();
-		let e = () => j();
+	}, [M]), I = c(() => {
+		M(), y(!1);
+	}, [M]);
+	return l(() => {
+		if (!v) return;
+		N();
+		let e = () => N();
 		return window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
-	}, [g, j]), s(() => () => A(), [A]), s(() => {
-		let e = x.current;
+	}, [v, N]), l(() => () => M(), [M]), l(() => {
+		let e = C.current;
 		if (!e || typeof window > "u") return;
 		let t = e.getBoundingClientRect();
-		E.current = {
+		O.current = {
 			left: t.left,
 			top: t.top,
 			width: t.width,
 			height: t.height
 		};
 		let n = () => {
-			if (!E.current) return T.current;
-			let { left: e, top: t, width: n, height: r } = E.current, i = 8 - e, a = 8 - t, o = window.innerWidth - 8 - n - e, s = window.innerHeight - 8 - r - t, c = Math.min(Math.max(T.current.x, i), o), l = Math.min(Math.max(T.current.y, a), s);
-			return T.current = {
+			if (!O.current) return D.current;
+			let { left: e, top: t, width: n, height: r } = O.current, i = 8 - e, a = 8 - t, o = window.innerWidth - 8 - n - e, s = window.innerHeight - 8 - r - t, c = Math.min(Math.max(D.current.x, i), o), l = Math.min(Math.max(D.current.y, a), s);
+			return D.current = {
 				x: c,
 				y: l
 			}, {
@@ -84,119 +85,139 @@ var m = [
 				maxX: o,
 				maxY: s
 			};
-		}, r = () => {
+		}, a = () => {
 			let { x: t, y: r } = n();
 			e.style.transform = `translate3d(${t}px, ${r}px, 0)`;
-		}, i = () => {
-			D.current != null && (cancelAnimationFrame(D.current), D.current = null), w.current = !1;
-		}, a = window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches, o = (t, o) => {
-			if (a) {
-				r(), w.current = !1;
+		}, o = (e, t) => {
+			let n = D.current.x, r = D.current.y;
+			return D.current.x += e, D.current.y += t, a(), N(), {
+				x: D.current.x - n,
+				y: D.current.y - r
+			};
+		}, s = () => {
+			k.current != null && (cancelAnimationFrame(k.current), k.current = null), E.current = !1;
+		}, c = window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches, l = (e = 0, t = 0) => {
+			i("dev-floating-button", {
+				velocityX: e,
+				velocityY: t
+			});
+		}, u = (t, r) => {
+			if (c) {
+				a(), l(t, r), E.current = !1;
 				return;
 			}
-			let s = performance.now();
-			w.current = !0;
-			let c = .92, l = .7, u = (r) => {
-				let a = (r - s) / 1e3;
-				s = r, T.current.x += t * a, T.current.y += o * a;
-				let { minX: d, minY: f, maxX: p, maxY: m } = n();
-				if (T.current.x <= d + .001 && t < 0 ? (T.current.x = d, t = -t * l) : T.current.x >= p - .001 && t > 0 && (T.current.x = p, t = -t * l), T.current.y <= f + .001 && o < 0 ? (T.current.y = f, o = -o * l) : T.current.y >= m - .001 && o > 0 && (T.current.y = m, o = -o * l), t *= c, o *= c, e.style.transform = `translate3d(${T.current.x}px, ${T.current.y}px, 0)`, Math.hypot(t, o) < 20) {
-					i();
+			let i = performance.now();
+			E.current = !0;
+			let o = .92, u = .7, d = (a) => {
+				let c = (a - i) / 1e3;
+				i = a, D.current.x += t * c, D.current.y += r * c;
+				let { minX: f, minY: p, maxX: m, maxY: h } = n();
+				if (D.current.x <= f + .001 && t < 0 ? (D.current.x = f, t = -t * u) : D.current.x >= m - .001 && t > 0 && (D.current.x = m, t = -t * u), D.current.y <= p + .001 && r < 0 ? (D.current.y = p, r = -r * u) : D.current.y >= h - .001 && r > 0 && (D.current.y = h, r = -r * u), t *= o, r *= o, e.style.transform = `translate3d(${D.current.x}px, ${D.current.y}px, 0)`, l(t, r), Math.hypot(t, r) < 20) {
+					s();
 					return;
 				}
-				D.current = requestAnimationFrame(u);
+				k.current = requestAnimationFrame(d);
 			};
-			D.current = requestAnimationFrame(u);
-		}, s = p(e).draggable({ inertia: !1 }).styleCursor(!1).on("dragstart", () => {
-			i(), C.current = !0, _(!1), A();
+			k.current = requestAnimationFrame(d);
+		}, d = r({
+			id: "dev-floating-button",
+			getRect: () => e.getBoundingClientRect(),
+			isDragging: () => T.current,
+			moveBy: o,
+			cancelMotion: s,
+			kick: u
+		}), f = h(e).draggable({ inertia: !1 }).styleCursor(!1).on("dragstart", () => {
+			s(), T.current = !0, y(!1), M();
 		}).on("dragmove", (e) => {
-			T.current.x += e.dx, T.current.y += e.dy, r();
+			D.current.x += e.dx, D.current.y += e.dy, a();
+			let t = Number.isFinite(e.velocityX) ? e.velocityX : 0, n = Number.isFinite(e.velocityY) ? e.velocityY : 0;
+			l(t, n);
 		}).on("dragend", (e) => {
 			let t = Number.isFinite(e.velocityX) ? e.velocityX : 0, n = Number.isFinite(e.velocityY) ? e.velocityY : 0;
-			C.current = !1, Math.hypot(t, n) >= 10 ? o(t, n) : (r(), i()), j();
-		}), c = () => {
+			T.current = !1, Math.hypot(t, n) >= 10 ? u(t, n) : (a(), s(), l(t, n)), N();
+		}), p = () => {
 			let t = e.getBoundingClientRect();
-			E.current = {
-				left: t.left - T.current.x,
-				top: t.top - T.current.y,
+			O.current = {
+				left: t.left - D.current.x,
+				top: t.top - D.current.y,
 				width: t.width,
 				height: t.height
-			}, r(), j();
+			}, a(), l(), N();
 		};
-		return window.addEventListener("resize", c), r(), j(), () => {
-			s.unset(), i(), window.removeEventListener("resize", c);
+		return window.addEventListener("resize", p), a(), l(), N(), () => {
+			d(), f.unset(), s(), window.removeEventListener("resize", p);
 		};
-	}, [A, j]), c(() => !1, []) ? /* @__PURE__ */ d("div", {
+	}, [M, N]), u(() => !1, []) ? /* @__PURE__ */ p("div", {
 		className: "fixed bottom-4 left-4 z-50 pointer-events-none select-none",
-		children: /* @__PURE__ */ d("div", {
-			ref: x,
+		children: /* @__PURE__ */ p("div", {
+			ref: C,
 			className: "pointer-events-auto",
 			style: { touchAction: "none" },
-			children: /* @__PURE__ */ f("div", {
+			children: /* @__PURE__ */ m("div", {
 				className: "relative",
-				onMouseEnter: M,
-				onMouseLeave: N,
-				onFocusCapture: M,
+				onMouseEnter: P,
+				onMouseLeave: F,
+				onFocusCapture: P,
 				onBlurCapture: (e) => {
 					let t = e.relatedTarget;
-					(!t || !e.currentTarget.contains(t)) && N();
+					(!t || !e.currentTarget.contains(t)) && F();
 				},
-				children: [/* @__PURE__ */ d("button", {
+				children: [/* @__PURE__ */ p("button", {
 					type: "button",
 					"aria-label": "Playground developer tools",
 					className: e("inline-flex h-14 w-14 md:h-12 md:w-12 items-center justify-center rounded-full shadow-lg ring-1 transition-colors p-1 cursor-pointer", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/90 focus-visible:ring-offset-2 focus-visible:ring-offset-pink-600", "bg-pink-600 hover:bg-pink-700 ring-pink-700"),
-					onMouseDown: P,
-					onTouchStart: P,
-					onFocus: M,
+					onMouseDown: I,
+					onTouchStart: I,
+					onFocus: P,
 					onKeyDown: (e) => {
-						e.key === "Escape" && (_(!1), A());
+						e.key === "Escape" && (y(!1), M());
 					},
-					children: /* @__PURE__ */ d("img", {
+					children: /* @__PURE__ */ p("img", {
 						src: n,
 						className: "h-9 w-9 md:h-8 md:w-8",
 						alt: "",
 						draggable: !1
 					})
-				}), /* @__PURE__ */ f("div", {
-					ref: S,
-					className: e("absolute w-80 rounded-xl border border-pink-500/40 bg-gray-950/95 text-gray-100 shadow-xl backdrop-blur-sm transition-all duration-150", v.vertical === "above" ? "bottom-full mb-3" : "top-full mt-3", v.horizontal === "left" ? "left-0" : "right-0", g ? "pointer-events-auto opacity-100 translate-y-0" : "pointer-events-none opacity-0 translate-y-2"),
-					onMouseEnter: M,
-					onMouseLeave: N,
+				}), /* @__PURE__ */ m("div", {
+					ref: w,
+					className: e("absolute w-80 rounded-xl border border-pink-500/40 bg-gray-950/95 text-gray-100 shadow-xl backdrop-blur-sm transition-all duration-150", b.vertical === "above" ? "bottom-full mb-3" : "top-full mt-3", b.horizontal === "left" ? "left-0" : "right-0", v ? "pointer-events-auto opacity-100 translate-y-0" : "pointer-events-none opacity-0 translate-y-2"),
+					onMouseEnter: P,
+					onMouseLeave: F,
 					children: [
-						/* @__PURE__ */ d("div", {
+						/* @__PURE__ */ p("div", {
 							className: "px-4 py-3 border-b border-pink-500/40",
-							children: /* @__PURE__ */ d("p", {
+							children: /* @__PURE__ */ p("p", {
 								className: "text-sm font-semibold text-pink-200",
 								children: "Playground overrides"
 							})
 						}),
-						/* @__PURE__ */ f("div", {
+						/* @__PURE__ */ m("div", {
 							className: "px-4 py-3 space-y-3",
 							children: [
-								/* @__PURE__ */ d("p", {
+								/* @__PURE__ */ p("p", {
 									className: "text-xs font-semibold uppercase tracking-wide text-pink-200",
 									children: "Hero layout"
 								}),
-								O ? null : /* @__PURE__ */ d("p", {
+								A ? null : /* @__PURE__ */ p("p", {
 									className: "text-xs text-gray-400",
 									children: "Using the saved storefront configuration."
 								}),
-								m.map((t) => {
-									let n = h.heroMode === t.value;
-									return /* @__PURE__ */ f("label", {
+								g.map((t) => {
+									let n = _.heroMode === t.value;
+									return /* @__PURE__ */ m("label", {
 										className: "flex cursor-pointer items-start gap-3 rounded-lg border border-pink-500/30 p-2",
-										children: [/* @__PURE__ */ d("input", {
+										children: [/* @__PURE__ */ p("input", {
 											type: "radio",
 											name: "playground-hero-mode",
 											className: "mt-0.5 h-4 w-4 accent-pink-500",
 											checked: n,
-											onChange: () => k(t.value)
-										}), /* @__PURE__ */ f("span", {
+											onChange: () => j(t.value)
+										}), /* @__PURE__ */ m("span", {
 											className: "flex flex-col gap-1",
-											children: [/* @__PURE__ */ d("span", {
+											children: [/* @__PURE__ */ p("span", {
 												className: "text-sm font-medium text-gray-100",
 												children: t.label
-											}), /* @__PURE__ */ d("span", {
+											}), /* @__PURE__ */ p("span", {
 												className: e("text-xs", n ? "text-pink-300" : "text-gray-400"),
 												children: t.hint
 											})]
@@ -205,14 +226,14 @@ var m = [
 								})
 							]
 						}),
-						/* @__PURE__ */ d("div", {
+						/* @__PURE__ */ p("div", {
 							className: "px-4 pb-4",
-							children: /* @__PURE__ */ d(t, {
+							children: /* @__PURE__ */ p(t, {
 								type: "button",
 								variant: "outline",
-								className: e("w-full border border-pink-500/60 bg-pink-500/10 text-pink-100 hover:text-white hover:bg-pink-500/30 cursor-pointer", !O && "pointer-events-none opacity-60"),
-								onClick: r,
-								disabled: !O,
+								className: e("w-full border border-pink-500/60 bg-pink-500/10 text-pink-100 hover:text-white hover:bg-pink-500/30 cursor-pointer", !A && "pointer-events-none opacity-60"),
+								onClick: a,
+								disabled: !A,
 								children: "Reset overrides"
 							})
 						})
@@ -223,4 +244,4 @@ var m = [
 	}) : null;
 };
 //#endregion
-export { h as PlaygroundDevFloatingButton };
+export { _ as PlaygroundDevFloatingButton };

package/dist/components/ProductPriceBadge/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ProductPriceBadge/index.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,8BAA8B,CAAA;AAoBhF,KAAK,sBAAsB,GAAG;IAC5B,MAAM,CAAC,EAAE,4BAA4B,EAAE,CAAA;IACvC,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB,CAAA;AAED,eAAO,MAAM,iBAAiB,GAAI,oDAK/B,sBAAsB,mDA8WxB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ProductPriceBadge/index.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,8BAA8B,CAAA;AAoBhF,KAAK,sBAAsB,GAAG;IAC5B,MAAM,CAAC,EAAE,4BAA4B,EAAE,CAAA;IACvC,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB,CAAA;AAED,eAAO,MAAM,iBAAiB,GAAI,oDAK/B,sBAAsB,mDAoXxB,CAAA"}