@rpcbase/ui 0.174.0 → 0.176.0

package/dist/index18.js

@@ -1,5 +1,5 @@
-import { j as a } from "./index28.js";
-import { Check as ue, ChevronDown as ne, ChevronUp as ae } from "lucide-react";
+import { j as f } from "./index28.js";
+import { Check as ue, ChevronDown as oe, ChevronUp as ae } from "lucide-react";
 import * as n from "react";
 import { DismissableLayerBranch as fe } from "./index29.js";
 import { createPortal as de } from "react-dom";
@@ -8,105 +8,105 @@ import pe, { InputMask as he } from "imask";
 import { Select as ve, SelectTrigger as be, SelectValue as ge, SelectContent as xe, SelectItem as we } from "./index20.js";
 import { useIsTouchDevice as ke } from "./index4.js";
 import { cn as q } from "./index2.js";
-const ee = pe;
-typeof ee.InputMask != "function" && (ee.InputMask = he);
-function Q(d) {
-  return String(d).padStart(2, "0");
+const te = pe;
+typeof te.InputMask != "function" && (te.InputMask = he);
+function Z(m) {
+  return String(m).padStart(2, "0");
 }
-function ye(d) {
-  const f = d.trim();
-  if (!f) return null;
-  const r = /^(\d{1,2}):(\d{2})$/.exec(f);
+function ye(m) {
+  const d = m.trim();
+  if (!d) return null;
+  const r = /^(\d{1,2}):(\d{2})$/.exec(d);
   if (!r)
     return null;
   const i = Number(r[1]), o = Number(r[2]);
-  return !Number.isFinite(i) || !Number.isFinite(o) || i < 0 || i > 23 || o < 0 || o > 59 ? null : `${Q(i)}:${Q(o)}`;
+  return !Number.isFinite(i) || !Number.isFinite(o) || i < 0 || i > 23 || o < 0 || o > 59 ? null : `${Z(i)}:${Z(o)}`;
 }
-function J(d, f) {
-  const r = ye(d);
+function Q(m, d) {
+  const r = ye(m);
   if (!r) return null;
-  const i = f.find((o) => o.value === r);
-  return z(i) ? { parsed: r, selectableValue: r } : { parsed: r, selectableValue: null };
+  const i = d.find((o) => o.value === r);
+  return B(i) ? { parsed: r, selectableValue: r } : { parsed: r, selectableValue: null };
 }
-function Z(d) {
-  const f = /^(\d{2}):(\d{2})$/.exec(d);
-  if (!f)
+function U(m) {
+  const d = /^(\d{2}):(\d{2})$/.exec(m);
+  if (!d)
     return null;
-  const r = Number(f[1]), i = Number(f[2]);
+  const r = Number(d[1]), i = Number(d[2]);
   return !Number.isFinite(r) || !Number.isFinite(i) ? null : r * 60 + i;
 }
-function z(d) {
-  return d ? !d.disabled : !1;
+function B(m) {
+  return m ? !m.disabled : !1;
 }
-function te(d, f) {
+function re(m, d) {
   let r = null, i = Number.POSITIVE_INFINITY, o = Number.NEGATIVE_INFINITY;
-  for (const g of f) {
-    if (!z(g)) continue;
-    const b = Z(g.value);
-    if (b == null) continue;
-    const N = Math.abs(b - d);
-    (N < i || N === i && b > o) && (r = g, i = N, o = b);
+  for (const v of d) {
+    if (!B(v)) continue;
+    const g = U(v.value);
+    if (g == null) continue;
+    const N = Math.abs(g - m);
+    (N < i || N === i && g > o) && (r = v, i = N, o = g);
   }
   return r;
 }
-function re({
-  direction: d,
-  viewportRef: f,
+function ne({
+  direction: m,
+  viewportRef: d,
   speed: r = 400,
   className: i
 }) {
-  const [o, g] = n.useState(!0), b = n.useRef(void 0), N = n.useRef(void 0), p = n.useRef(!1), h = n.useCallback(() => {
-    const T = f.current;
-    if (!T) {
-      g(!0);
+  const [o, v] = n.useState(!0), g = n.useRef(void 0), N = n.useRef(void 0), p = n.useRef(!1), h = n.useCallback(() => {
+    const y = d.current;
+    if (!y) {
+      v(!0);
       return;
     }
-    const { scrollTop: x, scrollHeight: v, clientHeight: M } = T, w = 2, A = x > w, D = x < v - M - w;
-    if (!(v > M + w)) {
-      g(!0);
+    const { scrollTop: x, scrollHeight: b, clientHeight: M } = y, w = 2, F = x > w, D = x < b - M - w;
+    if (!(b > M + w)) {
+      v(!0);
       return;
     }
-    g(d === "up" ? !A : !D);
-  }, [d, f]);
+    v(m === "up" ? !F : !D);
+  }, [m, d]);
   n.useEffect(() => {
-    const T = f.current;
-    if (!T) return;
+    const y = d.current;
+    if (!y) return;
     h();
-    const x = () => h(), v = () => h();
-    T.addEventListener("scroll", x, { passive: !0 });
-    const M = new ResizeObserver(v);
-    M.observe(T);
-    const w = new MutationObserver(v);
-    return w.observe(T, { childList: !0, subtree: !0 }), () => {
-      T.removeEventListener("scroll", x), M.disconnect(), w.disconnect();
+    const x = () => h(), b = () => h();
+    y.addEventListener("scroll", x, { passive: !0 });
+    const M = new ResizeObserver(b);
+    M.observe(y);
+    const w = new MutationObserver(b);
+    return w.observe(y, { childList: !0, subtree: !0 }), () => {
+      y.removeEventListener("scroll", x), M.disconnect(), w.disconnect();
     };
-  }, [f, h]);
-  const j = n.useCallback(() => {
-    b.current && (cancelAnimationFrame(b.current), b.current = void 0), p.current = !1, N.current = void 0;
-  }, []), P = n.useCallback(
-    (T) => {
-      const x = f.current;
+  }, [d, h]);
+  const I = n.useCallback(() => {
+    g.current && (cancelAnimationFrame(g.current), g.current = void 0), p.current = !1, N.current = void 0;
+  }, []), A = n.useCallback(
+    (y) => {
+      const x = d.current;
       if (!x || o || !p.current) {
-        j();
+        I();
         return;
       }
-      N.current || (N.current = T);
-      const v = T - N.current, M = r * v / 1e3;
+      N.current || (N.current = y);
+      const b = y - N.current, M = r * b / 1e3;
       if (M < 0.1) {
-        b.current = requestAnimationFrame(P);
+        g.current = requestAnimationFrame(A);
         return;
       }
-      const w = x.scrollTop, A = x.scrollHeight - x.clientHeight;
+      const w = x.scrollTop, F = x.scrollHeight - x.clientHeight;
       let D;
-      d === "up" ? D = Math.max(0, w - M) : D = Math.min(A, w + M), x.scrollTop = D, N.current = T;
-      const I = 1;
-      (d === "up" ? D > I : D < A - I) && Math.abs(D - w) > 0.01 ? b.current = requestAnimationFrame(P) : (j(), setTimeout(h, 16));
+      m === "up" ? D = Math.max(0, w - M) : D = Math.min(F, w + M), x.scrollTop = D, N.current = y;
+      const R = 1;
+      (m === "up" ? D > R : D < F - R) && Math.abs(D - w) > 0.01 ? g.current = requestAnimationFrame(A) : (I(), setTimeout(h, 16));
     },
-    [h, d, o, r, j, f]
-  ), O = n.useCallback(() => {
-    o || !f.current || p.current || (p.current = !0, N.current = void 0, b.current = requestAnimationFrame(P));
-  }, [o, P, f]);
-  return n.useEffect(() => j, [j]), /* @__PURE__ */ a.jsx(
+    [h, m, o, r, I, d]
+  ), V = n.useCallback(() => {
+    o || !d.current || p.current || (p.current = !0, N.current = void 0, g.current = requestAnimationFrame(A));
+  }, [o, A, d]);
+  return n.useEffect(() => I, [I]), /* @__PURE__ */ f.jsx(
     "div",
     {
       className: q(
@@ -115,62 +115,62 @@ function re({
         i
       ),
       onPointerEnter: () => {
-        o || O();
+        o || V();
       },
       onPointerMove: () => {
-        !o && !p.current && O();
+        !o && !p.current && V();
       },
       onPointerLeave: () => {
-        j();
+        I();
       },
-      children: d === "up" ? /* @__PURE__ */ a.jsx(ae, { "aria-hidden": !0, className: "h-4 w-4 opacity-50" }) : /* @__PURE__ */ a.jsx(ne, { "aria-hidden": !0, className: "h-4 w-4 opacity-50" })
+      children: m === "up" ? /* @__PURE__ */ f.jsx(ae, { "aria-hidden": !0, className: "h-4 w-4 opacity-50" }) : /* @__PURE__ */ f.jsx(oe, { "aria-hidden": !0, className: "h-4 w-4 opacity-50" })
     }
   );
 }
-function oe({
-  id: d,
-  value: f,
+function se({
+  id: m,
+  value: d,
   onChange: r,
   onValueUpdate: i,
   options: o,
-  placeholder: g = "Select time",
-  className: b,
+  placeholder: v = "Select time",
+  className: g,
   inputClassName: N,
   disabled: p,
   readOnly: h,
-  open: j,
-  onOpenChange: P,
-  triggerTestId: O,
-  contentTestId: T,
+  open: I,
+  onOpenChange: A,
+  triggerTestId: V,
+  contentTestId: y,
   isHydrated: x
 }) {
-  const v = n.useId(), M = d ?? `hours-picker-${v}`, w = n.useRef(null), A = n.useRef(null), D = n.useRef(null), I = n.useRef(!1), [F, K] = n.useState(null), R = n.useRef(null), _ = n.useRef(null), V = n.useRef(null), [t, l] = n.useState(() => ({
+  const b = n.useId(), M = m ?? `hours-picker-${b}`, w = n.useRef(null), F = n.useRef(null), D = n.useRef(null), R = n.useRef(!1), [L, W] = n.useState(null), j = n.useRef(null), _ = n.useRef(null), z = n.useRef(null), [t, c] = n.useState(() => ({
     left: 0,
     top: 0,
     width: 0
-  })), [k, S] = n.useState(!1), m = j ?? k, B = P ?? S, se = typeof window > "u" ? n.useEffect : n.useLayoutEffect;
+  })), [k, S] = n.useState(!1), u = I ?? k, H = A ?? S, X = typeof window > "u" ? n.useEffect : n.useLayoutEffect;
   n.useEffect(() => {
-    if (!m || p || h)
+    if (!u || p || h)
       return;
     const e = w.current;
     e instanceof HTMLInputElement && (typeof document < "u" && document.activeElement === e || e.focus({ preventScroll: !0 }));
-  }, [p, m, h]);
-  const W = n.useCallback((e) => {
-    D.current = e, K(e);
+  }, [p, u, h]);
+  const $ = n.useCallback((e) => {
+    D.current = e, W(e);
   }, []), ie = n.useCallback(() => {
-    I.current = !0;
+    R.current = !0;
   }, []);
   n.useEffect(() => {
-    if (!m) return;
-    const e = o.find((c) => c.value === f);
-    if (e && z(e)) {
-      W(e.value);
+    if (!u) return;
+    const e = o.find((l) => l.value === d);
+    if (e && B(e)) {
+      $(e.value);
       return;
     }
-    const s = o.find((c) => z(c));
-    W(s?.value ?? null);
-  }, [m, o, W, f]);
-  const ce = n.useCallback(
+    const s = o.find((l) => B(l));
+    $(s?.value ?? null);
+  }, [u, o, $, d]);
+  const le = n.useCallback(
     (e) => {
       if (e === null) {
         if (i) {
@@ -180,8 +180,8 @@ function oe({
         r(null);
         return;
       }
-      const s = o.find((c) => c.value === e);
-      if (z(s)) {
+      const s = o.find((l) => l.value === e);
+      if (B(s)) {
         if (i) {
           i(e);
           return;
@@ -190,171 +190,171 @@ function oe({
       }
     },
     [r, i, o]
-  ), U = n.useCallback(
+  ), ee = n.useCallback(
     (e) => {
       if (e === null) {
         i && i(null), r(null);
         return;
       }
-      const s = o.find((c) => c.value === e);
-      z(s) && (i && i(e), r(e));
+      const s = o.find((l) => l.value === e);
+      B(s) && (i && i(e), r(e));
     },
     [r, i, o]
   );
   n.useEffect(() => {
-    if (!m) return;
+    if (!u) return;
     const e = (s) => {
-      const c = s.target;
-      if (!(c instanceof Node))
+      const l = s.target;
+      if (!(l instanceof Node))
         return;
-      const u = R.current;
-      !u || u.contains(c) || _.current?.contains(c) || B(!1);
+      const a = j.current;
+      !a || a.contains(l) || _.current?.contains(l) || H(!1);
     };
     return document.addEventListener("pointerdown", e, !0), () => {
       document.removeEventListener("pointerdown", e, !0);
     };
-  }, [m, B]), n.useEffect(() => {
-    if (!m)
+  }, [u, H]), n.useEffect(() => {
+    if (!u)
       return;
     const e = _.current;
     if (!e)
       return;
-    const s = (c) => {
-      const u = V.current;
-      if (!u)
+    const s = (l) => {
+      const a = z.current;
+      if (!a)
         return;
-      const E = c.deltaY;
+      const E = l.deltaY;
       if (E === 0)
         return;
-      const C = Math.max(0, u.scrollHeight - u.clientHeight), y = u.scrollTop <= 0, G = u.scrollTop >= C, L = c.target;
-      if (L instanceof Node && u.contains(L)) {
-        (E < 0 && y || E > 0 && G) && c.preventDefault();
+      const C = Math.max(0, a.scrollHeight - a.clientHeight), T = a.scrollTop <= 0, G = a.scrollTop >= C, O = l.target;
+      if (O instanceof Node && a.contains(O)) {
+        (E < 0 && T || E > 0 && G) && l.preventDefault();
         return;
       }
-      c.preventDefault();
-      const Y = Math.min(C, Math.max(0, u.scrollTop + E));
-      u.scrollTop = Y;
+      l.preventDefault();
+      const K = Math.min(C, Math.max(0, a.scrollTop + E));
+      a.scrollTop = K;
     };
     return e.addEventListener("wheel", s, { passive: !1 }), () => {
       e.removeEventListener("wheel", s);
     };
-  }, [m]), n.useEffect(() => {
-    if (!m || j !== void 0 && !P || typeof window > "u" || !("IntersectionObserver" in window))
+  }, [u]), n.useEffect(() => {
+    if (!u || I !== void 0 && !A || typeof window > "u" || !("IntersectionObserver" in window))
       return;
     const e = w.current;
     if (!(e instanceof HTMLElement))
       return;
     let s = !0;
-    const c = new IntersectionObserver((u) => {
+    const l = new IntersectionObserver((a) => {
       if (!s)
         return;
-      const E = u[0];
-      E && !E.isIntersecting && B(!1);
+      const E = a[0];
+      E && !E.isIntersecting && H(!1);
     });
-    return c.observe(e), () => {
-      s = !1, c.disconnect();
+    return l.observe(e), () => {
+      s = !1, l.disconnect();
     };
-  }, [P, m, j, B]);
-  const $ = n.useCallback(() => {
+  }, [A, u, I, H]);
+  const Y = n.useCallback(() => {
     if (typeof window > "u") return;
     const e = w.current, s = _.current;
     if (!(e instanceof HTMLElement) || !s) return;
-    const c = e.getBoundingClientRect(), u = s.offsetHeight, E = window.innerWidth ?? 0, C = window.innerHeight ?? 0, y = 8, G = c.width;
-    let L = c.left;
-    L + G > E - y && (L = Math.max(y, E - G - y)), L < y && (L = y);
-    let H = c.bottom + y;
-    const Y = H + u > C - y, X = c.top - u - y;
-    Y && X >= y && (H = X), H < y && (H = y), H + u > C - y && (H = Math.max(y, C - u - y)), l({ left: L, top: H, width: G });
+    const l = e.getBoundingClientRect(), a = s.offsetHeight, E = window.innerWidth ?? 0, C = window.innerHeight ?? 0, T = 8, G = l.width;
+    let O = l.left;
+    O + G > E - T && (O = Math.max(T, E - G - T)), O < T && (O = T);
+    let P = l.bottom + T;
+    const K = P + a > C - T, J = l.top - a - T;
+    K && J >= T && (P = J), P < T && (P = T), P + a > C - T && (P = Math.max(T, C - a - T)), c({ left: O, top: P, width: G });
   }, []);
-  return se(() => {
-    if (!m || p || typeof window > "u") return;
-    $();
-    const e = window.requestAnimationFrame($);
-    return window.addEventListener("scroll", $, !0), window.addEventListener("resize", $), () => {
-      window.cancelAnimationFrame(e), window.removeEventListener("scroll", $, !0), window.removeEventListener("resize", $);
+  return X(() => {
+    if (!u || p || typeof window > "u") return;
+    Y();
+    const e = window.requestAnimationFrame(Y);
+    return window.addEventListener("scroll", Y, !0), window.addEventListener("resize", Y), () => {
+      window.cancelAnimationFrame(e), window.removeEventListener("scroll", Y, !0), window.removeEventListener("resize", Y);
     };
-  }, [p, m, $]), n.useEffect(() => {
-    if (!m) return;
-    const e = V.current;
+  }, [p, u, Y]), n.useEffect(() => {
+    if (!u) return;
+    const e = z.current;
     if (!e) return;
-    const c = requestAnimationFrame(() => {
-      const u = e.querySelector('[role="option"][data-state="checked"]');
-      if (u instanceof HTMLElement) {
-        const Y = u.offsetTop - 8, X = u.offsetTop + u.offsetHeight + 8;
-        if (Y < e.scrollTop) {
-          e.scrollTop = Math.max(0, Y);
+    const l = requestAnimationFrame(() => {
+      const a = e.querySelector('[role="option"][data-state="checked"]');
+      if (a instanceof HTMLElement) {
+        const K = a.offsetTop - 8, J = a.offsetTop + a.offsetHeight + 8;
+        if (K < e.scrollTop) {
+          e.scrollTop = Math.max(0, K);
           return;
         }
-        const le = e.scrollTop + e.clientHeight;
-        X > le && (e.scrollTop = Math.max(0, X - e.clientHeight));
+        const ce = e.scrollTop + e.clientHeight;
+        J > ce && (e.scrollTop = Math.max(0, J - e.clientHeight));
         return;
       }
       const E = Array.from(e.querySelectorAll('[role="option"]'));
       if (!E.length) return;
-      let C, y;
-      for (const H of E) {
-        if (!H.hasAttribute("data-disabled")) {
-          C = H;
+      let C, T;
+      for (const P of E) {
+        if (!P.hasAttribute("data-disabled")) {
+          C = P;
           break;
         }
-        y = H;
+        T = P;
       }
       if (!C) return;
-      const L = Math.max(0, (y || C).offsetTop - 8);
-      e.scrollTop = L;
+      const O = Math.max(0, (T || C).offsetTop - 8);
+      e.scrollTop = O;
     });
-    return () => cancelAnimationFrame(c);
-  }, [m, o]), n.useEffect(() => {
-    if (!m || !F || !I.current) return;
-    const e = V.current;
+    return () => cancelAnimationFrame(l);
+  }, [u, o]), n.useEffect(() => {
+    if (!u || !L || !R.current) return;
+    const e = z.current;
     if (!e) return;
-    const s = e.querySelector(`[role="option"][data-value="${F}"]`);
+    const s = e.querySelector(`[role="option"][data-value="${L}"]`);
     if (!(s instanceof HTMLElement)) return;
-    const c = 8, u = s.offsetTop - c, E = s.offsetTop + s.offsetHeight + c;
-    if (u < e.scrollTop) {
-      e.scrollTop = Math.max(0, u);
+    const l = 8, a = s.offsetTop - l, E = s.offsetTop + s.offsetHeight + l;
+    if (a < e.scrollTop) {
+      e.scrollTop = Math.max(0, a);
       return;
     }
     const C = e.scrollTop + e.clientHeight;
     E > C && (e.scrollTop = Math.max(0, E - e.clientHeight));
-  }, [F, m]), /* @__PURE__ */ a.jsx(
+  }, [L, u]), /* @__PURE__ */ f.jsx(
     "div",
     {
       "data-slot": "hours-picker-input",
-      className: q("w-[150px]", b),
-      ref: R,
-      children: /* @__PURE__ */ a.jsxs("div", { className: "relative", children: [
-        /* @__PURE__ */ a.jsx(
+      className: q("w-[150px]", g),
+      ref: j,
+      children: /* @__PURE__ */ f.jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ f.jsx(
           Ee,
           {
             id: M,
-            placeholder: g,
-            value: f,
-            onValueUpdate: ce,
-            onCommit: U,
+            placeholder: v,
+            value: d,
+            onValueUpdate: le,
+            onCommit: ee,
             options: o,
             disabled: p,
             readOnly: h,
-            open: m,
-            setOpen: B,
+            open: u,
+            setOpen: H,
             inputClassName: N,
-            triggerTestId: O,
+            triggerTestId: V,
             isHydrated: x,
             highlightedValueRef: D,
-            setHighlightedValue: W,
+            setHighlightedValue: $,
             markKeyboardNavigation: ie,
             inputRef: (e) => {
               w.current = e;
             },
-            setDraftValueRef: A
+            setDraftValueRef: F
           }
         ),
-        m ? (() => {
-          const e = /* @__PURE__ */ a.jsx(fe, { children: /* @__PURE__ */ a.jsxs(
+        u ? (() => {
+          const e = /* @__PURE__ */ f.jsx(fe, { children: /* @__PURE__ */ f.jsxs(
             "div",
             {
               ref: _,
-              "data-testid": T,
+              "data-testid": y,
               "data-state": "open",
               className: q(
                 "pointer-events-auto fixed z-[60] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md",
@@ -366,51 +366,51 @@ function oe({
                 width: t.width
               },
               children: [
-                /* @__PURE__ */ a.jsx(
-                  re,
+                /* @__PURE__ */ f.jsx(
+                  ne,
                   {
                     direction: "up",
-                    viewportRef: V
+                    viewportRef: z
                   }
                 ),
-                /* @__PURE__ */ a.jsx(
+                /* @__PURE__ */ f.jsx(
                   "div",
                   {
-                    ref: V,
+                    ref: z,
                     role: "listbox",
                     className: "max-h-64 overflow-y-auto p-1 [overscroll-behavior:contain] [scrollbar-width:none] [-ms-overflow-style:none] [&::-webkit-scrollbar]:hidden",
                     children: o.map((s) => {
-                      const c = s.value === f;
-                      return /* @__PURE__ */ a.jsxs(
+                      const l = s.value === d;
+                      return /* @__PURE__ */ f.jsxs(
                         "div",
                         {
                           role: "option",
-                          "aria-selected": c,
+                          "aria-selected": l,
                           "data-value": s.value,
-                          "data-state": c ? "checked" : "unchecked",
+                          "data-state": l ? "checked" : "unchecked",
                           "data-disabled": s.disabled ? "" : void 0,
                           className: q(
                             "relative flex w-full select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none cursor-pointer",
                             s.disabled && "pointer-events-none opacity-50",
-                            F === s.value && "bg-accent text-accent-foreground"
+                            L === s.value && "bg-accent text-accent-foreground"
                           ),
-                          onMouseDown: (u) => {
-                            u.preventDefault();
+                          onMouseDown: (a) => {
+                            a.preventDefault();
                           },
                           onClick: () => {
-                            s.disabled || (A.current?.(s.value), W(s.value), w.current?.focus({ preventScroll: !0 }), U(s.value), B(!1));
+                            s.disabled || (F.current?.(s.value), $(s.value), w.current?.focus({ preventScroll: !0 }), ee(s.value), H(!1));
                           },
                           onPointerEnter: () => {
-                            I.current || (I.current = !1, W(s.value));
+                            R.current || (R.current = !1, $(s.value));
                           },
-                          onPointerMove: (u) => {
-                            I.current && u.movementX === 0 && u.movementY === 0 || (I.current = !1, W(s.value));
+                          onPointerMove: (a) => {
+                            R.current && a.movementX === 0 && a.movementY === 0 || (R.current = !1, $(s.value));
                           },
                           children: [
-                            /* @__PURE__ */ a.jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: c ? /* @__PURE__ */ a.jsx(ue, { "aria-hidden": !0, className: "h-4 w-4" }) : null }),
-                            /* @__PURE__ */ a.jsxs("div", { className: "flex flex-col", children: [
-                              /* @__PURE__ */ a.jsx("span", { children: s.label }),
-                              s.description != null ? /* @__PURE__ */ a.jsx("span", { "data-slot": "description", className: "text-xs text-muted-foreground", children: s.description }) : null
+                            /* @__PURE__ */ f.jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: l ? /* @__PURE__ */ f.jsx(ue, { "aria-hidden": !0, className: "h-4 w-4" }) : null }),
+                            /* @__PURE__ */ f.jsxs("div", { className: "flex flex-col", children: [
+                              /* @__PURE__ */ f.jsx("span", { children: s.label }),
+                              s.description != null ? /* @__PURE__ */ f.jsx("span", { "data-slot": "description", className: "text-xs text-muted-foreground", children: s.description }) : null
                             ] })
                           ]
                         },
@@ -419,11 +419,11 @@ function oe({
                     })
                   }
                 ),
-                /* @__PURE__ */ a.jsx(
-                  re,
+                /* @__PURE__ */ f.jsx(
+                  ne,
                   {
                     direction: "down",
-                    viewportRef: V
+                    viewportRef: z
                   }
                 )
               ]
@@ -435,72 +435,72 @@ function oe({
     }
   );
 }
-oe.displayName = "HourPickerInput";
+se.displayName = "HourPickerInput";
 function Te({
-  id: d,
-  value: f,
+  id: m,
+  value: d,
   onChange: r,
   onValueUpdate: i,
   options: o,
-  placeholder: g = "Select time",
-  className: b,
+  placeholder: v = "Select time",
+  className: g,
   inputClassName: N,
   disabled: p,
   open: h,
-  onOpenChange: j,
-  triggerTestId: P,
-  contentTestId: O,
-  isHydrated: T
+  onOpenChange: I,
+  triggerTestId: A,
+  contentTestId: V,
+  isHydrated: y
 }) {
   const x = n.useCallback(
-    (v) => {
-      const M = o.find((w) => w.value === v);
-      z(M) && (i && i(v), r(v));
+    (b) => {
+      const M = o.find((w) => w.value === b);
+      B(M) && (i && i(b), r(b));
     },
     [r, i, o]
   );
-  return /* @__PURE__ */ a.jsx("div", { "data-slot": "hours-picker-field", className: q("w-[150px]", b), children: /* @__PURE__ */ a.jsxs(
+  return /* @__PURE__ */ f.jsx("div", { "data-slot": "hours-picker-field", className: q("w-[150px]", g), children: /* @__PURE__ */ f.jsxs(
     ve,
     {
       disabled: p,
       open: h,
-      onOpenChange: j,
-      value: f ?? "",
-      onValueChange: (v) => x(v),
+      onOpenChange: I,
+      value: d ?? "",
+      onValueChange: (b) => x(b),
       children: [
-        /* @__PURE__ */ a.jsx(
+        /* @__PURE__ */ f.jsx(
           be,
           {
-            id: d,
-            "data-testid": P,
-            "data-hydrated": T ? "true" : void 0,
+            id: m,
+            "data-testid": A,
+            "data-hydrated": y ? "true" : void 0,
             className: q(
               "transition-colors hover:bg-accent hover:text-accent-foreground",
-              !f && "text-muted-foreground",
+              !d && "text-muted-foreground",
               h && "ring-2 ring-primary ring-offset-2",
               "[&_[data-slot='description']]:hidden",
               N
             ),
-            children: /* @__PURE__ */ a.jsx(ge, { placeholder: g })
+            children: /* @__PURE__ */ f.jsx(ge, { placeholder: v })
           }
         ),
-        /* @__PURE__ */ a.jsx(
+        /* @__PURE__ */ f.jsx(
           xe,
           {
-            "data-testid": O,
+            "data-testid": V,
             autoScroll: "firstEnabledWithContext",
             className: "max-h-64 overflow-y-auto",
-            children: o.map((v) => /* @__PURE__ */ a.jsxs(
+            children: o.map((b) => /* @__PURE__ */ f.jsxs(
               we,
               {
-                value: v.value,
-                disabled: v.disabled,
+                value: b.value,
+                disabled: b.disabled,
                 children: [
-                  /* @__PURE__ */ a.jsx("span", { children: v.label }),
-                  v.description != null ? /* @__PURE__ */ a.jsx("span", { "data-slot": "description", className: "block text-xs text-muted-foreground", children: v.description }) : null
+                  /* @__PURE__ */ f.jsx("span", { children: b.label }),
+                  b.description != null ? /* @__PURE__ */ f.jsx("span", { "data-slot": "description", className: "block text-xs text-muted-foreground", children: b.description }) : null
                 ]
               },
-              v.value
+              b.value
             ))
           }
         )
@@ -508,71 +508,71 @@ function Te({
     }
   ) });
 }
-function Se(d) {
-  return ke() ? /* @__PURE__ */ a.jsx(Te, { ...d }) : /* @__PURE__ */ a.jsx(oe, { ...d });
+function Se(m) {
+  return ke() ? /* @__PURE__ */ f.jsx(Te, { ...m }) : /* @__PURE__ */ f.jsx(se, { ...m });
 }
 Se.displayName = "HourPickerField";
 function Ee({
-  id: d,
-  placeholder: f,
+  id: m,
+  placeholder: d,
   value: r,
   onValueUpdate: i,
   onCommit: o,
-  options: g,
-  disabled: b,
+  options: v,
+  disabled: g,
   readOnly: N,
   open: p,
   setOpen: h,
-  inputClassName: j,
-  triggerTestId: P,
-  isHydrated: O,
-  highlightedValueRef: T,
+  inputClassName: I,
+  triggerTestId: A,
+  isHydrated: V,
+  highlightedValueRef: y,
   setHighlightedValue: x,
-  markKeyboardNavigation: v,
+  markKeyboardNavigation: b,
   inputRef: M,
   setDraftValueRef: w
 }) {
-  const A = n.useRef(!1), D = n.useRef(!1), I = n.useRef(!1), F = n.useRef(null), [K, R] = n.useState(() => r || "");
+  const F = n.useRef(!1), D = n.useRef(!1), R = n.useRef(!1), L = n.useRef(null), [W, j] = n.useState(() => r || "");
   n.useEffect(() => (w.current = (t) => {
-    R(t);
+    j(t);
   }, () => {
     w.current = null;
   }), [w]);
   const _ = n.useCallback(
     (t) => {
-      const l = T.current ?? r ?? "";
-      let k = g.findIndex((S) => S.value === l);
-      k === -1 && (k = t === 1 ? -1 : g.length);
-      for (let S = k + t; S >= 0 && S < g.length; S += t) {
-        const m = g[S];
-        if (z(m)) {
-          x(m.value), F.current = m.value, R(m.value), i(m.value);
+      const c = y.current ?? r ?? "";
+      let k = v.findIndex((S) => S.value === c);
+      k === -1 && (k = t === 1 ? -1 : v.length);
+      for (let S = k + t; S >= 0 && S < v.length; S += t) {
+        const u = v[S];
+        if (B(u)) {
+          x(u.value), L.current = u.value, j(u.value), i(u.value);
           return;
         }
       }
     },
-    [T, i, g, x, r]
+    [y, i, v, x, r]
   );
   n.useEffect(() => {
-    A.current || R(r || "");
+    F.current || j(r || "");
   }, [r]);
-  const V = q(
+  const z = q(
     "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 pr-10 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground 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",
-    !K && "text-muted-foreground",
+    !W && "text-muted-foreground",
     p && "ring-2 ring-primary ring-offset-2",
     "[&_[data-slot='description']]:hidden",
-    j
+    I
   );
-  return /* @__PURE__ */ a.jsxs("div", { className: "relative group", children: [
-    /* @__PURE__ */ a.jsx(
+  return /* @__PURE__ */ f.jsxs("div", { className: "relative group", children: [
+    /* @__PURE__ */ f.jsx(
       me,
       {
-        id: d,
-        "data-testid": P,
-        "data-hydrated": O ? "true" : void 0,
+        id: m,
+        "data-testid": A,
+        "data-hydrated": V ? "true" : void 0,
         type: "text",
-        disabled: b,
+        disabled: g,
         readOnly: N,
         inputRef: M,
         autoComplete: "off",
@@ -580,51 +580,51 @@ function Ee({
           { mask: "00:00", lazy: !0 },
           { mask: "0:00", lazy: !0 }
         ],
-        dispatch: (t, l) => {
-          const k = (l.value + t).replace(/\D/g, "");
-          if (k.length <= 2 || k.length >= 4) return l.compiledMasks[0];
-          const S = Q(Number(k.slice(0, 2)));
-          return g.some((B) => B.value.startsWith(`${S}:`)) ? l.compiledMasks[0] : l.compiledMasks[1];
+        dispatch: (t, c) => {
+          const k = (c.value + t).replace(/\D/g, "");
+          if (k.length <= 2 || k.length >= 4) return c.compiledMasks[0];
+          const S = Z(Number(k.slice(0, 2)));
+          return v.some((H) => H.value.startsWith(`${S}:`)) ? c.compiledMasks[0] : c.compiledMasks[1];
         },
-        placeholder: f,
-        value: K,
-        className: V,
+        placeholder: d,
+        value: W,
+        className: z,
         onAccept: (t) => {
-          const l = typeof t == "string" ? t : String(t ?? "");
-          R(l), l.replace(/\D/g, "").length === 0 && r && o(null);
+          const c = typeof t == "string" ? t : String(t ?? "");
+          j(c), c.replace(/\D/g, "").length === 0 && r && o(null);
         },
         onComplete: (t) => {
-          const l = typeof t == "string" ? t : String(t ?? "");
-          if (F.current === l) {
-            F.current = null;
+          const c = typeof t == "string" ? t : String(t ?? "");
+          if (L.current === c) {
+            L.current = null;
             return;
           }
-          const k = J(l, g);
+          const k = Q(c, v);
           if (!k)
             return;
           if (k.selectableValue) {
-            if (x(k.selectableValue), R(k.selectableValue), r === k.selectableValue)
+            if (x(k.selectableValue), j(k.selectableValue), r === k.selectableValue)
               return;
             o(k.selectableValue);
             return;
           }
-          const S = Z(k.parsed);
+          const S = U(k.parsed);
           if (S == null)
             return;
-          const m = te(S, g);
-          m && x(m.value);
+          const u = re(S, v);
+          u && x(u.value);
         },
         onPointerDown: () => {
-          D.current = !0, !b && (p || h(!0));
+          D.current = !0, !g && (p || h(!0));
         },
         onMouseDown: (t) => {
-          D.current = !0, I.current = typeof document < "u" && document.activeElement === t.currentTarget, !b && (p || h(!0));
+          D.current = !0, R.current = typeof document < "u" && document.activeElement === t.currentTarget, !g && (p || h(!0));
         },
         onClick: () => {
-          b || p || h(!0);
+          g || p || h(!0);
         },
         onKeyDown: (t) => {
-          if (!b) {
+          if (!g) {
             if (t.key === "Tab" && p && !t.defaultPrevented) {
               h(!1);
               return;
@@ -636,7 +636,7 @@ function Ee({
               return;
             }
             if (!p && !t.defaultPrevented && (t.key.length === 1 || t.key === "Backspace" || t.key === "Delete") && !t.ctrlKey && !t.metaKey && !t.altKey && h(!0), t.key === "ArrowDown" || t.key === "ArrowUp") {
-              if (v(), t.preventDefault(), !p) {
+              if (b(), t.preventDefault(), !p) {
                 h(!0);
                 return;
               }
@@ -644,59 +644,66 @@ function Ee({
               return;
             }
             if (t.key === "Enter") {
-              v();
-              const l = J(K, g);
-              if (!l)
+              b();
+              const c = Q(W, v);
+              if (!c) {
+                if (!p || W.trim() !== "")
+                  return;
+                const u = v.find((X) => X.value === y.current), H = (B(u) ? u?.value : void 0) ?? v.find((X) => B(X))?.value;
+                if (!H)
+                  return;
+                t.preventDefault(), x(H), j(H), o(H), h(!1);
                 return;
-              if (l.selectableValue) {
-                t.preventDefault(), x(l.selectableValue), R(l.selectableValue), o(l.selectableValue), h(!1);
+              }
+              if (c.selectableValue) {
+                t.preventDefault(), x(c.selectableValue), j(c.selectableValue), o(c.selectableValue), h(!1);
                 return;
               }
-              const k = Z(l.parsed);
+              const k = U(c.parsed);
               if (k == null)
                 return;
-              const S = te(k, g);
+              const S = re(k, v);
               if (!S)
                 return;
-              t.preventDefault(), x(S.value), R(S.value), o(S.value), h(!1);
+              t.preventDefault(), x(S.value), j(S.value), o(S.value), h(!1);
               return;
             }
           }
         },
         onFocus: (t) => {
-          const l = !D.current || !I.current;
-          if (D.current = !1, I.current = !1, A.current = !0, l) {
+          const c = !D.current || !R.current;
+          if (D.current = !1, R.current = !1, F.current = !0, c) {
             const k = t.currentTarget;
             requestAnimationFrame(() => k.select());
           }
-          b || p || h(!0);
+          g || p || h(!0);
         },
         onBlur: () => {
-          A.current = !1;
-          const t = K.trim();
+          F.current = !1;
+          const t = W.trim();
           if (!t) {
-            R(r || "");
+            j(r || "");
             return;
           }
-          const l = J(t, g);
-          if (!l) {
-            R(r || "");
+          const c = Q(t, v);
+          if (!c) {
+            j(r || "");
             return;
           }
-          if (!l.selectableValue) {
-            R(r || "");
+          if (!c.selectableValue) {
+            j(r || "");
             return;
           }
-          R(l.selectableValue), r !== l.selectableValue && o(l.selectableValue);
+          j(c.selectableValue), r !== c.selectableValue && o(c.selectableValue);
         }
       }
     ),
-    /* @__PURE__ */ a.jsx(
+    /* @__PURE__ */ f.jsx(
       "button",
       {
         type: "button",
         tabIndex: -1,
-        disabled: b,
+        disabled: g,
         "data-slot": "hours-picker-input-toggle",
         className: q(
           "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"
@@ -709,15 +716,15 @@ function Ee({
           t.preventDefault();
         },
         onClick: () => {
-          b || h(!p);
+          g || h(!p);
         },
-        children: /* @__PURE__ */ a.jsx(ne, { "aria-hidden": !0, className: "size-4" })
+        children: /* @__PURE__ */ f.jsx(oe, { "aria-hidden": !0, className: "size-4" })
       }
     )
   ] });
 }
 export {
   Se as HourPickerField,
-  oe as HourPickerInput
+  se as HourPickerInput
 };
 //# sourceMappingURL=index18.js.map