@mattermost/compass-ui 0.1.0-alpha.3 → 0.1.0-alpha.31

package/dist/components/date-range-picker/DateRangePicker.js

@@ -1,17 +1,17 @@
-import { jsxs as _, jsx as s } from "react/jsx-runtime";
-import { useId as Oe, useRef as U, useState as R, useCallback as m, useEffect as T } from "react";
-import ze from "../button/Button.js";
-import le, { ICON_BUTTON_ICON_SIZES as ue } from "../icon-button/IconButton.js";
-import M from "../icon/Icon.js";
-import __de from "@mattermost/compass-icons/components/calendar-outline.js";const de=__de&&__de.default?__de.default:__de;
-import __Le from "@mattermost/compass-icons/components/chevron-down.js";const Le=__Le&&__Le.default?__Le.default:__Le;
-import __je from "@mattermost/compass-icons/components/chevron-left.js";const je=__je&&__je.default?__je.default:__je;
-import __Ye from "@mattermost/compass-icons/components/chevron-right.js";const Ye=__Ye&&__Ye.default?__Ye.default:__Ye;
-import { useAnchoredPopupPortal as Ke } from "../../hooks/use-anchored-popup-portal.js";
-import { useOutsideClose as qe } from "../../hooks/use-outside-close.js";
-import { usePopoverTransition as He } from "../../hooks/use-popover-transition.js";
+import { jsxs as b, jsx as s } from "react/jsx-runtime";
+import { useId as nt, useRef as oe, useState as k, useCallback as m, useEffect as P } from "react";
+import ot from "../button/Button.js";
+import Ne, { ICON_BUTTON_ICON_SIZES as Ee } from "../icon-button/IconButton.js";
+import F from "../icon/Icon.js";
+import __Se from "@mattermost/compass-icons/components/calendar-outline.js";const Se=__Se&&__Se.default?__Se.default:__Se;
+import __st from "@mattermost/compass-icons/components/chevron-down.js";const st=__st&&__st.default?__st.default:__st;
+import __it from "@mattermost/compass-icons/components/chevron-left.js";const it=__it&&__it.default?__it.default:__it;
+import __ct from "@mattermost/compass-icons/components/chevron-right.js";const ct=__ct&&__ct.default?__ct.default:__ct;
+import { useAnchoredPopupPortal as lt } from "../../hooks/use-anchored-popup-portal.js";
+import { useOutsideClose as dt } from "../../hooks/use-outside-close.js";
+import { usePopoverTransition as ut } from "../../hooks/use-popover-transition.js";
 import r from "./DateRangePicker.module.scss.js";
-const Ve = 360, We = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], fe = [
+const pt = 360, ft = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], se = [
   "January",
   "February",
   "March",
@@ -25,176 +25,195 @@ const Ve = 360, We = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], fe = [
   "November",
   "December"
 ];
-function G(c) {
+function mt(c) {
   if (!c) return "";
-  const [n, f, k] = c.split("-");
-  return `${f}/${k}/${n}`;
+  const [a, p, _] = c.split("-");
+  return `${p}/${_}/${a}`;
 }
-function Z(c, n, f) {
-  return `${c}-${String(n + 1).padStart(2, "0")}-${String(f).padStart(2, "0")}`;
+function ie(c, a, p) {
+  return `${c}-${String(a + 1).padStart(2, "0")}-${String(p).padStart(2, "0")}`;
 }
-function Q(c, n) {
-  return new Date(c, n + 1, 0).getDate();
+function ce(c, a) {
+  return new Date(c, a + 1, 0).getDate();
 }
-function Je(c, n) {
-  return new Date(c, n, 1).getDay();
+function gt(c, a) {
+  return new Date(c, a, 1).getDay();
 }
-function X(c, n) {
-  return c === n;
+function le(c, a) {
+  return c === a;
 }
-function Ue(c, n, f) {
-  if (!n || !f) return !1;
-  const [k, w] = n < f ? [n, f] : [f, n];
-  return c > k && c < w;
+function ht(c, a, p) {
+  if (!a || !p) return !1;
+  const [_, E] = a < p ? [a, p] : [p, a];
+  return c > _ && c < E;
 }
-function $(c, n, f) {
+function z(c, a, p) {
   if (!c) return null;
-  const [k, w, I] = c.split("-").map(Number);
-  return k === n && w === f + 1 ? I : null;
+  const [_, E, S] = c.split("-").map(Number);
+  return _ === a && E === p + 1 ? S : null;
 }
-function lt({
+function $t({
   className: c = "",
-  mode: n = "date",
-  value: f,
-  startDate: k,
-  endDate: w,
-  onChange: I,
-  onRangeChange: x,
+  mode: a = "date",
+  value: p,
+  startDate: _,
+  endDate: E,
+  onChange: S,
+  onRangeChange: j,
   disabled: D,
-  id: pe,
-  portalContainer: me = null,
-  zIndex: ge
+  required: Me,
+  onFocus: Y,
+  onBlur: q,
+  label: x,
+  id: Ae,
+  "aria-label": de,
+  "aria-labelledby": ue,
+  "aria-describedby": $e,
+  portalContainer: Fe = null,
+  zIndex: xe,
+  placeholder: K = "mm/dd/yyyy",
+  formatDate: H = mt,
+  monthNames: L = se,
+  shortMonthNames: Ce = L === se ? se.map((V) => V.slice(0, 3)) : L,
+  weekdayNames: Re = ft,
+  dialogLabel: pe = "Date picker",
+  todayLabel: Te = "Today",
+  previousMonthLabel: Be = "Previous month",
+  nextMonthLabel: Oe = "Next month"
 }) {
-  const he = Oe(), ee = pe ?? he, te = `${ee}-popover`, O = U(null), z = U(null), L = U(null), N = /* @__PURE__ */ new Date(), j = Z(
-    N.getFullYear(),
-    N.getMonth(),
-    N.getDate()
-  ), [i, A] = R(N.getFullYear()), [o, C] = R(N.getMonth()), [l, Y] = R(!1), [K, P] = R(1), [ye, ve] = R(""), [ke, ne] = R(""), [De, ae] = R(""), E = f ?? ye, u = k ?? ke, g = w ?? De, _e = n === "date" ? !!E : !!u, { mounted: q, visible: H } = He(l), {
-    placement: Re,
-    style: Pe,
-    portalRef: F,
-    renderPortal: be
-  } = Ke(z, q, {
-    preferredHeight: Ve,
-    portalContainer: me,
-    zIndex: ge,
+  const V = nt(), C = Ae ?? V, fe = `${C}-popover`, me = `${C}-label`, ge = `${C}-value`, M = x != null && typeof x != "boolean" && x !== "", W = oe(null), J = oe(null), U = oe(null), A = /* @__PURE__ */ new Date(), G = ie(
+    A.getFullYear(),
+    A.getMonth(),
+    A.getDate()
+  ), [i, R] = k(A.getFullYear()), [o, T] = k(A.getMonth()), [l, Z] = k(!1), [Pe, he] = k(!1), [Q, w] = k(1), [ze, je] = k(""), [Ye, ye] = k(""), [qe, ve] = k(""), I = p ?? ze, d = _ ?? Ye, g = E ?? qe, ke = a === "date" ? !!I : !!d, { mounted: X, visible: ee } = ut(l), {
+    placement: Ke,
+    style: He,
+    portalRef: B,
+    renderPortal: Le
+  } = lt(J, X, {
+    preferredHeight: pt,
+    portalContainer: Fe,
+    zIndex: xe,
     matchWidth: !1
   }), h = m((e = !0) => {
     var t;
-    Y(!1), e && ((t = z.current) == null || t.focus());
+    Z(!1), e && ((t = J.current) == null || t.focus());
   }, []);
-  qe(O, l, () => h(!0), F), T(() => {
+  dt(W, l, () => h(!0), B), P(() => {
     if (!l) return;
     function e(t) {
       t.key === "Escape" && (t.preventDefault(), h(!0));
     }
     return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
-  }, [l, h]), T(() => {
+  }, [l, h]), P(() => {
     if (!l) return;
     function e(t) {
-      var d, p;
-      const a = t.target;
-      a && ((d = O.current) != null && d.contains(a) || (p = F.current) != null && p.contains(a) || h(!1));
+      var u, f;
+      const n = t.target;
+      n && ((u = W.current) != null && u.contains(n) || (f = B.current) != null && f.contains(n) || h(!1));
     }
     return document.addEventListener("focusin", e), () => document.removeEventListener("focusin", e);
-  }, [l, h, F]);
-  const v = Q(i, o), we = m(() => {
-    if (n === "date") {
-      const t = $(E, i, o);
+  }, [l, h, B]);
+  const v = ce(i, o), Ve = m(() => {
+    if (a === "date") {
+      const t = z(I, i, o);
       if (t) return t;
     } else {
-      const t = $(g, i, o);
+      const t = z(g, i, o);
       if (t) return t;
-      const a = $(u, i, o);
-      if (a) return a;
+      const n = z(d, i, o);
+      if (n) return n;
     }
-    const e = $(j, i, o);
+    const e = z(G, i, o);
     return e || 1;
   }, [
-    n,
-    E,
-    u,
+    a,
+    I,
+    d,
     g,
     i,
     o,
-    j
+    G
   ]);
-  T(() => {
-    if (!l || !H) return;
-    const e = we();
-    P(e);
+  P(() => {
+    if (!l || !ee) return;
+    const e = Ve();
+    w(e);
     const t = requestAnimationFrame(() => {
-      var a, d;
-      (d = (a = L.current) == null ? void 0 : a.querySelector(`[data-day="${e}"]`)) == null || d.focus();
+      var n, u;
+      (u = (n = U.current) == null ? void 0 : n.querySelector(`[data-day="${e}"]`)) == null || u.focus();
     });
     return () => cancelAnimationFrame(t);
-  }, [l, H]);
+  }, [l, ee]);
   const y = m((e) => {
-    P(e), requestAnimationFrame(() => {
-      var t, a;
-      (a = (t = L.current) == null ? void 0 : t.querySelector(`[data-day="${e}"]`)) == null || a.focus();
+    w(e), requestAnimationFrame(() => {
+      var t, n;
+      (n = (t = U.current) == null ? void 0 : t.querySelector(`[data-day="${e}"]`)) == null || n.focus();
     });
-  }, []), V = m(() => {
-    D || Y((e) => !e);
-  }, [D]), Ie = m(() => {
-    C((e) => e === 0 ? (A((t) => t - 1), 11) : e - 1);
-  }, []), Ne = m(() => {
-    C((e) => e === 11 ? (A((t) => t + 1), 0) : e + 1);
-  }, []), b = m(
+  }, []), te = m(() => {
+    D || Z((e) => !e);
+  }, [D]), We = m(() => {
+    T((e) => e === 0 ? (R((t) => t - 1), 11) : e - 1);
+  }, []), Je = m(() => {
+    T((e) => e === 11 ? (R((t) => t + 1), 0) : e + 1);
+  }, []), N = m(
     (e, t) => {
-      const a = e === -1 ? o === 0 ? 11 : o - 1 : o === 11 ? 0 : o + 1, d = e === -1 ? o === 0 ? i - 1 : i : o === 11 ? i + 1 : i, p = Q(d, a);
-      A(d), C(a), y(Math.min(t, p));
+      const n = e === -1 ? o === 0 ? 11 : o - 1 : o === 11 ? 0 : o + 1, u = e === -1 ? o === 0 ? i - 1 : i : o === 11 ? i + 1 : i, f = ce(u, n);
+      R(u), T(n), y(Math.min(t, f));
     },
     [o, i, y]
-  ), Ee = m(() => {
+  ), Ue = m(() => {
     const e = /* @__PURE__ */ new Date();
-    A(e.getFullYear()), C(e.getMonth()), y(e.getDate());
-  }, [y]), W = m(
+    R(e.getFullYear()), T(e.getMonth()), y(e.getDate());
+  }, [y]), re = m(
     (e, t) => {
-      if (n === "date")
-        I ? I(e) : ve(e), h(!0);
-      else if (!u || u && g)
-        ne(e), ae(""), P(t);
+      if (a === "date")
+        S ? S(e) : je(e), h(!0);
+      else if (!d || d && g)
+        ye(e), ve(""), w(t);
       else {
-        const [a, d] = e >= u ? [u, e] : [e, u];
-        x ? x(a, d) : (ne(a), ae(d)), h(!0);
+        const [n, u] = e >= d ? [d, e] : [e, d];
+        j ? j(n, u) : (ye(n), ve(u)), h(!0);
       }
     },
-    [n, u, g, I, x, h]
-  ), S = m(
+    [a, d, g, S, j, h]
+  ), $ = m(
     (e) => {
-      const t = K + e;
+      const t = Q + e;
       if (t >= 1 && t <= v) {
         y(t);
         return;
       }
-      t < 1 ? b(-1, Q(
-        o === 0 ? i - 1 : i,
-        o === 0 ? 11 : o - 1
-      ) + t) : b(1, t - v);
+      t < 1 ? N(
+        -1,
+        ce(
+          o === 0 ? i - 1 : i,
+          o === 0 ? 11 : o - 1
+        ) + t
+      ) : N(1, t - v);
     },
     [
-      K,
+      Q,
       v,
       o,
       i,
       y,
-      b
+      N
     ]
-  ), Se = m(
+  ), Ge = m(
     (e, t) => {
       switch (e.key) {
         case "ArrowLeft":
-          e.preventDefault(), S(-1);
+          e.preventDefault(), $(-1);
           break;
         case "ArrowRight":
-          e.preventDefault(), S(1);
+          e.preventDefault(), $(1);
           break;
         case "ArrowUp":
-          e.preventDefault(), S(-7);
+          e.preventDefault(), $(-7);
           break;
         case "ArrowDown":
-          e.preventDefault(), S(7);
+          e.preventDefault(), $(7);
           break;
         case "Home":
           e.preventDefault(), y(1);
@@ -203,201 +222,229 @@ function lt({
           e.preventDefault(), y(v);
           break;
         case "PageUp":
-          e.preventDefault(), b(-1, t);
+          e.preventDefault(), N(-1, t);
           break;
         case "PageDown":
-          e.preventDefault(), b(1, t);
+          e.preventDefault(), N(1, t);
           break;
         case "Enter":
         case " ":
-          e.preventDefault(), P(t), W(Z(i, o, t), t);
+          e.preventDefault(), w(t), re(ie(i, o, t), t);
           break;
       }
     },
     [
-      S,
+      $,
       y,
       v,
-      b,
-      W,
+      N,
+      re,
       i,
       o
     ]
-  ), Me = m(
+  ), Ze = m(
     (e) => {
       if (!D)
         switch (e.key) {
           case "Enter":
           case " ":
-            e.preventDefault(), V();
+            e.preventDefault(), te();
             break;
           case "ArrowDown":
-            l || (e.preventDefault(), Y(!0));
+            l || (e.preventDefault(), Z(!0));
             break;
           case "Escape":
             l && (e.preventDefault(), h(!0));
             break;
         }
     },
-    [D, V, l, h]
+    [D, te, l, h]
   );
-  T(() => {
-    l && P((e) => Math.min(Math.max(1, e), v));
+  P(() => {
+    l && w((e) => Math.min(Math.max(1, e), v));
   }, [l, v, o, i]);
-  const Ae = Je(i, o), B = [
-    ...Array(Ae).fill(null),
+  const Qe = gt(i, o), O = [
+    ...Array(Qe).fill(null),
     ...Array.from({ length: v }, (e, t) => t + 1)
   ];
-  for (; B.length % 7 !== 0; ) B.push(null);
-  const re = [];
-  for (let e = 0; e < B.length; e += 7) re.push(B.slice(e, e + 7));
-  const Ce = n === "date" ? G(E) : u ? `${G(u)}${g ? ` – ${G(g)}` : ""}` : "", Fe = [
-    r.dateRangePicker,
-    l ? r["dateRangePicker--open"] : "",
-    D ? r["dateRangePicker--disabled"] : "",
+  for (; O.length % 7 !== 0; ) O.push(null);
+  const _e = [];
+  for (let e = 0; e < O.length; e += 7) _e.push(O.slice(e, e + 7));
+  const ae = a === "date" ? I ? H(I) : "" : d ? `${H(d)}${g ? ` – ${H(g)}` : ""}` : "", Xe = [
+    r["date-range-picker"],
+    l ? r["date-range-picker--open"] : "",
+    D ? r["date-range-picker--disabled"] : "",
+    M ? r["date-range-picker--has-label"] : "",
+    M && (l || Pe || ke) ? r["date-range-picker--label-floated"] : "",
     c
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ _("div", { ref: O, className: Fe, children: [
-    /* @__PURE__ */ _(
+  return /* @__PURE__ */ b("div", { ref: W, className: Xe, children: [
+    M && /* @__PURE__ */ s("span", { id: me, className: r["date-range-picker__label"], children: x }),
+    /* @__PURE__ */ b(
       "div",
       {
-        ref: z,
-        className: r.dateRangePicker__trigger,
-        role: "button",
+        ref: J,
+        className: r["date-range-picker__trigger"],
+        role: "combobox",
         "aria-haspopup": "dialog",
         "aria-expanded": l,
-        "aria-controls": q ? te : void 0,
+        "aria-controls": X ? fe : void 0,
         "aria-disabled": D || void 0,
+        "aria-required": Me || void 0,
+        "aria-label": de ?? (ue == null && !M && !ae && !K ? pe : void 0),
+        "aria-labelledby": ue ?? (de == null ? M ? me : ae || K ? ge : void 0 : void 0),
+        "aria-describedby": $e,
         tabIndex: D ? -1 : 0,
-        id: ee,
-        "data-has-value": _e ? "" : void 0,
-        onClick: V,
-        onKeyDown: Me,
+        id: C,
+        "data-has-value": ke ? "" : void 0,
+        onClick: te,
+        onKeyDown: Ze,
+        onFocus: (e) => {
+          he(!0), Y == null || Y(e);
+        },
+        onBlur: (e) => {
+          he(!1), q == null || q(e);
+        },
         children: [
-          /* @__PURE__ */ s("span", { className: r.dateRangePicker__calendarIcon, "aria-hidden": !0, children: /* @__PURE__ */ s(M, { size: "16", glyph: /* @__PURE__ */ s(de, {}) }) }),
-          /* @__PURE__ */ s("span", { className: r.dateRangePicker__value, children: Ce || "mm/dd/yyyy" }),
-          /* @__PURE__ */ s("span", { className: r.dateRangePicker__chevron, "aria-hidden": !0, children: /* @__PURE__ */ s(M, { size: "16", glyph: /* @__PURE__ */ s(Le, {}) }) })
+          /* @__PURE__ */ s(
+            "span",
+            {
+              className: r["date-range-picker__calendar-icon"],
+              "aria-hidden": !0,
+              children: /* @__PURE__ */ s(F, { size: "16", glyph: /* @__PURE__ */ s(Se, {}) })
+            }
+          ),
+          /* @__PURE__ */ s("span", { id: ge, className: r["date-range-picker__value"], children: ae || K }),
+          /* @__PURE__ */ s("span", { className: r["date-range-picker__chevron"], "aria-hidden": !0, children: /* @__PURE__ */ s(F, { size: "12", glyph: /* @__PURE__ */ s(st, {}) }) })
         ]
       }
     ),
-    q && be(
-      /* @__PURE__ */ _(
+    X && Le(
+      /* @__PURE__ */ b(
         "div",
         {
-          ref: F,
-          id: te,
+          ref: B,
+          id: fe,
           className: [
-            r.dateRangePicker__popover,
-            Re === "above" ? r["dateRangePicker__popover--above"] : "",
-            H ? r["dateRangePicker__popover--visible"] : ""
+            r["date-range-picker__popover"],
+            Ke === "above" ? r["date-range-picker__popover--above"] : "",
+            ee ? r["date-range-picker__popover--visible"] : ""
           ].filter(Boolean).join(" "),
-          style: Pe,
+          style: He,
           role: "dialog",
           "aria-modal": "false",
-          "aria-label": "Date picker",
+          "aria-label": pe,
           children: [
-            /* @__PURE__ */ _("div", { className: r.dateRangePicker__header, children: [
-              /* @__PURE__ */ _("span", { className: r.dateRangePicker__monthLabel, "aria-live": "polite", children: [
-                fe[o],
-                " ",
-                i
-              ] }),
-              /* @__PURE__ */ _("div", { className: r.dateRangePicker__headerActions, children: [
+            /* @__PURE__ */ b("div", { className: r["date-range-picker__header"], children: [
+              /* @__PURE__ */ b(
+                "span",
+                {
+                  className: r["date-range-picker__month-label"],
+                  "aria-live": "polite",
+                  children: [
+                    Ce[o],
+                    " ",
+                    i
+                  ]
+                }
+              ),
+              /* @__PURE__ */ b("div", { className: r["date-range-picker__header-actions"], children: [
                 /* @__PURE__ */ s(
-                  ze,
+                  ot,
                   {
                     emphasis: "quaternary",
                     size: "small",
-                    leadingIcon: /* @__PURE__ */ s(M, { size: "16", glyph: /* @__PURE__ */ s(de, {}) }),
-                    onClick: Ee,
-                    children: "Today"
+                    compact: !0,
+                    leadingIcon: /* @__PURE__ */ s(F, { size: "16", glyph: /* @__PURE__ */ s(Se, {}) }),
+                    onClick: Ue,
+                    children: Te
                   }
                 ),
-                /* @__PURE__ */ _("div", { className: r.dateRangePicker__navButtons, children: [
+                /* @__PURE__ */ b("div", { className: r["date-range-picker__nav-buttons"], children: [
                   /* @__PURE__ */ s(
-                    le,
+                    Ne,
                     {
                       size: "medium",
                       padding: "compact",
                       icon: /* @__PURE__ */ s(
-                        M,
+                        F,
                         {
-                          size: ue.medium,
-                          glyph: /* @__PURE__ */ s(je, {})
+                          size: Ee.medium,
+                          glyph: /* @__PURE__ */ s(it, {})
                         }
                       ),
-                      onClick: Ie,
-                      "aria-label": "Previous month"
+                      onClick: We,
+                      "aria-label": Be
                     }
                   ),
                   /* @__PURE__ */ s(
-                    le,
+                    Ne,
                     {
                       size: "medium",
                       padding: "compact",
                       icon: /* @__PURE__ */ s(
-                        M,
+                        F,
                         {
-                          size: ue.medium,
-                          glyph: /* @__PURE__ */ s(Ye, {})
+                          size: Ee.medium,
+                          glyph: /* @__PURE__ */ s(ct, {})
                         }
                       ),
-                      onClick: Ne,
-                      "aria-label": "Next month"
+                      onClick: Je,
+                      "aria-label": Oe
                     }
                   )
                 ] })
               ] })
             ] }),
-            /* @__PURE__ */ s("div", { className: r.dateRangePicker__weekdays, "aria-hidden": !0, children: We.map((e) => /* @__PURE__ */ s("span", { className: r.dateRangePicker__weekday, children: e }, e)) }),
+            /* @__PURE__ */ s("div", { className: r["date-range-picker__weekdays"], "aria-hidden": !0, children: Re.map((e, t) => /* @__PURE__ */ s("span", { className: r["date-range-picker__weekday"], children: e }, t)) }),
             /* @__PURE__ */ s(
               "div",
               {
-                ref: L,
-                className: r.dateRangePicker__grid,
+                ref: U,
+                className: r["date-range-picker__grid"],
                 role: "grid",
-                "aria-label": `${fe[o]} ${i}`,
-                children: re.map((e, t) => /* @__PURE__ */ s(
+                "aria-label": `${L[o]} ${i}`,
+                children: _e.map((e, t) => /* @__PURE__ */ s(
                   "div",
                   {
-                    className: r.dateRangePicker__week,
+                    className: r["date-range-picker__week"],
                     role: "row",
-                    children: e.map((a, d) => {
-                      if (a == null)
+                    children: e.map((n, u) => {
+                      if (n == null)
                         return /* @__PURE__ */ s(
                           "span",
                           {
-                            className: r.dateRangePicker__dayEmpty,
+                            className: r["date-range-picker__day-empty"],
                             role: "gridcell"
                           },
-                          d
+                          u
                         );
-                      const p = Z(i, o, a), oe = p === j, se = n === "range" && X(p, u), ie = n === "range" && !!g && X(p, g), J = n === "date" ? X(p, E) : se || ie, Be = n === "range" && Ue(p, u, g), ce = n === "range" && !!u && !!g && u !== g, Te = [
-                        r.dateRangePicker__dayCell,
-                        Be ? r["dateRangePicker__dayCell--in-range"] : "",
-                        ce && se ? r["dateRangePicker__dayCell--range-start"] : "",
-                        ce && ie ? r["dateRangePicker__dayCell--range-end"] : ""
-                      ].filter(Boolean).join(" "), $e = [
-                        r.dateRangePicker__day,
-                        J ? r["dateRangePicker__day--selected"] : "",
-                        oe && !J ? r["dateRangePicker__day--today"] : ""
+                      const f = ie(i, o, n), De = f === G, be = a === "range" && le(f, d), we = a === "range" && !!g && le(f, g), ne = a === "date" ? le(f, I) : be || we, et = a === "range" && ht(f, d, g), Ie = a === "range" && !!d && !!g && d !== g, tt = [
+                        r["date-range-picker__day-cell"],
+                        et ? r["date-range-picker__day-cell--in-range"] : "",
+                        Ie && be ? r["date-range-picker__day-cell--range-start"] : "",
+                        Ie && we ? r["date-range-picker__day-cell--range-end"] : ""
+                      ].filter(Boolean).join(" "), rt = [
+                        r["date-range-picker__day"],
+                        ne ? r["date-range-picker__day--selected"] : "",
+                        De && !ne ? r["date-range-picker__day--today"] : ""
                       ].filter(Boolean).join(" ");
-                      return /* @__PURE__ */ s("div", { className: Te, role: "gridcell", children: /* @__PURE__ */ s(
+                      return /* @__PURE__ */ s("div", { className: tt, role: "gridcell", children: /* @__PURE__ */ s(
                         "button",
                         {
                           type: "button",
-                          className: $e,
-                          "data-day": a,
-                          tabIndex: K === a ? 0 : -1,
-                          onClick: () => W(p, a),
-                          onFocus: () => P(a),
-                          onKeyDown: (xe) => Se(xe, a),
-                          "aria-label": p,
-                          "aria-pressed": J,
-                          "aria-current": oe ? "date" : void 0,
-                          children: a
+                          className: rt,
+                          "data-day": n,
+                          tabIndex: Q === n ? 0 : -1,
+                          onClick: () => re(f, n),
+                          onFocus: () => w(n),
+                          onKeyDown: (at) => Ge(at, n),
+                          "aria-label": f,
+                          "aria-pressed": ne,
+                          "aria-current": De ? "date" : void 0,
+                          children: n
                         }
-                      ) }, d);
+                      ) }, u);
                     })
                   },
                   t
@@ -411,6 +458,6 @@ function lt({
   ] });
 }
 export {
-  lt as default
+  $t as default
 };
 //# sourceMappingURL=DateRangePicker.js.map