welcome-ui/dist/TimePicker.js

Customizable design system with react, typescript, tailwindcss and ariakit.

"use client";
import { jsx as f } from "react/jsx-runtime";
import { forwardRef as S, useState as w, useRef as j, useEffect as d } from "react";
import { D as F, C as I } from "./CustomPopper-vwbOQq72.js";
import { b as L, D as M, s as O } from "./utils-BNMgUIHQ.js";
import { InputText as U } from "./InputText.js";
import { c as _ } from "./index-PAaZGbyz.js";
const q = _(O), V = S(
  ({
    autoFocus: o,
    className: D,
    dateFormat: T = "HH:mm",
    disabled: R,
    icon: a,
    iconPlacement: x = "left",
    onChange: t,
    placeholder: k,
    size: y = "md",
    timeIntervals: i = 15,
    transparent: A,
    value: r = M,
    ...m
  }, p) => {
    const l = (s) => L(s, i), [H, c] = w(l(r)), b = j(), E = p || b;
    d(() => {
      t == null || t(l(r));
    }, []), d(() => {
      var e;
      const s = l(r);
      ((e = new Date(r)) == null ? void 0 : e.getTime()) - (s == null ? void 0 : s.getTime()) !== 0 && (t == null || t(s)), c(s);
    }, [r]);
    const N = (s) => {
      var e;
      s.preventDefault(), (e = E.current) == null || e.blur(), c(null), t == null || t(null);
    }, P = (s) => {
      if (!s) {
        c(null), t == null || t(null);
        return;
      }
      const e = Array.isArray(s) ? s[0] : s;
      if (!e) {
        c(null), t == null || t(null);
        return;
      }
      const u = l(e);
      e.setHours(u.getHours(), u.getMinutes()), c(e), t == null || t(new Date(e));
    };
    return (
      // type issue in react-datepicker (https://github.com/Hacker0x01/react-datepicker/issues/5391)
      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
      // @ts-expect-error
      /* @__PURE__ */ f(
        F,
        {
          calendarClassName: "time-picker-popper",
          customInput: /* @__PURE__ */ f(
            U,
            {
              autoFocus: o,
              className: q("time-picker", D),
              "data-testid": m["data-testid"],
              disabled: R,
              icon: a,
              iconPlacement: x,
              isClearable: !1,
              onReset: N,
              ref: p,
              size: y,
              transparent: A
            }
          ),
          dateFormat: T,
          onChange: P,
          placeholderText: k,
          popperContainer: I,
          selected: H,
          showTimeSelect: !0,
          showTimeSelectOnly: !0,
          timeIntervals: i,
          ...m
        }
      )
    );
  }
);
export {
  V as TimePicker
};