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