@adyen/bento-vue2 1.102.0 → 1.103.0

package/dist/chunks/date-picker.CXZfCxwP.js

@@ -1,252 +0,0 @@
-import { ref as f, computed as i, defineComponent as le, toRef as E, watch as T, nextTick as re } from "vue";
-import { g as ne, f as q, b as oe, h as ie, i as se, p as de } from "./calendar.CvHJ3Geq.js";
-import { h as ce } from "./button-actions.Dpbx0xf3.js";
-import { d as ue, B as pe } from "./typography.C8lPlsbD.js";
-import { D as me, g as ve } from "./dropdown.DIqgVVXB.js";
-import { B as fe } from "./input-field.BEV5lhwO.js";
-import { g as y } from "./generate-uid.NJ8tVoha.js";
-import { u as W } from "./index.B6WW_F-J.js";
-import { u as De } from "./form-field.D_2g7vaP.js";
-import { u as U, a as be } from "./use-date-input-formatter.DfQk8_Dw.js";
-import { u as ye } from "./use-form-layout-loading.CWbjZiwP.js";
-import "./index.Cl4_42j5.js";
-import { u as ke } from "./use-touch-device.DTqFAbXh.js";
-import { B as ge } from "./directive.BBWhsNtO.js";
-import { F as Ie } from "./field-label.DjJ7wdFi.js";
-import { E as _e } from "./error-message.Hqp_VvD3.js";
-import { n as he } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
-import "../assets/date-picker.css";
-const Se = {
-  "de-DE": {
-    datePicker: "Datumsauswahl",
-    invalidDateFormat: "Ungültiges Datumsformat",
-    selectDate: "Wählen Sie ein Datum",
-    selectDateRange: "Wählen Sie einen Datumsbereich aus",
-    selectedDateIsNotAvailable: "Ausgewähltes Datum ist nicht verfügbar"
-  },
-  "en-GB": {
-    datePicker: "Date picker",
-    invalidDateFormat: "Invalid date format",
-    selectDate: "Select a date",
-    selectDateRange: "Select a date range",
-    selectedDateIsNotAvailable: "Selected date is not available"
-  },
-  "en-US": {
-    datePicker: "Date picker",
-    invalidDateFormat: "Invalid date format",
-    selectDate: "Select a date",
-    selectDateRange: "Select a date range",
-    selectedDateIsNotAvailable: "Selected date is not available"
-  },
-  "es-419": {
-    datePicker: "Selector de fecha",
-    invalidDateFormat: "Formato de fecha no válido",
-    selectDate: "Selecciona una fecha",
-    selectDateRange: "Selecciona un rango de fechas",
-    selectedDateIsNotAvailable: "La fecha seleccionada no está disponible"
-  },
-  "es-ES": {
-    datePicker: "Selector de fecha",
-    invalidDateFormat: "Formato de fecha no válido",
-    selectDate: "Selecciona una fecha",
-    selectDateRange: "Selecciona un rango de fechas",
-    selectedDateIsNotAvailable: "La fecha seleccionada no está disponible"
-  },
-  "es-MX": {
-    datePicker: "Selector de fecha",
-    invalidDateFormat: "Formato de fecha no válido",
-    selectDate: "Selecciona una fecha",
-    selectDateRange: "Selecciona un rango de fechas",
-    selectedDateIsNotAvailable: "La fecha seleccionada no está disponible"
-  },
-  "fr-FR": {
-    datePicker: "Sélecteur de date",
-    invalidDateFormat: "Format de date non valide",
-    selectDate: "Sélectionnez une date",
-    selectDateRange: "Sélectionnez une plage de dates",
-    selectedDateIsNotAvailable: "La date sélectionnée n’est pas disponible"
-  },
-  "it-IT": {
-    datePicker: "Selezionatore di date",
-    invalidDateFormat: "Formato data non valido",
-    selectDate: "Seleziona una data",
-    selectDateRange: "Seleziona un intervallo di date",
-    selectedDateIsNotAvailable: "La data selezionata non è disponibile"
-  },
-  "ja-JP": {
-    datePicker: "日付ピッカー",
-    invalidDateFormat: "無効な日付形式",
-    selectDate: "日付を選択",
-    selectDateRange: "日付範囲を選択",
-    selectedDateIsNotAvailable: "選択した日付は利用できません"
-  },
-  "pt-BR": {
-    datePicker: "Seletor de data",
-    invalidDateFormat: "Formato de data inválido",
-    selectDate: "Selecione uma data",
-    selectDateRange: "Selecione um intervalo de datas",
-    selectedDateIsNotAvailable: "A data selecionada não está disponível"
-  },
-  "zh-CN": {
-    datePicker: "日期选择器",
-    invalidDateFormat: "日期格式无效",
-    selectDate: "选择日期",
-    selectDateRange: "选择日期范围",
-    selectedDateIsNotAvailable: "所选日期不可用"
-  }
-}, Fe = ({
-  datePickerValue: p,
-  dateError: a,
-  isMonthVariant: t,
-  placeholder: e
-}) => {
-  var k;
-  const { locale: d, t: m } = W(), { formatDate: D } = U(), r = f((k = p.value) == null ? void 0 : k.toDateString());
-  return {
-    // Values
-    dateDisplayValue: i(() => {
-      if (a.value)
-        return r.value;
-      if (!p.value)
-        return (e == null ? void 0 : e.value) || m("selectDate");
-      const c = t != null && t.value ? { month: "long", year: "numeric" } : { day: "numeric", month: "short", year: "numeric" };
-      return ne(d.value, c).format(p.value);
-    }),
-    textInputValue: r,
-    // Methods
-    formatTextInputDisplayValue: (c = p.value) => {
-      if (a.value)
-        return;
-      if (!c) {
-        r.value = "";
-        return;
-      }
-      const g = t != null && t.value ? q(c) : c;
-      r.value = D(g);
-    }
-  };
-}, Ce = {
-  i18n: { messages: Se },
-  name: "bento-date-picker",
-  model: { prop: "modelValue" }
-}, Pe = /* @__PURE__ */ le({
-  ...Ce,
-  props: {
-    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 },
-    defaultDisplayMonth: { default: null },
-    firstDayOfWeek: { default: void 0 },
-    isDateDisabled: { default: void 0 },
-    min: { default: null },
-    max: { default: null },
-    modelValue: { default: null },
-    value: { default: null },
-    yearRange: { default: void 0 },
-    variant: { default: void 0 }
-  },
-  emits: ["update:model-value", "input"],
-  setup(p, { emit: a }) {
-    const t = p, e = 1e3, { t: d } = W(), m = y("bento-date-picker-container"), D = y("bento-date-picker-label"), r = y("bento-date-picker-description"), S = y("bento-date-picker-error"), F = y("bento-date-picker-date-error"), k = i(() => t.label || d("datePicker", { name: m })), c = f(null), g = f(null), o = f(null), u = f(!1), C = f(void 0), v = f(t.modelValue), { isReadOnly: K } = ye(E(t, "readonly")), { emitValue: s } = De(a), { resolvedFirstDayOfWeek: $ } = be(E(t, "firstDayOfWeek")), { isFormatValid: P, parseDate: x, onKeyDown: N, autoFormat: A } = U(), { isTouchDevice: w } = ke(), j = i(() => ({
-      initialFocus: C.value,
-      additionalContainers: [g.value.$el]
-    }));
-    T(
-      () => t.disabled,
-      (l) => {
-        l && u.value && (u.value = !1);
-      }
-    ), T(
-      [() => t.value, () => t.modelValue],
-      ([l, n]) => {
-        l && ue(
-          'BentoDatePicker "value" property',
-          'The use of "value" prop in "BentoDatePicker" is no longer supported. Use the "v-model" or "model-value" property instead.',
-          "2.0.0"
-        ), v.value = n ?? l;
-      },
-      { immediate: !0 }
-    );
-    const I = i(() => t.variant === "month"), { dateDisplayValue: G, textInputValue: b, formatTextInputDisplayValue: O } = Fe({
-      datePickerValue: v,
-      dateError: o,
-      isMonthVariant: I,
-      placeholder: E(t, "placeholder")
-    }), _ = (l) => l ? I.value ? ie(l) : se(l) : "", J = i(() => _(v.value)), X = (l) => {
-      if (!l) {
-        o.value = null, s(null);
-        return;
-      }
-      const n = de(l, I.value ? "month" : "date");
-      if (o.value = h(n), o.value) {
-        s(null);
-        return;
-      }
-      s(n);
-    }, H = i(() => _(t.min)), Q = i(() => _(t.max)), h = (l) => !l || isNaN(l.getTime()) || t.min && l < t.min || t.max && l > t.max ? "invalidDateFormat" : t.isDateDisabled && t.isDateDisabled(l) ? "selectedDateIsNotAvailable" : null, B = i(() => o.value ? d(o.value) : null);
-    T(
-      [u, b, () => t.isDateDisabled, () => t.min, () => t.max],
-      ([l, n]) => {
-        !l && n && P(n) && (o.value = h(x(n)));
-      }
-    );
-    const Y = i(() => ({
-      "b-date-picker__description--error": t.errorMessage || B.value
-    })), Z = i(
-      () => `${t.description ? r : ""} ${t.errorMessage ? S : ""} ${B.value ? F : ""}`.trim() || null
-    ), M = () => {
-      u.value = !1;
-    }, L = () => {
-      u.value = !0, O();
-    }, ee = (l) => {
-      o.value = null, M(), s(l);
-    }, ae = async () => {
-      o.value && (o.value = null, b.value = null), s(null);
-    }, te = (l) => {
-      N(l);
-    }, R = (l) => {
-      if (l.length < 10)
-        return;
-      const n = P(l) ? x(l) : null, z = h(n);
-      !z && n ? (o.value = null, s(n)) : l && (o.value = z || "invalidDateFormat", s(null));
-    }, V = ve(R, e);
-    return { __sfc: !0, DEBOUNCE_TIME: e, props: t, emit: a, t: d, datePickerContainerId: m, labelId: D, descriptionId: r, errorId: S, dateErrorId: F, popoverAriaLabel: k, calendarContainerRef: c, inputContainerRef: g, dateError: o, isDatePickerOpen: u, initialFocusOnDatePickerOpen: C, internalModelValue: v, isReadOnly: K, emitValue: s, resolvedFirstDayOfWeek: $, isFormatValid: P, parseDate: x, onKeyDown: N, autoFormat: A, isTouchDevice: w, computedTrapAllOptions: j, isMonthVariant: I, dateDisplayValue: G, textInputValue: b, formatTextInputDisplayValue: O, formatNativeDate: _, nativeValue: J, onNativeDateInput: X, formattedMin: H, formattedMax: Q, getDateErrorReason: h, dateErrorText: B, descriptionConditionalClasses: Y, ariaDescribedBy: Z, closeDatePicker: M, openDatePicker: L, onDateSelected: ee, clearDatePickerValue: ae, onDateKeyDown: te, validateDate: R, validateDateDebounced: V, onDateInputChange: (l) => {
-      o.value = null, b.value = A(l), u.value || w.value ? R(b.value) : V(b.value);
-    }, onSpaceBarOrEnter: async (l) => {
-      var n;
-      u.value || (l.preventDefault(), L(), await re(), v.value || (O(/* @__PURE__ */ new Date()), s(/* @__PURE__ */ new Date())), C.value = ((n = c.value) == null ? void 0 : n.$refs.calendarRef[0].focusOnDate(
-        t.variant === "month" ? q(v.value) : v.value,
-        !0
-      )) ?? void 0);
-    }, BentoPopover: ce, BentoTypography: pe, Calendar: oe, ErrorMessage: _e, FieldLabel: Ie, DropdownInputDefault: me, BentoInputField: fe, vBentoClickOutsideDirective: ge };
-  }
-});
-var xe = function() {
-  var d, m, D;
-  var a = this, t = a._self._c, e = a._self._setupProxy;
-  return t("div", { directives: [{ name: "bento-click-outside-directive", rawName: "v-bento-click-outside-directive", value: e.closeDatePicker, expression: "closeDatePicker" }], staticClass: "b-date-picker", on: { "!keydown": [function(r) {
-    return !r.type.indexOf("key") && a._k(r.keyCode, "space", 32, r.key, [" ", "Spacebar"]) ? null : e.onSpaceBarOrEnter.apply(null, arguments);
-  }, function(r) {
-    return !r.type.indexOf("key") && a._k(r.keyCode, "enter", 13, r.key, "Enter") ? null : e.onSpaceBarOrEnter.apply(null, arguments);
-  }] } }, [a.label ? t(e.FieldLabel, { attrs: { id: e.labelId, label: a.label, "tooltip-text": a.tooltipText, optional: a.optional, required: a.required } }) : a._e(), t("div", [e.isTouchDevice ? t(e.BentoInputField, { ref: "inputContainerRef", attrs: { type: e.isMonthVariant ? "month" : "date", "aria-labelledby": a.label ? e.labelId : (d = a.$attrs) == null ? void 0 : d["aria-labelledby"], "aria-label": a.label || (m = a.$attrs) != null && m["aria-labelledby"] ? null : e.popoverAriaLabel, "aria-describedby": e.ariaDescribedBy, "aria-required": a.required, disabled: a.disabled, error: !!a.errorMessage || !!e.dateErrorText, "model-value": e.nativeValue, readonly: e.isReadOnly, min: e.formattedMin, max: e.formattedMax }, on: { "update:model-value": e.onNativeDateInput } }) : t(e.DropdownInputDefault, { ref: "inputContainerRef", attrs: { "always-combobox-is-input": "", ariaControls: e.datePickerContainerId, ariaExpanded: e.isDatePickerOpen, "aria-labelledby": a.label ? e.labelId : (D = a.$attrs) == null ? void 0 : D["aria-labelledby"], "aria-label": a.label ? null : e.popoverAriaLabel, "aria-describedby": e.ariaDescribedBy, "aria-required": a.required, disabled: a.disabled, "dynamic-filtering": "", "is-invalid": !!a.errorMessage || !!e.dateErrorText, open: e.isDatePickerOpen, value: e.textInputValue, "display-value": e.dateDisplayValue, "debounce-time": 0, readonly: e.isReadOnly }, on: { input: e.onDateInputChange, open: e.openDatePicker, keydown: e.onDateKeyDown, clear: e.clearDatePickerValue, close: e.closeDatePicker } })], 1), e.dateErrorText && !a.errorMessage ? t(e.ErrorMessage, { staticClass: "b-date-picker__error-message", attrs: { id: e.dateErrorId, "error-message": e.dateErrorText } }) : a._e(), a.errorMessage ? t(e.ErrorMessage, { staticClass: "b-date-picker__error-message", attrs: { id: e.errorId, "error-message": a.errorMessage } }) : a._e(), a.description ? t(e.BentoTypography, { staticClass: "b-date-picker__description", class: e.descriptionConditionalClasses, attrs: { el: "span" } }, [a._v(" " + a._s(a.description) + " ")]) : a._e(), e.inputContainerRef && !e.isTouchDevice ? t(e.BentoPopover, { staticClass: "b-date-picker__container", attrs: { id: e.datePickerContainerId, role: "dialog", open: e.isDatePickerOpen, "target-element": e.inputContainerRef, "aria-label": e.popoverAriaLabel, "aria-modal": !0, position: "bottom-start", "fit-content": "", "trap-all": "", "overflow-visible": "", "trap-all-options": e.computedTrapAllOptions }, nativeOn: { keydown: function(r) {
-    return !r.type.indexOf("key") && a._k(r.keyCode, "esc", 27, r.key, ["Esc", "Escape"]) ? null : e.closeDatePicker.apply(null, arguments);
-  } } }, [t(e.Calendar, { ref: "calendarContainerRef", attrs: { "default-display-month": a.defaultDisplayMonth, "first-day-of-week": e.resolvedFirstDayOfWeek, "is-date-disabled": a.isDateDisabled, "number-of-months": 1, value: e.internalModelValue, min: a.min, max: a.max, variant: a.variant, "year-range": a.yearRange }, on: { input: e.onDateSelected } })], 1) : a._e()], 1);
-}, Oe = [], Be = /* @__PURE__ */ he(
-  Pe,
-  xe,
-  Oe,
-  !1,
-  null,
-  "f44937e7"
-);
-const He = Be.exports;
-export {
-  He as B
-};
-//# sourceMappingURL=date-picker.CXZfCxwP.js.map