@adyen/bento-vue3 1.89.2 → 1.90.0

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

@@ -0,0 +1,998 @@
+import { reactive as Me, defineComponent as Xe, useSlots as ga, ref as C, computed as f, onMounted as Ze, openBlock as I, createElementBlock as fe, createElementVNode as Q, normalizeClass as ve, unref as u, renderSlot as Be, createCommentVNode as w, createBlock as x, createVNode as U, withCtx as K, createTextVNode as ne, toDisplayString as Se, toRaw as we, watch as ye, useAttrs as Ta, toRef as Re, withDirectives as ha, withKeys as Ce, createSlots as Ya } from "vue";
+import { j as Aa } from "./index.DDwcHPb6.js";
+import { B as ba } from "./divider.BIY84UH7.js";
+import { h as Ra, B as ka } from "./button-actions.Bh_PZ_fV.js";
+import { B as Fe, d as Ne } from "./typography.B3J6_tYk.js";
+import { D as Ia } from "./dropdown-default-textbox.aYsTZDZ7.js";
+import { g as te } from "./generate-uid.DBWe4g6T.js";
+import { u as Ee } from "./index.B875RXHM.js";
+import { e as ea, f as re, i as q, h, j as Sa, k as Pe, l as wa, s as xe, m as Fa, n as Ue, b as P, u as Ea, o as F, g as Oa } from "./calendar.CH-1Vgeb.js";
+import { u as Oe, a as _a } from "./use-date-input-formatter.BiIraXZZ.js";
+import { t as G, n as qa, c as Ba } from "./en-US.CCazFVNP.js";
+import { u as Ca } from "./use-form-layout-loading.CWbjZiwP.js";
+import { B as Na } from "./directive.Dpivxq_t.js";
+import { u as Pa } from "./form-field.D_2g7vaP.js";
+import { B as Ge } from "./input-field.DnYjM6yy.js";
+import { B as Le, i as Ve } from "./input-time.DeJ8lDio.js";
+import { B as xa } from "./dropdown.Do-mZiI6.js";
+import { B as Ua } from "./segmented-control.CQWOO1-J.js";
+import { d as Je } from "./debounce.DUTu11PS.js";
+import { u as Ga } from "./use-has-slot.CyMiImRQ.js";
+import { e as N, a as Qe } from "./differenceInMonths.s_znQQpw.js";
+import { s as je } from "./startOfWeek.Cvmo-f5J.js";
+import { c as La } from "./constructNow.D9uRk678.js";
+import { _ as aa } from "./_plugin-vue_export-helper.CHgC5LLL.js";
+import { F as Va, E as ze } from "./error-message.849uzpkq.js";
+import { B as Ja } from "./button-actions.types.BptAXjD8.js";
+import "../assets/date-range-picker.css";
+function ta(t, m, c) {
+  return ea(t, m * 3, c);
+}
+function We(t, m) {
+  const c = G(t, m?.in);
+  return Math.trunc(c.getMonth() / 3) + 1;
+}
+function $e(t, m) {
+  return G(t, m?.in).getFullYear();
+}
+function ke(t, m) {
+  return +G(t) == +G(m);
+}
+function Qa(t, m, c) {
+  const [s, a] = qa(
+    c?.in,
+    t,
+    m
+  );
+  return +re(s) == +re(a);
+}
+function He(t, m) {
+  const c = G(t, m?.in);
+  return c.setMilliseconds(0), c;
+}
+function Ie(t, m) {
+  return +He(t) == +He(m);
+}
+function ja(t, m) {
+  return q(
+    Ba(t, t),
+    La(t)
+  );
+}
+function za(t, m, c) {
+  const s = G(t, c?.in);
+  return s.setHours(m), s;
+}
+function Ke(t, m, c) {
+  const s = G(t, c?.in);
+  return s.setMilliseconds(m), s;
+}
+function Wa(t, m, c) {
+  const s = G(t, c?.in);
+  return s.setMinutes(m), s;
+}
+function $a(t, m, c) {
+  const s = G(t, c?.in);
+  return s.setSeconds(m), s;
+}
+function Ha(t, m, c) {
+  return ta(t, -1, c);
+}
+const Ka = ({
+  firstDayOfWeek: t,
+  min: m,
+  max: c
+}) => ({ getGranularCalendarLimits: (a) => {
+  if (!m && !c)
+    return { min: null, max: null };
+  let i = m ? h(m) : null, D = c ? N(c) : null;
+  if (a?.type === "weekly") {
+    if (a.earliest)
+      i = h(a.earliest);
+    else if (i) {
+      const v = je(i, { weekStartsOn: t });
+      q(i, v) || (i = h(Sa(Pe(i, { weekStartsOn: t }), 1)));
+    }
+    if (a.latest)
+      D = N(a.latest);
+    else if (D) {
+      const v = Pe(D, { weekStartsOn: t });
+      q(D, v) || (D = N(wa(je(D, { weekStartsOn: t }), 1)));
+    }
+  }
+  if (a?.type === "monthly") {
+    if (a.earliest)
+      i = h(a.earliest);
+    else if (i) {
+      const v = xe(i);
+      q(i, v) || (i = xe(ea(i, 1)));
+    }
+    if (a.latest)
+      D = N(a.latest);
+    else if (D) {
+      const v = Qe(D);
+      q(D, v) || (D = Qe(Fa(D, 1)));
+    }
+  }
+  if (a?.type === "quarterly") {
+    if (a.earliest)
+      i = re(a.earliest);
+    else if (i) {
+      const v = re(i);
+      q(i, v) || (i = re(ta(i, 1)));
+    }
+    if (a.latest)
+      D = N(a.latest);
+    else if (D) {
+      const v = Ue(D);
+      q(D, v) || (D = Ue(Ha(D)));
+    }
+  }
+  return { min: i, max: D };
+} }), Xa = () => {
+  const t = Me({
+    daily: null,
+    weekly: null,
+    monthly: null,
+    quarterly: null
+  });
+  return {
+    savedRanges: t,
+    saveRange: (s, a) => {
+      t[s] = a;
+    },
+    resetSavedRanges: () => {
+      t.daily = null, t.weekly = null, t.monthly = null, t.quarterly = null;
+    }
+  };
+};
+var p = /* @__PURE__ */ ((t) => (t.CUSTOM_RANGE = "custom-range", t.INPUT = "input", t.ERROR = "error", t.FORM_DATE = "form-date", t.START_DATE_SELECTED = "start-date-selected", t))(p || {});
+const na = {
+  "de-DE": { "DD-MM-YYYY": "TT-MM-JJJJ", "MM-DD-YYYY": "JJJJ-MM-TT", "YYYY-MM-DD": "JJJJ-MM-TT", customRange: "Benutzerdefinierter Bereich", daily: "Täglich", dateFrom: "Datum von", dateTo: "Datum bis", lastMonth: "Letzter Monat", lastSevenDays: "Letzte 7 Tage", lastThreeMonths: "Letzte drei Monate", monthly: "Monatlich", quarterly: "Vierteljährlich", timeFrom: "Zeit von", timeTo: "Zeit bis", weekly: "Wöchentlich" },
+  "en-GB": { "DD-MM-YYYY": "DD-MM-YYYY", "MM-DD-YYYY": "MM-DD-YYYY", "YYYY-MM-DD": "YYYY-MM-DD", customRange: "Custom range", daily: "Daily", dateFrom: "Date from", dateTo: "Date to", lastMonth: "Last month", lastSevenDays: "Last 7 days", lastThreeMonths: "The last three months", monthly: "Monthly", quarterly: "Quarterly", timeFrom: "Time from", timeTo: "Time to", weekly: "Weekly" },
+  "en-US": { "DD-MM-YYYY": "DD-MM-YYYY", "MM-DD-YYYY": "MM-DD-YYYY", "YYYY-MM-DD": "YYYY-MM-DD", 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" },
+  "es-ES": { "DD-MM-YYYY": "DD-MM-AAAA", "MM-DD-YYYY": "MM-DD-AAAA", "YYYY-MM-DD": "AAAA-MM-DD", customRange: "Rango personalizado", daily: "Diario", dateFrom: "Fecha desde", dateTo: "Fecha hasta", lastMonth: "El mes pasado", lastSevenDays: "Últimos 7 días", lastThreeMonths: "Últimos tres meses", monthly: "Mensualmente", quarterly: "Trimestral", timeFrom: "Hora desde", timeTo: "Hora hasta", weekly: "Semanal" },
+  "es-MX": { "DD-MM-YYYY": "DD-MM-AAAA", "MM-DD-YYYY": "MM-DD-AAAA", "YYYY-MM-DD": "AAAA-MM-DD", customRange: "Rango personalizado", daily: "Diario", dateFrom: "Fecha de", dateTo: "Fecha hasta", lastMonth: "El mes pasado", lastSevenDays: "Últimos 7 días", lastThreeMonths: "Últimos tres meses", monthly: "Mensual", quarterly: "Trimestral", timeFrom: "Tiempo desde", timeTo: "Es hora de", weekly: "Semanal" },
+  "fr-FR": { "DD-MM-YYYY": "JJ-MM-AAAA", "MM-DD-YYYY": "MM-JJ-AAAA", "YYYY-MM-DD": "AAAA-MM-JJ", customRange: "Plage personnalisée", daily: "Quotidien", dateFrom: "Date de début", dateTo: "Date de fin", lastMonth: "Le mois dernier", lastSevenDays: "7 derniers jours", lastThreeMonths: "Trois derniers mois", monthly: "Mensuel", quarterly: "Trimestriel", timeFrom: "Heure de début", timeTo: "Heure de fin", weekly: "Hebdomadaire" },
+  "it-IT": { "DD-MM-YYYY": "GG-MM-AAAA", "MM-DD-YYYY": "MM-GG-AAAA", "YYYY-MM-DD": "AAAA-MM-GG", customRange: "Intervallo personalizzato", daily: "Giornaliero", dateFrom: "Data da", dateTo: "Da", lastMonth: "Il mese scorso", lastSevenDays: "Ultimi 7 giorni", lastThreeMonths: "Gli ultimi tre mesi", monthly: "Mensile", quarterly: "Trimestrale", timeFrom: "Tempo dal", timeTo: "Tempo fino al", weekly: "Settimanale" },
+  "ja-JP": { "DD-MM-YYYY": "DD-MM-YYYY", "MM-DD-YYYY": "MM-DD-YYYY", "YYYY-MM-DD": "YYYY-MM-DD", customRange: "カスタム範囲", daily: "毎日", dateFrom: "開始日", dateTo: "終了日", lastMonth: "先月", lastSevenDays: "過去 7 日間", lastThreeMonths: "過去3か月", monthly: "毎月", quarterly: "四半期ごと", timeFrom: "開始時刻", timeTo: "終了時刻", weekly: "毎週" },
+  "pt-BR": { "DD-MM-YYYY": "DD-MM-AAAA", "MM-DD-YYYY": "MM-DD-AAAA", "YYYY-MM-DD": "AAAA-MM-DD", customRange: "Intervalo personalizado", daily: "Diário", dateFrom: "Data a partir de", dateTo: "Data até", lastMonth: "Último mês", lastSevenDays: "Últimos 7 dias", lastThreeMonths: "Últimos 3 meses", monthly: "Mensal", quarterly: "Trimestral", timeFrom: "Horário a partir de", timeTo: "Horário até", weekly: "Semanal" },
+  "zh-CN": { "DD-MM-YYYY": "日-月-年", "MM-DD-YYYY": "YYYY-MM-DD", "YYYY-MM-DD": "年-月-日", customRange: "自定义范围", daily: "每日", dateFrom: "日期自", dateTo: "日期至", lastMonth: "上个月", lastSevenDays: "最近 7 天", lastThreeMonths: "过去三个月", monthly: "每月", quarterly: "每季度", timeFrom: "时间自", timeTo: "是时候", weekly: "每周" }
+}, Za = { class: "b-date-range-picker-calendar" }, et = { class: "b-date-range-picker-calendar__form" }, at = { key: 0 }, tt = {
+  key: 0,
+  class: "b-date-range-picker-calendar__calendars-container",
+  "data-testid": "date-range-picker-calendar-calendar-container"
+}, nt = {
+  name: "date-range-picker-calendar",
+  i18n: { messages: na }
+}, rt = /* @__PURE__ */ Xe({
+  ...nt,
+  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: P.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: P.props.isDateDisabled,
+    /**
+     * Set a maximum number of dates to be selectable by the range.
+     */
+    maxRange: P.props.maxRange,
+    /**
+     * Sets a minimum limit for selectable dates - dates before `min` will not be selectable
+     */
+    min: P.props.min,
+    /**
+     * Sets a maximum limit for selectable dates - dates after `max` will not be selectable
+     */
+    max: P.props.max,
+    /**
+     * Number of months rendered on pane
+     */
+    numberOfMonths: {
+      type: P.props.numberOfMonths.type,
+      default: P.props.numberOfMonths.default,
+      validator: (t) => t >= 0
+    },
+    /**
+     * 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: P.props.variant
+  },
+  emits: [
+    p.CUSTOM_RANGE,
+    p.INPUT,
+    p.ERROR,
+    p.FORM_DATE,
+    p.START_DATE_SELECTED
+  ],
+  setup(t, { emit: m }) {
+    const s = "customRange", a = t, i = m, D = ga(), v = Ga(D), { t: Y } = Ee({ messages: na }), {
+      dateFormat: L,
+      isFormatValid: A,
+      parseDate: S,
+      onKeyDown: le,
+      autoFormat: T,
+      formatDate: B
+    } = Oe(), E = C({}), V = f(() => a.variant === "month" ? "monthly" : "daily"), X = f(() => a.numberOfMonths === 0), n = Me({
+      startDate: a.value?.startDate,
+      endDate: a.value?.endDate,
+      range: a.value?.range,
+      ...a.granularities ? {
+        granularity: a.value?.granularity || V.value
+      } : {}
+    }), O = f(() => (
+      // eslint-disable-next-line consistent-return
+      a?.quickSelectRanges?.find(({ value: e, data: l }) => {
+        if (!l.endDate) {
+          if (l.isRelativeToNow) {
+            const d = E.value?.[e];
+            return d ? ke(d.startDate, n.startDate) && ke(d.endDate, 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.
+              e === n.range
+            );
+          }
+          return ke(l.startDate, n.startDate) && ja(n.endDate) && (!a.allowTimeInput || Ie(n.endDate, N(n.endDate))) && (a.granularities ? l.granularity === n.granularity : !0);
+        }
+        if (a.allowTimeInput)
+          return Ie(l.startDate, n.startDate) && Ie(l.endDate, n.endDate) && (a.granularities ? l.granularity === n.granularity : !0);
+        if (l.endDate)
+          return q(l.startDate, n.startDate) && q(l.endDate, n.endDate) && (a.granularities ? l.granularity === n.granularity : !0);
+      })?.value ?? s
+    )), R = f(() => ({
+      "b-date-range-picker-calendar__form-input-wrapper": a.allowTimeInput
+    })), ge = f(() => [
+      { label: Y("customRange"), value: s },
+      ...a.quickSelectRanges ? a.quickSelectRanges : []
+    ]), j = f(
+      () => a.granularities?.find(({ type: e }) => e === n.granularity) || null
+    ), se = f(
+      () => a.granularities?.map(({ type: e, disabled: l }) => ({
+        label: Y(e),
+        value: e,
+        disabled: l
+      })) ?? []
+    ), { getGranularCalendarLimits: ee } = Ka(a), M = f(
+      () => a.granularities ? ee(j.value) : { min: a.min ? h(a.min) : null, max: a.max ? N(a.max) : null }
+    ), {
+      adjustDateForQuarterly: Te,
+      adjustDateForMonthly: oe,
+      adjustDateForWeekly: ae,
+      adjustStartDateInputForWeekly: g,
+      adjustEndDateInputForWeekly: he,
+      adjustStartDateInputForMonthly: z,
+      adjustEndDateInputForMonthly: Ye,
+      adjustStartDateInputForQuarterly: ie,
+      adjustEndDateInputForQuarterly: de
+    } = Ea(a.firstDayOfWeek), { savedRanges: k, saveRange: Z, resetSavedRanges: ue } = Xa(), b = (e) => e ? B(e) : "", W = C(!1), $ = C(!1), o = Me({
+      startDate: a.dateFormData.startDate,
+      endDate: a.dateFormData.endDate,
+      startTime: a.dateFormData.startTime,
+      endTime: a.dateFormData.endTime
+    }), me = (e, l) => {
+      let d = new Date(e);
+      const [y, J, Ma] = l.split(":");
+      return d = za(d, parseInt(y, 10)), d = Wa(d, parseInt(J, 10)), d = $a(d, parseInt(Ma, 10)), d;
+    }, ce = (e, l) => {
+      const d = () => {
+        if (l && r(l)) {
+          const y = me(S(l), e);
+          if (a.min && y < Ke(a.min, 0) || a.max && y > Ke(a.max, 0))
+            return !1;
+        }
+        return !0;
+      };
+      return Ve(e) && d();
+    }, _ = (e, l) => !l || !Ve(l) || a.variant === "month" ? e : me(new Date(e), l), Ae = (e) => {
+      o.startTime = F(
+        a.min && a.allowTimeInput && q(a.min, e.startDate) ? a.min : h(e.startDate)
+      ), o.endTime = F(
+        a.max && a.allowTimeInput && q(a.max, e.endDate) ? a.max : N(e.endDate)
+      ), n.startDate = _(e.startDate, o.startTime), n.endDate = _(e.endDate, o.endTime), n.range = null, a.granularities && ue(), i(p.INPUT, {
+        ...n,
+        range: O.value
+      });
+    }, r = (e) => {
+      if (!e)
+        return !1;
+      const l = (d) => a.min && h(d) < h(a.min) || a.max && h(d) > h(a.max) ? !1 : a.isDateDisabled ? !a.isDateDisabled(h(d)) : !0;
+      return A(e) && l(S(e));
+    };
+    Ze(() => {
+      W.value = !!(a.dateFormData.startDate && !r(a.dateFormData.startDate)), $.value = !!(a.dateFormData.endDate && !r(a.dateFormData.endDate));
+    });
+    const H = (e) => {
+      o.startDate = b(e), o.startTime || (o.startTime = F(e)), W.value = !1, i(p.START_DATE_SELECTED, e);
+    }, De = (e) => {
+      o.endDate = b(e), o.endTime || (o.endTime = F(N(e))), $.value = !1;
+    }, be = (e) => {
+      const l = a.value[e];
+      if (l)
+        return l;
+      if (a.dateFormData[e] && r(a.dateFormData[e]))
+        return S(a.dateFormData[e]);
+    }, ra = Je((e) => {
+      if (r(e)) {
+        let l = e;
+        switch (W.value = !1, j.value?.type) {
+          case "weekly":
+            l = g(
+              e,
+              b,
+              M.value.min,
+              M.value.max
+            ), o.startDate = l;
+            break;
+          case "monthly":
+            l = z(
+              e,
+              b,
+              M.value.min,
+              M.value.max
+            ), o.startDate = l;
+            break;
+          case "quarterly":
+            l = ie(
+              e,
+              b,
+              M.value.min,
+              M.value.max
+            ), o.startDate = l;
+            break;
+        }
+        const d = h(S(l));
+        n.startDate = _(d, o.startTime), n.endDate = _(
+          h(S(o.endDate)),
+          o.endTime
+        ), r(o.endDate) && (n.endDate = _(
+          h(S(o.endDate)),
+          o.endTime
+        ));
+        const y = be("endDate");
+        n.range = null, i(p.FORM_DATE, {
+          startDate: d,
+          endDate: y
+        }), i(p.INPUT, {
+          ...n,
+          range: O.value
+        });
+      } else
+        W.value = !0, i(p.ERROR, { ...o });
+    }, 300), la = (e) => {
+      o.startDate = T(e), ra(o.startDate);
+    }, sa = Je((e) => {
+      if (r(e)) {
+        let l = e;
+        switch ($.value = !1, j.value?.type) {
+          case "weekly":
+            l = he(
+              e,
+              b,
+              M.value.min,
+              M.value.max
+            ), o.endDate = l;
+            break;
+          case "monthly":
+            l = Ye(
+              e,
+              b,
+              M.value.min,
+              M.value.max
+            ), o.endDate = l;
+            break;
+          case "quarterly":
+            l = de(
+              e,
+              b,
+              M.value.min,
+              M.value.max
+            ), o.endDate = l;
+            break;
+        }
+        const d = h(S(l));
+        n.endDate = _(d, o.endTime), r(o.startDate) && (n.startDate = _(
+          h(S(o.startDate)),
+          o.startTime
+        ));
+        const y = be("startDate");
+        n.range = null, i(p.FORM_DATE, {
+          startDate: y,
+          endDate: d
+        }), i(p.INPUT, {
+          ...n,
+          range: O.value
+        });
+      } else
+        $.value = !0, i(p.ERROR, { ...o });
+    }, 300), oa = (e) => {
+      o.endDate = T(e), sa(o.endDate);
+    }, qe = (e) => {
+      le(e);
+    }, ia = () => {
+      i(p.ERROR, { ...o });
+    }, da = () => {
+      const e = o.startTime;
+      if (!ce(e, o.startDate)) {
+        i(p.ERROR, { ...o });
+        return;
+      }
+      n.startDate = _(n.startDate, e);
+      const l = be("endDate");
+      i(p.FORM_DATE, {
+        startDate: n.startDate,
+        endDate: l,
+        startTime: e,
+        endTime: o.endTime ?? a.dateFormData.endTime
+      }), i(p.INPUT, {
+        ...n,
+        range: O.value
+      });
+    }, ua = () => {
+      i(p.ERROR, { ...o });
+    }, ma = () => {
+      const e = o.endTime;
+      if (!ce(e, o.endDate)) {
+        i(p.ERROR, { ...o });
+        return;
+      }
+      n.endDate = _(n.endDate, e), i(p.FORM_DATE, {
+        startDate: n.startDate,
+        endDate: n.endDate,
+        startTime: o.startTime ?? a.dateFormData.startTime,
+        endTime: e
+      }), i(p.INPUT, {
+        ...n,
+        range: O.value
+      });
+    }, ca = (e) => {
+      o.startTime = e;
+    }, Da = (e) => {
+      o.endTime = e;
+    }, pe = (e, l, d, y) => {
+      n.startDate = e, n.endDate = l, d && (n.granularity = d), y && (n.range = y);
+    }, pa = (e) => {
+      const l = a.quickSelectRanges?.find(({ value: d }) => d === e);
+      if (l) {
+        ue();
+        const d = l.data, y = d.endDate || (d.isRelativeToNow ? new Date(Date.now()) : N(new Date(Date.now()))), J = d.isRelativeToNow && d.timeDifference ? new Date(y.getTime() - d.timeDifference) : d.startDate;
+        o.endDate = b(y), o.startDate = b(J), pe(J, y, null, e), a.granularities && (n.granularity = d.granularity || V.value), o.startTime = F(J), o.endTime = F(y), n.startDate = J, n.endDate = y, d.isRelativeToNow && (E.value = {
+          ...E.value,
+          [e]: {
+            startDate: J,
+            endDate: y
+          }
+        }), i(p.CUSTOM_RANGE, {
+          ...l.data,
+          startDate: J,
+          endDate: y,
+          range: l.value
+        });
+      }
+    }, fa = {
+      weekly: ae,
+      monthly: oe,
+      quarterly: Te
+    }, va = (e) => {
+      const l = n.granularity;
+      if (n.granularity = e, l && Z(l, structuredClone(we(n))), n.startDate && n.endDate) {
+        switch (e) {
+          case "quarterly":
+          case "monthly":
+          case "weekly": {
+            if (k[e]) {
+              pe(k[e].startDate, k[e].endDate, e);
+              break;
+            }
+            const { startDate: d, endDate: y } = fa[e](
+              n.startDate,
+              n.endDate,
+              M.value.min,
+              M.value.max
+            );
+            pe(d, y, e);
+            break;
+          }
+          case "daily":
+            k.daily && pe(k.daily.startDate, k.daily.endDate, e);
+            break;
+        }
+        o.startDate = b(n.startDate), o.endDate = b(n.endDate), i(p.INPUT, {
+          ...n,
+          range: O.value
+        });
+      }
+    }, ya = f(() => ({
+      "b-date-range-picker-calendar__form-container--no-calendars": X.value
+    }));
+    return (e, l) => (I(), fe("div", Za, [
+      Q("div", {
+        class: ve(["b-date-range-picker-calendar__form-container", ya.value]),
+        "data-testid": "date-range-picker-calendar-form-container"
+      }, [
+        Q("div", et, [
+          u(v)("title") ? Be(e.$slots, "title", { key: 0 }, void 0, !0) : w("", !0),
+          t.quickSelectRanges ? (I(), x(xa, {
+            key: 1,
+            "aria-label": u(Y)("customRange"),
+            items: ge.value,
+            "model-value": O.value,
+            "onUpdate:modelValue": pa
+          }, null, 8, ["aria-label", "items", "model-value"])) : w("", !0),
+          t.granularities ? (I(), x(u(Ua), {
+            key: 2,
+            items: se.value,
+            "model-value": n.granularity,
+            "full-width": "",
+            "onUpdate:modelValue": va
+          }, null, 8, ["items", "model-value"])) : w("", !0),
+          Q("div", null, [
+            U(u(Fe), {
+              stronger: "",
+              el: "span",
+              class: "b-date-range-picker-calendar__label"
+            }, {
+              default: K(() => l[0] || (l[0] = [
+                ne(" From ")
+              ])),
+              _: 1
+            }),
+            Q("div", {
+              class: ve(R.value)
+            }, [
+              U(u(Ge), {
+                "aria-label": u(Y)("dateFrom"),
+                "model-value": o.startDate,
+                error: W.value,
+                class: "b-date-range-picker-calendar__form-input",
+                "onUpdate:modelValue": la,
+                onKeydown: qe
+              }, {
+                description: K(() => [
+                  ne(Se(u(Y)(u(L))), 1)
+                ]),
+                _: 1
+              }, 8, ["aria-label", "model-value", "error"]),
+              t.allowTimeInput ? (I(), x(u(Le), {
+                key: 0,
+                "aria-label": u(Y)("timeFrom"),
+                "model-value": o.startTime,
+                class: "b-date-range-picker-calendar__form-input",
+                "onUpdate:modelValue": ca,
+                "onInput:error": ia,
+                "onInput:valid": da
+              }, null, 8, ["aria-label", "model-value"])) : w("", !0)
+            ], 2)
+          ]),
+          Q("div", null, [
+            U(u(Fe), {
+              stronger: "",
+              el: "span",
+              class: "b-date-range-picker-calendar__label"
+            }, {
+              default: K(() => l[1] || (l[1] = [
+                ne(" To ")
+              ])),
+              _: 1
+            }),
+            Q("div", {
+              class: ve(R.value)
+            }, [
+              U(u(Ge), {
+                class: "b-date-range-picker-calendar__form-input",
+                "aria-label": u(Y)("dateTo"),
+                "model-value": o.endDate,
+                error: $.value,
+                "onUpdate:modelValue": oa,
+                onKeydown: qe
+              }, {
+                description: K(() => [
+                  ne(Se(u(Y)(u(L))), 1)
+                ]),
+                _: 1
+              }, 8, ["aria-label", "model-value", "error"]),
+              t.allowTimeInput ? (I(), x(u(Le), {
+                key: 0,
+                "aria-label": u(Y)("timeTo"),
+                "model-value": o.endTime,
+                class: "b-date-range-picker-calendar__form-input",
+                "onUpdate:modelValue": Da,
+                "onInput:error": ua,
+                "onInput:valid": ma
+              }, null, 8, ["aria-label", "model-value"])) : w("", !0)
+            ], 2)
+          ])
+        ]),
+        u(v)("actions") ? (I(), fe("div", at, [
+          Be(e.$slots, "actions", {}, void 0, !0)
+        ])) : w("", !0)
+      ], 2),
+      X.value ? w("", !0) : (I(), fe("div", tt, [
+        U(u(P), {
+          value: n,
+          "first-day-of-week": t.firstDayOfWeek,
+          "is-date-disabled": t.isDateDisabled,
+          "max-range": t.maxRange,
+          min: M.value.min,
+          max: M.value.max,
+          "number-of-months": t.numberOfMonths,
+          "show-end-date-on-open": t.showEndDateOnOpen,
+          granularity: j.value,
+          variant: t.variant,
+          "is-range": "",
+          onInput: Ae,
+          onStartDateSelected: H,
+          onEndDateSelected: De
+        }, null, 8, ["value", "first-day-of-week", "is-date-disabled", "max-range", "min", "max", "number-of-months", "show-end-date-on-open", "granularity", "variant"])
+      ]))
+    ]));
+  }
+}), lt = /* @__PURE__ */ aa(rt, [["__scopeId", "data-v-65a88054"]]), _e = {
+  "de-DE": { apply: "Anwenden", cancel: "Abbrechen", dateRangePicker: "Datumsbereichauswahl {name}", provideDateInAFormat: "Geben Sie das Datum im Format YYYY-MM-DD an", quarter: "Q{quarter} {year}", selectDate: "Wählen Sie ein Datum", selectDateRange: "Wählen Sie einen Datumsbereich aus", selectedDateIsNotAvailable: "Ausgewähltes Datum ist nicht verfügbar" },
+  "en-GB": { apply: "Apply", cancel: "Cancel", dateRangePicker: "Date range picker {name}", provideDateInAFormat: "Enter date in YYYY-MM-DD format", quarter: "Q{quarter} {year}", selectDate: "Select a date", selectDateRange: "Select a date range", selectedDateIsNotAvailable: "Selected date is not available" },
+  "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" },
+  "es-ES": { apply: "Aplicar", cancel: "Cancelar", dateRangePicker: "Selector de intervalos de fechas {name}", provideDateInAFormat: "Proporciona la fecha en formato AAAAA-MM-DD", quarter: "T{quarter} {year}", selectDate: "Selecciona una fecha", selectDateRange: "Selecciona un rango de fechas", selectedDateIsNotAvailable: "La fecha seleccionada no está disponible" },
+  "es-MX": { apply: "Aplicar", cancel: "Cancelar", dateRangePicker: "Selector de intervalos de fechas {name}", provideDateInAFormat: "Proporciona la fecha en formato AAAA-MM-DD", quarter: "T{quarter} {year}", selectDate: "Selecciona una fecha", selectDateRange: "Selecciona un rango de fechas", selectedDateIsNotAvailable: "La fecha seleccionada no está disponible" },
+  "fr-FR": { apply: "Appliquer", cancel: "Annuler", dateRangePicker: "Sélecteur de plages de dates {name}", provideDateInAFormat: "Fournissez la date au format AAAA-MM-JJ", quarter: "T{quarter} {year}", selectDate: "Sélectionnez une date", selectDateRange: "Sélectionnez une plage de dates", selectedDateIsNotAvailable: "La date sélectionnée n’est pas disponible" },
+  "it-IT": { apply: "Applica", cancel: "Annulla", dateRangePicker: "Selettore intervallo di date {name}", provideDateInAFormat: "Inserisci la data nel formato AAAA-MM-GG", quarter: "Q{quarter} {year}", selectDate: "Seleziona una data", selectDateRange: "Seleziona un intervallo di date", selectedDateIsNotAvailable: "La data selezionata non è disponibile" },
+  "ja-JP": { apply: "適用", cancel: "キャンセル", dateRangePicker: "日付範囲ピッカー {name}", provideDateInAFormat: "YYYY-MM-DD形式で日付を入力してください", quarter: "{year}年第{quarter}四半期", selectDate: "日付を選択", selectDateRange: "日付範囲を選択", selectedDateIsNotAvailable: "選択した日付は利用できません" },
+  "pt-BR": { apply: "Aplicar", cancel: "Cancelar", dateRangePicker: "Seletor de intervalo de datas {name}", provideDateInAFormat: "Inclua a data no formato AAAA-MM-DD", quarter: "{quarter}º trimestre de {year}", selectDate: "Selecione uma data", selectDateRange: "Selecione um intervalo de datas", selectedDateIsNotAvailable: "A data selecionada não está disponível" },
+  "zh-CN": { apply: "应用", cancel: "取消", dateRangePicker: "日期范围选择器 {name}", provideDateInAFormat: "提供 YYYY-MM-DD 格式的日期", quarter: "{year} {quarter} 季度", selectDate: "选择日期", selectDateRange: "选择日期范围", selectedDateIsNotAvailable: "所选日期不可用" }
+}, st = ({
+  datePickerValue: t,
+  isDateIncorrect: m,
+  quickSelectRanges: c,
+  isMonthVariant: s,
+  withTimeInput: a,
+  placeholder: i
+}) => {
+  const { locale: D, t: v } = Ee({ messages: _e }), { dateToInputDateString: Y } = Oe(), L = (T) => !!T && !isNaN(T.getTime()), A = Me({
+    startDate: null,
+    endDate: null,
+    startTime: null,
+    endTime: null
+  });
+  return ye(
+    t,
+    (T) => {
+      A.startDate = Y(T?.startDate), A.endDate = Y(T?.endDate), A.startTime = F(T?.startDate), A.endTime = F(T?.endDate);
+    },
+    { immediate: !0 }
+  ), {
+    // Values
+    dateDisplayValue: f(() => {
+      if (m.value)
+        return `${A.startDate || ""} - ${A.endDate || ""}`;
+      if (!t.value || !t.value.startDate && !t.value.endDate)
+        return i?.value || v("selectDateRange");
+      if (c.value?.length) {
+        const B = c.value.find(({ value: E }) => E === t.value?.range);
+        if (B)
+          return B.label;
+      }
+      if (t.value.granularity === "quarterly") {
+        const { startDate: B, endDate: E } = t.value, V = v("quarter", { quarter: We(B), year: $e(B) });
+        if (Qa(B, E))
+          return V;
+        const X = v("quarter", { quarter: We(E), year: $e(E) });
+        return `${V} - ${X}`;
+      }
+      if (!L(t.value.startDate) || !L(t.value.endDate))
+        return `${A.startDate || ""} - ${A.endDate || ""}`;
+      let T = s?.value ? { month: "long", year: "numeric" } : { month: "short", day: "2-digit", year: "numeric" };
+      return a.value && (T = {
+        ...T,
+        hour: "numeric",
+        minute: "numeric",
+        second: "numeric",
+        hour12: !1
+      }), Oa(D.value, T).formatRange(
+        t.value.startDate,
+        t.value.endDate
+      );
+    }),
+    textInputDisplayValue: A,
+    // Methods
+    formatTextInputDisplayValue: () => ""
+  };
+}, ot = { class: "b-date-range-picker" }, it = { class: "b-date-range-picker__footer" }, dt = {
+  i18n: { messages: _e },
+  name: "bento-date-range-picker",
+  model: { prop: "modelValue" }
+}, ut = /* @__PURE__ */ Xe({
+  ...dt,
+  props: {
+    allowTimeInput: { type: Boolean },
+    firstDayOfWeek: { default: void 0 },
+    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 },
+    modelValue: { default: null },
+    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: ["update:model-value", "input"],
+  setup(t, { emit: m }) {
+    const c = m, s = t, a = Ta(), { t: i } = Ee({ messages: _e }), { dateToInputDateString: D } = Oe(), v = te("bento-date-range-picker-container"), Y = te("bento-date-range-picker-label"), L = te("bento-date-range-picker-description"), A = te("bento-date-range-picker-error"), S = te("bento-date-range-picker-date-error"), le = f(() => s.label || i("dateRangePicker", { name: v })), { resolvedFirstDayOfWeek: T } = _a(Re(s, "firstDayOfWeek")), B = Aa({
+      none: 0,
+      one: 710,
+      // width of date range picker with one panes
+      two: 1030,
+      // width of date range picker with two panes
+      three: 1290
+      // width of date range picker with three panes
+    }), E = f(() => {
+      const r = B.active().value, H = {
+        none: 0,
+        one: 1,
+        two: 2
+      };
+      if (r in H) {
+        const De = H[r];
+        return s.numberOfMonths === void 0 ? De : Math.min(s.numberOfMonths, De);
+      }
+      return s.numberOfMonths;
+    }), V = f(() => s?.quickSelectRanges && s.quickSelectRanges.map((r) => {
+      const H = r.data.endDate ? void 0 : new Date(Date.now()).getTime() - r.data.startDate.getTime();
+      return {
+        ...r,
+        data: {
+          ...r.data,
+          // Adding timeDifference to calculate an up-to-date endDate on range selection
+          timeDifference: H
+        }
+      };
+    })), X = f(() => s.label ? Y : a?.["aria-labelledby"] ?? null), n = C(!1), O = C(null), R = C(!1), { isReadOnly: ge } = Ca(Re(s, "readonly")), { emitValue: j } = Pa(c);
+    ye(
+      () => s.disabled,
+      () => {
+        s.disabled && R.value && (R.value = !1);
+      }
+    );
+    const se = f(() => s.modelValue || s.value), ee = f(() => s.hasActions ? !Z.value && n.value : n.value), M = f(() => ({
+      "b-date-range-picker__description--error": !!s.errorMessage || ee.value
+    })), Te = f(() => s.variant === "month"), oe = f(() => s.allowTimeInput && s.variant !== "month"), { dateDisplayValue: ae, textInputDisplayValue: g } = st({
+      datePickerValue: se,
+      isDateIncorrect: n,
+      quickSelectRanges: V,
+      isMonthVariant: Te,
+      withTimeInput: oe,
+      placeholder: Re(s, "placeholder")
+    }), he = f(
+      () => `${s.description ? L : ""} ${s.errorMessage ? A : ""} ${n.value ? S : ""}`.trim() || null
+    ), z = () => {
+      R.value = !1;
+    }, Ye = () => {
+      R.value = !0;
+    }, ie = C(ae.value), de = C(
+      // textInputDisplayValue is a reactive object
+      structuredClone(we(g))
+    ), k = C(s.modelValue ?? s.value), Z = C(!0), ue = f(
+      () => s.hasActions ? de.value : g
+    ), b = f(
+      () => s.hasActions ? ie.value : ae.value
+    );
+    Ze(() => {
+      if (s.hasActions || Ne(
+        '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"
+      ), s.value && Ne(
+        'BentoDateRangePicker "value" property',
+        'The use of "value" prop in "BentoDateRangePicker" is no longer supported. Use the "v-model" or "model-value" property instead.',
+        "2.0.0"
+      ), s.granularities && s.variant !== "month" && s.granularities.find(({ type: r }) => r === "quarterly"))
+        throw new Error('Quarterly granularity is only supported by BentoDateRangePicker with variant: "month"');
+    }), ye([() => s.value, () => s.modelValue], () => {
+      ie.value = ae.value, de.value = structuredClone(we(g));
+    });
+    const W = f(() => [
+      {
+        title: i("apply"),
+        event: () => {
+          j(k.value), z(), Z.value = !0;
+        },
+        disabled: Z.value
+      },
+      {
+        title: i("cancel"),
+        event: z
+      }
+    ]);
+    ye(k, (r) => {
+      if (s.hasActions) {
+        Z.value = n.value;
+        return;
+      }
+      j(r);
+    });
+    const $ = (r) => {
+      n.value = !1, g.startDate = D(r.startDate), g.endDate = D(r.endDate), g.startTime = F(r.startDate), g.endTime = F(r.endDate), k.value = r;
+    }, o = async () => {
+      n.value && (n.value = !1), k.value = null;
+    }, me = () => {
+      if (!R.value) {
+        R.value = !0;
+        return;
+      }
+      n.value || (R.value = !1);
+    }, ce = (r) => {
+      n.value = !1, r.startTime && (g.startTime = r.startTime), r.endTime && (g.endTime = r.endTime);
+    }, _ = (r) => {
+      n.value = !0, g.startDate = r.startDate, g.endDate = r.endDate, k.value = { startDate: null, endDate: null };
+    }, Ae = (r) => {
+      r && (g.startDate = D(r.startDate), g.endDate = D(r.endDate), g.startTime = F(r.startDate), g.endTime = F(r.endDate), k.value = r);
+    };
+    return (r, H) => ha((I(), fe("div", ot, [
+      r.label ? (I(), x(u(Va), {
+        key: 0,
+        id: u(Y),
+        label: r.label,
+        "tooltip-text": r.tooltipText,
+        optional: r.optional,
+        required: r.required
+      }, null, 8, ["id", "label", "tooltip-text", "optional", "required"])) : w("", !0),
+      Q("div", {
+        onKeydown: Ce(me, ["enter"])
+      }, [
+        U(u(Ia), {
+          ref_key: "inputContainerRef",
+          ref: O,
+          "always-combobox-is-input": "",
+          ariaControls: u(v),
+          ariaExpanded: R.value,
+          "aria-labelledby": X.value,
+          "aria-describedby": he.value,
+          "aria-required": r.required,
+          disabled: r.disabled,
+          "is-invalid": !!r.errorMessage || ee.value,
+          open: R.value,
+          "display-value": b.value,
+          readonly: u(ge),
+          onOpen: Ye,
+          onClear: o,
+          onClose: z
+        }, null, 8, ["ariaControls", "ariaExpanded", "aria-labelledby", "aria-describedby", "aria-required", "disabled", "is-invalid", "open", "display-value", "readonly"])
+      ], 32),
+      ee.value ? (I(), x(u(ze), {
+        key: 1,
+        id: u(S),
+        "error-message": u(i)("provideDateInAFormat"),
+        class: "b-date-range-picker__error-message"
+      }, null, 8, ["id", "error-message"])) : w("", !0),
+      r.errorMessage ? (I(), x(u(ze), {
+        key: 2,
+        id: u(A),
+        "error-message": r.errorMessage,
+        class: "b-date-range-picker__error-message"
+      }, null, 8, ["id", "error-message"])) : w("", !0),
+      r.description ? (I(), x(u(Fe), {
+        key: 3,
+        id: u(L),
+        class: ve(["b-date-range-picker__description", M.value]),
+        el: "span"
+      }, {
+        default: K(() => [
+          ne(Se(r.description), 1)
+        ]),
+        _: 1
+      }, 8, ["id", "class"])) : w("", !0),
+      O.value ? (I(), x(u(Ra), {
+        key: 4,
+        id: u(v),
+        class: "b-date-range-picker__container",
+        open: R.value,
+        "target-element": O.value,
+        "aria-label": le.value,
+        position: "bottom-start",
+        "without-space": "",
+        "fit-content": "",
+        "trap-all": "",
+        "overflow-visible": "",
+        onKeydown: Ce(z, ["esc", "native"])
+      }, {
+        default: K(() => [
+          U(u(lt), {
+            "allow-time-input": oe.value,
+            "quick-select-ranges": V.value,
+            value: se.value,
+            "first-day-of-week": u(T),
+            granularities: r.granularities,
+            "is-date-disabled": r.isDateDisabled,
+            "max-range": r.maxRange,
+            min: r.min,
+            max: r.max,
+            "number-of-months": E.value,
+            "show-end-date-on-open": r.showEndDateOnOpen,
+            "date-form-data": ue.value,
+            variant: r.variant,
+            onCustomRange: Ae,
+            onInput: $,
+            onError: _,
+            onFormDate: ce
+          }, Ya({ _: 2 }, [
+            r.hasActions ? {
+              name: "actions",
+              fn: K(() => [
+                U(u(ba)),
+                Q("div", it, [
+                  U(u(ka), {
+                    actions: W.value,
+                    layout: u(Ja).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"])) : w("", !0)
+    ])), [
+      [u(Na), z]
+    ]);
+  }
+}), Nt = /* @__PURE__ */ aa(ut, [["__scopeId", "data-v-e00826fe"]]);
+export {
+  Nt as B,
+  lt as D,
+  ja as a,
+  ke as i
+};
+//# sourceMappingURL=date-range-picker.fyrfFd04.js.map