@loczer/storefront-sdk 0.181.0 → 0.183.0

package/dist/components/BookingPeriodSelector/components/internal/ModalDayPickerField.js

@@ -1,303 +1,264 @@
-import { jsxs as te, jsx as A } from "react/jsx-runtime";
-import { CalendarDays as re } from "lucide-react";
-import { createPortal as ne } from "react-dom";
-import { useRef as P, useState as I, useEffect as L, useLayoutEffect as oe } from "react";
-import { cn as B } from "@rpcbase/ui";
-import { DayPicker as ie } from "../../../../ui/day-picker.js";
-function H(n) {
-  return String(n).padStart(2, "0");
+import { DayPicker as e } from "../../../../ui/day-picker.js";
+import { useEffect as t, useLayoutEffect as n, useRef as r, useState as i } from "react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { cn as s } from "@rpcbase/ui";
+import { CalendarDays as c } from "lucide-react";
+import { createPortal as l } from "react-dom";
+//#region src/components/BookingPeriodSelector/components/internal/ModalDayPickerField.tsx
+function u(e) {
+	return String(e).padStart(2, "0");
 }
-function $(n) {
-  return new Date(n.getFullYear(), n.getMonth(), n.getDate());
+function d(e) {
+	return new Date(e.getFullYear(), e.getMonth(), e.getDate());
 }
-function W(n) {
-  return new Date(n.getFullYear(), n.getMonth(), 1);
+function f(e) {
+	return new Date(e.getFullYear(), e.getMonth(), 1);
 }
-function S(n, t) {
-  return !n || !t ? !1 : n.getFullYear() === t.getFullYear() && n.getMonth() === t.getMonth() && n.getDate() === t.getDate();
+function p(e, t) {
+	return !e || !t ? !1 : e.getFullYear() === t.getFullYear() && e.getMonth() === t.getMonth() && e.getDate() === t.getDate();
 }
-function N(n) {
-  return `${H(n.getDate())}/${H(n.getMonth() + 1)}/${n.getFullYear()}`;
+function m(e) {
+	return `${u(e.getDate())}/${u(e.getMonth() + 1)}/${e.getFullYear()}`;
 }
-function se(n) {
-  const t = n.replace(/\D/g, "").slice(0, 8);
-  return t.length <= 2 ? t : t.length <= 4 ? `${t.slice(0, 2)}/${t.slice(2)}` : `${t.slice(0, 2)}/${t.slice(2, 4)}/${t.slice(4)}`;
+function h(e) {
+	let t = e.replace(/\D/g, "").slice(0, 8);
+	return t.length <= 2 ? t : t.length <= 4 ? `${t.slice(0, 2)}/${t.slice(2)}` : `${t.slice(0, 2)}/${t.slice(2, 4)}/${t.slice(4)}`;
 }
-function x(n) {
-  const t = n.trim();
-  if (!t)
-    return null;
-  const m = /^(\d{2})\/(\d{2})\/(\d{4})$/.exec(t);
-  if (m) {
-    const a = Number(m[1]), l = Number(m[2]), i = Number(m[3]), o = new Date(i, l - 1, a);
-    return Number.isNaN(o.getTime()) || o.getFullYear() !== i || o.getMonth() !== l - 1 || o.getDate() !== a ? null : $(o);
-  }
-  const c = /^(\d{2})\/(\d{2})\/(\d{2})$/.exec(t);
-  if (c) {
-    const a = Number(c[1]), l = Number(c[2]), i = 2e3 + Number(c[3]), o = new Date(i, l - 1, a);
-    return Number.isNaN(o.getTime()) || o.getFullYear() !== i || o.getMonth() !== l - 1 || o.getDate() !== a ? null : $(o);
-  }
-  const h = /^(\d{2})\/(\d{2})$/.exec(t);
-  if (h) {
-    const a = Number(h[1]), l = Number(h[2]), i = (/* @__PURE__ */ new Date()).getFullYear(), o = new Date(i, l - 1, a);
-    return Number.isNaN(o.getTime()) || o.getFullYear() !== i || o.getMonth() !== l - 1 || o.getDate() !== a ? null : $(o);
-  }
-  return null;
+function g(e) {
+	let t = e.trim();
+	if (!t) return null;
+	let n = /^(\d{2})\/(\d{2})\/(\d{4})$/.exec(t);
+	if (n) {
+		let e = Number(n[1]), t = Number(n[2]), r = Number(n[3]), i = new Date(r, t - 1, e);
+		return Number.isNaN(i.getTime()) || i.getFullYear() !== r || i.getMonth() !== t - 1 || i.getDate() !== e ? null : d(i);
+	}
+	let r = /^(\d{2})\/(\d{2})\/(\d{2})$/.exec(t);
+	if (r) {
+		let e = Number(r[1]), t = Number(r[2]), n = 2e3 + Number(r[3]), i = new Date(n, t - 1, e);
+		return Number.isNaN(i.getTime()) || i.getFullYear() !== n || i.getMonth() !== t - 1 || i.getDate() !== e ? null : d(i);
+	}
+	let i = /^(\d{2})\/(\d{2})$/.exec(t);
+	if (i) {
+		let e = Number(i[1]), t = Number(i[2]), n = (/* @__PURE__ */ new Date()).getFullYear(), r = new Date(n, t - 1, e);
+		return Number.isNaN(r.getTime()) || r.getFullYear() !== n || r.getMonth() !== t - 1 || r.getDate() !== e ? null : d(r);
+	}
+	return null;
 }
-function ce(n, t) {
-  if (!t)
-    return !1;
-  const m = Array.isArray(t) ? t : [t];
-  for (const c of m) {
-    if (c instanceof Date) {
-      if (S(n, c))
-        return !0;
-      continue;
-    }
-    if (typeof c == "function" && c(n))
-      return !0;
-  }
-  return !1;
+function _(e, t) {
+	if (!t) return !1;
+	let n = Array.isArray(t) ? t : [t];
+	for (let t of n) {
+		if (t instanceof Date) {
+			if (p(e, t)) return !0;
+			continue;
+		}
+		if (typeof t == "function" && t(e)) return !0;
+	}
+	return !1;
 }
-function ue(n, t, m) {
-  const c = n.getBoundingClientRect(), h = t.offsetWidth, a = t.offsetHeight, l = m.getBoundingClientRect(), i = window.innerWidth, o = window.innerHeight, u = 8;
-  let g = c.left;
-  g + h > i - u && (g = Math.max(u, i - h - u)), g < u && (g = u);
-  let w = c.bottom + u;
-  const T = w + a > o - u, F = c.top - a - u;
-  return T && F >= u && (w = F), w < u && (w = u), w + a > o - u && (w = Math.max(u, o - a - u)), {
-    left: g - l.left,
-    top: w - l.top,
-    strategy: "absolute"
-  };
+function v(e, t, n) {
+	let r = e.getBoundingClientRect(), i = t.offsetWidth, a = t.offsetHeight, o = n.getBoundingClientRect(), s = window.innerWidth, c = window.innerHeight, l = r.left;
+	l + i > s - 8 && (l = Math.max(8, s - i - 8)), l < 8 && (l = 8);
+	let u = r.bottom + 8, d = u + a > c - 8, f = r.top - a - 8;
+	return d && f >= 8 && (u = f), u < 8 && (u = 8), u + a > c - 8 && (u = Math.max(8, c - a - 8)), {
+		left: l - o.left,
+		top: u - o.top,
+		strategy: "absolute"
+	};
 }
-function ge({
-  id: n,
-  value: t,
-  onChange: m,
-  onValueUpdate: c,
-  className: h,
-  inputClassName: a,
-  placeholder: l = "DD/MM/YYYY",
-  disabled: i,
-  readOnly: o,
-  open: u,
-  onOpenChange: g,
-  openOnFocus: w = !0,
-  dayPickerComponent: T,
-  dayPickerProps: F,
-  triggerTestId: q,
-  isHydrated: j,
-  portalContainer: E,
-  onFocus: G,
-  onBlur: J,
-  onKeyDown: Q,
-  ...V
-}) {
-  const M = P(null), k = P(null), y = P(null), [X, z] = I(!1), [b, D] = I(() => t ? N(t) : ""), [Z, O] = I(() => W(t ?? /* @__PURE__ */ new Date())), [C, _] = I({ left: 0, top: 0, strategy: "absolute" }), K = P(!1), R = P(!1), d = u ?? X;
-  L(() => {
-    K.current || D(t ? N(t) : "");
-  }, [t]), L(() => {
-    d && O(W(x(b) ?? t ?? /* @__PURE__ */ new Date()));
-  }, [b, d, t]), L(() => {
-    if (!d)
-      return;
-    const e = (s) => {
-      const f = s.target;
-      f instanceof Node && (M.current?.contains(f) || y.current?.contains(f) || (g?.(!1), z(!1)));
-    }, r = (s) => {
-      if (s.key !== "Escape")
-        return;
-      const f = s.target;
-      f instanceof Node && (!M.current?.contains(f) && !y.current?.contains(f) || (s.preventDefault(), s.stopPropagation(), g?.(!1), z(!1)));
-    };
-    return document.addEventListener("pointerdown", e, !0), window.addEventListener("keydown", r, !0), () => {
-      document.removeEventListener("pointerdown", e, !0), window.removeEventListener("keydown", r, !0);
-    };
-  }, [d, g]), L(() => {
-    if (!d || typeof window > "u" || !("IntersectionObserver" in window))
-      return;
-    const e = M.current;
-    if (!e)
-      return;
-    let r = !0;
-    const s = new IntersectionObserver((f) => {
-      if (!r)
-        return;
-      const v = f[0];
-      v && !v.isIntersecting && p(!1);
-    });
-    return s.observe(e), () => {
-      r = !1, s.disconnect();
-    };
-  }, [d]), oe(() => {
-    if (!d || i || !E)
-      return;
-    const e = () => {
-      !k.current || !y.current || _(ue(k.current, y.current, E));
-    };
-    e();
-    const r = window.requestAnimationFrame(e);
-    return window.addEventListener("scroll", e, !0), window.addEventListener("resize", e), () => {
-      window.cancelAnimationFrame(r), window.removeEventListener("scroll", e, !0), window.removeEventListener("resize", e);
-    };
-  }, [i, d, E]);
-  const p = (e) => {
-    g?.(e), z(e);
-  }, Y = (e) => {
-    c?.(e), m(e);
-  }, U = T ?? ie, ee = x(b) ?? t ?? void 0;
-  return /* @__PURE__ */ te("div", { ref: M, "data-slot": "day-picker-input", className: B("relative group", h), children: [
-    /* @__PURE__ */ A(
-      "input",
-      {
-        ...V,
-        ref: k,
-        id: n,
-        type: "text",
-        "data-testid": q,
-        "data-hydrated": j ? "true" : void 0,
-        autoComplete: "off",
-        disabled: i,
-        readOnly: o,
-        placeholder: l,
-        value: b,
-        className: B(
-          "flex h-10 w-full rounded-md border border-input bg-background py-2 pr-3 pl-[37px] text-base ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
-          "transition-colors group-hover:bg-accent group-hover:text-accent-foreground",
-          d && "ring-2 ring-primary ring-offset-2",
-          a
-        ),
-        onChange: (e) => {
-          const r = se(e.currentTarget.value);
-          if (D(r), !r) {
-            c?.(null);
-            return;
-          }
-          const s = x(r);
-          s && c?.(s);
-        },
-        onFocus: (e) => {
-          K.current = !0, G?.(e);
-          const r = e.currentTarget;
-          requestAnimationFrame(() => {
-            r.select();
-          }), !i && w && p(!0);
-        },
-        onClick: () => {
-          i || p(!0);
-        },
-        onKeyDown: (e) => {
-          if (Q?.(e), !(e.defaultPrevented || i)) {
-            if (e.key === "Enter") {
-              const r = x(b);
-              if (!r)
-                return;
-              e.preventDefault(), D(N(r)), S(r, t) || Y(r), p(!1);
-              return;
-            }
-            if (e.key === "ArrowUp" || e.key === "ArrowDown") {
-              const r = x(b) ?? t;
-              if (!r)
-                return;
-              const s = $(r);
-              if (s.setDate(s.getDate() + (e.key === "ArrowUp" ? 1 : -1)), ce(s, F?.disabled))
-                return;
-              e.preventDefault(), D(N(s)), c?.(s), p(!0);
-              return;
-            }
-            !d && (e.key.length === 1 || e.key === "Backspace" || e.key === "Delete") && !e.ctrlKey && !e.metaKey && !e.altKey && p(!0), e.key === "Tab" && p(!1);
-          }
-        },
-        onBlur: (e) => {
-          if (K.current = !1, J?.(e), R.current) {
-            R.current = !1;
-            return;
-          }
-          const r = e.relatedTarget;
-          if (r instanceof Node && (M.current?.contains(r) || y.current?.contains(r)))
-            return;
-          requestAnimationFrame(() => {
-            const v = document.activeElement;
-            v instanceof Node && (M.current?.contains(v) || y.current?.contains(v)) || p(!1);
-          });
-          const s = b.trim();
-          if (!s) {
-            t && (D(""), Y(null));
-            return;
-          }
-          const f = x(s);
-          if (f) {
-            D(N(f)), S(f, t) || Y(f);
-            return;
-          }
-          D(t ? N(t) : "");
-        }
-      }
-    ),
-    /* @__PURE__ */ A(
-      "button",
-      {
-        type: "button",
-        tabIndex: -1,
-        disabled: i,
-        "aria-label": "Open calendar",
-        "data-slot": "day-picker-input-trigger",
-        className: "absolute left-[13px] top-1/2 -translate-y-1/2 text-muted-foreground transition-colors group-hover:text-accent-foreground",
-        onPointerDown: (e) => {
-          e.preventDefault(), k.current?.focus({ preventScroll: !0 });
-        },
-        onMouseDown: (e) => {
-          e.preventDefault(), k.current?.focus({ preventScroll: !0 });
-        },
-        onClick: () => {
-          i || (k.current?.focus({ preventScroll: !0 }), p(!0));
-        },
-        children: /* @__PURE__ */ A(re, { "aria-hidden": !0, className: "size-4" })
-      }
-    ),
-    d && !i && E ? ne(
-      /* @__PURE__ */ A(
-        "div",
-        {
-          ref: y,
-          "data-slot": "day-picker-input-popover",
-          className: "pointer-events-auto rounded-md border bg-popover text-popover-foreground shadow-md",
-          style: {
-            position: C.strategy,
-            left: C.left,
-            top: C.top
-          },
-          onPointerDownCapture: () => {
-            R.current = !0;
-          },
-          onMouseDownCapture: () => {
-            R.current = !0;
-          },
-          children: /* @__PURE__ */ A(
-            U,
-            {
-              mode: "single",
-              month: Z,
-              onMonthChange: O,
-              selected: ee,
-              onSelect: (e) => {
-                if (!e) {
-                  t && Y(null), D(""), p(!1);
-                  return;
-                }
-                const r = $(e);
-                D(N(r)), S(r, t) || Y(r), p(!1);
-              },
-              ...F
-            }
-          )
-        }
-      ),
-      E
-    ) : null
-  ] });
+function y({ id: u, value: y, onChange: b, onValueUpdate: x, className: ee, inputClassName: S, placeholder: C = "DD/MM/YYYY", disabled: w, readOnly: T, open: E, onOpenChange: D, openOnFocus: O = !0, dayPickerComponent: k, dayPickerProps: A, triggerTestId: j, isHydrated: M, portalContainer: N, onFocus: P, onBlur: F, onKeyDown: I, ...L }) {
+	let R = r(null), z = r(null), B = r(null), [V, H] = i(!1), [U, W] = i(() => y ? m(y) : ""), [G, K] = i(() => f(y ?? /* @__PURE__ */ new Date())), [q, J] = i({
+		left: 0,
+		top: 0,
+		strategy: "absolute"
+	}), Y = r(!1), X = r(!1), Z = E ?? V;
+	t(() => {
+		Y.current || W(y ? m(y) : "");
+	}, [y]), t(() => {
+		Z && K(f(g(U) ?? y ?? /* @__PURE__ */ new Date()));
+	}, [
+		U,
+		Z,
+		y
+	]), t(() => {
+		if (!Z) return;
+		let e = (e) => {
+			let t = e.target;
+			t instanceof Node && (R.current?.contains(t) || B.current?.contains(t) || (D?.(!1), H(!1)));
+		}, t = (e) => {
+			if (e.key !== "Escape") return;
+			let t = e.target;
+			t instanceof Node && (!R.current?.contains(t) && !B.current?.contains(t) || (e.preventDefault(), e.stopPropagation(), D?.(!1), H(!1)));
+		};
+		return document.addEventListener("pointerdown", e, !0), window.addEventListener("keydown", t, !0), () => {
+			document.removeEventListener("pointerdown", e, !0), window.removeEventListener("keydown", t, !0);
+		};
+	}, [Z, D]), t(() => {
+		if (!Z || typeof window > "u" || !("IntersectionObserver" in window)) return;
+		let e = R.current;
+		if (!e) return;
+		let t = !0, n = new IntersectionObserver((e) => {
+			if (!t) return;
+			let n = e[0];
+			n && !n.isIntersecting && Q(!1);
+		});
+		return n.observe(e), () => {
+			t = !1, n.disconnect();
+		};
+	}, [Z]), n(() => {
+		if (!Z || w || !N) return;
+		let e = () => {
+			!z.current || !B.current || J(v(z.current, B.current, N));
+		};
+		e();
+		let t = window.requestAnimationFrame(e);
+		return window.addEventListener("scroll", e, !0), window.addEventListener("resize", e), () => {
+			window.cancelAnimationFrame(t), window.removeEventListener("scroll", e, !0), window.removeEventListener("resize", e);
+		};
+	}, [
+		w,
+		Z,
+		N
+	]);
+	let Q = (e) => {
+		D?.(e), H(e);
+	}, $ = (e) => {
+		x?.(e), b(e);
+	}, te = k ?? e, ne = g(U) ?? y ?? void 0;
+	return /* @__PURE__ */ o("div", {
+		ref: R,
+		"data-slot": "day-picker-input",
+		className: s("relative group", ee),
+		children: [
+			/* @__PURE__ */ a("input", {
+				...L,
+				ref: z,
+				id: u,
+				type: "text",
+				"data-testid": j,
+				"data-hydrated": M ? "true" : void 0,
+				autoComplete: "off",
+				disabled: w,
+				readOnly: T,
+				placeholder: C,
+				value: U,
+				className: s("flex h-10 w-full rounded-md border border-input bg-background py-2 pr-3 pl-[37px] text-base ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", "transition-colors group-hover:bg-accent group-hover:text-accent-foreground", Z && "ring-2 ring-primary ring-offset-2", S),
+				onChange: (e) => {
+					let t = h(e.currentTarget.value);
+					if (W(t), !t) {
+						x?.(null);
+						return;
+					}
+					let n = g(t);
+					n && x?.(n);
+				},
+				onFocus: (e) => {
+					Y.current = !0, P?.(e);
+					let t = e.currentTarget;
+					requestAnimationFrame(() => {
+						t.select();
+					}), !w && O && Q(!0);
+				},
+				onClick: () => {
+					w || Q(!0);
+				},
+				onKeyDown: (e) => {
+					if (I?.(e), !(e.defaultPrevented || w)) {
+						if (e.key === "Enter") {
+							let t = g(U);
+							if (!t) return;
+							e.preventDefault(), W(m(t)), p(t, y) || $(t), Q(!1);
+							return;
+						}
+						if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+							let t = g(U) ?? y;
+							if (!t) return;
+							let n = d(t);
+							if (n.setDate(n.getDate() + (e.key === "ArrowUp" ? 1 : -1)), _(n, A?.disabled)) return;
+							e.preventDefault(), W(m(n)), x?.(n), Q(!0);
+							return;
+						}
+						!Z && (e.key.length === 1 || e.key === "Backspace" || e.key === "Delete") && !e.ctrlKey && !e.metaKey && !e.altKey && Q(!0), e.key === "Tab" && Q(!1);
+					}
+				},
+				onBlur: (e) => {
+					if (Y.current = !1, F?.(e), X.current) {
+						X.current = !1;
+						return;
+					}
+					let t = e.relatedTarget;
+					if (t instanceof Node && (R.current?.contains(t) || B.current?.contains(t))) return;
+					requestAnimationFrame(() => {
+						let e = document.activeElement;
+						e instanceof Node && (R.current?.contains(e) || B.current?.contains(e)) || Q(!1);
+					});
+					let n = U.trim();
+					if (!n) {
+						y && (W(""), $(null));
+						return;
+					}
+					let r = g(n);
+					if (r) {
+						W(m(r)), p(r, y) || $(r);
+						return;
+					}
+					W(y ? m(y) : "");
+				}
+			}),
+			/* @__PURE__ */ a("button", {
+				type: "button",
+				tabIndex: -1,
+				disabled: w,
+				"aria-label": "Open calendar",
+				"data-slot": "day-picker-input-trigger",
+				className: "absolute left-[13px] top-1/2 -translate-y-1/2 text-muted-foreground transition-colors group-hover:text-accent-foreground",
+				onPointerDown: (e) => {
+					e.preventDefault(), z.current?.focus({ preventScroll: !0 });
+				},
+				onMouseDown: (e) => {
+					e.preventDefault(), z.current?.focus({ preventScroll: !0 });
+				},
+				onClick: () => {
+					w || (z.current?.focus({ preventScroll: !0 }), Q(!0));
+				},
+				children: /* @__PURE__ */ a(c, {
+					"aria-hidden": !0,
+					className: "size-4"
+				})
+			}),
+			Z && !w && N ? l(/* @__PURE__ */ a("div", {
+				ref: B,
+				"data-slot": "day-picker-input-popover",
+				className: "pointer-events-auto rounded-md border bg-popover text-popover-foreground shadow-md",
+				style: {
+					position: q.strategy,
+					left: q.left,
+					top: q.top
+				},
+				onPointerDownCapture: () => {
+					X.current = !0;
+				},
+				onMouseDownCapture: () => {
+					X.current = !0;
+				},
+				children: /* @__PURE__ */ a(te, {
+					mode: "single",
+					month: G,
+					onMonthChange: K,
+					selected: ne,
+					onSelect: (e) => {
+						if (!e) {
+							y && $(null), W(""), Q(!1);
+							return;
+						}
+						let t = d(e);
+						W(m(t)), p(t, y) || $(t), Q(!1);
+					},
+					...A
+				})
+			}), N) : null
+		]
+	});
 }
-export {
-  ge as ModalDayPickerField
-};
+//#endregion
+export { y as ModalDayPickerField };