@adyen/bento-vue3 1.68.2 → 1.69.0

package/dist/chunks/date-range-picker.l-CSmXBk.js

@@ -0,0 +1,1168 @@
+import { reactive as he, defineComponent as tt, ref as M, computed as S, onMounted as at, toRaw as Oe, resolveComponent as ve, createElementBlock as Me, openBlock as A, createElementVNode as Q, createCommentVNode as _, renderSlot as qe, createBlock as G, createVNode as H, withCtx as j, createTextVNode as ne, normalizeClass as Ce, toRef as $e, watch as ke, withDirectives as It, unref as p, withKeys as St, toDisplayString as Rt, createSlots as Et } from "vue";
+import { B as ht } from "./divider.DnKNNyWB.js";
+import { h as wt, B as kt } from "./toggle-button.ByyLw0Yf.js";
+import { B as nt, d as Ot } from "./typography.CFHvBR7L.js";
+import { e as P, a as Pe, g as Ae } from "./get-date-locale.CAyOIbcp.js";
+import { g as ge } from "./generate-uid.NJ8tVoha.js";
+import { u as Fe } from "./i18n.B6g5VX0q.js";
+import { e as rt, t as de, g as ye, i as B, h as C, j as Le, k as Mt, l as Ye, m as Ct, s as Ke, n as At, o as Qe, a as X, u as Ft, f as ue } from "./calendar.CYrrR8wd.js";
+import { f as je, v as Ut, D as h } from "./date-input.BqBdAO1E.js";
+import { r as O, t as V } from "./index.BrH1t1iu.js";
+import { u as Nt } from "./use-form-layout-loading.D3lALhtC.js";
+import { B as _t } from "./directive.Cbdox5VL.js";
+import { B as Bt } from "./input-field.6bH4yGb2.js";
+import { B as qt } from "./dropdown.Co86azLK.js";
+import { B as $t } from "./segmented-control.C6QyN2jS.js";
+import { d as Se } from "./debounce.DUTu11PS.js";
+import { u as Pt } from "./use-has-slot.B7eQSabc.js";
+import { _ as st } from "./_plugin-vue_export-helper.CHgC5LLL.js";
+import { D as Lt } from "./dropdown-default-textbox.DWgL31p1.js";
+import { F as Yt, E as Ge } from "./error-message.Cu4cIfdg.js";
+import { B as Kt } from "./button-actions.types.BptAXjD8.js";
+import "../assets/date-range-picker.css";
+function lt(e, a) {
+  O(2, arguments);
+  var o = de(a), r = o * 3;
+  return rt(e, r);
+}
+function He(e) {
+  O(1, arguments);
+  var a = V(e), o = Math.floor(a.getMonth() / 3) + 1;
+  return o;
+}
+function Ve(e) {
+  return O(1, arguments), V(e).getFullYear();
+}
+function Re(e, a) {
+  O(2, arguments);
+  var o = V(e), r = V(a);
+  return o.getTime() === r.getTime();
+}
+function Qt(e, a) {
+  O(2, arguments);
+  var o = ye(e), r = ye(a);
+  return o.getTime() === r.getTime();
+}
+function We(e) {
+  O(1, arguments);
+  var a = V(e);
+  return a.setMilliseconds(0), a;
+}
+function xe(e, a) {
+  O(2, arguments);
+  var o = We(e), r = We(a);
+  return o.getTime() === r.getTime();
+}
+function jt(e) {
+  return O(1, arguments), B(e, Date.now());
+}
+function Gt(e, a) {
+  O(2, arguments);
+  var o = V(e), r = de(a);
+  return o.setHours(r), o;
+}
+function ze(e, a) {
+  O(2, arguments);
+  var o = V(e), r = de(a);
+  return o.setMilliseconds(r), o;
+}
+function Ht(e, a) {
+  O(2, arguments);
+  var o = V(e), r = de(a);
+  return o.setMinutes(r), o;
+}
+function Vt(e, a) {
+  O(2, arguments);
+  var o = V(e), r = de(a);
+  return o.setSeconds(r), o;
+}
+function Wt(e, a) {
+  O(2, arguments);
+  var o = de(a);
+  return lt(e, -o);
+}
+function re(e) {
+  if (e == null)
+    return C(/* @__PURE__ */ new Date());
+  const [a, o, r] = e.split("-").map((d) => parseInt(d, 10));
+  return new Date(a, o - 1, r);
+}
+const xt = ({
+  firstDayOfWeek: e,
+  min: a,
+  max: o
+}) => ({ getGranularCalendarLimits: (d) => {
+  let f = C(a), c = P(o);
+  if ((d == null ? void 0 : d.type) === "weekly") {
+    if (d.earliest)
+      f = C(d.earliest);
+    else {
+      const y = Le(f, { weekStartsOn: e });
+      B(f, y) || (f = C(Mt(Ye(f, { weekStartsOn: e }), 1)));
+    }
+    if (d.latest)
+      c = P(d.latest);
+    else {
+      const y = Ye(c, { weekStartsOn: e });
+      B(c, y) || (c = P(Ct(Le(c, { weekStartsOn: e }), 1)));
+    }
+  }
+  if ((d == null ? void 0 : d.type) === "monthly") {
+    if (d.earliest)
+      f = C(d.earliest);
+    else {
+      const y = Ke(f);
+      B(f, y) || (f = Ke(rt(f, 1)));
+    }
+    if (d.latest)
+      c = P(d.latest);
+    else {
+      const y = Pe(c);
+      B(c, y) || (c = Pe(At(c, 1)));
+    }
+  }
+  if ((d == null ? void 0 : d.type) === "quarterly") {
+    if (d.earliest)
+      f = ye(d.earliest);
+    else {
+      const y = ye(f);
+      B(f, y) || (f = ye(lt(f, 1)));
+    }
+    if (d.latest)
+      c = P(d.latest);
+    else {
+      const y = Qe(c);
+      B(c, y) || (c = Qe(Wt(c, 1)));
+    }
+  }
+  return { min: f, max: c };
+} }), zt = () => {
+  const e = he({
+    daily: null,
+    weekly: null,
+    monthly: null,
+    quarterly: null
+  });
+  return {
+    savedRanges: e,
+    saveRange: (r, d) => {
+      e[r] = d;
+    },
+    resetSavedRanges: () => {
+      e.daily = null, e.weekly = null, e.monthly = null, e.quarterly = null;
+    }
+  };
+};
+var T = /* @__PURE__ */ ((e) => (e.CUSTOM_RANGE = "custom-range", e.INPUT = "input", e.ERROR = "error", e.FORM_DATE = "form-date", e.START_DATE_SELECTED = "start-date-selected", e))(T || {});
+const Jt = /[\d]/, Xt = /^\d{2}$/, Zt = /^\d{2}:\d{2}$/, ea = (e) => {
+  const { selectionStart: a } = e.target, o = ["Backspace", "Tab", "ArrowLeft", "ArrowRight"], r = Jt.test(e.key) || o.includes(e.key), d = [1, 2, 4, 5].includes(a) && e.key === ":";
+  !r && !d && e.preventDefault();
+}, Je = (e) => {
+  if (!e)
+    return e;
+  let a = e;
+  if (a.length === 1 && parseInt(e, 10) > 2)
+    return `0${a}:`;
+  const [o, r] = a.slice(-2);
+  return [2, 5].includes(a.length) && r === ":" && (a = `${a.slice(0, a.length - 2)}0${o}`), (Xt.test(a) || Zt.test(a)) && (a += ":"), a;
+}, Xe = {
+  "en-US": {
+    customRange: "Custom range",
+    daily: "Daily",
+    dateFrom: "Date from",
+    dateTo: "Date to",
+    lastMonth: "Last month",
+    lastSevenDays: "Last 7 days",
+    lastThreeMonths: "Last three months",
+    monthly: "Monthly",
+    quarterly: "Quarterly",
+    timeFrom: "Time from",
+    timeTo: "Time to",
+    weekly: "Weekly"
+  },
+  "ja-JP": {
+    customRange: "カスタム範囲を選択",
+    daily: "毎日",
+    lastMonth: "先月",
+    lastSevenDays: "過去7日間",
+    monthly: "毎月",
+    weekly: "毎週"
+  },
+  "pt-BR": {
+    customRange: "Selecione um intervalo personalizado",
+    daily: "Diário",
+    lastMonth: "Último mês",
+    lastSevenDays: "Últimos 7 dias",
+    monthly: "Mensal",
+    weekly: "Semanal"
+  }
+}, Ze = 300, et = "customRange", ta = tt({
+  i18n: { messages: Xe },
+  name: "date-range-picker-calendar",
+  components: {
+    BentoDropdown: qt,
+    BentoInputField: Bt,
+    BentoSegmentedControl: $t,
+    BentoTypography: nt,
+    Calendar: X
+  },
+  props: {
+    /**
+     * Allows user to enter time values in the form
+     */
+    allowTimeInput: { type: Boolean, default: !1 },
+    /**
+     * Ranges form persistance data
+     */
+    dateFormData: {
+      type: Object,
+      default: () => ({ startDate: void 0, endDate: void 0, startTime: void 0, endTime: void 0 })
+    },
+    /**
+     * Allows you to set the first day of the week. 0 is sunday, 1 is monday, 6 is saturday
+     */
+    firstDayOfWeek: X.props.firstDayOfWeek,
+    /**
+     * A list of available granularities.
+     * If present, the date picker will display a segmented control to change granularity.
+     */
+    granularities: {
+      type: Array,
+      default: null
+    },
+    /**
+     * Indicate if a date should be disabled or not
+     */
+    isDateDisabled: X.props.isDateDisabled,
+    /**
+     * Set a maximum number of dates to be selectable by the range.
+     */
+    maxRange: X.props.maxRange,
+    /**
+     * Sets a minimum limit for selectable dates - dates before `min` will not be selectable
+     */
+    min: X.props.min,
+    /**
+     * Sets a maximum limit for selectable dates - dates after `max` will not be selectable
+     */
+    max: X.props.max,
+    /**
+     * Number of months rendered on pane
+     */
+    numberOfMonths: X.props.numberOfMonths,
+    /**
+     * Displays the end date's month when the calendar is opened. Defaults to false i.e. the start date's month is displayed.
+     */
+    showEndDateOnOpen: { type: Boolean, default: !1 },
+    /**
+     * Enables the custom range selector.
+     * If provided, must be an array that sets the custom range dropdown items. Items are of the structure:
+     * `label` - label of custom range item.
+     * `value` - a unique key of the custom range item.
+     * `data` - an object `{ startDate: Date; endDate: Date }` to set the date picker range to upon selecting.
+     */
+    quickSelectRanges: {
+      type: Array,
+      default: void 0
+    },
+    /**
+     * Selected date
+     */
+    value: { type: Object, default: void 0 },
+    /**
+     * The type of calendar to display. Defaults to showing days.
+     */
+    variant: X.props.variant
+  },
+  emits: [
+    T.CUSTOM_RANGE,
+    T.INPUT,
+    T.ERROR,
+    T.FORM_DATE,
+    T.START_DATE_SELECTED
+  ],
+  setup(e, { emit: a, slots: o }) {
+    var Ue, Ne, _e, Be;
+    const { locale: r, t: d } = Fe({ messages: Xe }), f = Ae(), c = M({}), y = S(() => e.variant === "month" ? "monthly" : "daily"), n = he({
+      startDate: (Ue = e.value) == null ? void 0 : Ue.startDate,
+      endDate: (Ne = e.value) == null ? void 0 : Ne.endDate,
+      range: (_e = e.value) == null ? void 0 : _e.range,
+      ...e.granularities ? {
+        granularity: ((Be = e.value) == null ? void 0 : Be.granularity) || y.value
+      } : {}
+    });
+    function v(t) {
+      return t ? new Date(
+        t.getUTCFullYear(),
+        t.getUTCMonth(),
+        t.getUTCDate(),
+        t.getUTCHours(),
+        t.getUTCMinutes(),
+        t.getUTCSeconds()
+      ) : null;
+    }
+    const w = S(() => {
+      var t, l;
+      return (
+        // eslint-disable-next-line consistent-return
+        ((l = (t = e == null ? void 0 : e.quickSelectRanges) == null ? void 0 : t.find(({ value: i, data: u }) => {
+          var E;
+          if (!u.endDate) {
+            if (u.isRelativeToNow) {
+              const k = (E = c.value) == null ? void 0 : E[i];
+              return k ? Re(
+                v(k.startDate),
+                v(n.startDate)
+              ) && Re(
+                v(k.endDate),
+                v(n.endDate)
+              ) : (
+                // If not stored calculated dates, fall back to comparing the quick select item's value
+                // with the internal range's stored range identifier.
+                i === n.range
+              );
+            }
+            return Re(
+              v(u.startDate),
+              v(n.startDate)
+            ) && Re(
+              v(n.endDate),
+              v(P(n.endDate))
+            ) && jt(v(n.endDate));
+          }
+          if (e.allowTimeInput)
+            return xe(
+              v(u.startDate),
+              v(n.startDate)
+            ) && xe(v(u.endDate), v(n.endDate));
+          if (u.endDate)
+            return B(u.startDate, n.startDate) && B(u.endDate, n.endDate);
+        })) == null ? void 0 : l.value) ?? et
+      );
+    }), me = S(() => ({
+      "b-date-range-picker-calendar__form-input-wrapper": e.allowTimeInput
+    })), se = S(() => [
+      { label: d("customRange"), value: et },
+      ...e.quickSelectRanges ? e.quickSelectRanges : []
+    ]), q = S(
+      () => {
+        var t;
+        return ((t = e.granularities) == null ? void 0 : t.find(({ type: l }) => l === n.granularity)) || null;
+      }
+    ), R = S(
+      () => {
+        var t;
+        return ((t = e.granularities) == null ? void 0 : t.map(({ type: l, disabled: i }) => ({
+          label: d(l),
+          value: l,
+          disabled: i
+        }))) ?? [];
+      }
+    ), { getGranularCalendarLimits: W } = xt(e), m = S(
+      () => e.granularities ? W(q.value) : { min: C(e.min), max: P(e.max) }
+    ), {
+      adjustDateForQuarterly: Z,
+      adjustDateForMonthly: x,
+      adjustDateForWeekly: le,
+      adjustStartDateInputForWeekly: $,
+      adjustEndDateInputForWeekly: F,
+      adjustStartDateInputForMonthly: g,
+      adjustEndDateInputForMonthly: ce,
+      adjustStartDateInputForQuarterly: we,
+      adjustEndDateInputForQuarterly: oe
+    } = Ft(e.firstDayOfWeek), { savedRanges: z, saveRange: Te, resetSavedRanges: De } = zt(), b = (t) => t ? ue(t, h.NUMERIC_DATE_YEAR_FIRST, {
+      locale: f[r.value.substring(0, 2)] || f.enUS
+    }) : "", U = (t) => t ? ue(t, h.HOUR_MINUTE_SECONDS, {
+      locale: f[r.value.substring(0, 2)] || f.enUS
+    }) : "", ee = M(!1), te = M(!1), L = M(!1), Y = M(!1), s = he({
+      startDate: e.dateFormData.startDate,
+      endDate: e.dateFormData.endDate,
+      startTime: e.dateFormData.startTime,
+      endTime: e.dateFormData.endTime
+    }), pe = (t, l) => {
+      let i = new Date(t);
+      const [u, E, k] = l.split(":");
+      return i = Gt(i, parseInt(u, 10)), i = Ht(i, parseInt(E, 10)), i = Vt(i, parseInt(k, 10)), i;
+    }, be = (t) => /^(?:[01]\d|2[01234]):(?:[012345]\d):(?:[012345]\d)$/.test(t), ie = (t, l) => {
+      const i = () => {
+        if (l && I(l)) {
+          const u = pe(new Date(l), t);
+          if (e.min && u < ze(e.min, 0) || e.max && u > ze(e.max, 0))
+            return !1;
+        }
+        return !0;
+      };
+      return be(t) && i();
+    }, N = (t, l) => !l || !be(l) || e.variant === "month" ? t : pe(new Date(t), l), D = (t) => {
+      s.startTime = U(
+        e.min && e.allowTimeInput && B(e.min, t.startDate) ? e.min : C(t.startDate)
+      ), s.endTime = U(
+        e.max && e.allowTimeInput && B(e.max, t.endDate) ? e.max : P(t.endDate)
+      ), n.startDate = N(t.startDate, s.startTime), n.endDate = N(t.endDate, s.endTime), n.range = null, e.granularities && De(), a(T.INPUT, {
+        ...n,
+        range: w.value
+      });
+    }, I = (t) => {
+      const l = (u) => e.min && C(u) < C(e.min) || e.max && C(u) > C(e.max) ? !1 : e.isDateDisabled ? !e.isDateDisabled(C(u)) : !0;
+      return /^\d{4}-(0?[1-9]|1[012])-(0?[1-9]|[12][0-9]|3[01])$/.test(t) && l(new Date(t));
+    };
+    at(() => {
+      ee.value = !!(e.dateFormData.startDate && !I(e.dateFormData.startDate)), e.allowTimeInput ? L.value = !!(e.dateFormData.startTime && !ie(e.dateFormData.startTime, e.dateFormData.startDate)) : L.value = !1, te.value = !!(e.dateFormData.endDate && !I(e.dateFormData.endDate)), e.allowTimeInput ? Y.value = !!(e.dateFormData.endTime && !ie(e.dateFormData.endTime, e.dateFormData.endDate)) : Y.value = !1;
+    });
+    const ae = (t) => {
+      var l;
+      s.startDate = b(t), s.startTime ? L.value && (s.startTime = (l = e.dateFormData) == null ? void 0 : l.startTime) : s.startTime = U(t), ee.value = !1, L.value = !1, a(T.START_DATE_SELECTED, t);
+    }, J = (t) => {
+      var l;
+      s.endDate = b(t), s.endTime ? Y.value && (s.endTime = (l = e.dateFormData) == null ? void 0 : l.endTime) : s.endTime = U(P(t)), te.value = !1, Y.value = !1;
+    }, fe = (t) => {
+      const l = e.value[t];
+      if (l)
+        return l;
+      if (e.dateFormData[t] && I(e.dateFormData[t]))
+        return new Date(e.dateFormData[t]);
+    }, it = Se((t) => {
+      var l;
+      if (I(t)) {
+        let i = t;
+        switch (ee.value = !1, (l = q.value) == null ? void 0 : l.type) {
+          case "weekly":
+            i = $(
+              t,
+              b,
+              m.value.min,
+              m.value.max
+            ), s.startDate = i;
+            break;
+          case "monthly":
+            i = g(
+              t,
+              b,
+              m.value.min,
+              m.value.max
+            ), s.startDate = i;
+            break;
+          case "quarterly":
+            i = we(
+              t,
+              b,
+              m.value.min,
+              m.value.max
+            ), s.startDate = i;
+            break;
+        }
+        const u = re(i);
+        n.startDate = N(u, s.startTime), n.endDate = N(
+          re(s.endDate),
+          s.endTime
+        ), I(s.endDate) && (n.endDate = N(
+          re(s.endDate),
+          s.endTime
+        ));
+        const E = fe("endDate");
+        n.range = null, a(T.FORM_DATE, {
+          startDate: u,
+          endDate: E
+        }), a(T.INPUT, {
+          ...n,
+          range: w.value
+        });
+      } else
+        ee.value = !0, a(T.ERROR, { ...s });
+    }, Ze), ut = (t) => {
+      s.startDate = je(t), it(s.startDate);
+    }, dt = Se((t) => {
+      var l;
+      if (I(t)) {
+        let i = t;
+        switch (te.value = !1, (l = q.value) == null ? void 0 : l.type) {
+          case "weekly":
+            i = F(
+              t,
+              b,
+              m.value.min,
+              m.value.max
+            ), s.endDate = i;
+            break;
+          case "monthly":
+            i = ce(
+              t,
+              b,
+              m.value.min,
+              m.value.max
+            ), s.endDate = i;
+            break;
+          case "quarterly":
+            i = oe(
+              t,
+              b,
+              m.value.min,
+              m.value.max
+            ), s.endDate = i;
+            break;
+        }
+        const u = re(i);
+        n.endDate = N(u, s.endTime), I(s.startDate) && (n.startDate = N(
+          re(s.startDate),
+          s.startTime
+        ));
+        const E = fe("startDate");
+        n.range = null, a(T.FORM_DATE, {
+          startDate: E,
+          endDate: u
+        }), a(T.INPUT, {
+          ...n,
+          range: w.value
+        });
+      } else
+        te.value = !0, a(T.ERROR, { ...s });
+    }, Ze), mt = (t) => {
+      s.endDate = je(t), dt(s.endDate);
+    }, ct = (t) => {
+      Ut(t);
+    }, Dt = Se((t) => {
+      if (ie(t, e.dateFormData.startDate)) {
+        L.value = !1, n.startDate = N(n.startDate, t);
+        const l = fe("endDate");
+        a(T.FORM_DATE, {
+          startDate: n.startDate,
+          endDate: l,
+          startTime: t,
+          endTime: s.endTime ?? e.dateFormData.endTime
+        }), a(T.INPUT, {
+          ...n,
+          range: w.value
+        });
+      } else
+        L.value = !0, a(T.ERROR, { ...s });
+    }), ft = Se((t) => {
+      ie(t, e.dateFormData.endDate) ? (Y.value = !1, n.endDate = N(n.endDate, t), a(T.FORM_DATE, {
+        startDate: n.startDate,
+        endDate: n.endDate,
+        startTime: s.startTime ?? e.dateFormData.startTime,
+        endTime: t
+      }), a(T.INPUT, {
+        ...n,
+        range: w.value
+      })) : (Y.value = !0, a(T.ERROR, { ...s }));
+    }), vt = (t) => {
+      s.startTime = Je(t), Dt(s.startTime);
+    }, gt = (t) => {
+      s.endTime = Je(t), ft(s.endTime);
+    }, yt = (t) => {
+      ea(t);
+    }, Ie = (t, l, i, u) => {
+      n.startDate = t, n.endDate = l, i && (n.granularity = i), u && (n.range = u);
+    }, Tt = (t) => {
+      var i;
+      const l = (i = e.quickSelectRanges) == null ? void 0 : i.find(({ value: u }) => u === t);
+      if (l) {
+        De();
+        const u = l.data, E = u.endDate || (u.isRelativeToNow ? new Date(Date.now()) : P(new Date(Date.now()))), k = u.isRelativeToNow && u.timeDifference ? new Date(E.getTime() - u.timeDifference) : u.startDate;
+        s.endDate = b(E), s.startDate = b(k), Ie(k, E, null, t), e.granularities && (n.granularity = u.granularity || y.value), s.startTime = U(k), s.endTime = U(E), n.startDate = k, n.endDate = E, u.isRelativeToNow && (c.value = {
+          ...c.value,
+          [t]: {
+            startDate: k,
+            endDate: E
+          }
+        }), a(T.CUSTOM_RANGE, {
+          ...l.data,
+          startDate: k,
+          endDate: E,
+          range: l.value
+        });
+      }
+    }, pt = {
+      weekly: le,
+      monthly: x,
+      quarterly: Z
+    }, bt = (t) => {
+      const l = n.granularity;
+      if (n.granularity = t, l && Te(l, structuredClone(Oe(n))), n.startDate && n.endDate) {
+        switch (t) {
+          case "quarterly":
+          case "monthly":
+          case "weekly": {
+            if (z[t]) {
+              Ie(z[t].startDate, z[t].endDate, t);
+              break;
+            }
+            const { startDate: i, endDate: u } = pt[t](
+              n.startDate,
+              n.endDate,
+              m.value.min,
+              m.value.max
+            );
+            Ie(i, u, t);
+            break;
+          }
+          case "daily":
+            z.daily && Ie(z.daily.startDate, z.daily.endDate, t);
+            break;
+        }
+        s.startDate = b(n.startDate), s.endDate = b(n.endDate), a(T.INPUT, {
+          ...n,
+          range: w.value
+        });
+      }
+    };
+    return {
+      // Values
+      internalRangeDate: n,
+      dateTextInput: s,
+      endDateError: te,
+      endTimeError: Y,
+      granularityItems: R,
+      selectedGranularity: q,
+      computedMinMax: m,
+      selectedRangeSelectorValue: w,
+      startDateError: ee,
+      startTimeError: L,
+      quickSelectRangeDefaultItems: se,
+      formInputWrapperConditionalClasses: me,
+      // Methods
+      hasSlot: Pt(o),
+      t: d,
+      // Events
+      onDateInput: D,
+      onDateInputKeyDown: ct,
+      onEndDateInput: mt,
+      onEndDateSelected: J,
+      onEndTimeInput: gt,
+      onGranularityInput: bt,
+      onRangeSelectorInput: Tt,
+      onStartDateInput: ut,
+      onStartDateSelected: ae,
+      onStartTimeInput: vt,
+      onTimeInputKeyDown: yt
+    };
+  }
+}), aa = { class: "b-date-range-picker-calendar" }, na = { class: "b-date-range-picker-calendar__form-container" }, ra = { class: "b-date-range-picker-calendar__form" }, sa = { key: 0 }, la = { class: "b-date-range-picker-calendar__calendars-container" };
+function oa(e, a, o, r, d, f) {
+  const c = ve("bento-dropdown"), y = ve("bento-segmented-control"), n = ve("bento-typography"), v = ve("bento-input-field"), w = ve("calendar");
+  return A(), Me("div", aa, [
+    Q("div", na, [
+      Q("div", ra, [
+        e.hasSlot("title") ? qe(e.$slots, "title", { key: 0 }, void 0, !0) : _("", !0),
+        e.quickSelectRanges ? (A(), G(c, {
+          key: 1,
+          "aria-label": e.t("customRange"),
+          items: e.quickSelectRangeDefaultItems,
+          value: e.selectedRangeSelectorValue,
+          onInput: e.onRangeSelectorInput
+        }, null, 8, ["aria-label", "items", "value", "onInput"])) : _("", !0),
+        e.granularities ? (A(), G(y, {
+          key: 2,
+          items: e.granularityItems,
+          "model-value": e.internalRangeDate.granularity,
+          "full-width": "",
+          "onUpdate:modelValue": e.onGranularityInput
+        }, null, 8, ["items", "model-value", "onUpdate:modelValue"])) : _("", !0),
+        Q("div", null, [
+          H(n, {
+            stronger: "",
+            el: "span",
+            class: "b-date-range-picker-calendar__label"
+          }, {
+            default: j(() => a[0] || (a[0] = [
+              ne(" From ")
+            ])),
+            _: 1
+          }),
+          Q("div", {
+            class: Ce(e.formInputWrapperConditionalClasses)
+          }, [
+            H(v, {
+              "aria-label": e.t("dateFrom"),
+              value: e.dateTextInput.startDate,
+              error: e.startDateError,
+              class: "b-date-range-picker-calendar__form-input",
+              onInput: e.onStartDateInput,
+              onKeydown: e.onDateInputKeyDown
+            }, {
+              description: j(() => a[1] || (a[1] = [
+                ne("YYYY-MM-DD")
+              ])),
+              _: 1
+            }, 8, ["aria-label", "value", "error", "onInput", "onKeydown"]),
+            e.allowTimeInput ? (A(), G(v, {
+              key: 0,
+              "aria-label": e.t("timeFrom"),
+              value: e.dateTextInput.startTime,
+              error: e.startTimeError,
+              class: "b-date-range-picker-calendar__form-input",
+              onInput: e.onStartTimeInput,
+              onKeydown: e.onTimeInputKeyDown
+            }, {
+              description: j(() => a[2] || (a[2] = [
+                ne("HH:MM:SS")
+              ])),
+              _: 1
+            }, 8, ["aria-label", "value", "error", "onInput", "onKeydown"])) : _("", !0)
+          ], 2)
+        ]),
+        Q("div", null, [
+          H(n, {
+            stronger: "",
+            el: "span",
+            class: "b-date-range-picker-calendar__label"
+          }, {
+            default: j(() => a[3] || (a[3] = [
+              ne(" To ")
+            ])),
+            _: 1
+          }),
+          Q("div", {
+            class: Ce(e.formInputWrapperConditionalClasses)
+          }, [
+            H(v, {
+              class: "b-date-range-picker-calendar__form-input",
+              "aria-label": e.t("dateTo"),
+              value: e.dateTextInput.endDate,
+              error: e.endDateError,
+              onInput: e.onEndDateInput,
+              onKeydown: e.onDateInputKeyDown
+            }, {
+              description: j(() => a[4] || (a[4] = [
+                ne("YYYY-MM-DD")
+              ])),
+              _: 1
+            }, 8, ["aria-label", "value", "error", "onInput", "onKeydown"]),
+            e.allowTimeInput ? (A(), G(v, {
+              key: 0,
+              "aria-label": e.t("timeTo"),
+              value: e.dateTextInput.endTime,
+              error: e.endTimeError,
+              class: "b-date-range-picker-calendar__form-input",
+              onInput: e.onEndTimeInput,
+              onKeydown: e.onTimeInputKeyDown
+            }, {
+              description: j(() => a[5] || (a[5] = [
+                ne("HH:MM:SS")
+              ])),
+              _: 1
+            }, 8, ["aria-label", "value", "error", "onInput", "onKeydown"])) : _("", !0)
+          ], 2)
+        ])
+      ]),
+      e.hasSlot("actions") ? (A(), Me("div", sa, [
+        qe(e.$slots, "actions", {}, void 0, !0)
+      ])) : _("", !0)
+    ]),
+    Q("div", la, [
+      H(w, {
+        value: e.internalRangeDate,
+        "first-day-of-week": e.firstDayOfWeek,
+        "is-date-disabled": e.isDateDisabled,
+        "max-range": e.maxRange,
+        min: e.computedMinMax.min,
+        max: e.computedMinMax.max,
+        "number-of-months": e.numberOfMonths,
+        "show-end-date-on-open": e.showEndDateOnOpen,
+        granularity: e.selectedGranularity,
+        variant: e.variant,
+        "is-range": "",
+        onInput: e.onDateInput,
+        onStartDateSelected: e.onStartDateSelected,
+        onEndDateSelected: e.onEndDateSelected
+      }, null, 8, ["value", "first-day-of-week", "is-date-disabled", "max-range", "min", "max", "number-of-months", "show-end-date-on-open", "granularity", "variant", "onInput", "onStartDateSelected", "onEndDateSelected"])
+    ])
+  ]);
+}
+const K = /* @__PURE__ */ st(ta, [["render", oa], ["__scopeId", "data-v-cd1ab02c"]]), ia = ({
+  datePickerValue: e,
+  isDateIncorrect: a,
+  quickSelectRanges: o,
+  isMonthVariant: r
+}) => {
+  var se, q, R, W;
+  const { locale: d, t: f } = Fe(), c = Ae(), y = (m) => !!m && !isNaN(m.getTime()), n = (m, Z) => y(m) ? ue(m, Z, {
+    locale: c[d.value.substring(0, 2)] || c.enUS
+  }) : void 0, v = he({
+    startDate: n((se = e.value) == null ? void 0 : se.startDate, h.NUMERIC_DATE_YEAR_FIRST),
+    endDate: n((q = e.value) == null ? void 0 : q.endDate, h.NUMERIC_DATE_YEAR_FIRST),
+    startTime: n((R = e.value) == null ? void 0 : R.startDate, h.HOUR_MINUTE_SECONDS),
+    endTime: n((W = e.value) == null ? void 0 : W.endDate, h.HOUR_MINUTE_SECONDS)
+  });
+  return {
+    // Values
+    dateDisplayValue: S(() => {
+      var le;
+      if (a.value)
+        return `${v.startDate || ""} - ${v.endDate || ""}`;
+      if (!e.value || !e.value.startDate && !e.value.endDate)
+        return f("selectDateRange");
+      if ((le = o.value) != null && le.length) {
+        const $ = o.value.find(({ value: F }) => {
+          var g;
+          return F === ((g = e.value) == null ? void 0 : g.range);
+        });
+        if ($)
+          return $.label;
+      }
+      if (e.value.granularity === "quarterly") {
+        const { startDate: $, endDate: F } = e.value, g = f("quarter", { quarter: He($), year: Ve($) });
+        if (Qt($, F))
+          return g;
+        const ce = f("quarter", { quarter: He(F), year: Ve(F) });
+        return `${g} - ${ce}`;
+      }
+      const { startDate: m, endDate: Z } = v, x = r != null && r.value ? h.LONG_MONTH_YEAR : h.FULL_DATE_MONTH_FIRST;
+      return `${n(re(m), x)} - ${n(
+        re(Z),
+        x
+      )}`;
+    }),
+    textInputDisplayValue: v,
+    // Methods
+    formatTextInputDisplayValue: () => ""
+  };
+};
+var Ee = /* @__PURE__ */ ((e) => (e.INPUT = "input", e))(Ee || {});
+const ot = {
+  "en-US": {
+    apply: "Apply",
+    cancel: "Cancel",
+    dateRangePicker: "Date range picker {name}",
+    provideDateInAFormat: "Provide date in a YYYY-MM-DD format",
+    quarter: "Q{quarter} {year}",
+    selectDate: "Select a date",
+    selectDateRange: "Select a date range",
+    selectedDateIsNotAvailable: "Selected date is not available"
+  },
+  "ja-JP": {
+    apply: "適用",
+    cancel: "キャンセル",
+    selectDate: "日付を選択"
+  },
+  "pt-BR": {
+    apply: "Aplicar",
+    cancel: "Cancelar",
+    selectDate: "Selecione uma data"
+  }
+}, ua = { class: "b-date-range-picker" }, da = { class: "b-date-range-picker__footer" }, ma = {
+  i18n: { messages: ot },
+  name: "bento-date-range-picker"
+}, ca = /* @__PURE__ */ tt({
+  ...ma,
+  props: {
+    /**
+     * Allows user to enter time values in the form
+     */
+    allowTimeInput: { type: Boolean, default: !1 },
+    /**
+     * Descriptive supporting text visbile underneath the dropdown.
+     */
+    description: { type: String, default: void 0 },
+    /**
+     * Disables dropdown functionality.
+     */
+    disabled: { type: Boolean, default: !1 },
+    /**
+     * Displays component in an error state with an error message
+     */
+    errorMessage: { type: String, default: null },
+    /**
+     * Allows user to set the first day of the week. 0 is sunday, 1 is monday, 6 is saturday
+     */
+    firstDayOfWeek: K.props.firstDayOfWeek,
+    /**
+     * A list of available granularities.
+     * If present, the date picker will display a segmented control to change granularity.
+     */
+    granularities: K.props.granularities,
+    /**
+     * Indicate if a date should be disabled or not
+     */
+    isDateDisabled: K.props.isDateDisabled,
+    /**
+     * Text that is displayed as a label above the element.
+     */
+    label: { type: String, default: void 0 },
+    /**
+     * Upon opening date range picker, end date's month will be pre-selected.
+     */
+    showEndDateOnOpen: { type: Boolean, default: !1 },
+    /**
+     * Highlights the dropdown is optional.
+     */
+    optional: { type: Boolean, default: !1 },
+    /**
+     * The Boolean readonly property, when present, makes the element not mutable, meaning the user can not edit the date range picker.
+     */
+    readonly: { type: Boolean, default: !1 },
+    /**
+     * Highlights the dropdown is required.
+     */
+    required: { type: Boolean, default: !1 },
+    /**
+     * Adds a info icon next to the label to display the passed tooltip message.
+     */
+    tooltipText: { type: String, default: null },
+    /**
+     * Enables the range selector.
+     * If provided, must be an array that sets the custom range dropdown items. Items are of the structure:
+     * `label` - label of custom range item.
+     * `value` - a unique key of the custom range item.
+     * `data` - an object `{ startDate: Date; endDate: Date }` to set the date picker range to upon selecting.
+     */
+    quickSelectRanges: {
+      type: Array,
+      default: void 0
+    },
+    /**
+     * Set a maximum number of dates to be selectable by the range.
+     */
+    maxRange: K.props.maxRange,
+    /**
+     * Sets a minimum limit for selectable dates - dates before `min` will not be selectable
+     */
+    min: K.props.min,
+    /**
+     * Sets a maximum limit for selectable dates - dates after `max` will not be selectable
+     */
+    max: K.props.max,
+    /**
+     * Number of months rendered on pane
+     */
+    numberOfMonths: K.props.numberOfMonths,
+    /**
+     * Selected date
+     */
+    value: K.props.value,
+    /**
+     * The type of calendar to display. Defaults to showing days.
+     */
+    variant: {
+      type: String,
+      default: void 0
+      // Default will be set by @/internal/calendar
+    },
+    /**
+     * Enables the date picker selection to persist until it is explicitly applied.
+     * Displays a set of buttons: Apply and Cancel.
+     *
+     * @deprecated This will be the default behaviour in v2.0.0.
+     */
+    hasActions: { type: Boolean, default: !1 }
+  },
+  emits: [Ee.INPUT],
+  setup(e, { emit: a }) {
+    const o = a, r = e, { locale: d, t: f } = Fe({ messages: ot }), c = Ae(), y = ge("bento-date-range-picker-container"), n = ge("bento-date-range-picker-label"), v = ge("bento-date-range-picker-description"), w = ge("bento-date-range-picker-error"), me = ge("bento-date-range-picker-date-error"), se = S(() => r.label || f("dateRangePicker", { name: y })), q = S(() => (r == null ? void 0 : r.quickSelectRanges) && r.quickSelectRanges.map((D) => {
+      const I = D.data.endDate ? void 0 : new Date(Date.now()).getTime() - D.data.startDate.getTime();
+      return {
+        ...D,
+        data: {
+          ...D.data,
+          // Adding timeDifference to calculate an up-to-date endDate on range selection
+          timeDifference: I
+        }
+      };
+    })), R = M(!1), W = M(null), m = M(!1), { isReadOnly: Z } = Nt($e(r, "readonly"));
+    ke(
+      () => r.disabled,
+      () => {
+        r.disabled && m.value && (m.value = !1);
+      }
+    );
+    const x = S(() => r.hasActions ? !U.value && R.value : R.value), le = S(() => ({
+      "b-date-range-picker__description--error": !!r.errorMessage || x.value
+    })), $ = S(() => r.variant === "month"), { dateDisplayValue: F, textInputDisplayValue: g } = ia({
+      datePickerValue: $e(r, "value"),
+      isDateIncorrect: R,
+      quickSelectRanges: q,
+      isMonthVariant: $
+    }), ce = S(
+      () => `${r.description ? v : ""} ${r.errorMessage ? w : ""} ${R.value ? me : ""}`.trim() || null
+    ), we = S(() => r.allowTimeInput && r.variant !== "month"), oe = () => {
+      m.value = !1;
+    }, z = () => {
+      m.value = !0;
+    }, Te = M(F.value), De = M(
+      // textInputDisplayValue is a reactive object
+      structuredClone(Oe(g))
+    ), b = M(r.value), U = M(!0), ee = S(
+      () => r.hasActions ? De.value : g
+    ), te = S(
+      () => r.hasActions ? Te.value : F.value
+    );
+    at(() => {
+      if (r.hasActions || Ot(
+        'BentoDateRangePicker "hasActions" property',
+        `Set the BentoDateRangePicker "hasActions" property true which will display the "Apply" and "Cancel" buttons.
+                        This will be the default behavior in the v2 and "hasActions" will be removed.`,
+        "2.0.0"
+      ), r.granularities && r.variant !== "month" && r.granularities.find(({ type: D }) => D === "quarterly"))
+        throw new Error('Quarterly granularity is only supported by BentoDateRangePicker with variant: "month"');
+    }), ke(
+      () => r.value,
+      () => {
+        Te.value = F.value, De.value = structuredClone(Oe(g));
+      }
+    );
+    const L = S(() => [
+      {
+        title: f("apply"),
+        event: () => {
+          o(Ee.INPUT, b.value), oe(), U.value = !0;
+        },
+        disabled: U.value
+      },
+      {
+        title: f("cancel"),
+        event: oe
+      }
+    ]);
+    ke(b, (D) => {
+      if (r.hasActions) {
+        U.value = R.value;
+        return;
+      }
+      o(Ee.INPUT, D);
+    });
+    const Y = (D) => {
+      R.value = !1;
+      const I = (ae, J) => ae ? ue(ae, J, {
+        locale: c[d.value.substring(0, 2)] || c.enUS
+      }) : void 0;
+      g.startDate = I(D.startDate, h.NUMERIC_DATE_YEAR_FIRST), g.endDate = I(D.endDate, h.NUMERIC_DATE_YEAR_FIRST), g.startTime = I(D.startDate, h.HOUR_MINUTE_SECONDS), g.endTime = I(D.endDate, h.HOUR_MINUTE_SECONDS), b.value = D;
+    }, s = async () => {
+      R.value && (R.value = !1), b.value = null;
+    }, pe = () => {
+      if (!m.value) {
+        m.value = !0;
+        return;
+      }
+      R.value || (m.value = !1);
+    }, be = (D) => {
+      R.value = !1, D.startTime && (g.startTime = D.startTime), D.endTime && (g.endTime = D.endTime);
+    }, ie = (D) => {
+      R.value = !0, g.startDate = D.startDate, g.endDate = D.endDate, b.value = { startDate: null, endDate: null };
+    }, N = (D) => {
+      if (D) {
+        const I = (J, fe) => J ? ue(J, fe, {
+          locale: c[d.value.substring(0, 2)] || c.enUS
+        }) : void 0, ae = (J) => ue(J, h.NUMERIC_DATE_YEAR_FIRST, {
+          locale: c[d.value.substring(0, 2)] || c.enUS
+        });
+        g.startDate = ae(D.startDate), g.endDate = ae(D.endDate), g.startTime = I(
+          D.startDate,
+          h.HOUR_MINUTE_SECONDS
+        ), g.endTime = I(D.endDate, h.HOUR_MINUTE_SECONDS), b.value = D;
+      }
+    };
+    return (D, I) => It((A(), Me("div", ua, [
+      e.label ? (A(), G(p(Yt), {
+        key: 0,
+        id: p(n),
+        label: e.label,
+        "tooltip-text": e.tooltipText,
+        optional: e.optional,
+        required: e.required
+      }, null, 8, ["id", "label", "tooltip-text", "optional", "required"])) : _("", !0),
+      Q("div", {
+        onKeydown: St(pe, ["enter"])
+      }, [
+        H(p(Lt), {
+          ref_key: "inputContainerRef",
+          ref: W,
+          "always-combobox-is-input": "",
+          ariaControls: p(y),
+          ariaExpanded: m.value,
+          "aria-labelledby": e.label ? p(n) : null,
+          "aria-describedby": ce.value,
+          disabled: e.disabled,
+          "is-invalid": !!e.errorMessage || x.value,
+          open: m.value,
+          "display-value": te.value,
+          readonly: p(Z),
+          onOpen: z,
+          onClear: s,
+          onClose: oe
+        }, null, 8, ["ariaControls", "ariaExpanded", "aria-labelledby", "aria-describedby", "disabled", "is-invalid", "open", "display-value", "readonly"])
+      ], 32),
+      x.value ? (A(), G(p(Ge), {
+        key: 1,
+        id: p(me),
+        "error-message": p(f)("provideDateInAFormat"),
+        class: "b-date-range-picker__error-message"
+      }, null, 8, ["id", "error-message"])) : _("", !0),
+      e.errorMessage ? (A(), G(p(Ge), {
+        key: 2,
+        id: p(w),
+        "error-message": e.errorMessage,
+        class: "b-date-range-picker__error-message"
+      }, null, 8, ["id", "error-message"])) : _("", !0),
+      e.description ? (A(), G(p(nt), {
+        key: 3,
+        id: p(v),
+        class: Ce(["b-date-range-picker__description", le.value]),
+        el: "span"
+      }, {
+        default: j(() => [
+          ne(Rt(e.description), 1)
+        ]),
+        _: 1
+      }, 8, ["id", "class"])) : _("", !0),
+      W.value ? (A(), G(p(wt), {
+        key: 4,
+        id: p(y),
+        class: "b-date-range-picker__container",
+        open: m.value,
+        "target-element": W.value,
+        "disable-focus-trap": !0,
+        "aria-label": se.value,
+        position: "bottom-start",
+        "without-space": "",
+        "fit-content": ""
+      }, {
+        default: j(() => [
+          H(p(K), {
+            "allow-time-input": we.value,
+            "quick-select-ranges": q.value,
+            value: e.value,
+            "first-day-of-week": e.firstDayOfWeek,
+            granularities: e.granularities,
+            "is-date-disabled": e.isDateDisabled,
+            "max-range": e.maxRange,
+            min: e.min,
+            max: e.max,
+            "number-of-months": e.numberOfMonths,
+            "show-end-date-on-open": e.showEndDateOnOpen,
+            "date-form-data": ee.value,
+            variant: e.variant,
+            onCustomRange: N,
+            onInput: Y,
+            onError: ie,
+            onFormDate: be
+          }, Et({ _: 2 }, [
+            e.hasActions ? {
+              name: "actions",
+              fn: j(() => [
+                H(p(ht)),
+                Q("div", da, [
+                  H(p(kt), {
+                    actions: L.value,
+                    layout: p(Kt).SPACE_BETWEEN
+                  }, null, 8, ["actions", "layout"])
+                ])
+              ]),
+              key: "0"
+            } : void 0
+          ]), 1032, ["allow-time-input", "quick-select-ranges", "value", "first-day-of-week", "granularities", "is-date-disabled", "max-range", "min", "max", "number-of-months", "show-end-date-on-open", "date-form-data", "variant"])
+        ]),
+        _: 1
+      }, 8, ["id", "open", "target-element", "aria-label"])) : _("", !0)
+    ])), [
+      [p(_t), oe]
+    ]);
+  }
+}), Na = /* @__PURE__ */ st(ca, [["__scopeId", "data-v-73c96c17"]]);
+export {
+  Na as B,
+  K as D,
+  Ee as a,
+  jt as b,
+  Re as i
+};
+//# sourceMappingURL=date-range-picker.l-CSmXBk.js.map