@alfadocs/ui-kit 1.54.3 → 1.55.0

package/dist/_chunks/time-picker-DVfyAR81.js

@@ -0,0 +1,871 @@
+import { jsxs as je, jsx as g, Fragment as bt } from "react/jsx-runtime";
+import { forwardRef as yt, useContext as kt, useState as oe, useRef as d, useCallback as G, useEffect as be, useMemo as ye, useImperativeHandle as wt } from "react";
+import { c as C } from "./index-D2ZczOXr.js";
+import { useTranslation as xt } from "react-i18next";
+import * as W from "@radix-ui/react-popover";
+import { u as Dt, F as Tt, a as Mt } from "./form-field-context-DtiROUJV.js";
+import { u as Pt } from "./use-isomorphic-layout-effect-BGfaCOP1.js";
+import { u as Ct } from "./registry-DvAUVLHh.js";
+import { C as At } from "./clock-Drd4Wtis.js";
+const zt = {
+  id: "time-picker",
+  capabilities: ["select_single", "set_value", "open", "close"],
+  state: {
+    value: {
+      type: "HH:MM",
+      descriptionKey: "ui.agent.timePicker.state.value",
+      description: "Currently-selected time as 24h HH:MM (always present — defaults to 00:00 when unset).",
+      read: (r) => {
+        const o = r.getValue();
+        if (!o) return null;
+        const u = String(o.hours).padStart(2, "0"), b = String(o.minutes).padStart(2, "0");
+        return `${u}:${b}`;
+      }
+    },
+    isOpen: {
+      type: "boolean",
+      descriptionKey: "ui.agent.timePicker.state.isOpen",
+      description: "Whether the time dropdown is open. Always false unless the picker has the dropdown prop.",
+      read: (r) => r.isOpen()
+    }
+  },
+  actions: {
+    set_time: {
+      safety: "write",
+      argsType: "{ time: string }",
+      argsSchema: {
+        type: "object",
+        properties: {
+          time: { type: "string", pattern: "^([01][0-9]|2[0-3]):[0-5][0-9]$" }
+        },
+        required: ["time"]
+      },
+      idempotent: !0,
+      descriptionKey: "ui.agent.timePicker.actions.setTime",
+      description: "Set the time using a 24h HH:MM string.",
+      examples: [{ args: { time: "14:30" }, note: "2:30 PM in 24h form." }],
+      invoke: (r, o) => {
+        const [u, b] = o.time.split(":");
+        r.setValue({
+          hours: Number.parseInt(u ?? "0", 10),
+          minutes: Number.parseInt(b ?? "0", 10)
+        });
+      }
+    },
+    clear: {
+      safety: "destructive",
+      idempotent: !0,
+      descriptionKey: "ui.agent.timePicker.actions.clear",
+      description: "Clear the time (resets to 00:00).",
+      invoke: (r) => {
+        r.clear();
+      }
+    },
+    open: {
+      safety: "read",
+      descriptionKey: "ui.agent.timePicker.actions.open",
+      description: "Open the time dropdown without moving focus. A no-op unless the picker has the dropdown prop and is enabled.",
+      invoke: (r) => {
+        r.open();
+      }
+    },
+    close: {
+      safety: "read",
+      descriptionKey: "ui.agent.timePicker.actions.close",
+      description: "Close the time dropdown. A no-op unless the picker has the dropdown prop.",
+      invoke: (r) => {
+        r.close();
+      }
+    }
+  },
+  domHooks: {
+    root: {
+      attr: "data-component",
+      value: "time-picker",
+      description: "Marks the TimePicker wrapper."
+    },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop."
+    }
+  }
+};
+function Ht(r) {
+  try {
+    const o = new Intl.DateTimeFormat(r, {
+      hour: "numeric"
+    }).resolvedOptions();
+    return o.hourCycle === "h12" || o.hourCycle === "h11";
+  } catch {
+    return !1;
+  }
+}
+function It(r) {
+  var o, u;
+  try {
+    const b = ((o = new Intl.DateTimeFormat(r, {
+      hour: "numeric",
+      hour12: !0
+    }).formatToParts(new Date(2e3, 0, 1, 9)).find((w) => w.type === "dayPeriod")) == null ? void 0 : o.value) ?? "AM", k = ((u = new Intl.DateTimeFormat(r, {
+      hour: "numeric",
+      hour12: !0
+    }).formatToParts(new Date(2e3, 0, 1, 15)).find((w) => w.type === "dayPeriod")) == null ? void 0 : u.value) ?? "PM";
+    return { am: b, pm: k };
+  } catch {
+    return { am: "AM", pm: "PM" };
+  }
+}
+function H(r, o, u) {
+  return Math.min(u, Math.max(o, r));
+}
+function Be(r) {
+  return Math.floor(59 / r) * r;
+}
+function Ft(r, o) {
+  const u = Math.round(H(r, 0, 59) / o) * o;
+  return H(u, 0, Be(o));
+}
+function Ot(r, o, u) {
+  const b = Be(o);
+  if (u === 1) {
+    const w = Math.floor(r / o) * o + o;
+    return w > b ? 0 : w;
+  }
+  const k = Math.ceil(r / o) * o - o;
+  return k < 0 ? b : k;
+}
+function Rt(r) {
+  const o = (u) => Number.isFinite(u) ? Math.trunc(u) : 0;
+  return {
+    hours: H(o(r.hours), 0, 23),
+    minutes: H(o(r.minutes), 0, 59)
+  };
+}
+function ke(r) {
+  return r === 0 ? 12 : r > 12 ? r - 12 : r;
+}
+function Ee(r, o) {
+  return o ? r === 12 ? 12 : r + 12 : r === 12 ? 0 : r;
+}
+const J = (r) => String(r).padStart(2, "0");
+function Lt(r) {
+  r.stopPropagation();
+}
+const Kt = C(
+  [
+    "ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]",
+    "ds:rounded-[var(--radius-sm)] ds:border ds:border-[color:var(--control-border)] ds:bg-background",
+    "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+    "ds:focus-within:outline-[length:var(--focus-ring-width)] ds:focus-within:outline-solid",
+    "ds:focus-within:outline-ring ds:focus-within:outline-offset-[length:var(--focus-ring-offset)]",
+    "ds:forced-colors:focus-within:outline-[CanvasText]"
+  ].join(" "),
+  {
+    variants: {
+      size: {
+        sm: "ds:h-8 ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:text-[length:var(--font-size-sm)]",
+        md: "ds:h-[var(--min-target-size)] ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:text-[length:var(--font-size-base)]",
+        lg: "ds:h-12 ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:text-[length:var(--font-size-lg)]"
+      },
+      tone: {
+        default: "ds:border-[color:var(--control-border)]",
+        error: "ds:border-destructive"
+      },
+      isDisabled: {
+        true: "ds:cursor-not-allowed ds:opacity-50",
+        false: ""
+      },
+      /** `dropdown` on and enabled: a click anywhere on the field opens the list. */
+      opensOnClick: {
+        true: "ds:cursor-pointer",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      size: "md",
+      tone: "default",
+      isDisabled: !1,
+      opensOnClick: !1
+    }
+  }
+), Ne = C(
+  [
+    "ds:inline-flex ds:items-center ds:justify-center",
+    "ds:rounded-[var(--radius-sm)] ds:text-center ds:tabular-nums",
+    "ds:bg-transparent ds:text-foreground",
+    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+    "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+    "ds:select-none"
+  ].join(" "),
+  {
+    variants: {
+      size: {
+        sm: "ds:min-w-6 ds:h-6 ds:text-[length:var(--font-size-sm)]",
+        md: "ds:min-w-8 ds:h-8 ds:text-[length:var(--font-size-base)]",
+        lg: "ds:min-w-10 ds:h-10 ds:text-[length:var(--font-size-lg)]"
+      }
+    },
+    defaultVariants: { size: "md" }
+  }
+), St = C(
+  [
+    "ds:inline-flex ds:items-center ds:justify-center",
+    "ds:rounded-[var(--radius-sm)] ds:text-center",
+    "ds:bg-transparent ds:text-foreground ds:cursor-pointer",
+    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+    "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+    "ds:select-none",
+    "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+    "ds:hover:bg-muted"
+  ].join(" "),
+  {
+    variants: {
+      size: {
+        sm: "ds:min-w-8 ds:h-6 ds:text-[length:var(--font-size-sm)] ds:ps-1 ds:pe-1",
+        md: "ds:min-w-10 ds:h-8 ds:text-[length:var(--font-size-base)] ds:ps-1.5 ds:pe-1.5",
+        lg: "ds:min-w-12 ds:h-10 ds:text-[length:var(--font-size-lg)] ds:ps-2 ds:pe-2"
+      }
+    },
+    defaultVariants: { size: "md" }
+  }
+), Vt = C("ds:text-muted-foreground ds:select-none", {
+  variants: {
+    size: {
+      sm: "ds:text-[length:var(--font-size-sm)]",
+      md: "ds:text-[length:var(--font-size-base)]",
+      lg: "ds:text-[length:var(--font-size-lg)]"
+    }
+  },
+  defaultVariants: { size: "md" }
+}), jt = C(
+  [
+    "ds:relative ds:inline-flex ds:shrink-0 ds:self-stretch ds:items-center ds:justify-center",
+    "ds:before:absolute ds:before:inset-x-0 ds:before:-inset-y-px",
+    "ds:rounded-e-[var(--radius-sm)] ds:bg-transparent ds:text-muted-foreground ds:cursor-pointer",
+    "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+    "ds:hover:bg-muted ds:hover:text-foreground",
+    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-ring",
+    "ds:focus-visible:[outline-offset:calc(var(--focus-ring-width)*-1)]",
+    "ds:forced-colors:focus-visible:outline-[CanvasText]",
+    "ds:disabled:cursor-not-allowed ds:disabled:hover:bg-transparent"
+  ].join(" "),
+  {
+    variants: {
+      size: {
+        sm: "ds:min-w-8 ds:-me-[var(--spacing-sm)] ds:[&_svg]:size-4",
+        md: "ds:min-w-[var(--min-target-size)] ds:-me-[var(--spacing-md)] ds:[&_svg]:size-4",
+        lg: "ds:min-w-12 ds:-me-[var(--spacing-md)] ds:[&_svg]:size-5"
+      }
+    },
+    defaultVariants: { size: "md" }
+  }
+), Et = C(
+  [
+    "ds:z-[var(--z-popover)] ds:flex ds:rounded-[var(--radius-md)]",
+    "ds:border ds:border-border ds:bg-background ds:text-foreground ds:shadow-[var(--shadow-lg)]",
+    "ds:p-[var(--spacing-xs)]"
+  ].join(" "),
+  {
+    variants: {
+      size: {
+        sm: "ds:[--time-picker-option-size:var(--spacing-xl)] ds:text-[length:var(--font-size-sm)]",
+        md: "ds:[--time-picker-option-size:var(--min-target-size)] ds:text-[length:var(--font-size-base)]",
+        lg: "ds:[--time-picker-option-size:var(--spacing-2xl)] ds:text-[length:var(--font-size-lg)]"
+      }
+    },
+    defaultVariants: { size: "md" }
+  }
+), Nt = C(
+  [
+    "ds:relative ds:flex ds:flex-col ds:gap-[var(--spacing-2xs)]",
+    "ds:max-h-[calc(var(--time-picker-option-size)*6.5)] ds:overflow-y-auto ds:overscroll-contain",
+    "ds:p-[var(--spacing-2xs)]"
+  ].join(" "),
+  {
+    variants: {
+      separated: {
+        true: "ds:border-s ds:border-border",
+        false: ""
+      }
+    },
+    defaultVariants: { separated: !1 }
+  }
+), Bt = C(
+  [
+    "ds:flex ds:shrink-0 ds:items-center ds:justify-center",
+    "ds:h-[var(--time-picker-option-size)] ds:min-w-[var(--time-picker-option-size)]",
+    "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)]",
+    "ds:rounded-[var(--radius-sm)] ds:tabular-nums ds:whitespace-nowrap",
+    "ds:cursor-pointer ds:select-none",
+    "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+    // Inset ring: the column scrolls, so an outset ring would be clipped.
+    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+    "ds:focus-visible:[outline-offset:calc(var(--focus-ring-width)*-1)]"
+  ].join(" "),
+  {
+    variants: {
+      // The kit's selected treatment (the calendar's selected day): solid
+      // primary. Paired with aria-selected, so not colour alone.
+      selected: {
+        true: [
+          "ds:bg-primary ds:text-primary-foreground ds:font-semibold ds:hover:bg-primary-hover",
+          "ds:focus-visible:outline-primary-foreground",
+          "ds:forced-colors:bg-[Highlight] ds:forced-colors:text-[HighlightText]",
+          // CanvasText can sit close to Highlight in some contrast themes.
+          "ds:forced-colors:focus-visible:outline-[HighlightText]"
+        ].join(" "),
+        false: [
+          "ds:text-foreground ds:hover:bg-muted ds:focus-visible:outline-ring",
+          "ds:forced-colors:focus-visible:outline-[CanvasText]"
+        ].join(" ")
+      }
+    },
+    defaultVariants: { selected: !1 }
+  }
+);
+function Ut({
+  columns: r,
+  columnRefs: o,
+  onPick: u,
+  onOptionKeyDown: b
+}) {
+  const k = r.map((h) => h.selectedIndex).join(":"), w = d(!1);
+  return Pt(() => {
+    const h = !w.current;
+    w.current = !0;
+    for (const l of Object.values(o.current)) {
+      if (!l) continue;
+      const i = l.querySelector('[aria-selected="true"]') ?? l.querySelector('[role="option"][tabindex="0"]');
+      if (!i) continue;
+      const D = i.offsetTop, I = D + i.offsetHeight, V = D >= l.scrollTop && I <= l.scrollTop + l.clientHeight;
+      (h || !V) && (l.scrollTop = D - (l.clientHeight - i.offsetHeight) / 2);
+    }
+  }, [k, o]), /* @__PURE__ */ g(bt, { children: r.map((h, l) => /* @__PURE__ */ g(
+    "div",
+    {
+      ref: (i) => {
+        o.current[h.key] = i;
+      },
+      role: "listbox",
+      "aria-label": h.label,
+      "data-column": h.key,
+      className: Nt({ separated: l > 0 }),
+      children: h.options.map((i, D) => {
+        const I = D === h.selectedIndex;
+        return /* @__PURE__ */ g(
+          "div",
+          {
+            role: "option",
+            "aria-selected": I,
+            tabIndex: D === h.anchorIndex ? 0 : -1,
+            "data-value": i.value,
+            className: Bt({ selected: I }),
+            onClick: () => u(h.key, i.value),
+            onKeyDown: (V) => b(V, l, D),
+            children: i.label
+          },
+          i.value
+        );
+      })
+    },
+    h.key
+  )) });
+}
+const _t = yt(
+  ({
+    value: r,
+    defaultValue: o,
+    onChange: u,
+    hour12: b,
+    minuteStep: k = 1,
+    fullWidthSeparator: w = !1,
+    periodLabels: h,
+    size: l = "md",
+    dropdown: i = !1,
+    disabled: D,
+    className: I,
+    id: V,
+    "aria-label": we,
+    "aria-labelledby": Ue
+  }, _e) => {
+    const { t: j, i18n: xe } = xt("ui"), A = Dt(), qe = kt(Tt) !== null, F = Mt(A, V), c = !!(A.disabled || D), $e = A.invalid ? "error" : "default", m = b !== void 0 ? b : Ht(xe.language), Ge = It(xe.language), O = h ?? Ge, ie = r !== void 0, [We, Je] = oe(
+      r ?? o ?? { hours: 0, minutes: 0 }
+    ), p = ie ? r : We, T = d(p);
+    T.current = p;
+    const y = G(
+      (e) => {
+        T.current = e, ie || Je(e), u == null || u(e);
+      },
+      [ie, u]
+    ), E = d(null), R = d(null), L = d(null), Q = d(null), X = d(""), Y = d(""), M = d(null), P = d(null), Z = () => {
+      X.current = "", M.current && (clearTimeout(M.current), M.current = null);
+    }, ee = () => {
+      Y.current = "", P.current && (clearTimeout(P.current), P.current = null);
+    }, De = (e) => {
+      const t = T.current, n = H(
+        parseInt(e, 10),
+        m ? 1 : 0,
+        m ? 12 : 23
+      );
+      y({
+        ...t,
+        hours: m ? Ee(n, t.hours >= 12) : n
+      });
+    }, Te = (e) => {
+      y({
+        ...T.current,
+        minutes: Ft(parseInt(e, 10), k)
+      });
+    }, te = () => {
+      const e = X.current;
+      Z(), e && De(e);
+    }, re = () => {
+      const e = Y.current;
+      ee(), e && Te(e);
+    }, ae = d({
+      hour: te,
+      minute: re
+    });
+    ae.current = { hour: te, minute: re }, be(() => () => {
+      M.current && clearTimeout(M.current), P.current && clearTimeout(P.current);
+    }, []);
+    const Qe = w ? "：" : ":", Me = J(m ? ke(p.hours) : p.hours), Pe = J(p.minutes), N = p.hours >= 12, [z, Xe] = oe(!1), Ye = i && z, ce = d(z);
+    ce.current = z;
+    const x = G((e) => {
+      ce.current = e, Xe(e);
+    }, []), [Ce, Ze] = oe("ltr"), ne = d("pointer"), ue = d("hour"), B = d(null), U = d(!1), _ = d(null), le = d(null), de = d(
+      {}
+    ), fe = G((e) => {
+      var t, n;
+      (n = (t = de.current[e]) == null ? void 0 : t.querySelector('[role="option"][tabindex="0"]')) == null || n.focus({ preventScroll: !0 });
+    }, []), se = G(
+      (e) => {
+        if (e) {
+          if (c) return;
+          const t = E.current;
+          Ze(
+            t && window.getComputedStyle(t).direction === "rtl" ? "rtl" : "ltr"
+          ), U.current = !1;
+        }
+        x(e);
+      },
+      [c, x]
+    ), Ae = (e, t, n) => {
+      if (!(!i || c)) {
+        if (ne.current = e, ue.current = t, B.current = n, z) {
+          e === "keyboard" && fe(t);
+          return;
+        }
+        se(!0);
+      }
+    };
+    be(() => {
+      z && (!i || c) && x(!1);
+    }, [z, i, c, x]);
+    const me = (e, t) => !i || !e.altKey ? !1 : e.key === "ArrowUp" && z ? (e.preventDefault(), x(!1), !0) : e.key !== "ArrowDown" ? !1 : (e.preventDefault(), te(), re(), Ae("keyboard", t, e.currentTarget), !0), et = (e) => {
+      var t, n;
+      if (!c && !me(e, "hour")) {
+        if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+          e.preventDefault(), Z();
+          const s = T.current, a = e.key === "ArrowUp" ? 1 : -1, v = 23;
+          let f = s.hours + a;
+          f < 0 && (f = v), f > v && (f = 0), y({ ...s, hours: f });
+          return;
+        }
+        if (e.key === "Tab" && !e.shiftKey) {
+          e.preventDefault(), (t = L.current) == null || t.focus();
+          return;
+        }
+        if (e.key.length === 1 && e.key >= "0" && e.key <= "9") {
+          e.preventDefault(), M.current && clearTimeout(M.current);
+          const s = X.current + e.key;
+          s.length >= 2 || parseInt(s, 10) > (m ? 1 : 2) ? (Z(), De(s), (n = L.current) == null || n.focus()) : (X.current = s, M.current = setTimeout(
+            () => ae.current.hour(),
+            1e3
+          ));
+        }
+      }
+    }, tt = (e) => {
+      var t, n, s;
+      if (!c && !me(e, "minute")) {
+        if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+          e.preventDefault(), ee();
+          const a = T.current;
+          y({
+            ...a,
+            minutes: Ot(
+              a.minutes,
+              k,
+              e.key === "ArrowUp" ? 1 : -1
+            )
+          });
+          return;
+        }
+        if (e.key === "Tab" && !e.shiftKey && m) {
+          e.preventDefault(), (t = Q.current) == null || t.focus();
+          return;
+        }
+        if (e.key === "Tab" && e.shiftKey) {
+          e.preventDefault(), (n = R.current) == null || n.focus();
+          return;
+        }
+        if (e.key.length === 1 && e.key >= "0" && e.key <= "9") {
+          e.preventDefault(), P.current && clearTimeout(P.current);
+          const a = Y.current + e.key;
+          a.length >= 2 || parseInt(a, 10) > 5 ? (ee(), Te(a), m && ((s = Q.current) == null || s.focus())) : (Y.current = a, P.current = setTimeout(
+            () => ae.current.minute(),
+            1e3
+          ));
+        }
+      }
+    }, rt = (e) => {
+      var s;
+      if (c || me(e, "period")) return;
+      const t = T.current, n = t.hours >= 12;
+      if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+        e.preventDefault();
+        const a = n ? t.hours - 12 : t.hours + 12;
+        y({ ...t, hours: H(a, 0, 23) });
+        return;
+      }
+      if (e.key === "Tab" && e.shiftKey) {
+        e.preventDefault(), (s = L.current) == null || s.focus();
+        return;
+      }
+      (e.key === "a" || e.key === "A") && (e.preventDefault(), n && y({ ...t, hours: t.hours - 12 })), (e.key === "p" || e.key === "P") && (e.preventDefault(), n || y({ ...t, hours: t.hours + 12 }));
+    }, nt = () => {
+      te();
+    }, st = () => {
+      re();
+    }, ze = j("inputs.timePicker.hour", "Hour"), He = j("inputs.timePicker.minute", "Minute"), Ie = j("inputs.timePicker.period", "Period"), ot = j("inputs.timePicker.groupLabel", "Time"), it = j(
+      "inputs.timePicker.openDropdown",
+      "Choose time"
+    ), pe = `${A.id}-label`, he = qe && !!A.label, [at, Fe] = oe(!0), ve = Ue ?? (!we && he && at ? pe : void 0), Oe = ve ? void 0 : we ?? ot;
+    be(() => {
+      var v;
+      if (!he) return;
+      const e = (v = E.current) == null ? void 0 : v.getRootNode(), t = e instanceof Document || e instanceof ShadowRoot ? e.getElementById(pe) : null;
+      if (!(t instanceof HTMLLabelElement)) {
+        Fe(!1);
+        return;
+      }
+      const n = () => Fe(t.htmlFor === F);
+      n();
+      const s = new MutationObserver(n);
+      s.observe(t, { attributes: !0, attributeFilter: ["for"] });
+      const a = () => {
+        var f;
+        t.htmlFor !== F || c || (f = R.current) == null || f.focus();
+      };
+      return t.addEventListener("click", a), () => {
+        s.disconnect(), t.removeEventListener("click", a);
+      };
+    }, [he, pe, F, c]);
+    const Re = ye(
+      () => Array.from(
+        { length: m ? 12 : 24 },
+        (e, t) => m ? t + 1 : t
+      ).map((e) => ({ value: e, label: J(e) })),
+      [m]
+    ), ge = ye(() => {
+      const e = [];
+      for (let t = 0; t <= 59; t += k)
+        e.push({ value: t, label: J(t) });
+      return e;
+    }, [k]), K = [];
+    if (i) {
+      const e = Re.findIndex(
+        (n) => n.value === (m ? ke(p.hours) : p.hours)
+      );
+      K.push({
+        key: "hour",
+        label: ze,
+        options: Re,
+        selectedIndex: e,
+        anchorIndex: Math.max(e, 0)
+      });
+      const t = ge.findIndex(
+        (n) => n.value === p.minutes
+      );
+      K.push({
+        key: "minute",
+        label: He,
+        options: ge,
+        selectedIndex: t,
+        anchorIndex: t >= 0 ? t : H(
+          Math.floor(p.minutes / k),
+          0,
+          ge.length - 1
+        )
+      }), m && K.push({
+        key: "period",
+        label: Ie,
+        options: [
+          { value: 0, label: O.am },
+          { value: 1, label: O.pm }
+        ],
+        selectedIndex: N ? 1 : 0,
+        anchorIndex: N ? 1 : 0
+      });
+    }
+    const Le = (e, t) => {
+      var s;
+      Z(), ee();
+      const n = T.current;
+      if (e === "hour") {
+        const a = m ? Ee(t, n.hours >= 12) : t;
+        a !== n.hours && y({ ...n, hours: a });
+        return;
+      }
+      if (e === "period") {
+        const a = t === 1;
+        a !== n.hours >= 12 && y({ ...n, hours: a ? n.hours + 12 : n.hours - 12 });
+        return;
+      }
+      t !== n.minutes && y({ ...n, minutes: t }), (s = L.current) == null || s.focus(), x(!1);
+    }, ct = (e, t, n) => {
+      var f, q, Se;
+      const s = K[t];
+      if (!s) return;
+      const a = s.options.length - 1, v = (S) => {
+        var $, Ve;
+        (Ve = ($ = de.current[s.key]) == null ? void 0 : $.querySelectorAll('[role="option"]')[S]) == null || Ve.focus();
+      };
+      if (e.altKey && e.key === "ArrowUp") {
+        e.preventDefault(), (f = B.current) == null || f.focus(), x(!1);
+        return;
+      }
+      switch (e.key) {
+        case "ArrowDown":
+          e.preventDefault(), v(Math.min(n + 1, a));
+          break;
+        case "ArrowUp":
+          e.preventDefault(), v(Math.max(n - 1, 0));
+          break;
+        case "Home":
+          e.preventDefault(), v(0);
+          break;
+        case "End":
+          e.preventDefault(), v(a);
+          break;
+        case "ArrowLeft":
+        case "ArrowRight": {
+          e.preventDefault();
+          const S = e.key === "ArrowRight" == (Ce === "ltr"), $ = K[t + (S ? 1 : -1)];
+          $ && fe($.key);
+          break;
+        }
+        case "Enter":
+        case " ": {
+          e.preventDefault();
+          const S = s.options[n];
+          S && Le(s.key, S.value);
+          break;
+        }
+        case "Tab":
+          U.current = !0, e.shiftKey ? (q = R.current) == null || q.focus() : (Se = le.current) == null || Se.focus(), x(!1);
+          break;
+      }
+    }, ut = (e) => {
+      var a, v;
+      if (!i || c) return;
+      const t = e.target;
+      if (!(t instanceof Node) || (a = le.current) != null && a.contains(t)) return;
+      const n = [R.current, L.current, Q.current];
+      let s = n.find((f) => f == null ? void 0 : f.contains(t)) ?? null;
+      if (!s) {
+        const f = (v = t.ownerDocument) == null ? void 0 : v.activeElement;
+        s = n.find((q) => q && q === f) ?? R.current, s && s !== f && s.focus();
+      }
+      Ae("pointer", "hour", s);
+    }, lt = (e) => {
+      ne.current = e.detail === 0 ? "keyboard" : "pointer", ue.current = "hour", B.current = e.currentTarget;
+    }, dt = (e) => {
+      e.preventDefault(), ne.current === "keyboard" && fe(ue.current);
+    }, ft = (e) => {
+      var s;
+      e.preventDefault();
+      const t = U.current;
+      if (U.current = !1, t) return;
+      const n = document.activeElement;
+      (!n || n === document.body) && ((s = B.current) == null || s.focus());
+    }, mt = (e) => {
+      var n;
+      const t = e.target;
+      if (t instanceof Node && ((n = E.current) != null && n.contains(t))) {
+        e.preventDefault();
+        return;
+      }
+      U.current = !0;
+    }, pt = () => {
+      var e, t;
+      (e = _.current) != null && e.contains(document.activeElement) && ((t = B.current) == null || t.focus());
+    }, ht = G((e) => {
+      var n, s;
+      const t = Lt;
+      (n = _.current) == null || n.removeEventListener("wheel", t), (s = _.current) == null || s.removeEventListener("touchmove", t), _.current = e, e == null || e.addEventListener("wheel", t, { passive: !0 }), e == null || e.addEventListener("touchmove", t, { passive: !0 });
+    }, []), vt = (e) => {
+      var t;
+      (t = _.current) != null && t.contains(document.activeElement) || e.preventDefault();
+    }, gt = ye(
+      () => ({
+        getValue: () => p,
+        setValue: (e) => y(Rt(e)),
+        clear: () => y({ hours: 0, minutes: 0 }),
+        isOpen: () => i && ce.current,
+        open: () => {
+          !i || c || (ne.current = "pointer", se(!0));
+        },
+        close: () => {
+          i && x(!1);
+        }
+      }),
+      [
+        p,
+        y,
+        i,
+        c,
+        se,
+        x
+      ]
+    );
+    wt(_e, () => E.current, []), Ct(zt, gt, F);
+    const Ke = (
+      // eslint-disable-next-line jsx-a11y/role-supports-aria-props, jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions -- aria-invalid is a global ARIA state conveying group-level validation; the click is a pointer shortcut to the list, which the keyboard opens with Alt+ArrowDown or the clock button
+      /* @__PURE__ */ je(
+        "div",
+        {
+          ref: E,
+          id: F,
+          role: "group",
+          "aria-label": Oe,
+          "aria-labelledby": ve,
+          "aria-describedby": A.describedBy || void 0,
+          "aria-invalid": A.invalid || void 0,
+          "aria-disabled": c || void 0,
+          "data-component": "time-picker",
+          "data-component-id": F,
+          className: Kt({
+            size: l,
+            tone: $e,
+            isDisabled: c,
+            opensOnClick: i && !c,
+            className: I
+          }),
+          onClick: i ? ut : void 0,
+          children: [
+            /* @__PURE__ */ g(
+              "span",
+              {
+                ref: R,
+                role: "spinbutton",
+                "aria-disabled": c || void 0,
+                "aria-label": ze,
+                "aria-valuemin": m ? 1 : 0,
+                "aria-valuemax": m ? 12 : 23,
+                "aria-valuenow": m ? ke(p.hours) : p.hours,
+                "aria-valuetext": Me,
+                "aria-keyshortcuts": i ? "Alt+ArrowDown" : void 0,
+                tabIndex: c ? -1 : 0,
+                inputMode: "numeric",
+                onKeyDown: et,
+                onBlur: nt,
+                className: Ne({ size: l }),
+                children: Me
+              }
+            ),
+            /* @__PURE__ */ g("span", { "aria-hidden": "true", className: Vt({ size: l }), children: Qe }),
+            /* @__PURE__ */ g(
+              "span",
+              {
+                ref: L,
+                role: "spinbutton",
+                "aria-disabled": c || void 0,
+                "aria-label": He,
+                "aria-valuemin": 0,
+                "aria-valuemax": 59,
+                "aria-valuenow": p.minutes,
+                "aria-valuetext": Pe,
+                "aria-keyshortcuts": i ? "Alt+ArrowDown" : void 0,
+                tabIndex: c ? -1 : 0,
+                inputMode: "numeric",
+                onKeyDown: tt,
+                onBlur: st,
+                className: Ne({ size: l }),
+                children: Pe
+              }
+            ),
+            m ? /* @__PURE__ */ g(
+              "span",
+              {
+                ref: Q,
+                role: "spinbutton",
+                "aria-disabled": c || void 0,
+                "aria-label": Ie,
+                "aria-valuemin": 0,
+                "aria-valuemax": 1,
+                "aria-valuenow": N ? 1 : 0,
+                "aria-valuetext": N ? O.pm : O.am,
+                "aria-keyshortcuts": i ? "Alt+ArrowDown" : void 0,
+                tabIndex: c ? -1 : 0,
+                onKeyDown: rt,
+                className: St({ size: l }),
+                children: N ? O.pm : O.am
+              }
+            ) : null,
+            i ? /* @__PURE__ */ g(W.Trigger, { asChild: !0, children: /* @__PURE__ */ g(
+              "button",
+              {
+                ref: le,
+                type: "button",
+                "aria-label": it,
+                disabled: c,
+                onClick: lt,
+                className: jt({ size: l }),
+                children: /* @__PURE__ */ g(At, { "aria-hidden": "true" })
+              }
+            ) }) : null
+          ]
+        }
+      )
+    );
+    return i ? /* @__PURE__ */ je(W.Root, { open: Ye, onOpenChange: se, children: [
+      /* @__PURE__ */ g(W.Anchor, { asChild: !0, children: Ke }),
+      /* @__PURE__ */ g(W.Portal, { children: /* @__PURE__ */ g(
+        W.Content,
+        {
+          ref: ht,
+          side: "bottom",
+          align: "start",
+          sideOffset: 4,
+          dir: Ce,
+          "data-component": "time-picker-dropdown",
+          "aria-label": Oe,
+          "aria-labelledby": ve,
+          className: Et({ size: l }),
+          onOpenAutoFocus: dt,
+          onCloseAutoFocus: ft,
+          onInteractOutside: mt,
+          onEscapeKeyDown: pt,
+          onMouseDown: vt,
+          children: /* @__PURE__ */ g(
+            Ut,
+            {
+              columns: K,
+              columnRefs: de,
+              onPick: Le,
+              onOptionKeyDown: ct
+            }
+          )
+        }
+      ) })
+    ] }) : Ke;
+  }
+);
+_t.displayName = "TimePicker";
+export {
+  _t as T,
+  zt as t
+};
+//# sourceMappingURL=time-picker-DVfyAR81.js.map