@alfadocs/ui-kit-debug 1.93.1 → 1.95.0

package/dist/_chunks/time-picker-DSt-ns5F.js

@@ -0,0 +1,914 @@
+import { jsxs as $e, jsx as v, Fragment as Lt } from "react/jsx-runtime";
+import { forwardRef as Ht, useContext as Ft, useState as le, useMemo as ce, useRef as d, useCallback as U, useEffect as Ce, useImperativeHandle as It } from "react";
+import { c as L } from "./index-D2ZczOXr.js";
+import { useTranslation as Ot } from "react-i18next";
+import * as Z from "@radix-ui/react-popover";
+import { u as Rt, F as St, a as Kt } from "./form-field-context-DtiROUJV.js";
+import { u as Je } from "./use-isomorphic-layout-effect-BGfaCOP1.js";
+import { u as Nt } from "./registry-DvAUVLHh.js";
+import { X as Et } from "./x-B5YnXwCz.js";
+import { C as jt } from "./clock-Drd4Wtis.js";
+const Vt = {
+  id: "time-picker",
+  capabilities: ["select_single", "set_value", "open", "close"],
+  state: {
+    value: {
+      type: "HH:MM | null",
+      descriptionKey: "ui.agent.timePicker.state.value",
+      description: "Currently selected time as 24h HH:MM. Null when unset with allowEmpty; otherwise defaults to 00:00.",
+      read: (r) => {
+        const o = r.getValue();
+        if (!o) return null;
+        const l = String(o.hours).padStart(2, "0"), f = String(o.minutes).padStart(2, "0");
+        return `${l}:${f}`;
+      }
+    },
+    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 [l, f] = o.time.split(":");
+        r.setValue({
+          hours: Number.parseInt(l ?? "0", 10),
+          minutes: Number.parseInt(f ?? "0", 10)
+        });
+      }
+    },
+    clear: {
+      safety: "destructive",
+      idempotent: !0,
+      descriptionKey: "ui.agent.timePicker.actions.clear",
+      description: "Clear to null with allowEmpty; otherwise reset 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 Bt(r) {
+  try {
+    const o = new Intl.DateTimeFormat(r, {
+      hour: "numeric"
+    }).resolvedOptions();
+    return o.hourCycle === "h12" || o.hourCycle === "h11";
+  } catch {
+    return !1;
+  }
+}
+function Ut(r) {
+  var o, l;
+  try {
+    const f = ((o = new Intl.DateTimeFormat(r, {
+      hour: "numeric",
+      hour12: !0
+    }).formatToParts(new Date(2e3, 0, 1, 9)).find((b) => b.type === "dayPeriod")) == null ? void 0 : o.value) ?? "AM", C = ((l = new Intl.DateTimeFormat(r, {
+      hour: "numeric",
+      hour12: !0
+    }).formatToParts(new Date(2e3, 0, 1, 15)).find((b) => b.type === "dayPeriod")) == null ? void 0 : l.value) ?? "PM";
+    return { am: f, pm: C };
+  } catch {
+    return { am: "AM", pm: "PM" };
+  }
+}
+function O(r, o, l) {
+  return Math.min(l, Math.max(o, r));
+}
+function Qe(r) {
+  return Math.floor(59 / r) * r;
+}
+function _t(r, o) {
+  const l = Math.round(O(r, 0, 59) / o) * o;
+  return O(l, 0, Qe(o));
+}
+function qt(r, o, l) {
+  const f = Qe(o);
+  if (l === 1) {
+    const b = Math.floor(r / o) * o + o;
+    return b > f ? 0 : b;
+  }
+  const C = Math.ceil(r / o) * o - o;
+  return C < 0 ? f : C;
+}
+function $t(r) {
+  const o = (l) => Number.isFinite(l) ? Math.trunc(l) : 0;
+  return {
+    hours: O(o(r.hours), 0, 23),
+    minutes: O(o(r.minutes), 0, 59)
+  };
+}
+function ze(r) {
+  return r === 0 ? 12 : r > 12 ? r - 12 : r;
+}
+function We(r, o) {
+  return o ? r === 12 ? 12 : r + 12 : r === 12 ? 0 : r;
+}
+const ee = (r) => String(r).padStart(2, "0");
+function Wt(r) {
+  r.stopPropagation();
+}
+const Gt = L(
+  [
+    "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
+    }
+  }
+), Ge = L(
+  [
+    "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" }
+  }
+), Xt = L(
+  [
+    "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" }
+  }
+), Jt = L("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" }
+}), Xe = L(
+  [
+    "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: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: {
+      // Only the button that ends the field rounds its inline-end corner.
+      trailing: { true: "ds:rounded-e-[var(--radius-sm)]", false: "" },
+      size: {
+        sm: "ds:min-w-8 ds:[&_svg]:size-4",
+        md: "ds:min-w-[var(--min-target-size)] ds:[&_svg]:size-4",
+        lg: "ds:min-w-12 ds:[&_svg]:size-5"
+      }
+    },
+    defaultVariants: { size: "md", trailing: !0 },
+    compoundVariants: [
+      { size: "sm", trailing: !0, className: "ds:-me-[var(--spacing-sm)]" },
+      {
+        size: ["md", "lg"],
+        trailing: !0,
+        className: "ds:-me-[var(--spacing-md)]"
+      }
+    ]
+  }
+), Qt = L(
+  [
+    "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" }
+  }
+), Yt = L(
+  [
+    "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 }
+  }
+), Zt = L(
+  [
+    "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 er({
+  columns: r,
+  columnRefs: o,
+  onPick: l,
+  onOptionKeyDown: f
+}) {
+  const C = r.map((g) => g.selectedIndex).join(":"), b = d(!1);
+  return Je(() => {
+    const g = !b.current;
+    b.current = !0;
+    for (const m of Object.values(o.current)) {
+      if (!m) continue;
+      const k = m.querySelector('[aria-selected="true"]') ?? m.querySelector('[role="option"][tabindex="0"]');
+      if (!k) continue;
+      const z = k.offsetTop, x = z + k.offsetHeight, c = z >= m.scrollTop && x <= m.scrollTop + m.clientHeight;
+      (g || !c) && (m.scrollTop = z - (m.clientHeight - k.offsetHeight) / 2);
+    }
+  }, [C, o]), /* @__PURE__ */ v(Lt, { children: r.map((g, m) => /* @__PURE__ */ v(
+    "div",
+    {
+      ref: (k) => {
+        o.current[g.key] = k;
+      },
+      role: "listbox",
+      "aria-label": g.label,
+      "data-column": g.key,
+      className: Yt({ separated: m > 0 }),
+      children: g.options.map((k, z) => {
+        const x = z === g.selectedIndex;
+        return /* @__PURE__ */ v(
+          "div",
+          {
+            role: "option",
+            "aria-selected": x,
+            tabIndex: z === g.anchorIndex ? 0 : -1,
+            "data-value": k.value,
+            className: Zt({ selected: x }),
+            onClick: () => l(g.key, k.value),
+            onKeyDown: (c) => f(c, m, z),
+            children: k.label
+          },
+          k.value
+        );
+      })
+    },
+    g.key
+  )) });
+}
+const tr = Ht(
+  (r, o) => {
+    const {
+      value: l,
+      allowEmpty: f = !1,
+      defaultValue: C,
+      onChange: b,
+      hour12: g,
+      minuteStep: m = 1,
+      fullWidthSeparator: k = !1,
+      periodLabels: z,
+      size: x = "md",
+      dropdown: c = !1,
+      disabled: Ye,
+      className: Ze,
+      id: et,
+      "aria-label": de,
+      "aria-labelledby": tt
+    } = r, te = r.allowEmpty ? r.onChange : void 0, { t: M, i18n: Me } = Ot("ui"), A = Rt(), rt = Ft(St) !== null, R = Kt(A, et), u = !!(A.disabled || Ye), nt = A.invalid ? "error" : "default", h = g !== void 0 ? g : Bt(Me.language), st = Ut(Me.language), S = z ?? st, fe = l !== void 0, [ot, it] = le(
+      l !== void 0 ? l : C !== void 0 ? C : f ? null : { hours: 0, minutes: 0 }
+    ), pe = fe ? l : ot, i = ce(
+      () => f ? pe : pe ?? { hours: 0, minutes: 0 },
+      [f, pe]
+    ), K = () => H.current ?? { hours: 0, minutes: 0 }, H = d(i);
+    H.current = i;
+    const y = U(
+      (e) => {
+        H.current = e, fe || it(e), e === null ? te == null || te(null) : b == null || b(e);
+      },
+      [fe, b, te]
+    ), _ = d(null), F = d(null), N = d(null), re = d(null), q = d(""), $ = d(""), D = d(null), P = d(null), E = () => {
+      q.current = "", D.current && (clearTimeout(D.current), D.current = null);
+    }, j = () => {
+      $.current = "", P.current && (clearTimeout(P.current), P.current = null);
+    };
+    Je(() => {
+      (l === null || u) && (E(), j());
+    }, [l, u]);
+    const ne = U(() => {
+      q.current = "", $.current = "", D.current && clearTimeout(D.current), P.current && clearTimeout(P.current), D.current = null, P.current = null, y(f ? null : { hours: 0, minutes: 0 });
+    }, [f, y]), me = (e) => !f || e.key !== "Backspace" && e.key !== "Delete" ? !1 : (e.preventDefault(), ne(), !0), Ae = (e) => {
+      const t = K(), n = O(
+        parseInt(e, 10),
+        h ? 1 : 0,
+        h ? 12 : 23
+      );
+      y({
+        ...t,
+        hours: h ? We(n, t.hours >= 12) : n
+      });
+    }, Le = (e) => {
+      y({
+        ...K(),
+        minutes: _t(parseInt(e, 10), m)
+      });
+    }, se = () => {
+      const e = q.current;
+      E(), e && Ae(e);
+    }, oe = () => {
+      const e = $.current;
+      j(), e && Le(e);
+    }, he = d({
+      hour: se,
+      minute: oe
+    });
+    he.current = { hour: se, minute: oe }, Ce(() => () => {
+      D.current && clearTimeout(D.current), P.current && clearTimeout(P.current);
+    }, []);
+    const at = k ? "：" : ":", ve = M("inputs.timePicker.unset", "No time set"), He = i === null ? "--" : ee(h ? ze(i.hours) : i.hours), Fe = i === null ? "--" : ee(i.minutes), W = ((i == null ? void 0 : i.hours) ?? 0) >= 12, [I, ut] = le(!1), lt = c && I, ge = d(I);
+    ge.current = I;
+    const T = U((e) => {
+      ge.current = e, ut(e);
+    }, []), [Ie, ct] = le("ltr"), ie = d("pointer"), be = d("hour"), G = d(null), X = d(!1), J = d(null), ye = d(null), we = d(
+      {}
+    ), ke = U((e) => {
+      var t, n;
+      (n = (t = we.current[e]) == null ? void 0 : t.querySelector('[role="option"][tabindex="0"]')) == null || n.focus({ preventScroll: !0 });
+    }, []), ae = U(
+      (e) => {
+        if (e) {
+          if (u) return;
+          const t = _.current;
+          ct(
+            t && window.getComputedStyle(t).direction === "rtl" ? "rtl" : "ltr"
+          ), X.current = !1;
+        }
+        T(e);
+      },
+      [u, T]
+    ), Oe = (e, t, n) => {
+      if (!(!c || u)) {
+        if (ie.current = e, be.current = t, G.current = n, I) {
+          e === "keyboard" && ke(t);
+          return;
+        }
+        ae(!0);
+      }
+    };
+    Ce(() => {
+      I && (!c || u) && T(!1);
+    }, [I, c, u, T]);
+    const xe = (e, t) => !c || !e.altKey ? !1 : e.key === "ArrowUp" && I ? (e.preventDefault(), T(!1), !0) : e.key !== "ArrowDown" ? !1 : (e.preventDefault(), se(), oe(), Oe("keyboard", t, e.currentTarget), !0), dt = (e) => {
+      var t, n;
+      if (!u && !me(e) && !xe(e, "hour")) {
+        if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+          e.preventDefault(), E();
+          const s = K(), a = e.key === "ArrowUp" ? 1 : -1, w = 23;
+          let p = s.hours + a;
+          p < 0 && (p = w), p > w && (p = 0), y({ ...s, hours: p });
+          return;
+        }
+        if (e.key === "Tab" && !e.shiftKey) {
+          e.preventDefault(), (t = N.current) == null || t.focus();
+          return;
+        }
+        if (e.key.length === 1 && e.key >= "0" && e.key <= "9") {
+          e.preventDefault(), D.current && clearTimeout(D.current);
+          const s = q.current + e.key;
+          s.length >= 2 || parseInt(s, 10) > (h ? 1 : 2) ? (E(), Ae(s), (n = N.current) == null || n.focus()) : (q.current = s, D.current = setTimeout(
+            () => he.current.hour(),
+            1e3
+          ));
+        }
+      }
+    }, ft = (e) => {
+      var t, n, s;
+      if (!u && !me(e) && !xe(e, "minute")) {
+        if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+          e.preventDefault(), j();
+          const a = K();
+          y({
+            ...a,
+            minutes: qt(
+              a.minutes,
+              m,
+              e.key === "ArrowUp" ? 1 : -1
+            )
+          });
+          return;
+        }
+        if (e.key === "Tab" && !e.shiftKey && h) {
+          e.preventDefault(), (t = re.current) == null || t.focus();
+          return;
+        }
+        if (e.key === "Tab" && e.shiftKey) {
+          e.preventDefault(), (n = F.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 = $.current + e.key;
+          a.length >= 2 || parseInt(a, 10) > 5 ? (j(), Le(a), h && ((s = re.current) == null || s.focus())) : ($.current = a, P.current = setTimeout(
+            () => he.current.minute(),
+            1e3
+          ));
+        }
+      }
+    }, pt = (e) => {
+      var s;
+      if (u || me(e) || xe(e, "period")) return;
+      const t = K(), 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: O(a, 0, 23) });
+        return;
+      }
+      if (e.key === "Tab" && e.shiftKey) {
+        e.preventDefault(), (s = N.current) == null || s.focus();
+        return;
+      }
+      (e.key === "a" || e.key === "A") && (e.preventDefault(), (H.current === null || n) && y({ ...t, hours: n ? t.hours - 12 : t.hours })), (e.key === "p" || e.key === "P") && (e.preventDefault(), n || y({ ...t, hours: t.hours + 12 }));
+    }, mt = () => {
+      se();
+    }, ht = () => {
+      oe();
+    }, Re = M("inputs.timePicker.hour", "Hour"), Se = M("inputs.timePicker.minute", "Minute"), Ke = M("inputs.timePicker.period", "Period"), vt = M("inputs.timePicker.groupLabel", "Time"), gt = M(
+      "inputs.timePicker.openDropdown",
+      "Choose time"
+    ), De = `${A.id}-label`, ue = rt && !!A.label, [bt, Ne] = le(!0), Pe = tt ?? (!de && ue && bt ? De : void 0), Ee = Pe ? void 0 : de ?? vt, je = de ?? (ue ? A.label : void 0), yt = je ? M("inputs.timePicker.clearNamed", { label: je }) : M("inputs.text.clear");
+    Ce(() => {
+      var w;
+      if (!ue) return;
+      const e = (w = _.current) == null ? void 0 : w.getRootNode(), t = e instanceof Document || e instanceof ShadowRoot ? e.getElementById(De) : null;
+      if (!(t instanceof HTMLLabelElement)) {
+        Ne(!1);
+        return;
+      }
+      const n = () => Ne(t.htmlFor === R);
+      n();
+      const s = new MutationObserver(n);
+      s.observe(t, { attributes: !0, attributeFilter: ["for"] });
+      const a = () => {
+        var p;
+        t.htmlFor !== R || u || (p = F.current) == null || p.focus();
+      };
+      return t.addEventListener("click", a), () => {
+        s.disconnect(), t.removeEventListener("click", a);
+      };
+    }, [ue, De, R, u]);
+    const Ve = ce(
+      () => Array.from(
+        { length: h ? 12 : 24 },
+        (e, t) => h ? t + 1 : t
+      ).map((e) => ({ value: e, label: ee(e) })),
+      [h]
+    ), Te = ce(() => {
+      const e = [];
+      for (let t = 0; t <= 59; t += m)
+        e.push({ value: t, label: ee(t) });
+      return e;
+    }, [m]), V = [];
+    if (c) {
+      const e = Ve.findIndex(
+        (n) => n.value === (i === null ? void 0 : h ? ze(i.hours) : i.hours)
+      );
+      V.push({
+        key: "hour",
+        label: Re,
+        options: Ve,
+        selectedIndex: e,
+        anchorIndex: Math.max(e, 0)
+      });
+      const t = Te.findIndex(
+        (n) => n.value === (i == null ? void 0 : i.minutes)
+      );
+      V.push({
+        key: "minute",
+        label: Se,
+        options: Te,
+        selectedIndex: t,
+        anchorIndex: t >= 0 ? t : O(
+          Math.floor(((i == null ? void 0 : i.minutes) ?? 0) / m),
+          0,
+          Te.length - 1
+        )
+      }), h && V.push({
+        key: "period",
+        label: Ke,
+        options: [
+          { value: 0, label: S.am },
+          { value: 1, label: S.pm }
+        ],
+        selectedIndex: i === null ? -1 : W ? 1 : 0,
+        anchorIndex: W ? 1 : 0
+      });
+    }
+    const Be = (e, t) => {
+      var s;
+      E(), j();
+      const n = K();
+      if (e === "hour") {
+        const a = h ? We(t, n.hours >= 12) : t;
+        (H.current === null || a !== n.hours) && y({ ...n, hours: a });
+        return;
+      }
+      if (e === "period") {
+        const a = t === 1;
+        (H.current === null || a !== n.hours >= 12) && y({ ...n, hours: n.hours % 12 + (a ? 12 : 0) });
+        return;
+      }
+      (H.current === null || t !== n.minutes) && y({ ...n, minutes: t }), (s = N.current) == null || s.focus(), T(!1);
+    }, wt = (e, t, n) => {
+      var p, Q, _e;
+      const s = V[t];
+      if (!s) return;
+      const a = s.options.length - 1, w = (B) => {
+        var Y, qe;
+        (qe = (Y = we.current[s.key]) == null ? void 0 : Y.querySelectorAll('[role="option"]')[B]) == null || qe.focus();
+      };
+      if (e.altKey && e.key === "ArrowUp") {
+        e.preventDefault(), (p = G.current) == null || p.focus(), T(!1);
+        return;
+      }
+      switch (e.key) {
+        case "ArrowDown":
+          e.preventDefault(), w(Math.min(n + 1, a));
+          break;
+        case "ArrowUp":
+          e.preventDefault(), w(Math.max(n - 1, 0));
+          break;
+        case "Home":
+          e.preventDefault(), w(0);
+          break;
+        case "End":
+          e.preventDefault(), w(a);
+          break;
+        case "ArrowLeft":
+        case "ArrowRight": {
+          e.preventDefault();
+          const B = e.key === "ArrowRight" == (Ie === "ltr"), Y = V[t + (B ? 1 : -1)];
+          Y && ke(Y.key);
+          break;
+        }
+        case "Enter":
+        case " ": {
+          e.preventDefault();
+          const B = s.options[n];
+          B && Be(s.key, B.value);
+          break;
+        }
+        case "Tab":
+          X.current = !0, e.shiftKey ? (Q = F.current) == null || Q.focus() : (_e = ye.current) == null || _e.focus(), T(!1);
+          break;
+      }
+    }, kt = (e) => {
+      var a, w;
+      if (!c || u) return;
+      const t = e.target;
+      if (!(t instanceof Node) || (a = ye.current) != null && a.contains(t)) return;
+      const n = [F.current, N.current, re.current];
+      let s = n.find((p) => p == null ? void 0 : p.contains(t)) ?? null;
+      if (!s) {
+        const p = (w = t.ownerDocument) == null ? void 0 : w.activeElement;
+        s = n.find((Q) => Q && Q === p) ?? F.current, s && s !== p && s.focus();
+      }
+      Oe("pointer", "hour", s);
+    }, xt = (e) => {
+      ie.current = e.detail === 0 ? "keyboard" : "pointer", be.current = "hour", G.current = e.currentTarget;
+    }, Dt = (e) => {
+      e.preventDefault(), ie.current === "keyboard" && ke(be.current);
+    }, Pt = (e) => {
+      var s;
+      e.preventDefault();
+      const t = X.current;
+      if (X.current = !1, t) return;
+      const n = document.activeElement;
+      (!n || n === document.body) && ((s = G.current) == null || s.focus());
+    }, Tt = (e) => {
+      var n;
+      const t = e.target;
+      if (t instanceof Node && ((n = _.current) != null && n.contains(t))) {
+        e.preventDefault();
+        return;
+      }
+      X.current = !0;
+    }, Ct = () => {
+      var e, t;
+      (e = J.current) != null && e.contains(document.activeElement) && ((t = G.current) == null || t.focus());
+    }, zt = U((e) => {
+      var n, s;
+      const t = Wt;
+      (n = J.current) == null || n.removeEventListener("wheel", t), (s = J.current) == null || s.removeEventListener("touchmove", t), J.current = e, e == null || e.addEventListener("wheel", t, { passive: !0 }), e == null || e.addEventListener("touchmove", t, { passive: !0 });
+    }, []), Mt = (e) => {
+      var t;
+      (t = J.current) != null && t.contains(document.activeElement) || e.preventDefault();
+    }, At = ce(
+      () => ({
+        getValue: () => i,
+        setValue: (e) => y($t(e)),
+        clear: ne,
+        isOpen: () => c && ge.current,
+        open: () => {
+          !c || u || (ie.current = "pointer", ae(!0));
+        },
+        close: () => {
+          c && T(!1);
+        }
+      }),
+      [
+        i,
+        y,
+        ne,
+        c,
+        u,
+        ae,
+        T
+      ]
+    );
+    It(o, () => _.current, []), Nt(Vt, At, R);
+    const Ue = (
+      // 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__ */ $e(
+        "div",
+        {
+          ref: _,
+          id: R,
+          role: "group",
+          "aria-label": Ee,
+          "aria-labelledby": Pe,
+          "aria-describedby": A.describedBy || void 0,
+          "aria-invalid": A.invalid || void 0,
+          "aria-disabled": u || void 0,
+          "data-component": "time-picker",
+          "data-component-id": R,
+          className: Gt({
+            size: x,
+            tone: nt,
+            isDisabled: u,
+            opensOnClick: c && !u,
+            className: Ze
+          }),
+          onClick: c ? kt : void 0,
+          children: [
+            /* @__PURE__ */ v(
+              "span",
+              {
+                ref: F,
+                role: "spinbutton",
+                "aria-disabled": u || void 0,
+                "aria-label": Re,
+                "aria-valuemin": h ? 1 : 0,
+                "aria-valuemax": h ? 12 : 23,
+                "aria-valuenow": i === null ? void 0 : h ? ze(i.hours) : i.hours,
+                "aria-valuetext": i === null ? ve : He,
+                "aria-keyshortcuts": c ? "Alt+ArrowDown" : void 0,
+                tabIndex: u ? -1 : 0,
+                inputMode: "numeric",
+                onKeyDown: dt,
+                onBlur: mt,
+                className: Ge({ size: x }),
+                children: He
+              }
+            ),
+            /* @__PURE__ */ v("span", { "aria-hidden": "true", className: Jt({ size: x }), children: at }),
+            /* @__PURE__ */ v(
+              "span",
+              {
+                ref: N,
+                role: "spinbutton",
+                "aria-disabled": u || void 0,
+                "aria-label": Se,
+                "aria-valuemin": 0,
+                "aria-valuemax": 59,
+                "aria-valuenow": i == null ? void 0 : i.minutes,
+                "aria-valuetext": i === null ? ve : Fe,
+                "aria-keyshortcuts": c ? "Alt+ArrowDown" : void 0,
+                tabIndex: u ? -1 : 0,
+                inputMode: "numeric",
+                onKeyDown: ft,
+                onBlur: ht,
+                className: Ge({ size: x }),
+                children: Fe
+              }
+            ),
+            h ? /* @__PURE__ */ v(
+              "span",
+              {
+                ref: re,
+                role: "spinbutton",
+                "aria-disabled": u || void 0,
+                "aria-label": Ke,
+                "aria-valuemin": 0,
+                "aria-valuemax": 1,
+                "aria-valuenow": i === null ? void 0 : W ? 1 : 0,
+                "aria-valuetext": i === null ? ve : W ? S.pm : S.am,
+                "aria-keyshortcuts": c ? "Alt+ArrowDown" : void 0,
+                tabIndex: u ? -1 : 0,
+                onKeyDown: pt,
+                className: Xt({ size: x }),
+                children: i === null ? "--" : W ? S.pm : S.am
+              }
+            ) : null,
+            f ? /* @__PURE__ */ v(
+              "button",
+              {
+                type: "button",
+                "aria-label": yt,
+                disabled: u || i === null,
+                onPointerDown: (e) => {
+                  e.preventDefault(), E(), j();
+                },
+                onClick: (e) => {
+                  var t;
+                  e.stopPropagation(), ne(), (t = F.current) == null || t.focus();
+                },
+                className: Xe({
+                  size: x,
+                  trailing: !c,
+                  className: i === null ? "ds:invisible" : void 0
+                }),
+                children: /* @__PURE__ */ v(Et, { "aria-hidden": "true" })
+              }
+            ) : null,
+            c ? /* @__PURE__ */ v(Z.Trigger, { asChild: !0, children: /* @__PURE__ */ v(
+              "button",
+              {
+                ref: ye,
+                type: "button",
+                "aria-label": gt,
+                disabled: u,
+                onClick: xt,
+                className: Xe({ size: x }),
+                children: /* @__PURE__ */ v(jt, { "aria-hidden": "true" })
+              }
+            ) }) : null
+          ]
+        }
+      )
+    );
+    return c ? /* @__PURE__ */ $e(Z.Root, { open: lt, onOpenChange: ae, children: [
+      /* @__PURE__ */ v(Z.Anchor, { asChild: !0, children: Ue }),
+      /* @__PURE__ */ v(Z.Portal, { children: /* @__PURE__ */ v(
+        Z.Content,
+        {
+          ref: zt,
+          side: "bottom",
+          align: "start",
+          sideOffset: 4,
+          dir: Ie,
+          "data-component": "time-picker-dropdown",
+          "aria-label": Ee,
+          "aria-labelledby": Pe,
+          className: Qt({ size: x }),
+          onOpenAutoFocus: Dt,
+          onCloseAutoFocus: Pt,
+          onInteractOutside: Tt,
+          onEscapeKeyDown: Ct,
+          onMouseDown: Mt,
+          children: /* @__PURE__ */ v(
+            er,
+            {
+              columns: V,
+              columnRefs: we,
+              onPick: Be,
+              onOptionKeyDown: wt
+            }
+          )
+        }
+      ) })
+    ] }) : Ue;
+  }
+);
+tr.displayName = "TimePicker";
+export {
+  tr as T,
+  Vt as t
+};
+//# sourceMappingURL=time-picker-DSt-ns5F.js.map