@adyen/bento-vue3 1.72.0 → 1.74.0

package/dist/chunks/date-range-picker.cmg75lC-.js

@@ -0,0 +1,1117 @@
+import { reactive as he, defineComponent as nt, ref as F, computed as S, onMounted as rt, toRaw as Oe, resolveComponent as ve, createElementBlock as _e, openBlock as U, createElementVNode as H, createCommentVNode as q, renderSlot as Pe, createBlock as W, createVNode as z, withCtx as V, createTextVNode as oe, normalizeClass as Ce, toRef as ke, watch as Me, withDirectives as bt, unref as I, withKeys as Le, toDisplayString as Rt, createSlots as St } from "vue";
+import { B as Et } from "./divider.DnKNNyWB.js";
+import { h as wt, B as ht } from "./button-actions.BQ3AFQqt.js";
+import { B as st, d as kt } from "./typography.yBEME_Gu.js";
+import { D as Mt } from "./dropdown-default-textbox.MkU0tMf1.js";
+import { e as L, a as Ye, g as Fe } from "./get-date-locale.CAyOIbcp.js";
+import { g as ge } from "./generate-uid.NJ8tVoha.js";
+import { u as Ae } from "./index.pdBj0KQU.js";
+import { e as lt, t as fe, g as ye, i as $, h as A, j as je, k as Ot, l as Ke, m as _t, s as Qe, n as Ct, o as Ge, b as ae, u as Ft, f as ce } from "./calendar.Cqjyxc69.js";
+import { f as He, v as At, D as k } from "./date-format.B8RU7D42.js";
+import { r as _, t as J } from "./index.BrH1t1iu.js";
+import { u as Ut } from "./use-form-layout-loading.D3lALhtC.js";
+import { B as Nt } from "./directive.Cbdox5VL.js";
+import { B as Bt } from "./input-field.D_tADgPG.js";
+import { B as qt } from "./dropdown.bLsoTZbw.js";
+import { B as $t } from "./segmented-control.BCHGDSrf.js";
+import { d as Se } from "./debounce.DUTu11PS.js";
+import { u as Pt } from "./use-has-slot.B7eQSabc.js";
+import { _ as ot } from "./_plugin-vue_export-helper.CHgC5LLL.js";
+import { F as Lt, E as Ve } from "./field-label.C97CrBI_.js";
+import { B as Yt } from "./button-actions.types.BptAXjD8.js";
+import "../assets/date-range-picker.css";
+function it(e, a) {
+  _(2, arguments);
+  var u = fe(a), r = u * 3;
+  return lt(e, r);
+}
+function We(e) {
+  _(1, arguments);
+  var a = J(e), u = Math.floor(a.getMonth() / 3) + 1;
+  return u;
+}
+function ze(e) {
+  return _(1, arguments), J(e).getFullYear();
+}
+function Ee(e, a) {
+  _(2, arguments);
+  var u = J(e), r = J(a);
+  return u.getTime() === r.getTime();
+}
+function jt(e, a) {
+  _(2, arguments);
+  var u = ye(e), r = ye(a);
+  return u.getTime() === r.getTime();
+}
+function Je(e) {
+  _(1, arguments);
+  var a = J(e);
+  return a.setMilliseconds(0), a;
+}
+function Xe(e, a) {
+  _(2, arguments);
+  var u = Je(e), r = Je(a);
+  return u.getTime() === r.getTime();
+}
+function Kt(e) {
+  return _(1, arguments), $(e, Date.now());
+}
+function Qt(e, a) {
+  _(2, arguments);
+  var u = J(e), r = fe(a);
+  return u.setHours(r), u;
+}
+function Ze(e, a) {
+  _(2, arguments);
+  var u = J(e), r = fe(a);
+  return u.setMilliseconds(r), u;
+}
+function Gt(e, a) {
+  _(2, arguments);
+  var u = J(e), r = fe(a);
+  return u.setMinutes(r), u;
+}
+function Ht(e, a) {
+  _(2, arguments);
+  var u = J(e), r = fe(a);
+  return u.setSeconds(r), u;
+}
+function Vt(e, a) {
+  _(2, arguments);
+  var u = fe(a);
+  return it(e, -u);
+}
+function ie(e) {
+  if (e == null)
+    return A(/* @__PURE__ */ new Date());
+  const [a, u, r] = e.split("-").map((m) => parseInt(m, 10));
+  return new Date(a, u - 1, r);
+}
+const Wt = ({
+  firstDayOfWeek: e,
+  min: a,
+  max: u
+}) => ({ getGranularCalendarLimits: (m) => {
+  let D = A(a), c = L(u);
+  if ((m == null ? void 0 : m.type) === "weekly") {
+    if (m.earliest)
+      D = A(m.earliest);
+    else {
+      const g = je(D, { weekStartsOn: e });
+      $(D, g) || (D = A(Ot(Ke(D, { weekStartsOn: e }), 1)));
+    }
+    if (m.latest)
+      c = L(m.latest);
+    else {
+      const g = Ke(c, { weekStartsOn: e });
+      $(c, g) || (c = L(_t(je(c, { weekStartsOn: e }), 1)));
+    }
+  }
+  if ((m == null ? void 0 : m.type) === "monthly") {
+    if (m.earliest)
+      D = A(m.earliest);
+    else {
+      const g = Qe(D);
+      $(D, g) || (D = Qe(lt(D, 1)));
+    }
+    if (m.latest)
+      c = L(m.latest);
+    else {
+      const g = Ye(c);
+      $(c, g) || (c = Ye(Ct(c, 1)));
+    }
+  }
+  if ((m == null ? void 0 : m.type) === "quarterly") {
+    if (m.earliest)
+      D = ye(m.earliest);
+    else {
+      const g = ye(D);
+      $(D, g) || (D = ye(it(D, 1)));
+    }
+    if (m.latest)
+      c = L(m.latest);
+    else {
+      const g = Ge(c);
+      $(c, g) || (c = Ge(Vt(c, 1)));
+    }
+  }
+  return { min: D, max: c };
+} }), zt = () => {
+  const e = he({
+    daily: null,
+    weekly: null,
+    monthly: null,
+    quarterly: null
+  });
+  return {
+    savedRanges: e,
+    saveRange: (r, m) => {
+      e[r] = m;
+    },
+    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}$/, xt = (e) => {
+  const { selectionStart: a } = e.target, u = ["Backspace", "Tab", "ArrowLeft", "ArrowRight"], r = Jt.test(e.key) || u.includes(e.key), m = [1, 2, 4, 5].includes(a) && e.key === ":";
+  !r && !m && e.preventDefault();
+}, xe = (e) => {
+  if (!e)
+    return e;
+  let a = e;
+  if (a.length === 1 && parseInt(e, 10) > 2)
+    return `0${a}:`;
+  const [u, r] = a.slice(-2);
+  return [2, 5].includes(a.length) && r === ":" && (a = `${a.slice(0, a.length - 2)}0${u}`), (Xt.test(a) || Zt.test(a)) && (a += ":"), a;
+}, et = {
+  "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"
+  }
+}, tt = 300, at = "customRange", ea = nt({
+  i18n: { messages: et },
+  name: "date-range-picker-calendar",
+  components: {
+    BentoDropdown: qt,
+    BentoInputField: Bt,
+    BentoSegmentedControl: $t,
+    BentoTypography: st,
+    Calendar: ae
+  },
+  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: ae.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: ae.props.isDateDisabled,
+    /**
+     * Set a maximum number of dates to be selectable by the range.
+     */
+    maxRange: ae.props.maxRange,
+    /**
+     * Sets a minimum limit for selectable dates - dates before `min` will not be selectable
+     */
+    min: ae.props.min,
+    /**
+     * Sets a maximum limit for selectable dates - dates after `max` will not be selectable
+     */
+    max: ae.props.max,
+    /**
+     * Number of months rendered on pane
+     */
+    numberOfMonths: ae.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: ae.props.variant
+  },
+  emits: [
+    T.CUSTOM_RANGE,
+    T.INPUT,
+    T.ERROR,
+    T.FORM_DATE,
+    T.START_DATE_SELECTED
+  ],
+  setup(e, { emit: a, slots: u }) {
+    var Ne, Be, qe, $e;
+    const { locale: r, t: m } = Ae({ messages: et }), D = Fe(), c = F({}), g = S(() => e.variant === "month" ? "monthly" : "daily"), n = he({
+      startDate: (Ne = e.value) == null ? void 0 : Ne.startDate,
+      endDate: (Be = e.value) == null ? void 0 : Be.endDate,
+      range: (qe = e.value) == null ? void 0 : qe.range,
+      ...e.granularities ? {
+        granularity: (($e = e.value) == null ? void 0 : $e.granularity) || g.value
+      } : {}
+    });
+    function y(t) {
+      return t ? new Date(
+        t.getUTCFullYear(),
+        t.getUTCMonth(),
+        t.getUTCDate(),
+        t.getUTCHours(),
+        t.getUTCMinutes(),
+        t.getUTCSeconds()
+      ) : null;
+    }
+    const b = 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: d, data: i }) => {
+          var h;
+          if (!i.endDate) {
+            if (i.isRelativeToNow) {
+              const O = (h = c.value) == null ? void 0 : h[d];
+              return O ? Ee(
+                y(O.startDate),
+                y(n.startDate)
+              ) && Ee(
+                y(O.endDate),
+                y(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.
+                d === n.range
+              );
+            }
+            return Ee(
+              y(i.startDate),
+              y(n.startDate)
+            ) && Ee(
+              y(n.endDate),
+              y(L(n.endDate))
+            ) && Kt(y(n.endDate)) && (e.granularities ? i.granularity === n.granularity : !0);
+          }
+          if (e.allowTimeInput)
+            return Xe(
+              y(i.startDate),
+              y(n.startDate)
+            ) && Xe(
+              y(i.endDate),
+              y(n.endDate)
+            ) && (e.granularities ? i.granularity === n.granularity : !0);
+          if (i.endDate)
+            return $(i.startDate, n.startDate) && $(i.endDate, n.endDate) && (e.granularities ? i.granularity === n.granularity : !0);
+        })) == null ? void 0 : l.value) ?? at
+      );
+    }), Y = S(() => ({
+      "b-date-range-picker-calendar__form-input-wrapper": e.allowTimeInput
+    })), Te = S(() => [
+      { label: m("customRange"), value: at },
+      ...e.quickSelectRanges ? e.quickSelectRanges : []
+    ]), X = S(
+      () => {
+        var t;
+        return ((t = e.granularities) == null ? void 0 : t.find(({ type: l }) => l === n.granularity)) || null;
+      }
+    ), w = S(
+      () => {
+        var t;
+        return ((t = e.granularities) == null ? void 0 : t.map(({ type: l, disabled: d }) => ({
+          label: m(l),
+          value: l,
+          disabled: d
+        }))) ?? [];
+      }
+    ), { getGranularCalendarLimits: Z } = Wt(e), f = S(
+      () => e.granularities ? Z(X.value) : { min: A(e.min), max: L(e.max) }
+    ), {
+      adjustDateForQuarterly: ue,
+      adjustDateForMonthly: M,
+      adjustDateForWeekly: ne,
+      adjustStartDateInputForWeekly: x,
+      adjustEndDateInputForWeekly: de,
+      adjustStartDateInputForMonthly: ee,
+      adjustEndDateInputForMonthly: p,
+      adjustStartDateInputForQuarterly: me,
+      adjustEndDateInputForQuarterly: j
+    } = Ft(e.firstDayOfWeek), { savedRanges: P, saveRange: re, resetSavedRanges: C } = zt(), v = (t) => {
+      var l;
+      return t ? ce(t, k.NUMERIC_DATE_YEAR_FIRST, {
+        locale: D[(l = r.value) == null ? void 0 : l.substring(0, 2)] || D.enUS
+      }) : "";
+    }, E = (t) => {
+      var l;
+      return t ? ce(t, k.HOUR_MINUTE_SECONDS, {
+        locale: D[(l = r.value) == null ? void 0 : l.substring(0, 2)] || D.enUS
+      }) : "";
+    }, K = F(!1), se = F(!1), Q = F(!1), G = F(!1), o = he({
+      startDate: e.dateFormData.startDate,
+      endDate: e.dateFormData.endDate,
+      startTime: e.dateFormData.startTime,
+      endTime: e.dateFormData.endTime
+    }), pe = (t, l) => {
+      let d = new Date(t);
+      const [i, h, O] = l.split(":");
+      return d = Qt(d, parseInt(i, 10)), d = Gt(d, parseInt(h, 10)), d = Ht(d, parseInt(O, 10)), d;
+    }, Ie = (t) => /^(?:[01]\d|2[01234]):(?:[012345]\d):(?:[012345]\d)$/.test(t), De = (t, l) => {
+      const d = () => {
+        if (l && R(l)) {
+          const i = pe(new Date(l), t);
+          if (e.min && i < Ze(e.min, 0) || e.max && i > Ze(e.max, 0))
+            return !1;
+        }
+        return !0;
+      };
+      return Ie(t) && d();
+    }, N = (t, l) => !l || !Ie(l) || e.variant === "month" ? t : pe(new Date(t), l), s = (t) => {
+      o.startTime = E(
+        e.min && e.allowTimeInput && $(e.min, t.startDate) ? e.min : A(t.startDate)
+      ), o.endTime = E(
+        e.max && e.allowTimeInput && $(e.max, t.endDate) ? e.max : L(t.endDate)
+      ), n.startDate = N(t.startDate, o.startTime), n.endDate = N(t.endDate, o.endTime), n.range = null, e.granularities && C(), a(T.INPUT, {
+        ...n,
+        range: b.value
+      });
+    }, R = (t) => {
+      const l = (i) => e.min && A(i) < A(e.min) || e.max && A(i) > A(e.max) ? !1 : e.isDateDisabled ? !e.isDateDisabled(A(i)) : !0;
+      return /^\d{4}-(0?[1-9]|1[012])-(0?[1-9]|[12][0-9]|3[01])$/.test(t) && l(new Date(t));
+    };
+    rt(() => {
+      K.value = !!(e.dateFormData.startDate && !R(e.dateFormData.startDate)), e.allowTimeInput ? Q.value = !!(e.dateFormData.startTime && !De(e.dateFormData.startTime, e.dateFormData.startDate)) : Q.value = !1, se.value = !!(e.dateFormData.endDate && !R(e.dateFormData.endDate)), e.allowTimeInput ? G.value = !!(e.dateFormData.endTime && !De(e.dateFormData.endTime, e.dateFormData.endDate)) : G.value = !1;
+    });
+    const le = (t) => {
+      var l;
+      o.startDate = v(t), o.startTime ? Q.value && (o.startTime = (l = e.dateFormData) == null ? void 0 : l.startTime) : o.startTime = E(t), K.value = !1, Q.value = !1, a(T.START_DATE_SELECTED, t);
+    }, te = (t) => {
+      var l;
+      o.endDate = v(t), o.endTime ? G.value && (o.endTime = (l = e.dateFormData) == null ? void 0 : l.endTime) : o.endTime = E(L(t)), se.value = !1, G.value = !1;
+    }, B = (t) => {
+      const l = e.value[t];
+      if (l)
+        return l;
+      if (e.dateFormData[t] && R(e.dateFormData[t]))
+        return new Date(e.dateFormData[t]);
+    }, be = Se((t) => {
+      var l;
+      if (R(t)) {
+        let d = t;
+        switch (K.value = !1, (l = X.value) == null ? void 0 : l.type) {
+          case "weekly":
+            d = x(
+              t,
+              v,
+              f.value.min,
+              f.value.max
+            ), o.startDate = d;
+            break;
+          case "monthly":
+            d = ee(
+              t,
+              v,
+              f.value.min,
+              f.value.max
+            ), o.startDate = d;
+            break;
+          case "quarterly":
+            d = me(
+              t,
+              v,
+              f.value.min,
+              f.value.max
+            ), o.startDate = d;
+            break;
+        }
+        const i = ie(d);
+        n.startDate = N(i, o.startTime), n.endDate = N(
+          ie(o.endDate),
+          o.endTime
+        ), R(o.endDate) && (n.endDate = N(
+          ie(o.endDate),
+          o.endTime
+        ));
+        const h = B("endDate");
+        n.range = null, a(T.FORM_DATE, {
+          startDate: i,
+          endDate: h
+        }), a(T.INPUT, {
+          ...n,
+          range: b.value
+        });
+      } else
+        K.value = !0, a(T.ERROR, { ...o });
+    }, tt), ut = (t) => {
+      o.startDate = He(t), be(o.startDate);
+    }, dt = Se((t) => {
+      var l;
+      if (R(t)) {
+        let d = t;
+        switch (se.value = !1, (l = X.value) == null ? void 0 : l.type) {
+          case "weekly":
+            d = de(
+              t,
+              v,
+              f.value.min,
+              f.value.max
+            ), o.endDate = d;
+            break;
+          case "monthly":
+            d = p(
+              t,
+              v,
+              f.value.min,
+              f.value.max
+            ), o.endDate = d;
+            break;
+          case "quarterly":
+            d = j(
+              t,
+              v,
+              f.value.min,
+              f.value.max
+            ), o.endDate = d;
+            break;
+        }
+        const i = ie(d);
+        n.endDate = N(i, o.endTime), R(o.startDate) && (n.startDate = N(
+          ie(o.startDate),
+          o.startTime
+        ));
+        const h = B("startDate");
+        n.range = null, a(T.FORM_DATE, {
+          startDate: h,
+          endDate: i
+        }), a(T.INPUT, {
+          ...n,
+          range: b.value
+        });
+      } else
+        se.value = !0, a(T.ERROR, { ...o });
+    }, tt), mt = (t) => {
+      o.endDate = He(t), dt(o.endDate);
+    }, Dt = (t) => {
+      At(t);
+    }, ct = Se((t) => {
+      if (De(t, e.dateFormData.startDate)) {
+        Q.value = !1, n.startDate = N(n.startDate, t);
+        const l = B("endDate");
+        a(T.FORM_DATE, {
+          startDate: n.startDate,
+          endDate: l,
+          startTime: t,
+          endTime: o.endTime ?? e.dateFormData.endTime
+        }), a(T.INPUT, {
+          ...n,
+          range: b.value
+        });
+      } else
+        Q.value = !0, a(T.ERROR, { ...o });
+    }), ft = Se((t) => {
+      De(t, e.dateFormData.endDate) ? (G.value = !1, n.endDate = N(n.endDate, t), a(T.FORM_DATE, {
+        startDate: n.startDate,
+        endDate: n.endDate,
+        startTime: o.startTime ?? e.dateFormData.startTime,
+        endTime: t
+      }), a(T.INPUT, {
+        ...n,
+        range: b.value
+      })) : (G.value = !0, a(T.ERROR, { ...o }));
+    }), vt = (t) => {
+      o.startTime = xe(t), ct(o.startTime);
+    }, gt = (t) => {
+      o.endTime = xe(t), ft(o.endTime);
+    }, yt = (t) => {
+      xt(t);
+    }, Re = (t, l, d, i) => {
+      n.startDate = t, n.endDate = l, d && (n.granularity = d), i && (n.range = i);
+    }, Tt = (t) => {
+      var d;
+      const l = (d = e.quickSelectRanges) == null ? void 0 : d.find(({ value: i }) => i === t);
+      if (l) {
+        C();
+        const i = l.data, h = i.endDate || (i.isRelativeToNow ? new Date(Date.now()) : L(new Date(Date.now()))), O = i.isRelativeToNow && i.timeDifference ? new Date(h.getTime() - i.timeDifference) : i.startDate;
+        o.endDate = v(h), o.startDate = v(O), Re(O, h, null, t), e.granularities && (n.granularity = i.granularity || g.value), o.startTime = E(O), o.endTime = E(h), n.startDate = O, n.endDate = h, i.isRelativeToNow && (c.value = {
+          ...c.value,
+          [t]: {
+            startDate: O,
+            endDate: h
+          }
+        }), a(T.CUSTOM_RANGE, {
+          ...l.data,
+          startDate: O,
+          endDate: h,
+          range: l.value
+        });
+      }
+    }, pt = {
+      weekly: ne,
+      monthly: M,
+      quarterly: ue
+    }, It = (t) => {
+      const l = n.granularity;
+      if (n.granularity = t, l && re(l, structuredClone(Oe(n))), n.startDate && n.endDate) {
+        switch (t) {
+          case "quarterly":
+          case "monthly":
+          case "weekly": {
+            if (P[t]) {
+              Re(P[t].startDate, P[t].endDate, t);
+              break;
+            }
+            const { startDate: d, endDate: i } = pt[t](
+              n.startDate,
+              n.endDate,
+              f.value.min,
+              f.value.max
+            );
+            Re(d, i, t);
+            break;
+          }
+          case "daily":
+            P.daily && Re(P.daily.startDate, P.daily.endDate, t);
+            break;
+        }
+        o.startDate = v(n.startDate), o.endDate = v(n.endDate), a(T.INPUT, {
+          ...n,
+          range: b.value
+        });
+      }
+    };
+    return {
+      // Values
+      internalRangeDate: n,
+      dateTextInput: o,
+      endDateError: se,
+      endTimeError: G,
+      granularityItems: w,
+      selectedGranularity: X,
+      computedMinMax: f,
+      selectedRangeSelectorValue: b,
+      startDateError: K,
+      startTimeError: Q,
+      quickSelectRangeDefaultItems: Te,
+      formInputWrapperConditionalClasses: Y,
+      // Methods
+      hasSlot: Pt(u),
+      t: m,
+      // Events
+      onDateInput: s,
+      onDateInputKeyDown: Dt,
+      onEndDateInput: mt,
+      onEndDateSelected: te,
+      onEndTimeInput: gt,
+      onGranularityInput: It,
+      onRangeSelectorInput: Tt,
+      onStartDateInput: ut,
+      onStartDateSelected: le,
+      onStartTimeInput: vt,
+      onTimeInputKeyDown: yt
+    };
+  }
+}), ta = { class: "b-date-range-picker-calendar" }, aa = { class: "b-date-range-picker-calendar__form-container" }, na = { class: "b-date-range-picker-calendar__form" }, ra = { key: 0 }, sa = { class: "b-date-range-picker-calendar__calendars-container" };
+function la(e, a, u, r, m, D) {
+  const c = ve("bento-dropdown"), g = ve("bento-segmented-control"), n = ve("bento-typography"), y = ve("bento-input-field"), b = ve("calendar");
+  return U(), _e("div", ta, [
+    H("div", aa, [
+      H("div", na, [
+        e.hasSlot("title") ? Pe(e.$slots, "title", { key: 0 }, void 0, !0) : q("", !0),
+        e.quickSelectRanges ? (U(), W(c, {
+          key: 1,
+          "aria-label": e.t("customRange"),
+          items: e.quickSelectRangeDefaultItems,
+          value: e.selectedRangeSelectorValue,
+          onInput: e.onRangeSelectorInput
+        }, null, 8, ["aria-label", "items", "value", "onInput"])) : q("", !0),
+        e.granularities ? (U(), W(g, {
+          key: 2,
+          items: e.granularityItems,
+          "model-value": e.internalRangeDate.granularity,
+          "full-width": "",
+          "onUpdate:modelValue": e.onGranularityInput
+        }, null, 8, ["items", "model-value", "onUpdate:modelValue"])) : q("", !0),
+        H("div", null, [
+          z(n, {
+            stronger: "",
+            el: "span",
+            class: "b-date-range-picker-calendar__label"
+          }, {
+            default: V(() => a[0] || (a[0] = [
+              oe(" From ")
+            ])),
+            _: 1
+          }),
+          H("div", {
+            class: Ce(e.formInputWrapperConditionalClasses)
+          }, [
+            z(y, {
+              "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: V(() => a[1] || (a[1] = [
+                oe("YYYY-MM-DD")
+              ])),
+              _: 1
+            }, 8, ["aria-label", "value", "error", "onInput", "onKeydown"]),
+            e.allowTimeInput ? (U(), W(y, {
+              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: V(() => a[2] || (a[2] = [
+                oe("HH:MM:SS")
+              ])),
+              _: 1
+            }, 8, ["aria-label", "value", "error", "onInput", "onKeydown"])) : q("", !0)
+          ], 2)
+        ]),
+        H("div", null, [
+          z(n, {
+            stronger: "",
+            el: "span",
+            class: "b-date-range-picker-calendar__label"
+          }, {
+            default: V(() => a[3] || (a[3] = [
+              oe(" To ")
+            ])),
+            _: 1
+          }),
+          H("div", {
+            class: Ce(e.formInputWrapperConditionalClasses)
+          }, [
+            z(y, {
+              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: V(() => a[4] || (a[4] = [
+                oe("YYYY-MM-DD")
+              ])),
+              _: 1
+            }, 8, ["aria-label", "value", "error", "onInput", "onKeydown"]),
+            e.allowTimeInput ? (U(), W(y, {
+              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: V(() => a[5] || (a[5] = [
+                oe("HH:MM:SS")
+              ])),
+              _: 1
+            }, 8, ["aria-label", "value", "error", "onInput", "onKeydown"])) : q("", !0)
+          ], 2)
+        ])
+      ]),
+      e.hasSlot("actions") ? (U(), _e("div", ra, [
+        Pe(e.$slots, "actions", {}, void 0, !0)
+      ])) : q("", !0)
+    ]),
+    H("div", sa, [
+      z(b, {
+        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 oa = /* @__PURE__ */ ot(ea, [["render", la], ["__scopeId", "data-v-dd07a8f5"]]), Ue = {
+  "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"
+  }
+}, ia = ({
+  datePickerValue: e,
+  isDateIncorrect: a,
+  quickSelectRanges: u,
+  isMonthVariant: r,
+  withTimeInput: m,
+  placeholder: D
+}) => {
+  var w, Z, f, ue;
+  const { locale: c, t: g } = Ae({ messages: Ue }), n = Fe(), y = (M) => !!M && !isNaN(M.getTime()), b = (M, ne) => {
+    var x;
+    return y(M) ? ce(M, ne, {
+      locale: n[(x = c.value) == null ? void 0 : x.substring(0, 2)] || n.enUS
+    }) : void 0;
+  }, Y = he({
+    startDate: b((w = e.value) == null ? void 0 : w.startDate, k.NUMERIC_DATE_YEAR_FIRST),
+    endDate: b((Z = e.value) == null ? void 0 : Z.endDate, k.NUMERIC_DATE_YEAR_FIRST),
+    startTime: b((f = e.value) == null ? void 0 : f.startDate, k.HOUR_MINUTE_SECONDS),
+    endTime: b((ue = e.value) == null ? void 0 : ue.endDate, k.HOUR_MINUTE_SECONDS)
+  });
+  return {
+    // Values
+    dateDisplayValue: S(() => {
+      var re;
+      if (a.value)
+        return `${Y.startDate || ""} - ${Y.endDate || ""}`;
+      if (!e.value || !e.value.startDate && !e.value.endDate)
+        return (D == null ? void 0 : D.value) || g("selectDateRange");
+      if ((re = u.value) != null && re.length) {
+        const C = u.value.find(({ value: v }) => {
+          var E;
+          return v === ((E = e.value) == null ? void 0 : E.range);
+        });
+        if (C)
+          return C.label;
+      }
+      if (e.value.granularity === "quarterly") {
+        const { startDate: C, endDate: v } = e.value, E = g("quarter", { quarter: We(C), year: ze(C) });
+        if (jt(C, v))
+          return E;
+        const K = g("quarter", { quarter: We(v), year: ze(v) });
+        return `${E} - ${K}`;
+      }
+      const { startDate: M, endDate: ne, startTime: x, endTime: de } = Y, ee = r != null && r.value ? k.LONG_MONTH_YEAR : k.FULL_DATE_MONTH_FIRST, p = b(ie(M), ee), me = b(ie(ne), ee);
+      if (!m.value)
+        return `${p} - ${me}`;
+      const j = [p, x].filter(Boolean).join(", "), P = [me, de].filter(Boolean).join(", ");
+      return `${j} - ${P}`;
+    }),
+    textInputDisplayValue: Y,
+    // Methods
+    formatTextInputDisplayValue: () => ""
+  };
+};
+var we = /* @__PURE__ */ ((e) => (e.INPUT = "input", e))(we || {});
+const ua = { class: "b-date-range-picker" }, da = { class: "b-date-range-picker__footer" }, ma = {
+  i18n: { messages: Ue },
+  name: "bento-date-range-picker"
+}, Da = /* @__PURE__ */ nt({
+  ...ma,
+  props: {
+    allowTimeInput: { type: Boolean },
+    firstDayOfWeek: { default: 1 },
+    granularities: {},
+    isDateDisabled: { type: Function, default: void 0 },
+    showEndDateOnOpen: { type: Boolean, default: !1 },
+    quickSelectRanges: { default: void 0 },
+    maxRange: { default: null },
+    min: { default: null },
+    max: { default: null },
+    numberOfMonths: { default: void 0 },
+    value: { default: null },
+    variant: { default: void 0 },
+    hasActions: { type: Boolean, default: !1 },
+    description: { default: void 0 },
+    disabled: { type: Boolean, default: !1 },
+    errorMessage: { default: null },
+    label: { default: void 0 },
+    optional: { type: Boolean, default: !1 },
+    placeholder: { default: null },
+    readonly: { type: Boolean, default: !1 },
+    required: { type: Boolean, default: !1 },
+    tooltipText: { default: null }
+  },
+  emits: [we.INPUT],
+  setup(e, { emit: a }) {
+    const u = a, r = e, { locale: m, t: D } = Ae({ messages: Ue }), c = Fe(), g = ge("bento-date-range-picker-container"), n = ge("bento-date-range-picker-label"), y = ge("bento-date-range-picker-description"), b = ge("bento-date-range-picker-error"), Y = ge("bento-date-range-picker-date-error"), Te = S(() => r.label || D("dateRangePicker", { name: g })), X = S(() => (r == null ? void 0 : r.quickSelectRanges) && r.quickSelectRanges.map((s) => {
+      const R = s.data.endDate ? void 0 : new Date(Date.now()).getTime() - s.data.startDate.getTime();
+      return {
+        ...s,
+        data: {
+          ...s.data,
+          // Adding timeDifference to calculate an up-to-date endDate on range selection
+          timeDifference: R
+        }
+      };
+    })), w = F(!1), Z = F(null), f = F(!1), { isReadOnly: ue } = Ut(ke(r, "readonly"));
+    Me(
+      () => r.disabled,
+      () => {
+        r.disabled && f.value && (f.value = !1);
+      }
+    );
+    const M = S(() => r.hasActions ? !E.value && w.value : w.value), ne = S(() => ({
+      "b-date-range-picker__description--error": !!r.errorMessage || M.value
+    })), x = S(() => r.variant === "month"), de = S(() => r.allowTimeInput && r.variant !== "month"), { dateDisplayValue: ee, textInputDisplayValue: p } = ia({
+      datePickerValue: ke(r, "value"),
+      isDateIncorrect: w,
+      quickSelectRanges: X,
+      isMonthVariant: x,
+      withTimeInput: de,
+      placeholder: ke(r, "placeholder")
+    }), me = S(
+      () => `${r.description ? y : ""} ${r.errorMessage ? b : ""} ${w.value ? Y : ""}`.trim() || null
+    ), j = () => {
+      f.value = !1;
+    }, P = () => {
+      f.value = !0;
+    }, re = F(ee.value), C = F(
+      // textInputDisplayValue is a reactive object
+      structuredClone(Oe(p))
+    ), v = F(r.value), E = F(!0), K = S(
+      () => r.hasActions ? C.value : p
+    ), se = S(
+      () => r.hasActions ? re.value : ee.value
+    );
+    rt(() => {
+      if (r.hasActions || kt(
+        '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: s }) => s === "quarterly"))
+        throw new Error('Quarterly granularity is only supported by BentoDateRangePicker with variant: "month"');
+    }), Me(
+      () => r.value,
+      () => {
+        re.value = ee.value, C.value = structuredClone(Oe(p));
+      }
+    );
+    const Q = S(() => [
+      {
+        title: D("apply"),
+        event: () => {
+          u(we.INPUT, v.value), j(), E.value = !0;
+        },
+        disabled: E.value
+      },
+      {
+        title: D("cancel"),
+        event: j
+      }
+    ]);
+    Me(v, (s) => {
+      if (r.hasActions) {
+        E.value = w.value;
+        return;
+      }
+      u(we.INPUT, s);
+    });
+    const G = (s) => {
+      w.value = !1;
+      const R = (le, te) => {
+        var B;
+        return le ? ce(le, te, {
+          locale: c[(B = m.value) == null ? void 0 : B.substring(0, 2)] || c.enUS
+        }) : void 0;
+      };
+      p.startDate = R(s.startDate, k.NUMERIC_DATE_YEAR_FIRST), p.endDate = R(s.endDate, k.NUMERIC_DATE_YEAR_FIRST), p.startTime = R(s.startDate, k.HOUR_MINUTE_SECONDS), p.endTime = R(s.endDate, k.HOUR_MINUTE_SECONDS), v.value = s;
+    }, o = async () => {
+      w.value && (w.value = !1), v.value = null;
+    }, pe = () => {
+      if (!f.value) {
+        f.value = !0;
+        return;
+      }
+      w.value || (f.value = !1);
+    }, Ie = (s) => {
+      w.value = !1, s.startTime && (p.startTime = s.startTime), s.endTime && (p.endTime = s.endTime);
+    }, De = (s) => {
+      w.value = !0, p.startDate = s.startDate, p.endDate = s.endDate, v.value = { startDate: null, endDate: null };
+    }, N = (s) => {
+      if (s) {
+        const R = (te, B) => {
+          var be;
+          return te ? ce(te, B, {
+            locale: c[(be = m.value) == null ? void 0 : be.substring(0, 2)] || c.enUS
+          }) : void 0;
+        }, le = (te) => {
+          var B;
+          return ce(te, k.NUMERIC_DATE_YEAR_FIRST, {
+            locale: c[(B = m.value) == null ? void 0 : B.substring(0, 2)] || c.enUS
+          });
+        };
+        p.startDate = le(s.startDate), p.endDate = le(s.endDate), p.startTime = R(
+          s.startDate,
+          k.HOUR_MINUTE_SECONDS
+        ), p.endTime = R(s.endDate, k.HOUR_MINUTE_SECONDS), v.value = s;
+      }
+    };
+    return (s, R) => bt((U(), _e("div", ua, [
+      s.label ? (U(), W(I(Lt), {
+        key: 0,
+        id: I(n),
+        label: s.label,
+        "tooltip-text": s.tooltipText,
+        optional: s.optional,
+        required: s.required
+      }, null, 8, ["id", "label", "tooltip-text", "optional", "required"])) : q("", !0),
+      H("div", {
+        onKeydown: Le(pe, ["enter"])
+      }, [
+        z(I(Mt), {
+          ref_key: "inputContainerRef",
+          ref: Z,
+          "always-combobox-is-input": "",
+          ariaControls: I(g),
+          ariaExpanded: f.value,
+          "aria-labelledby": s.label ? I(n) : null,
+          "aria-describedby": me.value,
+          disabled: s.disabled,
+          "is-invalid": !!s.errorMessage || M.value,
+          open: f.value,
+          "display-value": se.value,
+          readonly: I(ue),
+          onOpen: P,
+          onClear: o,
+          onClose: j
+        }, null, 8, ["ariaControls", "ariaExpanded", "aria-labelledby", "aria-describedby", "disabled", "is-invalid", "open", "display-value", "readonly"])
+      ], 32),
+      M.value ? (U(), W(I(Ve), {
+        key: 1,
+        id: I(Y),
+        "error-message": I(D)("provideDateInAFormat"),
+        class: "b-date-range-picker__error-message"
+      }, null, 8, ["id", "error-message"])) : q("", !0),
+      s.errorMessage ? (U(), W(I(Ve), {
+        key: 2,
+        id: I(b),
+        "error-message": s.errorMessage,
+        class: "b-date-range-picker__error-message"
+      }, null, 8, ["id", "error-message"])) : q("", !0),
+      s.description ? (U(), W(I(st), {
+        key: 3,
+        id: I(y),
+        class: Ce(["b-date-range-picker__description", ne.value]),
+        el: "span"
+      }, {
+        default: V(() => [
+          oe(Rt(s.description), 1)
+        ]),
+        _: 1
+      }, 8, ["id", "class"])) : q("", !0),
+      Z.value ? (U(), W(I(wt), {
+        key: 4,
+        id: I(g),
+        class: "b-date-range-picker__container",
+        open: f.value,
+        "target-element": Z.value,
+        "aria-label": Te.value,
+        position: "bottom-start",
+        "without-space": "",
+        "fit-content": "",
+        "trap-all": "",
+        onKeydown: Le(j, ["esc", "native"])
+      }, {
+        default: V(() => [
+          z(I(oa), {
+            "allow-time-input": de.value,
+            "quick-select-ranges": X.value,
+            value: s.value,
+            "first-day-of-week": s.firstDayOfWeek,
+            granularities: s.granularities,
+            "is-date-disabled": s.isDateDisabled,
+            "max-range": s.maxRange,
+            min: s.min,
+            max: s.max,
+            "number-of-months": s.numberOfMonths,
+            "show-end-date-on-open": s.showEndDateOnOpen,
+            "date-form-data": K.value,
+            variant: s.variant,
+            onCustomRange: N,
+            onInput: G,
+            onError: De,
+            onFormDate: Ie
+          }, St({ _: 2 }, [
+            s.hasActions ? {
+              name: "actions",
+              fn: V(() => [
+                z(I(Et)),
+                H("div", da, [
+                  z(I(ht), {
+                    actions: Q.value,
+                    layout: I(Yt).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"])) : q("", !0)
+    ])), [
+      [I(Nt), j]
+    ]);
+  }
+}), Ua = /* @__PURE__ */ ot(Da, [["__scopeId", "data-v-a569926c"]]);
+export {
+  Ua as B,
+  oa as D,
+  we as a,
+  Kt as b,
+  Ee as i
+};
+//# sourceMappingURL=date-range-picker.cmg75lC-.js.map