@loczer/storefront-sdk 0.181.0 → 0.182.0

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

@@ -1,368 +1,333 @@
-import { jsx as h, jsxs as B } from "react/jsx-runtime";
-import { ChevronDown as Q, Check as X } from "lucide-react";
-import { createPortal as Z } from "react-dom";
-import { useRef as T, useState as R, useEffect as S, useLayoutEffect as U } from "react";
-import { cn as K } from "@rpcbase/ui";
-function V(s) {
-  return s == null ? !1 : !s.disabled;
+import { useEffect as e, useLayoutEffect as t, useRef as n, useState as r } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { cn as o } from "@rpcbase/ui";
+import { Check as s, ChevronDown as c } from "lucide-react";
+import { createPortal as l } from "react-dom";
+//#region src/components/BookingPeriodSelector/components/internal/ModalHourPickerField.tsx
+function u(e) {
+	return e != null && !e.disabled;
 }
-function q(s) {
-  const t = /^(\d{1,2}):(\d{2})$/.exec(s.trim());
-  if (!t)
-    return null;
-  const u = Number(t[1]), o = Number(t[2]);
-  return !Number.isFinite(u) || !Number.isFinite(o) || u < 0 || u > 23 || o < 0 || o > 59 ? null : u * 60 + o;
+function d(e) {
+	let t = /^(\d{1,2}):(\d{2})$/.exec(e.trim());
+	if (!t) return null;
+	let n = Number(t[1]), r = Number(t[2]);
+	return !Number.isFinite(n) || !Number.isFinite(r) || n < 0 || n > 23 || r < 0 || r > 59 ? null : n * 60 + r;
 }
-function Y(s) {
-  const t = /^(\d{1,2}):(\d{2})$/.exec(s.trim());
-  if (!t)
-    return null;
-  const u = Number(t[1]), o = Number(t[2]);
-  return !Number.isFinite(u) || !Number.isFinite(o) || u < 0 || u > 23 || o < 0 || o > 59 ? null : `${String(u).padStart(2, "0")}:${String(o).padStart(2, "0")}`;
+function f(e) {
+	let t = /^(\d{1,2}):(\d{2})$/.exec(e.trim());
+	if (!t) return null;
+	let n = Number(t[1]), r = Number(t[2]);
+	return !Number.isFinite(n) || !Number.isFinite(r) || n < 0 || n > 23 || r < 0 || r > 59 ? null : `${String(n).padStart(2, "0")}:${String(r).padStart(2, "0")}`;
 }
-function ee(s) {
-  const t = s.replace(/\D/g, "").slice(0, 4);
-  return t.length <= 2 ? t : `${t.slice(0, t.length - 2)}:${t.slice(-2)}`;
+function p(e) {
+	let t = e.replace(/\D/g, "").slice(0, 4);
+	return t.length <= 2 ? t : `${t.slice(0, t.length - 2)}:${t.slice(-2)}`;
 }
-function L(s, t) {
-  if (!s)
-    return null;
-  const u = Y(s);
-  if (!u)
-    return null;
-  const o = t.find((n) => n.value === u);
-  return V(o) ? u : null;
+function m(e, t) {
+	if (!e) return null;
+	let n = f(e);
+	return n && u(t.find((e) => e.value === n)) ? n : null;
 }
-function O(s) {
-  return s.find((t) => V(t)) ?? null;
+function h(e) {
+	return e.find((e) => u(e)) ?? null;
 }
-function W(s, t) {
-  const u = q(s);
-  if (u == null)
-    return null;
-  let o = null, n = Number.POSITIVE_INFINITY, m = Number.NEGATIVE_INFINITY;
-  for (const b of t) {
-    if (!V(b))
-      continue;
-    const p = q(b.value);
-    if (p == null)
-      continue;
-    const i = Math.abs(p - u);
-    (i < n || i === n && p > m) && (o = b, n = i, m = p);
-  }
-  return o;
+function g(e, t) {
+	let n = d(e);
+	if (n == null) return null;
+	let r = null, i = Infinity, a = -Infinity;
+	for (let e of t) {
+		if (!u(e)) continue;
+		let t = d(e.value);
+		if (t == null) continue;
+		let o = Math.abs(t - n);
+		(o < i || o === i && t > a) && (r = e, i = o, a = t);
+	}
+	return r;
 }
-function te(s, t, u) {
-  let o = s ? u.findIndex((n) => n.value === s) : -1;
-  o === -1 && (o = t === 1 ? -1 : u.length);
-  for (let n = o + t; n >= 0 && n < u.length; n += t) {
-    const m = u[n];
-    if (V(m))
-      return m.value;
-  }
-  return null;
+function _(e, t, n) {
+	let r = e ? n.findIndex((t) => t.value === e) : -1;
+	r === -1 && (r = t === 1 ? -1 : n.length);
+	for (let e = r + t; e >= 0 && e < n.length; e += t) {
+		let t = n[e];
+		if (u(t)) return t.value;
+	}
+	return null;
 }
-function re(s, t, u) {
-  const o = s.getBoundingClientRect(), n = t.offsetHeight, m = u.getBoundingClientRect(), b = window.innerWidth, p = window.innerHeight, i = 8, x = o.width;
-  let y = o.left;
-  y + x > b - i && (y = Math.max(i, b - x - i)), y < i && (y = i);
-  let f = o.bottom + i;
-  const z = f + n > p - i, F = o.top - n - i;
-  return z && F >= i && (f = F), f < i && (f = i), f + n > p - i && (f = Math.max(i, p - n - i)), {
-    left: y - m.left,
-    top: f - m.top,
-    width: x,
-    strategy: "absolute"
-  };
+function v(e, t, n) {
+	let r = e.getBoundingClientRect(), i = t.offsetHeight, a = n.getBoundingClientRect(), o = window.innerWidth, s = window.innerHeight, c = r.width, l = r.left;
+	l + c > o - 8 && (l = Math.max(8, o - c - 8)), l < 8 && (l = 8);
+	let u = r.bottom + 8, d = u + i > s - 8, f = r.top - i - 8;
+	return d && f >= 8 && (u = f), u < 8 && (u = 8), u + i > s - 8 && (u = Math.max(8, s - i - 8)), {
+		left: l - a.left,
+		top: u - a.top,
+		width: c,
+		strategy: "absolute"
+	};
 }
-function se({
-  id: s,
-  value: t,
-  onChange: u,
-  onValueUpdate: o,
-  options: n,
-  placeholder: m = "Select time",
-  className: b,
-  inputClassName: p,
-  disabled: i,
-  readOnly: x,
-  open: y,
-  onOpenChange: f,
-  triggerTestId: z,
-  contentTestId: F,
-  isHydrated: _,
-  portalContainer: P
-}) {
-  const k = T(null), E = T(null), N = T(null), v = T(null), [G, $] = R(!1), [D, w] = R(() => t ?? ""), [I, g] = R(t ?? O(n)?.value ?? null), [A, J] = R({ left: 0, top: 0, width: 0, strategy: "absolute" }), C = T(!1), H = T(!1), a = y ?? G;
-  S(() => {
-    C.current || w(t ?? "");
-  }, [t]), S(() => {
-    if (!a) {
-      g(t ?? O(n)?.value ?? null);
-      return;
-    }
-    const e = L(t, n);
-    g(e ?? O(n)?.value ?? null);
-  }, [a, n, t]), S(() => {
-    if (!a || i || x)
-      return;
-    const e = E.current;
-    e instanceof HTMLInputElement && document.activeElement !== e && e.focus({ preventScroll: !0 });
-  }, [i, a, x]), S(() => {
-    if (!a)
-      return;
-    const e = (l) => {
-      const c = l.target;
-      c instanceof Node && (k.current?.contains(c) || N.current?.contains(c) || (f?.(!1), $(!1)));
-    }, r = (l) => {
-      if (l.key !== "Escape")
-        return;
-      const c = l.target;
-      c instanceof Node && (!k.current?.contains(c) && !N.current?.contains(c) || (l.preventDefault(), l.stopPropagation(), f?.(!1), $(!1)));
-    };
-    return document.addEventListener("pointerdown", e, !0), window.addEventListener("keydown", r, !0), () => {
-      document.removeEventListener("pointerdown", e, !0), window.removeEventListener("keydown", r, !0);
-    };
-  }, [a, f]), S(() => {
-    if (!a || typeof window > "u" || !("IntersectionObserver" in window))
-      return;
-    const e = k.current;
-    if (!e)
-      return;
-    let r = !0;
-    const l = new IntersectionObserver((c) => {
-      if (!r)
-        return;
-      const M = c[0];
-      M && !M.isIntersecting && d(!1);
-    });
-    return l.observe(e), () => {
-      r = !1, l.disconnect();
-    };
-  }, [a]), U(() => {
-    if (!a || i || !P)
-      return;
-    const e = () => {
-      !E.current || !N.current || J(re(E.current, N.current, P));
-    };
-    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, a, P]), S(() => {
-    if (!a || !v.current || !I)
-      return;
-    const e = v.current.querySelector(`[role="option"][data-value="${I}"]`);
-    if (!e)
-      return;
-    const r = e.offsetTop - 8, l = e.offsetTop + e.offsetHeight + 8;
-    if (r < v.current.scrollTop) {
-      v.current.scrollTop = Math.max(0, r);
-      return;
-    }
-    const c = v.current.scrollTop + v.current.clientHeight;
-    l > c && (v.current.scrollTop = Math.max(0, l - v.current.clientHeight));
-  }, [I, a]);
-  const d = (e) => {
-    f?.(e), $(e);
-  }, j = (e) => {
-    o?.(e), u(e);
-  };
-  return /* @__PURE__ */ h("div", { "data-slot": "hours-picker-input", className: K("w-[150px]", b), ref: k, children: /* @__PURE__ */ B("div", { className: "relative group", children: [
-    /* @__PURE__ */ h(
-      "input",
-      {
-        ref: E,
-        id: s,
-        type: "text",
-        "data-testid": z,
-        "data-hydrated": _ ? "true" : void 0,
-        autoComplete: "off",
-        disabled: i,
-        readOnly: x,
-        placeholder: m,
-        value: D,
-        className: K(
-          "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 pr-10 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 && "text-muted-foreground",
-          a && "ring-2 ring-primary ring-offset-2",
-          p
-        ),
-        onChange: (e) => {
-          const r = ee(e.currentTarget.value);
-          if (w(r), !r) {
-            o?.(null);
-            return;
-          }
-          const l = L(r, n);
-          if (l) {
-            g(l), o?.(l);
-            return;
-          }
-          const c = Y(r);
-          if (!c)
-            return;
-          const M = W(c, n);
-          M && g(M.value);
-        },
-        onFocus: (e) => {
-          C.current = !0;
-          const r = e.currentTarget;
-          requestAnimationFrame(() => {
-            r.select();
-          }), i || d(!0);
-        },
-        onClick: () => {
-          i || d(!0);
-        },
-        onKeyDown: (e) => {
-          if (!i) {
-            if (e.key === "Tab") {
-              d(!1);
-              return;
-            }
-            if (e.key === "Escape") {
-              if (!a)
-                return;
-              e.preventDefault(), d(!1);
-              return;
-            }
-            if (e.key === "ArrowDown" || e.key === "ArrowUp") {
-              if (e.preventDefault(), !a) {
-                d(!0);
-                return;
-              }
-              const r = te(
-                I ?? t,
-                e.key === "ArrowDown" ? 1 : -1,
-                n
-              );
-              if (!r)
-                return;
-              g(r), w(r), o?.(r);
-              return;
-            }
-            if (e.key === "Enter") {
-              const r = I ?? L(D, n) ?? W(D, n)?.value ?? O(n)?.value ?? null;
-              if (!r)
-                return;
-              e.preventDefault(), w(r), g(r), j(r), d(!1);
-              return;
-            }
-            !a && (e.key.length === 1 || e.key === "Backspace" || e.key === "Delete") && !e.ctrlKey && !e.metaKey && !e.altKey && d(!0);
-          }
-        },
-        onBlur: (e) => {
-          if (C.current = !1, H.current) {
-            H.current = !1;
-            return;
-          }
-          const r = e.relatedTarget;
-          if (r instanceof Node && (k.current?.contains(r) || N.current?.contains(r)))
-            return;
-          if (requestAnimationFrame(() => {
-            const c = document.activeElement;
-            c instanceof Node && (k.current?.contains(c) || N.current?.contains(c)) || d(!1);
-          }), !D.trim()) {
-            w(t ?? "");
-            return;
-          }
-          const l = L(D, n);
-          if (l) {
-            w(l), g(l), t !== l && j(l);
-            return;
-          }
-          w(t ?? "");
-        }
-      }
-    ),
-    /* @__PURE__ */ h(
-      "button",
-      {
-        type: "button",
-        tabIndex: -1,
-        disabled: i,
-        "data-slot": "hours-picker-input-toggle",
-        className: "absolute right-1 top-1/2 inline-flex size-8 -translate-y-1/2 items-center justify-center rounded-md text-muted-foreground transition-colors hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
-        "aria-label": a ? "Close time picker" : "Open time picker",
-        onPointerDown: (e) => {
-          e.preventDefault();
-        },
-        onMouseDown: (e) => {
-          e.preventDefault();
-        },
-        onClick: () => {
-          i || (d(!a), E.current?.focus({ preventScroll: !0 }));
-        },
-        children: /* @__PURE__ */ h(Q, { "aria-hidden": !0, className: "size-4" })
-      }
-    ),
-    a ? Z(
-      /* @__PURE__ */ h(
-        "div",
-        {
-          ref: N,
-          "data-testid": F,
-          "data-state": "open",
-          className: "pointer-events-auto overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md",
-          style: {
-            position: A.strategy,
-            left: A.left,
-            top: A.top,
-            width: A.width
-          },
-          onPointerDownCapture: () => {
-            H.current = !0;
-          },
-          onMouseDownCapture: () => {
-            H.current = !0;
-          },
-          children: /* @__PURE__ */ h("div", { ref: v, role: "listbox", className: "max-h-64 overflow-y-auto p-1", children: n.map((e) => {
-            const r = e.value === t, l = e.value === I;
-            return /* @__PURE__ */ B(
-              "div",
-              {
-                role: "option",
-                "aria-selected": r,
-                "data-value": e.value,
-                "data-state": r ? "checked" : "unchecked",
-                "data-disabled": e.disabled ? "" : void 0,
-                className: K(
-                  "relative flex w-full select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none",
-                  e.disabled ? "pointer-events-none opacity-50" : "cursor-pointer",
-                  l && "bg-accent text-accent-foreground"
-                ),
-                onMouseDown: (c) => {
-                  c.preventDefault();
-                },
-                onClick: () => {
-                  e.disabled || (w(e.value), g(e.value), j(e.value), d(!1), E.current?.focus({ preventScroll: !0 }));
-                },
-                onPointerEnter: () => {
-                  e.disabled || g(e.value);
-                },
-                onPointerMove: () => {
-                  e.disabled || g(e.value);
-                },
-                children: [
-                  /* @__PURE__ */ h("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: r ? /* @__PURE__ */ h(X, { "aria-hidden": !0, className: "h-4 w-4" }) : null }),
-                  /* @__PURE__ */ B("div", { className: "flex flex-col", children: [
-                    /* @__PURE__ */ h("span", { children: e.label }),
-                    e.description != null ? /* @__PURE__ */ h("span", { "data-slot": "description", className: "text-xs text-muted-foreground", children: e.description }) : null
-                  ] })
-                ]
-              },
-              e.value
-            );
-          }) })
-        }
-      ),
-      P
-    ) : null
-  ] }) });
+function y({ id: u, value: d, onChange: y, onValueUpdate: b, options: x, placeholder: S = "Select time", className: C, inputClassName: w, disabled: T, readOnly: E, open: D, onOpenChange: O, triggerTestId: k, contentTestId: A, isHydrated: j, portalContainer: M }) {
+	let N = n(null), P = n(null), F = n(null), I = n(null), [L, R] = r(!1), [z, B] = r(() => d ?? ""), [V, H] = r(d ?? h(x)?.value ?? null), [U, W] = r({
+		left: 0,
+		top: 0,
+		width: 0,
+		strategy: "absolute"
+	}), G = n(!1), K = n(!1), q = D ?? L;
+	e(() => {
+		G.current || B(d ?? "");
+	}, [d]), e(() => {
+		if (!q) {
+			H(d ?? h(x)?.value ?? null);
+			return;
+		}
+		let e = m(d, x);
+		H(e ?? h(x)?.value ?? null);
+	}, [
+		q,
+		x,
+		d
+	]), e(() => {
+		if (!q || T || E) return;
+		let e = P.current;
+		e instanceof HTMLInputElement && document.activeElement !== e && e.focus({ preventScroll: !0 });
+	}, [
+		T,
+		q,
+		E
+	]), e(() => {
+		if (!q) return;
+		let e = (e) => {
+			let t = e.target;
+			t instanceof Node && (N.current?.contains(t) || F.current?.contains(t) || (O?.(!1), R(!1)));
+		}, t = (e) => {
+			if (e.key !== "Escape") return;
+			let t = e.target;
+			t instanceof Node && (!N.current?.contains(t) && !F.current?.contains(t) || (e.preventDefault(), e.stopPropagation(), O?.(!1), R(!1)));
+		};
+		return document.addEventListener("pointerdown", e, !0), window.addEventListener("keydown", t, !0), () => {
+			document.removeEventListener("pointerdown", e, !0), window.removeEventListener("keydown", t, !0);
+		};
+	}, [q, O]), e(() => {
+		if (!q || typeof window > "u" || !("IntersectionObserver" in window)) return;
+		let e = N.current;
+		if (!e) return;
+		let t = !0, n = new IntersectionObserver((e) => {
+			if (!t) return;
+			let n = e[0];
+			n && !n.isIntersecting && J(!1);
+		});
+		return n.observe(e), () => {
+			t = !1, n.disconnect();
+		};
+	}, [q]), t(() => {
+		if (!q || T || !M) return;
+		let e = () => {
+			!P.current || !F.current || W(v(P.current, F.current, M));
+		};
+		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);
+		};
+	}, [
+		T,
+		q,
+		M
+	]), e(() => {
+		if (!q || !I.current || !V) return;
+		let e = I.current.querySelector(`[role="option"][data-value="${V}"]`);
+		if (!e) return;
+		let t = e.offsetTop - 8, n = e.offsetTop + e.offsetHeight + 8;
+		if (t < I.current.scrollTop) {
+			I.current.scrollTop = Math.max(0, t);
+			return;
+		}
+		n > I.current.scrollTop + I.current.clientHeight && (I.current.scrollTop = Math.max(0, n - I.current.clientHeight));
+	}, [V, q]);
+	let J = (e) => {
+		O?.(e), R(e);
+	}, Y = (e) => {
+		b?.(e), y(e);
+	};
+	return /* @__PURE__ */ i("div", {
+		"data-slot": "hours-picker-input",
+		className: o("w-[150px]", C),
+		ref: N,
+		children: /* @__PURE__ */ a("div", {
+			className: "relative group",
+			children: [
+				/* @__PURE__ */ i("input", {
+					ref: P,
+					id: u,
+					type: "text",
+					"data-testid": k,
+					"data-hydrated": j ? "true" : void 0,
+					autoComplete: "off",
+					disabled: T,
+					readOnly: E,
+					placeholder: S,
+					value: z,
+					className: o("flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 pr-10 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 && "text-muted-foreground", q && "ring-2 ring-primary ring-offset-2", w),
+					onChange: (e) => {
+						let t = p(e.currentTarget.value);
+						if (B(t), !t) {
+							b?.(null);
+							return;
+						}
+						let n = m(t, x);
+						if (n) {
+							H(n), b?.(n);
+							return;
+						}
+						let r = f(t);
+						if (!r) return;
+						let i = g(r, x);
+						i && H(i.value);
+					},
+					onFocus: (e) => {
+						G.current = !0;
+						let t = e.currentTarget;
+						requestAnimationFrame(() => {
+							t.select();
+						}), T || J(!0);
+					},
+					onClick: () => {
+						T || J(!0);
+					},
+					onKeyDown: (e) => {
+						if (!T) {
+							if (e.key === "Tab") {
+								J(!1);
+								return;
+							}
+							if (e.key === "Escape") {
+								if (!q) return;
+								e.preventDefault(), J(!1);
+								return;
+							}
+							if (e.key === "ArrowDown" || e.key === "ArrowUp") {
+								if (e.preventDefault(), !q) {
+									J(!0);
+									return;
+								}
+								let t = _(V ?? d, e.key === "ArrowDown" ? 1 : -1, x);
+								if (!t) return;
+								H(t), B(t), b?.(t);
+								return;
+							}
+							if (e.key === "Enter") {
+								let t = V ?? m(z, x) ?? g(z, x)?.value ?? h(x)?.value ?? null;
+								if (!t) return;
+								e.preventDefault(), B(t), H(t), Y(t), J(!1);
+								return;
+							}
+							!q && (e.key.length === 1 || e.key === "Backspace" || e.key === "Delete") && !e.ctrlKey && !e.metaKey && !e.altKey && J(!0);
+						}
+					},
+					onBlur: (e) => {
+						if (G.current = !1, K.current) {
+							K.current = !1;
+							return;
+						}
+						let t = e.relatedTarget;
+						if (t instanceof Node && (N.current?.contains(t) || F.current?.contains(t))) return;
+						if (requestAnimationFrame(() => {
+							let e = document.activeElement;
+							e instanceof Node && (N.current?.contains(e) || F.current?.contains(e)) || J(!1);
+						}), !z.trim()) {
+							B(d ?? "");
+							return;
+						}
+						let n = m(z, x);
+						if (n) {
+							B(n), H(n), d !== n && Y(n);
+							return;
+						}
+						B(d ?? "");
+					}
+				}),
+				/* @__PURE__ */ i("button", {
+					type: "button",
+					tabIndex: -1,
+					disabled: T,
+					"data-slot": "hours-picker-input-toggle",
+					className: "absolute right-1 top-1/2 inline-flex size-8 -translate-y-1/2 items-center justify-center rounded-md text-muted-foreground transition-colors hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
+					"aria-label": q ? "Close time picker" : "Open time picker",
+					onPointerDown: (e) => {
+						e.preventDefault();
+					},
+					onMouseDown: (e) => {
+						e.preventDefault();
+					},
+					onClick: () => {
+						T || (J(!q), P.current?.focus({ preventScroll: !0 }));
+					},
+					children: /* @__PURE__ */ i(c, {
+						"aria-hidden": !0,
+						className: "size-4"
+					})
+				}),
+				q ? l(/* @__PURE__ */ i("div", {
+					ref: F,
+					"data-testid": A,
+					"data-state": "open",
+					className: "pointer-events-auto overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md",
+					style: {
+						position: U.strategy,
+						left: U.left,
+						top: U.top,
+						width: U.width
+					},
+					onPointerDownCapture: () => {
+						K.current = !0;
+					},
+					onMouseDownCapture: () => {
+						K.current = !0;
+					},
+					children: /* @__PURE__ */ i("div", {
+						ref: I,
+						role: "listbox",
+						className: "max-h-64 overflow-y-auto p-1",
+						children: x.map((e) => {
+							let t = e.value === d, n = e.value === V;
+							return /* @__PURE__ */ a("div", {
+								role: "option",
+								"aria-selected": t,
+								"data-value": e.value,
+								"data-state": t ? "checked" : "unchecked",
+								"data-disabled": e.disabled ? "" : void 0,
+								className: o("relative flex w-full select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none", e.disabled ? "pointer-events-none opacity-50" : "cursor-pointer", n && "bg-accent text-accent-foreground"),
+								onMouseDown: (e) => {
+									e.preventDefault();
+								},
+								onClick: () => {
+									e.disabled || (B(e.value), H(e.value), Y(e.value), J(!1), P.current?.focus({ preventScroll: !0 }));
+								},
+								onPointerEnter: () => {
+									e.disabled || H(e.value);
+								},
+								onPointerMove: () => {
+									e.disabled || H(e.value);
+								},
+								children: [/* @__PURE__ */ i("span", {
+									className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center",
+									children: t ? /* @__PURE__ */ i(s, {
+										"aria-hidden": !0,
+										className: "h-4 w-4"
+									}) : null
+								}), /* @__PURE__ */ a("div", {
+									className: "flex flex-col",
+									children: [/* @__PURE__ */ i("span", { children: e.label }), e.description == null ? null : /* @__PURE__ */ i("span", {
+										"data-slot": "description",
+										className: "text-xs text-muted-foreground",
+										children: e.description
+									})]
+								})]
+							}, e.value);
+						})
+					})
+				}), M) : null
+			]
+		})
+	});
 }
-export {
-  se as ModalHourPickerField
-};
+//#endregion
+export { y as ModalHourPickerField };