import { jsx as t, jsxs as u } from "react/jsx-runtime";
/* empty css              */
import { shift as J, offset as Q } from "@floating-ui/dom";
import { format as U, getYear as X } from "date-fns";
import { forwardRef as Z, useRef as _, useState as $ } from "react";
import h from "react-datepicker";
import { createPortal as ee } from "react-dom";
import { Button as o } from "../Button/Button.es.js";
import { ButtonEmphasis as i, ButtonSize as s, ButtonStyle as l } from "../Button/ButtonTypes.es.js";
import te from "../../foundation/Icon/Generated/IconCaretLeft.es.js";
import ae from "../../foundation/Icon/Generated/IconCaretLeftDouble.es.js";
import re from "../../foundation/Icon/Generated/IconCaretRight.es.js";
import oe from "../../foundation/Icon/Generated/IconCaretRightDouble.es.js";
import { IconSize as n } from "../../foundation/Icon/IconSize.es.js";
import { merge as ie } from "../../utilities/merge.es.js";
import { Validation as se } from "../../utilities/validation.es.js";
import { DatePickerTrigger as le } from "./DatePickerTrigger.es.js";
const ne = h.default ?? h, ce = (c, a) => c === "single" ? a < /* @__PURE__ */ new Date() ? "past-date" : "future-date" : "range-day", de = Z(
  ({
    placeHolder: c = "Select a date",
    isClearable: a,
    shouldCloseOnSelect: g,
    onChange: w,
    onOpen: d,
    onClose: m,
    onBlur: z,
    onKeyDown: M,
    dateFormat: S = "MMM dd, yyyy",
    value: x,
    startDate: N,
    endDate: P,
    minDate: R,
    maxDate: b,
    validation: I = se.Default,
    customTrigger: v,
    customHeader: B,
    children: j,
    fixedHeight: W = !0,
    hasPopperArrow: q = !0,
    preventOpenOnFocus: F = !1,
    inline: k = !1,
    filterDate: H = () => !0,
    variant: y = "single",
    hugWidth: p = !0,
    "data-test-id": L = "date-picker",
    triggerAriaLabel: A = "Open or close the date picker"
  }, E) => {
    const D = _(null), [f, C] = $(!1), K = () => {
      C(!0), d == null || d(), queueMicrotask(O);
    }, O = () => {
      var e, r;
      (r = (e = D.current) == null ? void 0 : e.querySelector("button")) == null || r.focus();
    }, T = () => {
      C(!1), m == null || m();
    };
    return /* @__PURE__ */ t("div", { "data-test-id": L, className: p ? "tw-w-auto" : "tw-w-full", children: /* @__PURE__ */ t(
      ne,
      {
        wrapperClassName: p ? "tw-w-auto" : "tw-w-full",
        calendarClassName: ie([
          "react-datepicker-wrap tw-pointer-events-auto",
          k && "react-datepicker-inline"
        ]),
        inline: k,
        selected: x,
        startDate: N,
        endDate: P,
        minDate: R,
        maxDate: b,
        calendarStartDay: 1,
        onChange: w,
        onKeyDown: f ? void 0 : M,
        onBlur: z,
        selectsRange: y === "range",
        showPopperArrow: q,
        preventOpenOnFocus: F,
        filterDate: H,
        fixedHeight: W,
        customInput: v ?? /* @__PURE__ */ t(
          le,
          {
            isCalendarOpen: f,
            isClearable: a,
            placeHolder: c,
            validation: I,
            onDateChanged: w,
            hugWidth: p,
            "aria-haspopup": "dialog",
            "aria-expanded": f,
            "aria-label": A
          }
        ),
        ref: E,
        formatWeekDay: (e) => e.slice(0, 1),
        isClearable: a,
        dateFormat: S,
        onCalendarClose: T,
        onCalendarOpen: K,
        shouldCloseOnSelect: g,
        dayClassName: (e) => ce(y, e),
        popperProps: {
          strategy: "fixed"
        },
        popperContainer: ({ children: e }) => ee(e, document.body),
        popperModifiers: [J({ padding: 8 }), Q(8)],
        renderCustomHeader: ({ date: e, decreaseMonth: r, increaseMonth: V, increaseYear: Y, decreaseYear: G }) => /* @__PURE__ */ u(
          "div",
          {
            className: "tw-flex tw-flex-col tw-gap-3",
            ref: D,
            "data-test-id": "date-picker-header",
            children: [
              B,
              /* @__PURE__ */ u("div", { className: "tw-flex tw-justify-between tw-pb-4 tw-px-0", children: [
                /* @__PURE__ */ t(
                  o,
                  {
                    style: l.Default,
                    size: s.Medium,
                    onClick: G,
                    emphasis: i.Weak,
                    icon: /* @__PURE__ */ t(ae, { size: n.Size20 })
                  }
                ),
                /* @__PURE__ */ t(
                  o,
                  {
                    style: l.Default,
                    size: s.Medium,
                    onClick: r,
                    emphasis: i.Weak,
                    icon: /* @__PURE__ */ t(te, { size: n.Size20 })
                  }
                ),
                /* @__PURE__ */ u("p", { className: "tw-font-sans tw-font-semibold tw-grow tw-self-center", children: [
                  U(e, "MMMM"),
                  " ",
                  X(e)
                ] }),
                /* @__PURE__ */ t(
                  o,
                  {
                    style: l.Default,
                    size: s.Medium,
                    onClick: V,
                    emphasis: i.Weak,
                    icon: /* @__PURE__ */ t(re, { size: n.Size20 })
                  }
                ),
                /* @__PURE__ */ t(
                  o,
                  {
                    style: l.Default,
                    size: s.Medium,
                    onClick: Y,
                    emphasis: i.Weak,
                    icon: /* @__PURE__ */ t(oe, { size: n.Size20 })
                  }
                )
              ] })
            ]
          }
        ),
        children: j
      }
    ) });
  }
);
de.displayName = "FondueDatePicker";
export {
  de as DatePicker
};
//# sourceMappingURL=DatePicker.es.js.map
