import { jsxs as d, jsx as n, Fragment as se } from "react/jsx-runtime";
import { useState as V, useRef as y, useEffect as P } from "react";
import { IMaskInput as te, IMask as O } from "react-imask";
import { noop as ne } from "es-toolkit/compat";
import { isNil as oe } from "es-toolkit/predicate";
import I from "moment";
import re from "tiny-invariant";
import ae from "../selects/BaseSelectDropdown.js";
import ie from "../../hooks/useClickOutside.js";
import ce from "../../hooks/useMergeRefs.js";
import T from "../../utils/classNames.js";
const b = 15, le = /^(?:\d|[01]\d|2[0-3]):[0-5]\d$/, C = (e) => e >= 10 ? `${e}` : `0${e}`, p = (e, t) => `${C(e)}:${C(t)}`, D = (e, t = b) => Math.floor(e.minutes() / t) * t, me = (e) => Number.isInteger(e) && e > 0 && e <= 60, de = (e) => me(e) ? e : b, ue = (e) => {
  const t = [];
  for (let a = 0; a < 1440; a += e) {
    const f = Math.floor(a / 60), i = a % 60;
    t.push(p(f, i));
  }
  return t;
}, pe = () => {
  const e = /* @__PURE__ */ new Date(), t = e.getHours(), r = e.getMinutes();
  return p(t, r);
}, S = (e) => le.test(e), R = (e) => {
  if (!!oe(e))
    return !1;
  const r = e === "" || S(e);
  return r || re(!1, 'Wrong time format. Please pass in value with the following format: "hh:mm".'), r;
}, xe = (e) => {
  const {
    value: t,
    onChange: r = ne,
    alwaysShowMask: a = !0,
    showIcon: f = !1,
    dropdown: i = !1,
    maskOverwrite: $ = "shift",
    minuteOffset: F = b,
    disabled: E = !1,
    errorMessage: h,
    warningMessage: g,
    messageWhiteSpace: H = "normal",
    className: A = "",
    inputProps: k = {},
    ...W
  } = e, j = R(t) ? t : pe(), [c, l] = V(j), [x, w] = V(!1), m = de(F), u = E || !!k.disabled, B = y(null), N = y(!1), M = y(!1), L = ie(() => {
    i && w(!1);
  }), U = ce(B, L);
  P(() => {
    R(t) && l(t);
  }, [t]), P(() => (N.current = !0, () => {
    N.current = !1;
  }), []);
  const z = (s) => {
    const o = s.target;
    (!o.value || o.value.startsWith("-")) && setTimeout(() => {
      o.setSelectionRange(0, 0);
    }, 0), k.onFocus?.(s), i && !u && w(!0);
  }, _ = (s, o) => {
    if (M.current) {
      M.current = !1;
      return;
    }
    if (l(s), !!N.current) {
      if (o.masked.isComplete) {
        r(s);
        return;
      }
      o.unmaskedValue === "" && r("");
    }
  }, q = S(c), G = () => {
    const s = I(`2020-01-01 ${c}`), o = D(s, m);
    s.minute(o).second(0), s.add(m, "minutes");
    const v = p(s.hours(), s.minutes());
    l(v);
  }, J = () => {
    const s = I(`2020-01-01 ${c}`), o = D(s, m);
    s.minute(o).second(0), s.subtract(m, "minutes");
    const v = p(s.hours(), s.minutes());
    l(v);
  }, { className: K, ...Q } = k, X = ue(m).map((s) => ({
    id: s,
    label: s,
    selected: s === c
  })), Y = (s) => {
    !s || u || (M.current = !0, l(s.id), r(s.id), w(!1));
  }, Z = h || g, ee = T("TimePicker", i && "dropdown", x && "open", A);
  return /* @__PURE__ */ d("div", { ...W, className: ee, ref: U, children: [
    /* @__PURE__ */ d("div", { className: "input-group", children: [
      f && /* @__PURE__ */ n("span", { className: "input-group-addon", children: /* @__PURE__ */ n("span", { className: "rioglyph rioglyph-time-alt" }) }),
      /* @__PURE__ */ d("div", { className: "form-control-feedback-wrapper", children: [
        /* @__PURE__ */ n(
          te,
          {
            ...Q,
            className: T("TimePickerInput", "form-control", K),
            disabled: u,
            mask: "HH:MM",
            blocks: {
              HH: {
                mask: O.MaskedRange,
                from: 0,
                to: 23,
                maxLength: 2
              },
              MM: {
                mask: O.MaskedRange,
                from: 0,
                to: 59,
                maxLength: 2
              }
            },
            value: c,
            onAccept: _,
            onFocus: z,
            lazy: !a,
            placeholderChar: "-",
            overwrite: $
          }
        ),
        Z && /* @__PURE__ */ d(se, { children: [
          h && /* @__PURE__ */ n("span", { className: "form-control-feedback rioglyph rioglyph-error-sign" }),
          g && /* @__PURE__ */ n("span", { className: "form-control-feedback rioglyph rioglyph-warning-sign" }),
          /* @__PURE__ */ n("span", { className: `help-block white-space-${H}`, children: /* @__PURE__ */ n("span", { children: h || g }) })
        ] })
      ] }),
      q && /* @__PURE__ */ d(
        "div",
        {
          className: T(
            "TimePickerIncreaseButton input-group-addon",
            u && "pointer-events-none bg-lightest"
          ),
          children: [
            /* @__PURE__ */ n(
              "div",
              {
                className: "text-color-gray hover-text-color-dark display-grid place-items-center cursor-pointer",
                onClick: J,
                children: /* @__PURE__ */ n("div", { className: "rioglyph rioglyph-chevron-left scale-90" })
              }
            ),
            /* @__PURE__ */ n(
              "div",
              {
                className: "text-color-gray hover-text-color-dark margin-left-5 display-grid place-items-center cursor-pointer",
                onClick: G,
                children: /* @__PURE__ */ n("div", { className: "rioglyph rioglyph-chevron-right scale-90" })
              }
            )
          ]
        }
      )
    ] }),
    i && /* @__PURE__ */ n(
      ae,
      {
        isOpen: x,
        options: X,
        onSelect: Y,
        dropdownClassName: "max-height-200 overflow-auto width-100pct"
      }
    )
  ] });
};
export {
  xe as default
};
//# sourceMappingURL=TimePicker.js.map
