@alfadocs/ui-kit-debug 0.89.0 → 0.94.0

package/dist/_chunks/date-range-picker-Cfv4Sr63.js

@@ -0,0 +1,832 @@
+import { jsx as r, jsxs as c, Fragment as wt } from "react/jsx-runtime";
+import { forwardRef as It, useState as y, useRef as ce, useId as G, useCallback as Ke, useEffect as Le, useMemo as Ot, useImperativeHandle as Tt, Fragment as Gt } from "react";
+import { useTranslation as Et } from "react-i18next";
+import * as _ from "@radix-ui/react-popover";
+import * as z from "@radix-ui/react-radio-group";
+import { u as $e } from "./use-controllable-state-BiY4xTzM.js";
+import { u as Mt } from "./form-field-context-B3APVHKx.js";
+import { S as Vt } from "./switch-OILsBLWo.js";
+import { u as Ft } from "./registry-DvAUVLHh.js";
+import { l as Kt, m as Lt, u as $t, g as At, b as Wt, f as h, n as Ae, s as We, o as jt, q as qt, k as ue, a as _t, d as zt, t as Bt, r as je, v as qe, w as _e, p as Yt, x as Ut, D as Ht, C as Qt, y as Jt, e as Xt, z as B, h as Zt, j as ea, i as pe, c as ta } from "./date-picker-variants-eL6HjWvw.js";
+import { s as E } from "./subDays-BcNi04uf.js";
+import { C as aa } from "./calendar-days-BGWklvE-.js";
+import { C as ra } from "./check-DrFSN__t.js";
+import { i as ze } from "./isSameDay-DUEiAT0G.js";
+import { p as sa } from "./parse-DvA97ro9.js";
+function na(s, l, f) {
+  return Kt(s, -1, f);
+}
+function Be(s, l, f) {
+  return Lt(s, -1, f);
+}
+const oa = {
+  id: "date-range-picker",
+  capabilities: [
+    "range_pick",
+    "open",
+    "close",
+    "confirm",
+    // apply — commit the draft range
+    "dismiss",
+    // cancel — discard the draft
+    "set_value"
+    // set_granularity + compare_toggle
+  ],
+  state: {
+    range: {
+      type: "{ from: iso-date | null, to: iso-date | null }",
+      descriptionKey: "ui.agent.dateRangePicker.state.range",
+      description: "Currently-selected ISO date range endpoints, each possibly null.",
+      read: (s) => {
+        var f, m;
+        const l = s.getRange();
+        return {
+          from: ((f = l.from) == null ? void 0 : f.toISOString()) ?? null,
+          to: ((m = l.to) == null ? void 0 : m.toISOString()) ?? null
+        };
+      }
+    },
+    isOpen: {
+      type: "boolean",
+      descriptionKey: "ui.agent.dateRangePicker.state.isOpen",
+      description: "Whether the range calendar popover is open.",
+      read: (s) => s.isOpen()
+    },
+    granularity: {
+      type: "'day' | 'week' | 'month' | 'quarter' | null",
+      descriptionKey: "ui.agent.dateRangePicker.state.granularity",
+      description: "Selected time granularity (Range Cockpit), or null when the control is disabled.",
+      read: (s) => s.getGranularity() ?? null
+    },
+    compareRange: {
+      type: "{ from: iso-date | null, to: iso-date | null } | null",
+      descriptionKey: "ui.agent.dateRangePicker.state.compareRange",
+      description: "Resolved comparison period when compare-to-previous-period is on, else null.",
+      read: (s) => {
+        var f, m;
+        const l = s.getCompareRange();
+        return l ? {
+          from: ((f = l.from) == null ? void 0 : f.toISOString()) ?? null,
+          to: ((m = l.to) == null ? void 0 : m.toISOString()) ?? null
+        } : null;
+      }
+    }
+  },
+  actions: {
+    set_range: {
+      safety: "write",
+      argsType: "{ from: string, to: string }",
+      argsSchema: {
+        type: "object",
+        properties: {
+          from: {
+            type: "string",
+            format: "date",
+            description: "ISO start date (inclusive)."
+          },
+          to: {
+            type: "string",
+            format: "date",
+            description: "ISO end date (inclusive)."
+          }
+        },
+        required: ["from", "to"]
+      },
+      idempotent: !0,
+      descriptionKey: "ui.agent.dateRangePicker.actions.setRange",
+      description: "Replace the selected range with the given ISO endpoints.",
+      examples: [
+        {
+          args: { from: "2026-06-01", to: "2026-06-30" },
+          note: "Select all of June 2026."
+        }
+      ],
+      invoke: (s, l) => {
+        s.setRange({ from: new Date(l.from), to: new Date(l.to) });
+      }
+    },
+    clear: {
+      // Discards the selected range — loses the user's input.
+      safety: "destructive",
+      idempotent: !0,
+      descriptionKey: "ui.agent.dateRangePicker.actions.clear",
+      description: "Clear the selected range.",
+      invoke: (s) => {
+        s.clear();
+      }
+    },
+    open: {
+      safety: "read",
+      idempotent: !0,
+      descriptionKey: "ui.agent.dateRangePicker.actions.open",
+      description: "Open the range calendar popover.",
+      invoke: (s) => {
+        s.open();
+      }
+    },
+    close: {
+      safety: "read",
+      idempotent: !0,
+      descriptionKey: "ui.agent.dateRangePicker.actions.close",
+      description: "Close the range calendar popover.",
+      invoke: (s) => {
+        s.close();
+      }
+    },
+    apply: {
+      // Commits the current draft — in `commitMode="apply"` this is what runs
+      // the downstream query, so it is a write, not read.
+      safety: "write",
+      idempotent: !0,
+      descriptionKey: "ui.agent.dateRangePicker.actions.apply",
+      description: "Commit the current draft range (as the Apply / Done button).",
+      invoke: (s) => {
+        s.apply();
+      }
+    },
+    cancel: {
+      safety: "read",
+      idempotent: !0,
+      descriptionKey: "ui.agent.dateRangePicker.actions.cancel",
+      description: "Discard the draft and close without committing.",
+      invoke: (s) => {
+        s.cancel();
+      }
+    },
+    set_granularity: {
+      safety: "write",
+      argsType: "{ granularity: 'day' | 'week' | 'month' | 'quarter' }",
+      argsSchema: {
+        type: "object",
+        properties: {
+          granularity: {
+            type: "string",
+            enum: ["day", "week", "month", "quarter"],
+            description: "Time grain to query the range at."
+          }
+        },
+        required: ["granularity"]
+      },
+      idempotent: !0,
+      descriptionKey: "ui.agent.dateRangePicker.actions.setGranularity",
+      description: "Set the time granularity (Range Cockpit).",
+      examples: [{ args: { granularity: "month" }, note: "Query by month." }],
+      invoke: (s, l) => {
+        s.setGranularity(l.granularity);
+      }
+    },
+    toggle_compare: {
+      safety: "write",
+      argsType: "{ enabled: boolean }",
+      argsSchema: {
+        type: "object",
+        properties: {
+          enabled: {
+            type: "boolean",
+            description: "Whether to compare against the previous period."
+          }
+        },
+        required: ["enabled"]
+      },
+      idempotent: !0,
+      descriptionKey: "ui.agent.dateRangePicker.actions.toggleCompare",
+      description: "Turn compare-to-previous-period on or off (Range Cockpit).",
+      examples: [
+        { args: { enabled: !0 }, note: "Enable period comparison." }
+      ],
+      invoke: (s, l) => {
+        s.setCompare(l.enabled);
+      }
+    }
+  },
+  domHooks: {
+    root: {
+      attr: "data-component",
+      value: "date-range-picker",
+      description: "Marks the DateRangePicker wrapper."
+    },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop."
+    }
+  }
+}, Ye = [
+  { value: "day", fallback: "Day" },
+  { value: "week", fallback: "Week" },
+  { value: "month", fallback: "Month" },
+  { value: "quarter", fallback: "Quarter" }
+], ia = [
+  { value: "previous", fallback: "Previous period" },
+  { value: "lastYear", fallback: "Same period last year" }
+], da = It(
+  ({
+    value: s,
+    defaultValue: l,
+    onChange: f,
+    commitMode: m = "auto",
+    onApply: P,
+    onCancel: N,
+    showClear: Ue = !0,
+    numberOfMonths: He = 2,
+    granularity: me,
+    defaultGranularity: fe,
+    onGranularityChange: Qe,
+    allowedGranularities: Y,
+    compare: ge = !1,
+    defaultCompare: Je = !1,
+    defaultCompareMode: Xe = "previous",
+    onCompareChange: D,
+    weekStartsOn: M,
+    minDate: U,
+    maxDate: H,
+    presets: Q,
+    mergePresets: Ze = !1,
+    size: ve = "md",
+    chrome: et = "input",
+    disabled: tt,
+    placeholder: at,
+    className: rt,
+    id: st
+  }, nt) => {
+    const { t: n, i18n: ye } = Et(), V = Mt(), J = st ?? V.id, he = V.disabled || tt, ot = V.invalid ? "error" : "default", u = $t(ye.language), p = At(ye.language), it = at ?? n("inputs.dateRangePicker.placeholder", "Select date range"), [dt, be] = $e({
+      value: s,
+      defaultValue: l ?? {},
+      onChange: f
+    }), i = dt ?? {}, [C, b] = y(!1), [a, S] = y(i), [lt, X] = y(i.from ?? /* @__PURE__ */ new Date()), [ke, Re] = y(""), [xe, Pe] = y(""), [w, F] = y(!1), [I, K] = y(!1), $ = me !== void 0 || fe !== void 0, A = Y && Y.length > 0 ? Y : void 0, Ne = A ? Ye.filter(
+      (e) => A.includes(e.value)
+    ) : Ye, L = (e) => {
+      var t;
+      return !A || A.includes(e) ? e : ((t = Ne[0]) == null ? void 0 : t.value) ?? e;
+    }, [ct, Z] = $e({
+      value: me,
+      defaultValue: L(fe ?? "day"),
+      onChange: Qe
+    }), W = L(ct ?? "day"), [ee, ut] = y(Je), [De, pt] = y(Xe), mt = ce(null), x = ce(!1), Ce = G(), Se = G(), we = G(), Ie = G(), te = G(), ft = G(), k = Ke(
+      (e) => {
+        be(e);
+      },
+      [be]
+    ), gt = Wt(U, H), vt = (e) => (U ? ta(e, U) : !1) || (H ? pe(e, H) : !1);
+    Le(() => {
+      C && (S(i), F(!1), K(!1), x.current = !1);
+    }, [C]), Le(() => {
+      w || Re(
+        a.from ? h(a.from, p, { locale: u }) : ""
+      ), I || Pe(a.to ? h(a.to, p, { locale: u }) : "");
+    }, [a.from, a.to, p, u]);
+    const Oe = [
+      {
+        label: n("inputs.dateRangePicker.presets.today", "Today"),
+        range: () => {
+          const e = /* @__PURE__ */ new Date();
+          return { from: e, to: e };
+        }
+      },
+      {
+        label: n("inputs.dateRangePicker.presets.yesterday", "Yesterday"),
+        range: () => {
+          const e = E(/* @__PURE__ */ new Date(), 1);
+          return { from: e, to: e };
+        }
+      },
+      {
+        label: n("inputs.dateRangePicker.presets.last7", "Last 7 days"),
+        range: () => ({
+          from: E(/* @__PURE__ */ new Date(), 6),
+          to: /* @__PURE__ */ new Date()
+        })
+      },
+      {
+        label: n("inputs.dateRangePicker.presets.thisWeek", "This week"),
+        range: () => ({
+          // `weekStartsOn` (when set) overrides the locale's first day; when
+          // undefined date-fns falls back to the locale.
+          from: We(/* @__PURE__ */ new Date(), { locale: u, weekStartsOn: M }),
+          to: Ae(/* @__PURE__ */ new Date(), { locale: u, weekStartsOn: M })
+        })
+      },
+      {
+        label: n("inputs.dateRangePicker.presets.lastWeek", "Last week"),
+        range: () => {
+          const e = na(/* @__PURE__ */ new Date());
+          return {
+            from: We(e, { locale: u, weekStartsOn: M }),
+            to: Ae(e, { locale: u, weekStartsOn: M })
+          };
+        }
+      },
+      {
+        label: n("inputs.dateRangePicker.presets.thisMonth", "This month"),
+        range: () => ({
+          from: qt(/* @__PURE__ */ new Date()),
+          to: jt(/* @__PURE__ */ new Date())
+        })
+      },
+      {
+        label: n("inputs.dateRangePicker.presets.last30", "Last 30 days"),
+        range: () => ({
+          from: E(/* @__PURE__ */ new Date(), 29),
+          to: /* @__PURE__ */ new Date()
+        })
+      }
+    ], j = Q ? Ze ? [...Oe, ...Q] : Q : Oe, Te = (() => {
+      const e = [], t = /* @__PURE__ */ new Map();
+      for (const d of j) {
+        const o = d.group ?? "";
+        t.has(o) || (t.set(o, []), e.push(o)), t.get(o).push(d);
+      }
+      return e.map((d) => ({ group: d, presets: t.get(d) }));
+    })(), yt = Te.some((e) => e.group !== ""), O = (e, t = De) => {
+      if (!e.from || !e.to) return;
+      if (t === "lastYear")
+        return { from: Be(e.from), to: Be(e.to) };
+      const d = ue(e.to, e.from), o = E(e.from, 1);
+      return { from: E(o, d), to: o };
+    }, T = ge && ee, v = T ? O(a) : void 0, ht = (() => {
+      if (!(v != null && v.from) || !v.to) return;
+      const e = v.from, t = v.to, d = {
+        compareStart: e,
+        compareEnd: t
+      };
+      return ue(t, e) >= 2 && (d.compareMiddle = { from: _t(e, 1), to: E(t, 1) }), d;
+    })(), Ge = (e) => {
+      const t = {};
+      return $ && (t.granularity = W), T && (t.compareRange = O(e)), t.granularity || t.compareRange ? t : void 0;
+    }, bt = (e) => {
+      const t = e;
+      pt(t), T && (D == null || D(!0, O(a, t)));
+    }, ae = (e) => {
+      ut(e), D == null || D(e, e ? O(a) : void 0);
+    }, re = Ke(
+      (e) => {
+        S(e), m === "auto" && e.from && e.to && k(e);
+      },
+      [m, k]
+    ), kt = (e) => {
+      F(!1), K(!1), re({ from: e == null ? void 0 : e.from, to: e == null ? void 0 : e.to });
+    }, Rt = (e) => {
+      const t = e.range();
+      F(!1), K(!1), S(t), X(t.from), m === "auto" && (k(t), P == null || P(t, Ge(t)), x.current = !0, b(!1));
+    }, se = (e, t) => {
+      const d = e === "from" ? F : K;
+      if (t.trim() === "") {
+        d(!1), re(
+          e === "from" ? { from: void 0, to: a.to } : { from: a.from, to: void 0 }
+        );
+        return;
+      }
+      const o = sa(t, p, /* @__PURE__ */ new Date(), { locale: u });
+      if (!ea(o) || vt(o)) {
+        d(!0);
+        return;
+      }
+      d(!1);
+      let R;
+      e === "from" ? R = a.to && pe(o, a.to) ? { from: o, to: void 0 } : { from: o, to: a.to } : R = a.from && pe(a.from, o) ? { from: o, to: void 0 } : { from: a.from, to: o }, X(o), re(R);
+    }, Ee = (e) => (t) => {
+      t.key === "Enter" && (t.preventDefault(), se(e, e === "from" ? ke : xe));
+    }, xt = () => {
+      S({}), F(!1), K(!1), m === "auto" && k({});
+    }, Pt = !!(a.from && a.to), Nt = !a.from && !a.to, Me = (Pt || Nt) && !w && !I, ne = () => {
+      Me && (k(a), P == null || P(a, Ge(a))), x.current = !0, b(!1);
+    }, Dt = () => {
+      x.current = !0, b(!1);
+    }, oe = () => {
+      m === "apply" && (N == null || N()), S(i), b(!1);
+    }, Ct = (e) => {
+      if (e) {
+        x.current = !1, b(!0);
+        return;
+      }
+      m === "apply" && !x.current && (N == null || N()), S(i), x.current = !1, b(!1);
+    }, ie = (e) => {
+      if (!i.from || !i.to) return !1;
+      const t = e.range();
+      return ze(t.from, i.from) && ze(t.to, i.to);
+    }, Ve = (() => {
+      if (i.from && i.to) {
+        const e = h(i.from, p, { locale: u }), t = h(i.to, p, { locale: u });
+        return `${e} – ${t}`;
+      }
+      return i.from ? h(i.from, p, { locale: u }) : "";
+    })(), q = a.from ? a.to ? null : "end" : "start", St = (() => {
+      if (!a.from)
+        return n("inputs.dateRangePicker.selectStart", "Select start date");
+      if (!a.to)
+        return n("inputs.dateRangePicker.selectEnd", "Select end date");
+      const e = ue(a.to, a.from) + 1, t = h(a.from, p, { locale: u }), d = h(a.to, p, { locale: u }), o = n("inputs.dateRangePicker.days", { count: e });
+      return `${t} – ${d} · ${o}`;
+    })(), g = ce({
+      currentValue: i,
+      open: C,
+      getGranularity: () => $ ? W : void 0,
+      setGranularity: (e) => Z(L(e)),
+      getCompareRange: () => T ? O(i) : void 0,
+      setCompare: (e) => ae(e),
+      getActivePreset: () => {
+        var e;
+        return (e = j.find(ie)) == null ? void 0 : e.label;
+      },
+      getActiveEnd: () => q,
+      apply: () => ne(),
+      cancel: () => oe()
+    });
+    g.current = {
+      currentValue: i,
+      open: C,
+      getGranularity: () => $ ? W : void 0,
+      setGranularity: (e) => Z(L(e)),
+      getCompareRange: () => T ? O(i) : void 0,
+      setCompare: (e) => ae(e),
+      getActivePreset: () => {
+        var e;
+        return (e = j.find(ie)) == null ? void 0 : e.label;
+      },
+      getActiveEnd: () => q,
+      apply: () => ne(),
+      cancel: () => oe()
+    };
+    const de = Ot(
+      () => ({
+        getRange: () => g.current.currentValue,
+        setRange: (e) => k(e),
+        clear: () => k({}),
+        isOpen: () => g.current.open,
+        open: () => b(!0),
+        close: () => b(!1),
+        getGranularity: () => g.current.getGranularity(),
+        setGranularity: (e) => g.current.setGranularity(e),
+        getCompareRange: () => g.current.getCompareRange(),
+        setCompare: (e) => g.current.setCompare(e),
+        getActivePreset: () => g.current.getActivePreset(),
+        getActiveEnd: () => g.current.getActiveEnd(),
+        apply: () => g.current.apply(),
+        cancel: () => g.current.cancel()
+      }),
+      [k]
+    );
+    Tt(nt, () => de, [de]), Ft(oa, de, J);
+    const Fe = (e) => e === "from" ? w ? "error" : q === "start" ? "active" : "default" : I ? "error" : q === "end" ? "active" : "default";
+    return /* @__PURE__ */ r(_.Root, { open: C, onOpenChange: Ct, children: /* @__PURE__ */ c(
+      "div",
+      {
+        className: rt,
+        "data-component": "date-range-picker",
+        "data-component-id": J,
+        children: [
+          /* @__PURE__ */ r(_.Trigger, { asChild: !0, disabled: he, children: /* @__PURE__ */ c(
+            "button",
+            {
+              ref: mt,
+              id: J,
+              type: "button",
+              disabled: he,
+              "aria-describedby": V.describedBy || void 0,
+              "aria-invalid": V.invalid || void 0,
+              "aria-haspopup": "dialog",
+              "aria-expanded": C,
+              className: Bt({ size: ve, tone: ot, chrome: et }),
+              children: [
+                /* @__PURE__ */ r(
+                  "span",
+                  {
+                    className: [
+                      // Truncate so a long value/placeholder ellipsises instead of
+                      // running under the absolutely-positioned calendar icon (the
+                      // trigger reserves the icon's space via `pe-10`). `min-w-0`
+                      // lets the flex child shrink below its content width so
+                      // `truncate` engages.
+                      "ds:min-w-0 ds:flex-1 ds:truncate ds:text-start",
+                      Ve ? "ds:text-foreground" : "ds:text-muted-foreground"
+                    ].join(" "),
+                    children: Ve || it
+                  }
+                ),
+                /* @__PURE__ */ r(
+                  "span",
+                  {
+                    "aria-hidden": "true",
+                    className: zt({ size: ve }),
+                    children: /* @__PURE__ */ r(aa, {})
+                  }
+                )
+              ]
+            }
+          ) }),
+          /* @__PURE__ */ r(_.Portal, { children: /* @__PURE__ */ r(
+            _.Content,
+            {
+              sideOffset: 4,
+              align: "start",
+              role: "dialog",
+              "aria-label": n(
+                "inputs.dateRangePicker.title",
+                "Select date range"
+              ),
+              className: Zt(),
+              children: /* @__PURE__ */ c("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-md)]", children: [
+                /* @__PURE__ */ c("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]", children: [
+                  /* @__PURE__ */ c("div", { className: "ds:flex ds:items-center ds:justify-between ds:gap-[var(--spacing-sm)]", children: [
+                    /* @__PURE__ */ r(
+                      "h2",
+                      {
+                        id: Ce,
+                        className: "type-body-sm ds:font-semibold ds:text-foreground",
+                        children: n("inputs.dateRangePicker.title", "Select date range")
+                      }
+                    ),
+                    $ ? /* @__PURE__ */ r(
+                      z.Root,
+                      {
+                        value: W,
+                        onValueChange: (e) => Z(
+                          L(e)
+                        ),
+                        "aria-label": n(
+                          "inputs.dateRangePicker.granularityLabel",
+                          "Granularity"
+                        ),
+                        className: qe(),
+                        children: Ne.map((e) => /* @__PURE__ */ r(
+                          z.Item,
+                          {
+                            value: e.value,
+                            className: je(),
+                            children: n(
+                              `inputs.dateRangePicker.granularity.${e.value}`,
+                              e.fallback
+                            )
+                          },
+                          e.value
+                        ))
+                      }
+                    ) : null
+                  ] }),
+                  /* @__PURE__ */ c("div", { className: "ds:flex ds:items-end ds:gap-[var(--spacing-xs)]", children: [
+                    /* @__PURE__ */ c("div", { className: "ds:flex ds:min-w-0 ds:flex-1 ds:flex-col ds:gap-[var(--spacing-xs)]", children: [
+                      /* @__PURE__ */ r(
+                        "label",
+                        {
+                          htmlFor: Se,
+                          className: "ds:text-[length:var(--font-size-xs)] ds:text-muted-foreground",
+                          children: n("inputs.dateRangePicker.startLabel", "Start date")
+                        }
+                      ),
+                      /* @__PURE__ */ r(
+                        "input",
+                        {
+                          id: Se,
+                          type: "text",
+                          inputMode: "numeric",
+                          value: ke,
+                          placeholder: p.toUpperCase(),
+                          "aria-invalid": w || void 0,
+                          "aria-describedby": w ? te : void 0,
+                          onChange: (e) => Re(e.target.value),
+                          onBlur: (e) => se("from", e.target.value),
+                          onKeyDown: Ee("from"),
+                          className: _e({
+                            state: Fe("from")
+                          })
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ r(
+                      "span",
+                      {
+                        "aria-hidden": "true",
+                        className: "ds:pb-[var(--spacing-xs)] ds:text-muted-foreground",
+                        children: "–"
+                      }
+                    ),
+                    /* @__PURE__ */ c("div", { className: "ds:flex ds:min-w-0 ds:flex-1 ds:flex-col ds:gap-[var(--spacing-xs)]", children: [
+                      /* @__PURE__ */ r(
+                        "label",
+                        {
+                          htmlFor: we,
+                          className: "ds:text-[length:var(--font-size-xs)] ds:text-muted-foreground",
+                          children: n("inputs.dateRangePicker.endLabel", "End date")
+                        }
+                      ),
+                      /* @__PURE__ */ r(
+                        "input",
+                        {
+                          id: we,
+                          type: "text",
+                          inputMode: "numeric",
+                          value: xe,
+                          placeholder: p.toUpperCase(),
+                          "aria-invalid": I || void 0,
+                          "aria-describedby": I ? te : void 0,
+                          onChange: (e) => Pe(e.target.value),
+                          onBlur: (e) => se("to", e.target.value),
+                          onKeyDown: Ee("to"),
+                          className: _e({
+                            state: Fe("to")
+                          })
+                        }
+                      )
+                    ] })
+                  ] }),
+                  w || I ? /* @__PURE__ */ r(
+                    "p",
+                    {
+                      id: te,
+                      role: "alert",
+                      className: "ds:text-[length:var(--font-size-xs)] ds:text-destructive",
+                      children: n(
+                        "inputs.dateRangePicker.invalidDate",
+                        "Enter a date as {{format}}",
+                        {
+                          format: p.toUpperCase()
+                        }
+                      )
+                    }
+                  ) : null
+                ] }),
+                /* @__PURE__ */ c("div", { className: "ds:flex ds:gap-[var(--spacing-md)]", children: [
+                  j.length > 0 ? /* @__PURE__ */ r("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)] ds:min-w-[8rem] ds:border-e ds:border-border ds:pe-[var(--spacing-md)]", children: Te.map((e, t) => {
+                    const d = `${Ce}-pg${t}`, o = e.presets.map((R) => {
+                      const le = ie(R);
+                      return /* @__PURE__ */ c(
+                        "button",
+                        {
+                          type: "button",
+                          "aria-pressed": le,
+                          onClick: () => Rt(R),
+                          className: Yt({ active: le }),
+                          children: [
+                            /* @__PURE__ */ r("span", { className: "ds:min-w-0 ds:truncate", children: R.label }),
+                            le ? /* @__PURE__ */ r(
+                              ra,
+                              {
+                                "aria-hidden": "true",
+                                className: "ds:size-4 ds:shrink-0 ds:text-primary"
+                              }
+                            ) : null
+                          ]
+                        },
+                        R.label
+                      );
+                    });
+                    return yt && e.group ? /* @__PURE__ */ c(
+                      "div",
+                      {
+                        role: "group",
+                        "aria-labelledby": d,
+                        className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]",
+                        children: [
+                          /* @__PURE__ */ r(
+                            "div",
+                            {
+                              id: d,
+                              className: Ut(),
+                              children: e.group
+                            }
+                          ),
+                          o
+                        ]
+                      },
+                      e.group
+                    ) : /* @__PURE__ */ r(Gt, { children: o }, e.group || "_ungrouped");
+                  }) }) : null,
+                  /* @__PURE__ */ c("div", { role: "region", "aria-labelledby": Ie, children: [
+                    /* @__PURE__ */ r("span", { id: Ie, className: "ds:sr-only", children: n("inputs.dateRangePicker.gridLabel", "Calendar") }),
+                    /* @__PURE__ */ r(
+                      Ht,
+                      {
+                        mode: "range",
+                        selected: a.from ? { from: a.from, to: a.to } : void 0,
+                        onSelect: kt,
+                        month: lt,
+                        onMonthChange: X,
+                        numberOfMonths: He,
+                        weekStartsOn: M,
+                        disabled: gt,
+                        locale: u,
+                        showOutsideDays: !0,
+                        fixedWeeks: !0,
+                        pagedNavigation: !0,
+                        classNames: Xt,
+                        modifiers: ht,
+                        modifiersClassNames: Jt,
+                        components: { Chevron: Qt }
+                      }
+                    )
+                  ] })
+                ] }),
+                ge ? /* @__PURE__ */ c("div", { className: "ds:flex ds:flex-wrap ds:items-center ds:gap-[var(--spacing-sm)] ds:border-t ds:border-border ds:pt-[var(--spacing-sm)]", children: [
+                  /* @__PURE__ */ r(
+                    Vt,
+                    {
+                      id: ft,
+                      label: n(
+                        "inputs.dateRangePicker.compareLabel",
+                        "Compare to previous period"
+                      ),
+                      size: "sm",
+                      checked: ee,
+                      onCheckedChange: ae
+                    }
+                  ),
+                  T && v ? /* @__PURE__ */ c("span", { className: "ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)] ds:text-[length:var(--font-size-xs)] ds:text-muted-foreground", children: [
+                    /* @__PURE__ */ r(
+                      "span",
+                      {
+                        "aria-hidden": "true",
+                        className: "ds:inline-block ds:size-3 ds:rounded-[calc(var(--radius-sm)-2px)] ds:bg-[var(--calendar-compare-fill)] ds:border-b-2 ds:border-dashed ds:border-b-[var(--calendar-compare-edge)]"
+                      }
+                    ),
+                    `${h(v.from, p, { locale: u })} – ${h(v.to, p, { locale: u })}`
+                  ] }) : null,
+                  ee ? /* @__PURE__ */ r(
+                    z.Root,
+                    {
+                      value: De,
+                      onValueChange: bt,
+                      "aria-label": n(
+                        "inputs.dateRangePicker.compareModeLabel",
+                        "Comparison period"
+                      ),
+                      className: `${qe()} ds:ms-auto`,
+                      children: ia.map((e) => /* @__PURE__ */ r(
+                        z.Item,
+                        {
+                          value: e.value,
+                          className: je(),
+                          children: n(
+                            `inputs.dateRangePicker.compareMode.${e.value}`,
+                            e.fallback
+                          )
+                        },
+                        e.value
+                      ))
+                    }
+                  ) : null
+                ] }) : null,
+                /* @__PURE__ */ c("div", { className: "ds:flex ds:items-center ds:justify-between ds:gap-[var(--spacing-md)] ds:border-t ds:border-border ds:pt-[var(--spacing-sm)]", children: [
+                  /* @__PURE__ */ r(
+                    "div",
+                    {
+                      role: "status",
+                      "aria-live": "polite",
+                      className: "type-body-sm ds:min-w-0 ds:truncate ds:text-muted-foreground",
+                      children: St
+                    }
+                  ),
+                  /* @__PURE__ */ c("div", { className: "ds:flex ds:shrink-0 ds:gap-[var(--spacing-xs)]", children: [
+                    Ue ? /* @__PURE__ */ r(
+                      "button",
+                      {
+                        type: "button",
+                        onClick: xt,
+                        className: B({ intent: "ghost" }),
+                        children: n("inputs.dateRangePicker.clear", "Clear")
+                      }
+                    ) : null,
+                    m === "apply" ? /* @__PURE__ */ c(wt, { children: [
+                      /* @__PURE__ */ r(
+                        "button",
+                        {
+                          type: "button",
+                          onClick: oe,
+                          className: B({ intent: "ghost" }),
+                          children: n("inputs.dateRangePicker.cancel", "Cancel")
+                        }
+                      ),
+                      /* @__PURE__ */ r(
+                        "button",
+                        {
+                          type: "button",
+                          disabled: !Me,
+                          onClick: ne,
+                          className: B({ intent: "primary" }),
+                          children: n("inputs.dateRangePicker.apply", "Apply")
+                        }
+                      )
+                    ] }) : /* @__PURE__ */ r(
+                      "button",
+                      {
+                        type: "button",
+                        onClick: Dt,
+                        className: B({ intent: "primary" }),
+                        children: n("inputs.dateRangePicker.done", "Done")
+                      }
+                    )
+                  ] })
+                ] })
+              ] })
+            }
+          ) })
+        ]
+      }
+    ) });
+  }
+);
+da.displayName = "DateRangePicker";
+export {
+  da as D,
+  oa as d
+};
+//# sourceMappingURL=date-range-picker-Cfv4Sr63.js.map