@adyen/bento-vue2 1.63.2 → 1.64.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (121) hide show
  1. package/dist/@types/index.d.ts +4 -0
  2. package/dist/assets/accordion-item.css +1 -1
  3. package/dist/assets/action-bar.css +1 -1
  4. package/dist/assets/base-modal.css +1 -1
  5. package/dist/assets/card.css +1 -1
  6. package/dist/assets/data-grid.css +1 -1
  7. package/dist/assets/date-picker.css +1 -1
  8. package/dist/assets/dialog-page.css +1 -1
  9. package/dist/assets/dropdown.css +1 -1
  10. package/dist/assets/file-uploader.css +1 -1
  11. package/dist/assets/input-field-password.css +1 -1
  12. package/dist/assets/inspector.css +1 -1
  13. package/dist/assets/menu.css +1 -1
  14. package/dist/assets/modal-fullscreen.css +1 -1
  15. package/dist/assets/popover.css +1 -1
  16. package/dist/assets/sidepanel.css +1 -1
  17. package/dist/assets/use-cached-selected-values.css +1 -1
  18. package/dist/checkbox.js +2 -2
  19. package/dist/chunks/{checkbox-group.6y92U6AF.js → checkbox-group.DVX0GFm9.js} +4 -4
  20. package/dist/chunks/{checkbox-group.6y92U6AF.js.map → checkbox-group.DVX0GFm9.js.map} +1 -1
  21. package/dist/chunks/{checkbox.C9nJVvMq.js → checkbox.nHrvoKfp.js} +3 -3
  22. package/dist/chunks/{checkbox.C9nJVvMq.js.map → checkbox.nHrvoKfp.js.map} +1 -1
  23. package/dist/chunks/{code-snippet.CBU8Tlbs.js → code-snippet.C7eh-7Vy.js} +3 -3
  24. package/dist/chunks/{code-snippet.CBU8Tlbs.js.map → code-snippet.C7eh-7Vy.js.map} +1 -1
  25. package/dist/chunks/{controls-group.Dpe3TqAz.js → controls-group.BWAmz7Tg.js} +2 -2
  26. package/dist/chunks/{controls-group.Dpe3TqAz.js.map → controls-group.BWAmz7Tg.js.map} +1 -1
  27. package/dist/chunks/{copy.Co1MMqtM.js → copy.CXeLbvUP.js} +2 -2
  28. package/dist/chunks/{copy.Co1MMqtM.js.map → copy.CXeLbvUP.js.map} +1 -1
  29. package/dist/chunks/{dashed-underline.DD24UDCz.js → dashed-underline.CEaAmjDa.js} +2 -2
  30. package/dist/chunks/{dashed-underline.DD24UDCz.js.map → dashed-underline.CEaAmjDa.js.map} +1 -1
  31. package/dist/chunks/{data-grid.Cep-0zsO.js → data-grid.o64ltIur.js} +1105 -1076
  32. package/dist/chunks/data-grid.o64ltIur.js.map +1 -0
  33. package/dist/chunks/{date-picker.D65ieFdN.js → date-picker.Ba-lHyXs.js} +29 -29
  34. package/dist/chunks/{date-picker.D65ieFdN.js.map → date-picker.Ba-lHyXs.js.map} +1 -1
  35. package/dist/chunks/{date-range-picker.CNB28UaM.js → date-range-picker.BER92nnT.js} +21 -21
  36. package/dist/chunks/{date-range-picker.CNB28UaM.js.map → date-range-picker.BER92nnT.js.map} +1 -1
  37. package/dist/chunks/{dropdown-tag.DmVsDrL_.js → dropdown-tag.uNZs7yVF.js} +3 -3
  38. package/dist/chunks/{dropdown-tag.DmVsDrL_.js.map → dropdown-tag.uNZs7yVF.js.map} +1 -1
  39. package/dist/chunks/{dropdown.B_PWXFtT.js → dropdown.DZ1Ndonr.js} +211 -210
  40. package/dist/chunks/dropdown.DZ1Ndonr.js.map +1 -0
  41. package/dist/chunks/{error-message.BeExHHgv.js → error-message.1Em7Lis3.js} +2 -2
  42. package/dist/chunks/{error-message.BeExHHgv.js.map → error-message.1Em7Lis3.js.map} +1 -1
  43. package/dist/chunks/{file-uploader.RYWR99Nq.js → file-uploader.DyjdNLOa.js} +3 -3
  44. package/dist/chunks/{file-uploader.RYWR99Nq.js.map → file-uploader.DyjdNLOa.js.map} +1 -1
  45. package/dist/chunks/{filter-bar.DjUN3PeJ.js → filter-bar.BMDvL9EW.js} +10 -10
  46. package/dist/chunks/{filter-bar.DjUN3PeJ.js.map → filter-bar.BMDvL9EW.js.map} +1 -1
  47. package/dist/chunks/{header-with-views.Csgl4PSQ.js → header-with-views.CEfKLlVv.js} +4 -4
  48. package/dist/chunks/{header-with-views.Csgl4PSQ.js.map → header-with-views.CEfKLlVv.js.map} +1 -1
  49. package/dist/chunks/{info-icon.G8lKgclf.js → info-icon.B9aTl1nU.js} +2 -2
  50. package/dist/chunks/{info-icon.G8lKgclf.js.map → info-icon.B9aTl1nU.js.map} +1 -1
  51. package/dist/chunks/{input-field-password.CY3eRVpe.js → input-field-password.DI7W4ehj.js} +110 -109
  52. package/dist/chunks/input-field-password.DI7W4ehj.js.map +1 -0
  53. package/dist/chunks/{input-field-phone-number.CN5qZ0VL.js → input-field-phone-number.BXbNxQeN.js} +3 -3
  54. package/dist/chunks/{input-field-phone-number.CN5qZ0VL.js.map → input-field-phone-number.BXbNxQeN.js.map} +1 -1
  55. package/dist/chunks/{input-field.DKhsSYF8.js → input-field.-Pgtuotm.js} +3 -3
  56. package/dist/chunks/{input-field.DKhsSYF8.js.map → input-field.-Pgtuotm.js.map} +1 -1
  57. package/dist/chunks/{listbox-option-tag.DFmB_TuD.js → listbox-option-tag.D0Cql_R3.js} +2 -2
  58. package/dist/chunks/{listbox-option-tag.DFmB_TuD.js.map → listbox-option-tag.D0Cql_R3.js.map} +1 -1
  59. package/dist/chunks/{pagination.DvP8FqiW.js → pagination.CoM4szsH.js} +2 -2
  60. package/dist/chunks/{pagination.DvP8FqiW.js.map → pagination.CoM4szsH.js.map} +1 -1
  61. package/dist/chunks/{radio-group.CRDMTTyM.js → radio-group.CtPG_iiI.js} +4 -4
  62. package/dist/chunks/{radio-group.CRDMTTyM.js.map → radio-group.CtPG_iiI.js.map} +1 -1
  63. package/dist/chunks/{rich-text-editor.aSOSl4Rz.js → rich-text-editor.CLxVaskq.js} +4 -4
  64. package/dist/chunks/{rich-text-editor.aSOSl4Rz.js.map → rich-text-editor.CLxVaskq.js.map} +1 -1
  65. package/dist/chunks/{search-bar.Sh4A8UId.js → search-bar.BhQdvBh8.js} +3 -3
  66. package/dist/chunks/{search-bar.Sh4A8UId.js.map → search-bar.BhQdvBh8.js.map} +1 -1
  67. package/dist/chunks/{secondary-nav.BFtGx_IN.js → secondary-nav.CItGT9T3.js} +2 -2
  68. package/dist/chunks/{secondary-nav.BFtGx_IN.js.map → secondary-nav.CItGT9T3.js.map} +1 -1
  69. package/dist/chunks/{segmented-control.B-uxKqMN.js → segmented-control.DHZEfmT-.js} +2 -2
  70. package/dist/chunks/{segmented-control.B-uxKqMN.js.map → segmented-control.DHZEfmT-.js.map} +1 -1
  71. package/dist/chunks/{selection-card-group.CrWy35QU.js → selection-card-group.CoqBRUT8.js} +3 -3
  72. package/dist/chunks/{selection-card-group.CrWy35QU.js.map → selection-card-group.CoqBRUT8.js.map} +1 -1
  73. package/dist/chunks/{structured-list-item.DKEwF8n7.js → structured-list-item.tox2Kcb6.js} +4 -4
  74. package/dist/chunks/{structured-list-item.DKEwF8n7.js.map → structured-list-item.tox2Kcb6.js.map} +1 -1
  75. package/dist/chunks/{summary-grid.types.BgFtV5Qh.js → summary-grid.types.CkUIw703.js} +5 -5
  76. package/dist/chunks/{summary-grid.types.BgFtV5Qh.js.map → summary-grid.types.CkUIw703.js.map} +1 -1
  77. package/dist/chunks/{tag.BaSi2GVV.js → tag.CGkclKVL.js} +2 -2
  78. package/dist/chunks/{tag.BaSi2GVV.js.map → tag.CGkclKVL.js.map} +1 -1
  79. package/dist/chunks/{textarea.D7M7Jerq.js → textarea.BPeDUAPL.js} +2 -2
  80. package/dist/chunks/{textarea.D7M7Jerq.js.map → textarea.BPeDUAPL.js.map} +1 -1
  81. package/dist/chunks/{timeline-item.njO0X8KL.js → timeline-item.CS9ZDOsm.js} +4 -4
  82. package/dist/chunks/{timeline-item.njO0X8KL.js.map → timeline-item.CS9ZDOsm.js.map} +1 -1
  83. package/dist/chunks/{tooltip.DyZIyMZN.js → tooltip.wQsyAwkC.js} +15 -15
  84. package/dist/chunks/tooltip.wQsyAwkC.js.map +1 -0
  85. package/dist/chunks/use-cached-selected-values.C1CeSurp.js +1271 -0
  86. package/dist/chunks/use-cached-selected-values.C1CeSurp.js.map +1 -0
  87. package/dist/code-snippet.js +1 -1
  88. package/dist/dashed-underline.js +1 -1
  89. package/dist/data-grid.js +1 -1
  90. package/dist/date-picker.js +1 -1
  91. package/dist/date-range-picker.js +1 -1
  92. package/dist/dropdown.js +3 -3
  93. package/dist/file-uploader.js +1 -1
  94. package/dist/filter-bar.js +1 -1
  95. package/dist/header-with-views.js +1 -1
  96. package/dist/index.js +30 -30
  97. package/dist/info-icon.js +1 -1
  98. package/dist/input-field-password.js +1 -1
  99. package/dist/input-field-phone-number.js +1 -1
  100. package/dist/input-field.js +1 -1
  101. package/dist/internal.js +6 -6
  102. package/dist/pagination.js +1 -1
  103. package/dist/radio-group.js +1 -1
  104. package/dist/rich-text-editor.js +1 -1
  105. package/dist/search-bar.js +2 -2
  106. package/dist/secondary-nav.js +1 -1
  107. package/dist/segmented-control.js +1 -1
  108. package/dist/selection-card.js +1 -1
  109. package/dist/structured-list.js +1 -1
  110. package/dist/summary-grid.js +1 -1
  111. package/dist/tag.js +1 -1
  112. package/dist/textarea.js +1 -1
  113. package/dist/timeline.js +1 -1
  114. package/dist/web-types.json +9 -1
  115. package/package.json +6 -6
  116. package/dist/chunks/data-grid.Cep-0zsO.js.map +0 -1
  117. package/dist/chunks/dropdown.B_PWXFtT.js.map +0 -1
  118. package/dist/chunks/input-field-password.CY3eRVpe.js.map +0 -1
  119. package/dist/chunks/tooltip.DyZIyMZN.js.map +0 -1
  120. package/dist/chunks/use-cached-selected-values.CDBmVxYM.js +0 -1225
  121. package/dist/chunks/use-cached-selected-values.CDBmVxYM.js.map +0 -1
@@ -2,17 +2,17 @@ import { ref as v, computed as u, defineComponent as q, toRef as E, watch as W,
2
2
  import { s as R, a as D } from "./calendar.DbTC35rM.js";
3
3
  import { B as j } from "./popover.B05xkQ4e.js";
4
4
  import { B as K } from "./typography.J1v_SPG3.js";
5
- import { D as $ } from "./dropdown-default-textbox.BNuuA4ES.js";
6
- import { d as z } from "./debounce.DUTu11PS.js";
7
- import { D as _, v as G, f as H } from "./date-input.BqBdAO1E.js";
5
+ import { d as $ } from "./debounce.DUTu11PS.js";
6
+ import { D as _, v as z, f as G } from "./date-input.BqBdAO1E.js";
8
7
  import { g as m } from "./generate-uid.NJ8tVoha.js";
9
8
  import { u as B } from "./i18n.BQkEbtPM.js";
10
- import { g as J } from "./get-date-locale.BN8xEjY0.js";
9
+ import { g as H } from "./get-date-locale.BN8xEjY0.js";
11
10
  import { f as T } from "./date.dYFFEunA.js";
12
- import { u as Q } from "./use-form-layout-loading.D3lALhtC.js";
11
+ import { u as J } from "./use-form-layout-loading.D3lALhtC.js";
13
12
  import "./index.Cl4_42j5.js";
13
+ import { D as Q } from "./dropdown-default-textbox.BNuuA4ES.js";
14
14
  import { B as X } from "./directive.Cbdox5VL.js";
15
- import { F as Z, E as ee } from "./error-message.BeExHHgv.js";
15
+ import { F as Z, E as ee } from "./error-message.1Em7Lis3.js";
16
16
  import { n as ae } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
17
17
  import "../assets/date-picker.css";
18
18
  const te = ({
@@ -21,29 +21,29 @@ const te = ({
21
21
  isMonthVariant: t
22
22
  }) => {
23
23
  var p;
24
- const { locale: n, t: b } = B(), o = J(), c = v((p = a.value) == null ? void 0 : p.toDateString());
24
+ const { locale: n, t: b } = B(), o = H(), d = v((p = a.value) == null ? void 0 : p.toDateString());
25
25
  return {
26
26
  // Values
27
- dateDisplayValue: u(() => e.value ? c.value : a.value ? T(
27
+ dateDisplayValue: u(() => e.value ? d.value : a.value ? T(
28
28
  a.value,
29
29
  t != null && t.value ? _.LONG_MONTH_YEAR : _.FULL_DATE,
30
30
  {
31
31
  locale: o[n.value.substring(0, 2)] || o.enUS
32
32
  }
33
33
  ) : b("selectDate")),
34
- textInputValue: c,
34
+ textInputValue: d,
35
35
  // Methods
36
36
  formatTextInputDisplayValue: (f = a.value) => {
37
37
  if (e.value)
38
38
  return;
39
39
  const l = t != null && t.value ? R(f) : f;
40
- c.value = f ? T(l, _.NUMERIC_DATE_YEAR_FIRST, {
40
+ d.value = f ? T(l, _.NUMERIC_DATE_YEAR_FIRST, {
41
41
  locale: o[n.value.substring(0, 2)] || o.enUS
42
42
  }) : null;
43
43
  }
44
44
  };
45
45
  };
46
- var d = /* @__PURE__ */ ((a) => (a.INPUT = "input", a))(d || {});
46
+ var s = /* @__PURE__ */ ((a) => (a.INPUT = "input", a))(s || {});
47
47
  const re = {
48
48
  "en-US": {
49
49
  datePicker: "Date picker",
@@ -68,7 +68,7 @@ const re = {
68
68
  BentoPopover: j,
69
69
  Calendar: D,
70
70
  ErrorMessage: ee,
71
- DropdownInputDefault: $,
71
+ DropdownInputDefault: Q,
72
72
  FieldLabel: Z
73
73
  },
74
74
  directives: { BentoClickOutsideDirective: X },
@@ -142,38 +142,38 @@ const re = {
142
142
  validator: (a) => /^\d{4}-(0?[1-9]|1[012])(-(0?[1-9]|[12][0-9]|3[01]))?$/.test(a)
143
143
  }
144
144
  },
145
- emits: [d.INPUT],
145
+ emits: [s.INPUT],
146
146
  setup(a, { emit: e }) {
147
- const { t } = B(), n = m("bento-date-picker-container"), b = m("bento-date-picker-label"), o = m("bento-date-picker-description"), c = m("bento-date-picker-error"), y = m("bento-date-picker-date-error"), I = u(() => a.label || t("datePicker", { name: n })), p = v(null), f = v(null), l = v(!1), i = v(!1), { isReadOnly: w } = Q(E(a, "readonly"));
147
+ const { t } = B(), n = m("bento-date-picker-container"), b = m("bento-date-picker-label"), o = m("bento-date-picker-description"), d = m("bento-date-picker-error"), y = m("bento-date-picker-date-error"), I = u(() => a.label || t("datePicker", { name: n })), p = v(null), f = v(null), l = v(!1), i = v(!1), { isReadOnly: w } = J(E(a, "readonly"));
148
148
  W(
149
149
  () => a.disabled,
150
150
  (r) => {
151
151
  r && i.value && (i.value = !1);
152
152
  }
153
153
  );
154
- const N = u(() => a.variant === "month"), { dateDisplayValue: U, textInputValue: s, formatTextInputDisplayValue: x } = te({
154
+ const N = u(() => a.variant === "month"), { dateDisplayValue: U, textInputValue: c, formatTextInputDisplayValue: x } = te({
155
155
  datePickerValue: E(a, "value"),
156
156
  isDateIncorrect: l,
157
157
  isMonthVariant: N
158
- }), k = u(() => a.isDateDisabled && s.value && a.isDateDisabled(new Date(s.value)) && !i.value ? t("selectedDateIsNotAvailable") : l.value ? t("provideDateInAFormat") : null), A = u(() => ({
158
+ }), k = u(() => a.isDateDisabled && a.isDateDisabled(new Date(c.value)) && !i.value ? t("selectedDateIsNotAvailable") : l.value ? t("provideDateInAFormat") : null), A = u(() => ({
159
159
  "b-date-picker__description--error": a.errorMessage || k.value
160
160
  })), L = u(
161
- () => `${a.description ? o : ""} ${a.errorMessage ? c : ""} ${k.value ? y : ""}`.trim() || null
161
+ () => `${a.description ? o : ""} ${a.errorMessage ? d : ""} ${k.value ? y : ""}`.trim() || null
162
162
  ), F = (r) => a.min && r <= a.min || a.max && r >= a.max ? !1 : a.isDateDisabled ? !a.isDateDisabled(r) : !0, C = () => {
163
163
  i.value = !1;
164
164
  }, P = () => {
165
165
  i.value = !0, x();
166
166
  }, h = (r) => {
167
- l.value = !1, C(), e(d.INPUT, r);
167
+ l.value = !1, C(), e(s.INPUT, r);
168
168
  }, M = async () => {
169
- l.value && (l.value = !1, s.value = null), e(d.INPUT, null);
169
+ l.value && (l.value = !1, c.value = null), e(s.INPUT, null);
170
170
  }, V = (r) => {
171
- G(r);
171
+ z(r);
172
172
  }, S = (r) => {
173
173
  if (r.length < 10)
174
174
  return;
175
- /^\d{4}-(0?[1-9]|1[012])-(0?[1-9]|[12][0-9]|3[01])$/.test(r) && F(new Date(r)) ? (l.value = !1, e(d.INPUT, new Date(r))) : r && (l.value = !0, e(d.INPUT, null));
176
- }, Y = z(S, ne);
175
+ /^\d{4}-(0?[1-9]|1[012])-(0?[1-9]|[12][0-9]|3[01])$/.test(r) && F(new Date(r)) ? (l.value = !1, e(s.INPUT, new Date(r))) : r && (l.value = !0, e(s.INPUT, null));
176
+ }, Y = $(S, ne);
177
177
  return {
178
178
  // Refs
179
179
  inputContainerRef: f,
@@ -188,11 +188,11 @@ const re = {
188
188
  dateErrorText: k,
189
189
  labelId: b,
190
190
  descriptionId: o,
191
- errorId: c,
191
+ errorId: d,
192
192
  dateErrorId: y,
193
193
  popoverAriaLabel: I,
194
194
  ariaDescribedBy: L,
195
- textInputValue: s,
195
+ textInputValue: c,
196
196
  // Events
197
197
  closeDatePicker: C,
198
198
  clearDatePickerValue: M,
@@ -200,12 +200,12 @@ const re = {
200
200
  openDatePicker: P,
201
201
  onDateKeyDown: V,
202
202
  onDateInputChange: (r) => {
203
- s.value = H(r), i.value ? Y(s.value) : S(s.value);
203
+ c.value = G(r), i.value ? Y(c.value) : S(c.value);
204
204
  },
205
205
  // Keyboard navigation
206
206
  onSpaceBarOrEnter: async (r) => {
207
207
  var g;
208
- i.value || (r.preventDefault(), P(), await O(), a.value || (x(/* @__PURE__ */ new Date()), e(d.INPUT, /* @__PURE__ */ new Date()), await O()), (g = p.value) == null || g.$refs.calendarRef[0].focusOnDate(
208
+ i.value || (r.preventDefault(), P(), await O(), a.value || (x(/* @__PURE__ */ new Date()), e(s.INPUT, /* @__PURE__ */ new Date()), await O()), (g = p.value) == null || g.$refs.calendarRef[0].focusOnDate(
209
209
  a.variant === "month" ? R(a.value) : a.value
210
210
  ));
211
211
  }
@@ -225,11 +225,11 @@ var ie = function() {
225
225
  oe,
226
226
  !1,
227
227
  null,
228
- "2774b8e4"
228
+ "8933e97a"
229
229
  );
230
230
  const Oe = se.exports;
231
231
  export {
232
232
  Oe as B,
233
- d as a
233
+ s as a
234
234
  };
235
- //# sourceMappingURL=date-picker.D65ieFdN.js.map
235
+ //# sourceMappingURL=date-picker.Ba-lHyXs.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"date-picker.D65ieFdN.js","sources":["../../src/components/date-picker/composables/use-date-picker-single-calendar-text.ts","../../src/components/date-picker/date-picker.types.ts","../../src/components/date-picker/date-picker.vue"],"sourcesContent":["import { computed, ref } from 'vue';\nimport { useI18n } from '@/utils/ts/i18n';\nimport { UseDateDisplayText } from './use-date-picker-single-calendar-text.types';\nimport { DateFormat } from '@/types';\nimport { getDateLocale } from '@/utils/ts/get-date-locale/get-date-locale';\nimport format from 'date-fns/format';\nimport startOfMonth from 'date-fns/startOfMonth';\n\n/**\n * Composable that sets and formats the date to be displayed in the input box of a Single Date Picker\n * @param {Ref<Date>} option.datePickerValue Ref to the datePickerValue set in the DatePicker component\n * @param {Ref<boolean>} option.isDateIncorrect Indicates if the date is correct or not\n * @param {?Ref<boolean>} option.isMonthVariant Indicates if the date picker has variant \"month\"\n */\nexport const useDatePickerSingleCalendarText: UseDateDisplayText<Date> = ({\n datePickerValue,\n isDateIncorrect,\n isMonthVariant,\n}) => {\n const { locale, t } = useI18n();\n const locales = getDateLocale();\n\n const textInputValue = ref(datePickerValue.value?.toDateString());\n\n const dateDisplayValue = computed(() => {\n // Display incorrect date when there's an error with the input\n if (isDateIncorrect.value) {\n return textInputValue.value;\n }\n\n // Display \"Select a date\" when there's no date selected or input\n if (!datePickerValue.value) {\n return t('selectDate') as string;\n }\n\n // Display the date in format \"dd MMM, yyyy (25 Jun, 2023)\" or \"MMMM yyyy (June 2023)\"\n // if there's a valid date selected\n return format(\n datePickerValue.value,\n isMonthVariant?.value ? DateFormat.LONG_MONTH_YEAR : DateFormat.FULL_DATE,\n {\n locale: locales[locale.value.substring(0, 2)] || locales.enUS,\n }\n );\n });\n\n /**\n * Formats the \"dateToFormat\" date value with the yyyy-MM-dd format and sets it as \"formatTextInputDisplayValue\" value\n * @param {Date} dateToFormat - Date to be assigned and formatted\n */\n const formatTextInputDisplayValue = (dateToFormat: Date = datePickerValue.value) => {\n // If date is incorrect, leave the textInputValue intact\n if (isDateIncorrect.value) {\n return;\n }\n\n const date = isMonthVariant?.value ? startOfMonth(dateToFormat) : dateToFormat;\n textInputValue.value = dateToFormat\n ? format(date, DateFormat.NUMERIC_DATE_YEAR_FIRST, {\n locale: locales[locale.value.substring(0, 2)] || locales.enUS,\n })\n : null;\n };\n\n return {\n // Values\n dateDisplayValue,\n textInputValue,\n\n // Methods\n formatTextInputDisplayValue,\n };\n};\n","export { CalendarFirstDayOfWeek as BentoDatePickerFirstDayOfWeek } from '@/internal';\nexport type {\n CalendarIsDateDisabled as BentoDatePickerIsDateDisabled,\n CalendarSingleDateValue as BentoDatePickerValue,\n CalendarVariant as BentoDatePickerVariant,\n} from '@/internal';\n\nexport enum BentoDatePickerEvent {\n INPUT = 'input',\n}\n","<!-- TODO: Remove aria props as these are part of JSX elements /vue/types/jsx.d.ts -->\n<!-- eslint-disable vue/attribute-hyphenation -->\n<template>\n <div\n v-bento-click-outside-directive=\"closeDatePicker\"\n class=\"b-date-picker\"\n @keydown.space.capture=\"onSpaceBarOrEnter\"\n @keydown.enter.capture=\"onSpaceBarOrEnter\"\n >\n <!-- Label -->\n <field-label\n v-if=\"label\"\n :id=\"labelId\"\n :label=\"label\"\n :tooltip-text=\"tooltipText\"\n :optional=\"optional\"\n :required=\"required\"\n />\n\n <!-- Input -->\n <div>\n <dropdown-input-default\n ref=\"inputContainerRef\"\n always-combobox-is-input\n :ariaControls=\"datePickerContainerId\"\n :ariaExpanded=\"isDatePickerOpen\"\n :aria-labelledby=\"label ? labelId : null\"\n :aria-describedby=\"ariaDescribedBy\"\n :disabled=\"disabled\"\n dynamic-filtering\n :is-invalid=\"!!errorMessage || !!dateErrorText\"\n :open=\"isDatePickerOpen\"\n :value=\"textInputValue\"\n :display-value=\"dateDisplayValue\"\n :debounce-time=\"0\"\n :readonly=\"isReadOnly\"\n @input=\"onDateInputChange\"\n @open=\"openDatePicker\"\n @keydown=\"onDateKeyDown\"\n @clear=\"clearDatePickerValue\"\n @close=\"closeDatePicker\"\n />\n </div>\n\n <!-- Error Messages -->\n <error-message\n v-if=\"dateErrorText\"\n :id=\"dateErrorId\"\n :error-message=\"dateErrorText\"\n class=\"b-date-picker__error-message\"\n />\n <error-message\n v-if=\"errorMessage\"\n :id=\"errorId\"\n :error-message=\"errorMessage\"\n class=\"b-date-picker__error-message\"\n />\n\n <!-- Description -->\n <bento-typography\n v-if=\"description\"\n class=\"b-date-picker__description\"\n :class=\"descriptionConditionalClasses\"\n el=\"span\"\n >\n {{ description }}\n </bento-typography>\n\n <!-- Calendar container -->\n <bento-popover\n v-if=\"inputContainerRef\"\n :id=\"datePickerContainerId\"\n class=\"b-date-picker__container\"\n role=\"dialog\"\n :open=\"isDatePickerOpen\"\n :target-element=\"inputContainerRef\"\n :disable-focus-trap=\"true\"\n :aria-label=\"popoverAriaLabel\"\n :aria-modal=\"true\"\n position=\"bottom-start\"\n fit-content\n >\n <calendar\n ref=\"calendarContainerRef\"\n :default-display-month=\"defaultDisplayMonth\"\n :first-day-of-week=\"firstDayOfWeek\"\n :is-date-disabled=\"isDateDisabled\"\n :number-of-months=\"1\"\n :value=\"value\"\n :min=\"min\"\n :max=\"max\"\n :variant=\"variant\"\n @input=\"onDateSelected\"\n />\n </bento-popover>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, nextTick, PropType, Ref, ref, toRef, watch } from 'vue';\n import startOfMonth from 'date-fns/startOfMonth';\n\n // Components\n import { BentoPopover } from '@/components/popover';\n import { BentoTypography } from '../typography';\n import { Calendar, ErrorMessage, FieldLabel } from '@/internal';\n import { DropdownInputDefault } from '@/components/dropdown/components';\n\n // Utils\n import { debounce } from '@/utils/ts/debounce';\n import { formatDateInputValue, validateDateInput } from '@/utils/ts/date-input';\n import { generateUid } from '@/core/utils/ts';\n import { useI18n } from '@/utils/ts/i18n';\n\n // Composables\n import { useDatePickerSingleCalendarText } from './composables/use-date-picker-single-calendar-text';\n import { useFormLayoutFieldLoading } from '@/composables';\n\n // Directive\n import { BentoClickOutsideDirective } from '@/directives';\n\n // Types\n import { BentoDatePickerEvent, BentoDatePickerValue, BentoDatePickerVariant } from './date-picker.types';\n\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n const DEBOUNCE_TIME = 1000;\n\n /**\n * Date picker selector.\n *\n * @example\n * import { BentoDatePicker } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoDatePicker },\n * template: `\n * <bento-date-picker\n * label=\"Label\"\n * description=\"Supporting text\"\n * required\n * optional\n * disabled\n * @input=\"onDateChanged\"\n * v-model=\"selectedDate\"\n * />\n * `,\n * setup() {\n * const selectedDate = ref(new Date()); // reactive({ startDate: new Date(), endDate: new Date() })\n * return {\n * selectedDate,\n * }\n * }\n * }\n */\n export default defineComponent({\n i18n: { messages },\n name: 'bento-date-picker',\n components: {\n BentoTypography,\n BentoPopover,\n Calendar,\n ErrorMessage,\n DropdownInputDefault,\n FieldLabel,\n },\n directives: { BentoClickOutsideDirective },\n props: {\n /**\n * Descriptive supporting text visbile underneath the dropdown.\n */\n description: { type: String, default: undefined },\n\n /**\n * Disables dropdown functionality.\n */\n disabled: { type: Boolean, default: false },\n\n /**\n * Displays component in an error state with an error message\n */\n errorMessage: { type: String, default: null },\n\n /**\n * Allows you to set the first day of the week. 0 is sunday, 1 is monday, 6 is saturday\n */\n firstDayOfWeek: Calendar.props.firstDayOfWeek,\n\n /**\n * Indicate if a date should be disabled or not\n */\n isDateDisabled: Calendar.props.isDateDisabled,\n\n /**\n * Sets a minimum limit for selectable dates - dates before `min` will not be selectable\n */\n min: Calendar.props.min,\n\n /**\n * Sets a maximum limit for selectable dates - dates after `max` will not be selectable\n */\n max: Calendar.props.max,\n\n /**\n * Text that is displayed as a label above the element.\n */\n label: { type: String, default: undefined },\n\n /**\n * Highlights the dropdown is optional.\n */\n optional: { type: Boolean, default: false },\n\n /**\n * The Boolean readonly property, when present, makes the element not mutable, meaning the user can not edit the date picker.\n */\n readonly: { type: Boolean, default: false },\n\n /**\n * Highlights the dropdown is required.\n */\n required: { type: Boolean, default: false },\n\n /**\n * Adds a info icon next to the label to display the passed tooltip message.\n */\n tooltipText: { type: String, default: null },\n\n /**\n * Selected date\n */\n value: { type: [Date, Object] as PropType<BentoDatePickerValue>, default: null },\n\n /**\n * The type of calendar to display. Defaults to showing days.\n */\n variant: {\n type: String as PropType<`${BentoDatePickerVariant}`>,\n default: undefined, // Default will be set by @/internal/calendar\n },\n\n /**\n * Default start date for the calendar pane\n */\n defaultDisplayMonth: {\n type: String,\n default: null,\n validator: (value: string) => {\n // Checks for YYYY-MM-DD format\n const dateRegex = /^\\d{4}-(0?[1-9]|1[012])(-(0?[1-9]|[12][0-9]|3[01]))?$/;\n const isValidDate = dateRegex.test(value);\n\n return isValidDate;\n },\n },\n },\n emits: [BentoDatePickerEvent.INPUT],\n setup(props, { emit }) {\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const datePickerContainerId = generateUid('bento-date-picker-container');\n const labelId = generateUid('bento-date-picker-label');\n const descriptionId = generateUid('bento-date-picker-description');\n const errorId = generateUid('bento-date-picker-error');\n const dateErrorId = generateUid('bento-date-picker-date-error');\n const popoverAriaLabel = computed(() => props.label || t('datePicker', { name: datePickerContainerId }));\n\n // Refs\n const calendarContainerRef = ref(null);\n const inputContainerRef = ref(null);\n\n // Values\n const isDateIncorrect = ref(false);\n const isDatePickerOpen = ref(false);\n const { isReadOnly } = useFormLayoutFieldLoading(toRef(props, 'readonly'));\n\n watch(\n () => props.disabled,\n disabled => {\n // Close date picker popover if it's opened when it's disabled\n if (disabled && isDatePickerOpen.value) {\n isDatePickerOpen.value = false;\n }\n }\n );\n\n const isMonthVariant = computed(() => props.variant === 'month');\n\n const { dateDisplayValue, textInputValue, formatTextInputDisplayValue } = useDatePickerSingleCalendarText({\n datePickerValue: toRef(props, 'value') as Ref<Date>,\n isDateIncorrect,\n isMonthVariant,\n });\n\n const dateErrorText = computed(() => {\n if (\n props.isDateDisabled &&\n textInputValue.value &&\n props.isDateDisabled(new Date(textInputValue.value)) &&\n !isDatePickerOpen.value\n ) {\n return t('selectedDateIsNotAvailable');\n }\n\n return isDateIncorrect.value ? t('provideDateInAFormat') : null;\n });\n\n const descriptionConditionalClasses = computed(() => ({\n 'b-date-picker__description--error': props.errorMessage || dateErrorText.value,\n }));\n\n const ariaDescribedBy = computed(\n () =>\n `${props.description ? descriptionId : ''} ${props.errorMessage ? errorId : ''} ${\n dateErrorText.value ? dateErrorId : ''\n }`.trim() || null\n );\n\n const isDateEnabled = (date: Date) => {\n // Check if date is between min/max bounds, if there are any\n if ((props.min && date <= props.min) || (props.max && date >= props.max)) {\n return false;\n }\n\n // Check if function is set, otherwise all dates are enabled\n if (props.isDateDisabled) {\n return !props.isDateDisabled(date);\n }\n\n return true;\n };\n\n const closeDatePicker = () => {\n isDatePickerOpen.value = false;\n };\n\n const openDatePicker = () => {\n isDatePickerOpen.value = true;\n\n formatTextInputDisplayValue();\n };\n\n const onDateSelected = (selectedDate: Date) => {\n // Reset the error state when a valid date is selected\n isDateIncorrect.value = false;\n\n closeDatePicker();\n emit(BentoDatePickerEvent.INPUT, selectedDate);\n };\n\n const clearDatePickerValue = async () => {\n if (isDateIncorrect.value) {\n isDateIncorrect.value = false;\n textInputValue.value = null;\n }\n emit(BentoDatePickerEvent.INPUT, null);\n };\n\n const onDateKeyDown = (event: KeyboardEvent) => {\n validateDateInput(event);\n };\n\n const validateDate = (stringDate: string) => {\n // Validate only if the date is complete\n if (stringDate.length < 10) {\n return;\n }\n\n // Checks for YYYY-MM-DD format\n const dateRegex = /^\\d{4}-(0?[1-9]|1[012])-(0?[1-9]|[12][0-9]|3[01])$/;\n const isValidDate = dateRegex.test(stringDate) && isDateEnabled(new Date(stringDate));\n if (isValidDate) {\n isDateIncorrect.value = false;\n emit(BentoDatePickerEvent.INPUT, new Date(stringDate));\n } else if (stringDate) {\n // Only set to true if the value exists (not null/undefined)\n isDateIncorrect.value = true;\n emit(BentoDatePickerEvent.INPUT, null);\n }\n };\n\n const validateDateDebounced = debounce(validateDate, DEBOUNCE_TIME);\n\n const onDateInputChange = (stringDate: string) => {\n textInputValue.value = formatDateInputValue(stringDate);\n // If we are closing the date picker, we should validate (and emit date inputs) immediately so the user doesn't have to wait for the debounce time.\n if (isDatePickerOpen.value) {\n validateDateDebounced(textInputValue.value);\n } else {\n validateDate(textInputValue.value);\n }\n };\n\n /**\n * Space bar and Enter keyDown event handler.\n *\n * * Opens the date picker dialog on the first keydown.\n * * Move focus to selected date, i.e., the date displayed in the date input text field. If no date has been selected, places focus on the current date.\n * @param {KeyboardEvent} event Event being triggered\n */\n const onSpaceBarOrEnter = async (event: KeyboardEvent) => {\n if (isDatePickerOpen.value) {\n return;\n }\n event.preventDefault();\n\n openDatePicker();\n\n // Wait for the date picker dialog to open\n await nextTick();\n\n // Set current date (today) if no date is selected\n if (!props.value) {\n // Format the opened date picker date to YYYY-MM-DD\n formatTextInputDisplayValue(new Date());\n emit(BentoDatePickerEvent.INPUT, new Date());\n\n // Wait for new value to be set with the emit\n await nextTick();\n }\n\n // Focus on date\n calendarContainerRef.value?.$refs.calendarRef[0].focusOnDate(\n props.variant === 'month' ? startOfMonth(props.value) : props.value\n );\n };\n\n return {\n // Refs\n inputContainerRef,\n calendarContainerRef,\n\n // Values,\n dateDisplayValue,\n datePickerContainerId,\n descriptionConditionalClasses,\n isDateIncorrect,\n isDatePickerOpen,\n isReadOnly,\n dateErrorText,\n labelId,\n descriptionId,\n errorId,\n dateErrorId,\n popoverAriaLabel,\n ariaDescribedBy,\n textInputValue,\n\n // Events\n closeDatePicker,\n clearDatePickerValue,\n onDateSelected,\n openDatePicker,\n onDateKeyDown,\n onDateInputChange,\n\n // Keyboard navigation\n onSpaceBarOrEnter,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./date-picker.scss\" />\n"],"names":["useDatePickerSingleCalendarText","datePickerValue","isDateIncorrect","isMonthVariant","locale","t","useI18n","locales","getDateLocale","textInputValue","ref","_a","computed","format","DateFormat","dateToFormat","date","startOfMonth","BentoDatePickerEvent","BentoDatePickerEvent2","DEBOUNCE_TIME","_sfc_main","defineComponent","messages","BentoTypography","BentoPopover","Calendar","ErrorMessage","DropdownInputDefault","FieldLabel","BentoClickOutsideDirective","value","props","emit","datePickerContainerId","generateUid","labelId","descriptionId","errorId","dateErrorId","popoverAriaLabel","calendarContainerRef","inputContainerRef","isDatePickerOpen","isReadOnly","useFormLayoutFieldLoading","toRef","watch","disabled","dateDisplayValue","formatTextInputDisplayValue","dateErrorText","descriptionConditionalClasses","ariaDescribedBy","isDateEnabled","closeDatePicker","openDatePicker","onDateSelected","selectedDate","clearDatePickerValue","onDateKeyDown","event","validateDateInput","validateDate","stringDate","validateDateDebounced","debounce","formatDateInputValue","nextTick"],"mappings":";;;;;;;;;;;;;;;;;AAcO,MAAAA,KAAA,CAAA;AAAA,EAAmE,iBAAAC;AAAA,EACtE,iBAAAC;AAAA,EACA,gBAAAC;AAEJ,MAAA;;AACI,QAAA,EAAA,QAAAC,GAAA,GAAAC,EAAA,IAAAC,EAAA,GACAC,IAAAC,EAAA,GAEAC,IAAAC,GAAAC,IAAAV,EAAA,UAAA,gBAAAU,EAAA,cAAA;AA0CA,SAAA;AAAA;AAAA,IAAO,kBAxCPC,EAAA,MAEIV,EAAA,QACIO,EAAA,QAIJR,EAAA,QAMAY;AAAA,MAAOZ,EAAA;AAAA,MACaE,KAAA,QAAAA,EAAA,QAAAW,EAAA,kBAAAA,EAAA;AAAA,MACgD;AAAA,QAChE,QAAAP,EAAAH,EAAA,MAAA,UAAA,GAAA,CAAA,CAAA,KAAAG,EAAA;AAAA,MAC6D;AAAA,IAC7D,IAVAF,EAAA,YAAA,CAWJ;AAAA,IAuBA,gBAAAI;AAAA;AAAA,IACA,6BAjBJ,CAAAM,IAAAd,EAAA,UAAA;AAEI,UAAAC,EAAA;AACI;AAGJ,YAAAc,IAAAb,KAAA,QAAAA,EAAA,QAAAc,EAAAF,CAAA,IAAAA;AACA,MAAAN,EAAA,QAAAM,IAAAF,EAAAG,GAAAF,EAAA,yBAAA;AAAA,QACuD,QAAAP,EAAAH,EAAA,MAAA,UAAA,GAAA,CAAA,CAAA,KAAAG,EAAA;AAAA,MACY,CAAA,IAAA;AAAA,IAE7D;AAAA,EASN;AAER;ACjEY,IAAAW,IAAA,kBAAAC,OACRA,EAAA,QAAA,SADQA,IAAAD,KAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;GCwHZE,KAAA,KA6BAC,KAAAC,EAAA;AAAA,EAAA,MAAA,EAAA,UAAAC,GAAA;AAAA,EACA,MAAA;AAAA,EACA,YAAA;AAAA,IACA,iBAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,cAAAC;AAAA,IACA,sBAAAC;AAAA,IACA,YAAAC;AAAA,EACA;AAAA,EACA,YAAA,EAAA,4BAAAC,EAAA;AAAA,EACA,OAAA;AAAA;AAAA;AAAA;AAAA,IACA,aAAA,EAAA,MAAA,QAAA,SAAA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,UAAA,EAAA,MAAA,SAAA,SAAA,GAAA;AAAA;AAAA;AAAA;AAAA,IAKA,cAAA,EAAA,MAAA,QAAA,SAAA,KAAA;AAAA;AAAA;AAAA;AAAA,IAKA,gBAAAJ,EAAA,MAAA;AAAA;AAAA;AAAA;AAAA,IAKA,gBAAAA,EAAA,MAAA;AAAA;AAAA;AAAA;AAAA,IAKA,KAAAA,EAAA,MAAA;AAAA;AAAA;AAAA;AAAA,IAKA,KAAAA,EAAA,MAAA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAA,EAAA,MAAA,QAAA,SAAA,OAAA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA,EAAA,MAAA,SAAA,SAAA,GAAA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA,EAAA,MAAA,SAAA,SAAA,GAAA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA,EAAA,MAAA,SAAA,SAAA,GAAA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA,EAAA,MAAA,QAAA,SAAA,KAAA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAA,EAAA,MAAA,CAAA,MAAA,MAAA,GAAA,SAAA,KAAA;AAAA;AAAA;AAAA;AAAA,IAKA,SAAA;AAAA,MAKA,MAAA;AAAA,MACA,SAAA;AAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IACA,qBAAA;AAAA,MAKA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAAK,MAGA,wDACA,KAAAA,CAAA;AAAA,IAGA;AAAA,EACA;AAAA,EACA,OAAA,CAAAb,EAAA,KAAA;AAAA,EACA,MAAAc,GAAA,EAAA,MAAAC,EAAA,GAAA;AAEA,UAAA,EAAA,EAAA,IAAA3B,EAAA,GACA4B,IAAAC,EAAA,6BAAA,GACAC,IAAAD,EAAA,yBAAA,GACAE,IAAAF,EAAA,+BAAA,GACAG,IAAAH,EAAA,yBAAA,GACAI,IAAAJ,EAAA,8BAAA,GACAK,IAAA5B,EAAA,MAAAoB,EAAA,SAAA,EAAA,cAAA,EAAA,MAAAE,EAAA,CAAA,CAAA,GAGAO,IAAA/B,EAAA,IAAA,GACAgC,IAAAhC,EAAA,IAAA,GAGAR,IAAAQ,EAAA,EAAA,GACAiC,IAAAjC,EAAA,EAAA,GACA,EAAA,YAAAkC,EAAA,IAAAC,EAAAC,EAAAd,GAAA,UAAA,CAAA;AAEA,IAAAe;AAAA,MAAA,MAAAf,EAAA;AAAA,MACA,CAAAgB,MAAA;AAGA,QAAAA,KAAAL,EAAA,UACAA,EAAA,QAAA;AAAA,MACA;AAAA,IACA;AAGA,UAAAxC,IAAAS,EAAA,MAAAoB,EAAA,YAAA,OAAA,GAEA,EAAA,kBAAAiB,GAAA,gBAAAxC,GAAA,6BAAAyC,EAAA,IAAAlD,GAAA;AAAA,MAAA,iBAAA8C,EAAAd,GAAA,OAAA;AAAA,MACA,iBAAA9B;AAAA,MACA,gBAAAC;AAAA,IACA,CAAA,GAGAgD,IAAAvC,EAAA,MACAoB,EAAA,kBAAAvB,EAAA,SAAAuB,EAAA,eAAA,IAAA,KAAAvB,EAAA,KAAA,CAAA,KAAA,CAAAkC,EAAA,QAMA,EAAA,4BAAA,IAGAzC,EAAA,QAAA,EAAA,sBAAA,IAAA,IAAA,GAGAkD,IAAAxC,EAAA,OAAA;AAAA,MAAA,qCAAAoB,EAAA,gBAAAmB,EAAA;AAAA,IACA,EAAA,GAGAE,IAAAzC;AAAA,MAAA,MAAA,GAAAoB,EAAA,cAAAK,IAAA,EAAA,IAAAL,EAAA,eAAAM,IAAA,EAAA,IAAAa,EAAA,QAAAZ,IAAA,EAAA,GAAA,KAAA,KAAA;AAAA,IAIA,GAGAe,IAAA,CAAAtC,MAEAgB,EAAA,OAAAhB,KAAAgB,EAAA,OAAAA,EAAA,OAAAhB,KAAAgB,EAAA,MACA,KAIAA,EAAA,iBACA,CAAAA,EAAA,eAAAhB,CAAA,IAGA,IAGAuC,IAAA,MAAA;AACA,MAAAZ,EAAA,QAAA;AAAA,IAAA,GAGAa,IAAA,MAAA;AACA,MAAAb,EAAA,QAAA,IAEAO,EAAA;AAAA,IAAA,GAGAO,IAAA,CAAAC,MAAA;AAEA,MAAAxD,EAAA,QAAA,IAEAqD,EAAA,GACAtB,EAAAf,EAAA,OAAAwC,CAAA;AAAA,IAAA,GAGAC,IAAA,YAAA;AACA,MAAAzD,EAAA,UACAA,EAAA,QAAA,IACAO,EAAA,QAAA,OAEAwB,EAAAf,EAAA,OAAA,IAAA;AAAA,IAAA,GAGA0C,IAAA,CAAAC,MAAA;AACA,MAAAC,EAAAD,CAAA;AAAA,IAAA,GAGAE,IAAA,CAAAC,MAAA;AAEA,UAAAA,EAAA,SAAA;AACA;AAMA,MAFA,qDACA,KAAAA,CAAA,KAAAV,EAAA,IAAA,KAAAU,CAAA,CAAA,KAEA9D,EAAA,QAAA,IACA+B,EAAAf,EAAA,OAAA,IAAA,KAAA8C,CAAA,CAAA,KAAAA,MAGA9D,EAAA,QAAA,IACA+B,EAAAf,EAAA,OAAA,IAAA;AAAA,IACA,GAGA+C,IAAAC,EAAAH,GAAA3C,EAAA;AA8CA,WAAA;AAAA;AAAA,MAAA,mBAAAsB;AAAA,MAEA,sBAAAD;AAAA;AAAA,MACA,kBAAAQ;AAAA,MAGA,uBAAAf;AAAA,MACA,+BAAAkB;AAAA,MACA,iBAAAlD;AAAA,MACA,kBAAAyC;AAAA,MACA,YAAAC;AAAA,MACA,eAAAO;AAAA,MACA,SAAAf;AAAA,MACA,eAAAC;AAAA,MACA,SAAAC;AAAA,MACA,aAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,iBAAAa;AAAA,MACA,gBAAA5C;AAAA;AAAA,MACA,iBAAA8C;AAAA,MAGA,sBAAAI;AAAA,MACA,gBAAAF;AAAA,MACA,gBAAAD;AAAA,MACA,eAAAI;AAAA,MACA,mBAtEA,CAAAI,MAAA;AACA,QAAAvD,EAAA,QAAA0D,EAAAH,CAAA,GAEArB,EAAA,QACAsB,EAAAxD,EAAA,KAAA,IAEAsD,EAAAtD,EAAA,KAAA;AAAA,MACA;AAAA;AAAA,MAgEA,mBAtDA,OAAAoD,MAAA;;AACA,QAAAlB,EAAA,UAGAkB,EAAA,eAAA,GAEAL,EAAA,GAGA,MAAAY,EAAA,GAGApC,EAAA,UAEAkB,EAAA,oBAAA,KAAA,CAAA,GACAjB,EAAAf,EAAA,OAAA,oBAAA,KAAA,CAAA,GAGA,MAAAkD,EAAA,KAIAzD,IAAA8B,EAAA,UAAA,QAAA9B,EAAA,MAAA,YAAA,GAAA;AAAA,UAAAqB,EAAA,YAAA,UAAAf,EAAAe,EAAA,KAAA,IAAAA,EAAA;AAAA;AAAA,MAEA;AAAA,IAiCA;AAAA,EACA;AAEA,CAAA;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"date-picker.Ba-lHyXs.js","sources":["../../src/components/date-picker/composables/use-date-picker-single-calendar-text.ts","../../src/components/date-picker/date-picker.types.ts","../../src/components/date-picker/date-picker.vue"],"sourcesContent":["import { computed, ref } from 'vue';\nimport { useI18n } from '@/utils/ts/i18n';\nimport { UseDateDisplayText } from './use-date-picker-single-calendar-text.types';\nimport { DateFormat } from '@/types';\nimport { getDateLocale } from '@/utils/ts/get-date-locale/get-date-locale';\nimport format from 'date-fns/format';\nimport startOfMonth from 'date-fns/startOfMonth';\n\n/**\n * Composable that sets and formats the date to be displayed in the input box of a Single Date Picker\n * @param {Ref<Date>} option.datePickerValue Ref to the datePickerValue set in the DatePicker component\n * @param {Ref<boolean>} option.isDateIncorrect Indicates if the date is correct or not\n * @param {?Ref<boolean>} option.isMonthVariant Indicates if the date picker has variant \"month\"\n */\nexport const useDatePickerSingleCalendarText: UseDateDisplayText<Date> = ({\n datePickerValue,\n isDateIncorrect,\n isMonthVariant,\n}) => {\n const { locale, t } = useI18n();\n const locales = getDateLocale();\n\n const textInputValue = ref(datePickerValue.value?.toDateString());\n\n const dateDisplayValue = computed(() => {\n // Display incorrect date when there's an error with the input\n if (isDateIncorrect.value) {\n return textInputValue.value;\n }\n\n // Display \"Select a date\" when there's no date selected or input\n if (!datePickerValue.value) {\n return t('selectDate') as string;\n }\n\n // Display the date in format \"dd MMM, yyyy (25 Jun, 2023)\" or \"MMMM yyyy (June 2023)\"\n // if there's a valid date selected\n return format(\n datePickerValue.value,\n isMonthVariant?.value ? DateFormat.LONG_MONTH_YEAR : DateFormat.FULL_DATE,\n {\n locale: locales[locale.value.substring(0, 2)] || locales.enUS,\n }\n );\n });\n\n /**\n * Formats the \"dateToFormat\" date value with the yyyy-MM-dd format and sets it as \"formatTextInputDisplayValue\" value\n * @param {Date} dateToFormat - Date to be assigned and formatted\n */\n const formatTextInputDisplayValue = (dateToFormat: Date = datePickerValue.value) => {\n // If date is incorrect, leave the textInputValue intact\n if (isDateIncorrect.value) {\n return;\n }\n\n const date = isMonthVariant?.value ? startOfMonth(dateToFormat) : dateToFormat;\n textInputValue.value = dateToFormat\n ? format(date, DateFormat.NUMERIC_DATE_YEAR_FIRST, {\n locale: locales[locale.value.substring(0, 2)] || locales.enUS,\n })\n : null;\n };\n\n return {\n // Values\n dateDisplayValue,\n textInputValue,\n\n // Methods\n formatTextInputDisplayValue,\n };\n};\n","export { CalendarFirstDayOfWeek as BentoDatePickerFirstDayOfWeek } from '@/internal';\nexport type {\n CalendarIsDateDisabled as BentoDatePickerIsDateDisabled,\n CalendarSingleDateValue as BentoDatePickerValue,\n CalendarVariant as BentoDatePickerVariant,\n} from '@/internal';\n\nexport enum BentoDatePickerEvent {\n INPUT = 'input',\n}\n","<!-- TODO: Remove aria props as these are part of JSX elements /vue/types/jsx.d.ts -->\n<!-- eslint-disable vue/attribute-hyphenation -->\n<template>\n <div\n v-bento-click-outside-directive=\"closeDatePicker\"\n class=\"b-date-picker\"\n @keydown.space.capture=\"onSpaceBarOrEnter\"\n @keydown.enter.capture=\"onSpaceBarOrEnter\"\n >\n <!-- Label -->\n <field-label\n v-if=\"label\"\n :id=\"labelId\"\n :label=\"label\"\n :tooltip-text=\"tooltipText\"\n :optional=\"optional\"\n :required=\"required\"\n />\n\n <!-- Input -->\n <div>\n <dropdown-input-default\n ref=\"inputContainerRef\"\n always-combobox-is-input\n :ariaControls=\"datePickerContainerId\"\n :ariaExpanded=\"isDatePickerOpen\"\n :aria-labelledby=\"label ? labelId : null\"\n :aria-describedby=\"ariaDescribedBy\"\n :disabled=\"disabled\"\n dynamic-filtering\n :is-invalid=\"!!errorMessage || !!dateErrorText\"\n :open=\"isDatePickerOpen\"\n :value=\"textInputValue\"\n :display-value=\"dateDisplayValue\"\n :debounce-time=\"0\"\n :readonly=\"isReadOnly\"\n @input=\"onDateInputChange\"\n @open=\"openDatePicker\"\n @keydown=\"onDateKeyDown\"\n @clear=\"clearDatePickerValue\"\n @close=\"closeDatePicker\"\n />\n </div>\n\n <!-- Error Messages -->\n <error-message\n v-if=\"dateErrorText\"\n :id=\"dateErrorId\"\n :error-message=\"dateErrorText\"\n class=\"b-date-picker__error-message\"\n />\n <error-message\n v-if=\"errorMessage\"\n :id=\"errorId\"\n :error-message=\"errorMessage\"\n class=\"b-date-picker__error-message\"\n />\n\n <!-- Description -->\n <bento-typography\n v-if=\"description\"\n class=\"b-date-picker__description\"\n :class=\"descriptionConditionalClasses\"\n el=\"span\"\n >\n {{ description }}\n </bento-typography>\n\n <!-- Calendar container -->\n <bento-popover\n v-if=\"inputContainerRef\"\n :id=\"datePickerContainerId\"\n class=\"b-date-picker__container\"\n role=\"dialog\"\n :open=\"isDatePickerOpen\"\n :target-element=\"inputContainerRef\"\n :disable-focus-trap=\"true\"\n :aria-label=\"popoverAriaLabel\"\n :aria-modal=\"true\"\n position=\"bottom-start\"\n fit-content\n >\n <calendar\n ref=\"calendarContainerRef\"\n :default-display-month=\"defaultDisplayMonth\"\n :first-day-of-week=\"firstDayOfWeek\"\n :is-date-disabled=\"isDateDisabled\"\n :number-of-months=\"1\"\n :value=\"value\"\n :min=\"min\"\n :max=\"max\"\n :variant=\"variant\"\n @input=\"onDateSelected\"\n />\n </bento-popover>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, nextTick, PropType, Ref, ref, toRef, watch } from 'vue';\n import startOfMonth from 'date-fns/startOfMonth';\n\n // Components\n import { BentoPopover } from '@/components/popover';\n import { BentoTypography } from '../typography';\n import { Calendar, ErrorMessage, FieldLabel } from '@/internal';\n import { DropdownInputDefault } from '@/components/dropdown/components';\n\n // Utils\n import { debounce } from '@/utils/ts/debounce';\n import { formatDateInputValue, validateDateInput } from '@/utils/ts/date-input';\n import { generateUid } from '@/core/utils/ts';\n import { useI18n } from '@/utils/ts/i18n';\n\n // Composables\n import { useDatePickerSingleCalendarText } from './composables/use-date-picker-single-calendar-text';\n import { useFormLayoutFieldLoading } from '@/composables';\n\n // Directive\n import { BentoClickOutsideDirective } from '@/directives';\n\n // Types\n import { BentoDatePickerEvent, BentoDatePickerValue, BentoDatePickerVariant } from './date-picker.types';\n\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n const DEBOUNCE_TIME = 1000;\n\n /**\n * Date picker selector.\n *\n * @example\n * import { BentoDatePicker } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoDatePicker },\n * template: `\n * <bento-date-picker\n * label=\"Label\"\n * description=\"Supporting text\"\n * required\n * optional\n * disabled\n * @input=\"onDateChanged\"\n * v-model=\"selectedDate\"\n * />\n * `,\n * setup() {\n * const selectedDate = ref(new Date()); // reactive({ startDate: new Date(), endDate: new Date() })\n * return {\n * selectedDate,\n * }\n * }\n * }\n */\n export default defineComponent({\n i18n: { messages },\n name: 'bento-date-picker',\n components: {\n BentoTypography,\n BentoPopover,\n Calendar,\n ErrorMessage,\n DropdownInputDefault,\n FieldLabel,\n },\n directives: { BentoClickOutsideDirective },\n props: {\n /**\n * Descriptive supporting text visbile underneath the dropdown.\n */\n description: { type: String, default: undefined },\n\n /**\n * Disables dropdown functionality.\n */\n disabled: { type: Boolean, default: false },\n\n /**\n * Displays component in an error state with an error message\n */\n errorMessage: { type: String, default: null },\n\n /**\n * Allows you to set the first day of the week. 0 is sunday, 1 is monday, 6 is saturday\n */\n firstDayOfWeek: Calendar.props.firstDayOfWeek,\n\n /**\n * Indicate if a date should be disabled or not\n */\n isDateDisabled: Calendar.props.isDateDisabled,\n\n /**\n * Sets a minimum limit for selectable dates - dates before `min` will not be selectable\n */\n min: Calendar.props.min,\n\n /**\n * Sets a maximum limit for selectable dates - dates after `max` will not be selectable\n */\n max: Calendar.props.max,\n\n /**\n * Text that is displayed as a label above the element.\n */\n label: { type: String, default: undefined },\n\n /**\n * Highlights the dropdown is optional.\n */\n optional: { type: Boolean, default: false },\n\n /**\n * The Boolean readonly property, when present, makes the element not mutable, meaning the user can not edit the date picker.\n */\n readonly: { type: Boolean, default: false },\n\n /**\n * Highlights the dropdown is required.\n */\n required: { type: Boolean, default: false },\n\n /**\n * Adds a info icon next to the label to display the passed tooltip message.\n */\n tooltipText: { type: String, default: null },\n\n /**\n * Selected date\n */\n value: { type: [Date, Object] as PropType<BentoDatePickerValue>, default: null },\n\n /**\n * The type of calendar to display. Defaults to showing days.\n */\n variant: {\n type: String as PropType<`${BentoDatePickerVariant}`>,\n default: undefined, // Default will be set by @/internal/calendar\n },\n\n /**\n * Default start date for the calendar pane\n */\n defaultDisplayMonth: {\n type: String,\n default: null,\n validator: (value: string) => {\n // Checks for YYYY-MM-DD format\n const dateRegex = /^\\d{4}-(0?[1-9]|1[012])(-(0?[1-9]|[12][0-9]|3[01]))?$/;\n const isValidDate = dateRegex.test(value);\n\n return isValidDate;\n },\n },\n },\n emits: [BentoDatePickerEvent.INPUT],\n setup(props, { emit }) {\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const datePickerContainerId = generateUid('bento-date-picker-container');\n const labelId = generateUid('bento-date-picker-label');\n const descriptionId = generateUid('bento-date-picker-description');\n const errorId = generateUid('bento-date-picker-error');\n const dateErrorId = generateUid('bento-date-picker-date-error');\n const popoverAriaLabel = computed(() => props.label || t('datePicker', { name: datePickerContainerId }));\n\n // Refs\n const calendarContainerRef = ref(null);\n const inputContainerRef = ref(null);\n\n // Values\n const isDateIncorrect = ref(false);\n const isDatePickerOpen = ref(false);\n const { isReadOnly } = useFormLayoutFieldLoading(toRef(props, 'readonly'));\n\n watch(\n () => props.disabled,\n disabled => {\n // Close date picker popover if it's opened when it's disabled\n if (disabled && isDatePickerOpen.value) {\n isDatePickerOpen.value = false;\n }\n }\n );\n\n const isMonthVariant = computed(() => props.variant === 'month');\n\n const { dateDisplayValue, textInputValue, formatTextInputDisplayValue } = useDatePickerSingleCalendarText({\n datePickerValue: toRef(props, 'value') as Ref<Date>,\n isDateIncorrect,\n isMonthVariant,\n });\n\n const dateErrorText = computed(() => {\n if (\n props.isDateDisabled &&\n props.isDateDisabled(new Date(textInputValue.value)) &&\n !isDatePickerOpen.value\n ) {\n return t('selectedDateIsNotAvailable');\n }\n\n return isDateIncorrect.value ? t('provideDateInAFormat') : null;\n });\n\n const descriptionConditionalClasses = computed(() => ({\n 'b-date-picker__description--error': props.errorMessage || dateErrorText.value,\n }));\n\n const ariaDescribedBy = computed(\n () =>\n `${props.description ? descriptionId : ''} ${props.errorMessage ? errorId : ''} ${\n dateErrorText.value ? dateErrorId : ''\n }`.trim() || null\n );\n\n const isDateEnabled = (date: Date) => {\n // Check if date is between min/max bounds, if there are any\n if ((props.min && date <= props.min) || (props.max && date >= props.max)) {\n return false;\n }\n\n // Check if function is set, otherwise all dates are enabled\n if (props.isDateDisabled) {\n return !props.isDateDisabled(date);\n }\n\n return true;\n };\n\n const closeDatePicker = () => {\n isDatePickerOpen.value = false;\n };\n\n const openDatePicker = () => {\n isDatePickerOpen.value = true;\n\n formatTextInputDisplayValue();\n };\n\n const onDateSelected = (selectedDate: Date) => {\n // Reset the error state when a valid date is selected\n isDateIncorrect.value = false;\n\n closeDatePicker();\n emit(BentoDatePickerEvent.INPUT, selectedDate);\n };\n\n const clearDatePickerValue = async () => {\n if (isDateIncorrect.value) {\n isDateIncorrect.value = false;\n textInputValue.value = null;\n }\n emit(BentoDatePickerEvent.INPUT, null);\n };\n\n const onDateKeyDown = (event: KeyboardEvent) => {\n validateDateInput(event);\n };\n\n const validateDate = (stringDate: string) => {\n // Validate only if the date is complete\n if (stringDate.length < 10) {\n return;\n }\n\n // Checks for YYYY-MM-DD format\n const dateRegex = /^\\d{4}-(0?[1-9]|1[012])-(0?[1-9]|[12][0-9]|3[01])$/;\n const isValidDate = dateRegex.test(stringDate) && isDateEnabled(new Date(stringDate));\n if (isValidDate) {\n isDateIncorrect.value = false;\n emit(BentoDatePickerEvent.INPUT, new Date(stringDate));\n } else if (stringDate) {\n // Only set to true if the value exists (not null/undefined)\n isDateIncorrect.value = true;\n emit(BentoDatePickerEvent.INPUT, null);\n }\n };\n\n const validateDateDebounced = debounce(validateDate, DEBOUNCE_TIME);\n\n const onDateInputChange = (stringDate: string) => {\n textInputValue.value = formatDateInputValue(stringDate);\n // If we are closing the date picker, we should validate (and emit date inputs) immediately so the user doesn't have to wait for the debounce time.\n if (isDatePickerOpen.value) {\n validateDateDebounced(textInputValue.value);\n } else {\n validateDate(textInputValue.value);\n }\n };\n\n /**\n * Space bar and Enter keyDown event handler.\n *\n * * Opens the date picker dialog on the first keydown.\n * * Move focus to selected date, i.e., the date displayed in the date input text field. If no date has been selected, places focus on the current date.\n * @param {KeyboardEvent} event Event being triggered\n */\n const onSpaceBarOrEnter = async (event: KeyboardEvent) => {\n if (isDatePickerOpen.value) {\n return;\n }\n event.preventDefault();\n\n openDatePicker();\n\n // Wait for the date picker dialog to open\n await nextTick();\n\n // Set current date (today) if no date is selected\n if (!props.value) {\n // Format the opened date picker date to YYYY-MM-DD\n formatTextInputDisplayValue(new Date());\n emit(BentoDatePickerEvent.INPUT, new Date());\n\n // Wait for new value to be set with the emit\n await nextTick();\n }\n\n // Focus on date\n calendarContainerRef.value?.$refs.calendarRef[0].focusOnDate(\n props.variant === 'month' ? startOfMonth(props.value) : props.value\n );\n };\n\n return {\n // Refs\n inputContainerRef,\n calendarContainerRef,\n\n // Values,\n dateDisplayValue,\n datePickerContainerId,\n descriptionConditionalClasses,\n isDateIncorrect,\n isDatePickerOpen,\n isReadOnly,\n dateErrorText,\n labelId,\n descriptionId,\n errorId,\n dateErrorId,\n popoverAriaLabel,\n ariaDescribedBy,\n textInputValue,\n\n // Events\n closeDatePicker,\n clearDatePickerValue,\n onDateSelected,\n openDatePicker,\n onDateKeyDown,\n onDateInputChange,\n\n // Keyboard navigation\n onSpaceBarOrEnter,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./date-picker.scss\" />\n"],"names":["useDatePickerSingleCalendarText","datePickerValue","isDateIncorrect","isMonthVariant","locale","t","useI18n","locales","getDateLocale","textInputValue","ref","_a","computed","format","DateFormat","dateToFormat","date","startOfMonth","BentoDatePickerEvent","BentoDatePickerEvent2","DEBOUNCE_TIME","_sfc_main","defineComponent","messages","BentoTypography","BentoPopover","Calendar","ErrorMessage","DropdownInputDefault","FieldLabel","BentoClickOutsideDirective","value","props","emit","datePickerContainerId","generateUid","labelId","descriptionId","errorId","dateErrorId","popoverAriaLabel","calendarContainerRef","inputContainerRef","isDatePickerOpen","isReadOnly","useFormLayoutFieldLoading","toRef","watch","disabled","dateDisplayValue","formatTextInputDisplayValue","dateErrorText","descriptionConditionalClasses","ariaDescribedBy","isDateEnabled","closeDatePicker","openDatePicker","onDateSelected","selectedDate","clearDatePickerValue","onDateKeyDown","event","validateDateInput","validateDate","stringDate","validateDateDebounced","debounce","formatDateInputValue","nextTick"],"mappings":"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"}
@@ -2,24 +2,24 @@ import { reactive as fe, defineComponent as Be, ref as h, computed as T, onMount
2
2
  import { B as nt } from "./divider.Cc4JFWG_.js";
3
3
  import { B as rt } from "./popover.B05xkQ4e.js";
4
4
  import { B as Le, d as st } from "./typography.J1v_SPG3.js";
5
- import { D as it } from "./dropdown-default-textbox.BNuuA4ES.js";
6
5
  import { r as O, t as j, g as ye } from "./get-date-locale.BN8xEjY0.js";
7
6
  import { g as se } from "./generate-uid.NJ8tVoha.js";
8
7
  import { u as Te } from "./i18n.BQkEbtPM.js";
9
8
  import { t as oe, f as ae } from "./date.dYFFEunA.js";
10
- import { e as Ye, f as ie, i as B, g as Z, h as ke, j as ot, k as Ee, l as lt, s as he, m as ut, n as Oe, a as $, u as dt } from "./calendar.DbTC35rM.js";
11
- import { f as we, v as ct, D as I } from "./date-input.BqBdAO1E.js";
12
- import { u as Dt } from "./use-form-layout-loading.D3lALhtC.js";
9
+ import { e as Ye, f as ie, i as B, g as Z, h as ke, j as it, k as Ee, l as ot, s as he, m as lt, n as Oe, a as $, u as ut } from "./calendar.DbTC35rM.js";
10
+ import { f as we, v as dt, D as I } from "./date-input.BqBdAO1E.js";
11
+ import { u as ct } from "./use-form-layout-loading.D3lALhtC.js";
13
12
  import "./index.Cl4_42j5.js";
14
- import { B as mt } from "./input-field.DKhsSYF8.js";
15
- import { B as ft } from "./dropdown.B_PWXFtT.js";
16
- import { B as vt } from "./segmented-control.B-uxKqMN.js";
13
+ import { B as Dt } from "./input-field.-Pgtuotm.js";
14
+ import { B as mt } from "./dropdown.DZ1Ndonr.js";
15
+ import { B as ft } from "./segmented-control.DHZEfmT-.js";
17
16
  import { d as ce } from "./debounce.DUTu11PS.js";
18
- import { u as pt } from "./use-has-slot.C9lQZ6nz.js";
17
+ import { u as vt } from "./use-has-slot.C9lQZ6nz.js";
19
18
  import { e as C, a as Me } from "./index.BDuTpjD8.js";
20
19
  import { n as Qe } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
20
+ import { D as pt } from "./dropdown-default-textbox.BNuuA4ES.js";
21
21
  import { B as gt } from "./directive.Cbdox5VL.js";
22
- import { F as yt, E as Tt } from "./error-message.BeExHHgv.js";
22
+ import { F as yt, E as Tt } from "./error-message.1Em7Lis3.js";
23
23
  import { B as _t, c as Rt } from "./button-actions._OIvTdKt.js";
24
24
  import "../assets/date-range-picker.css";
25
25
  function $e(t, e) {
@@ -95,13 +95,13 @@ const Ot = ({
95
95
  D = Z(o.earliest);
96
96
  else {
97
97
  const y = ke(D, { weekStartsOn: t });
98
- B(D, y) || (D = Z(ot(Ee(D, { weekStartsOn: t }), 1)));
98
+ B(D, y) || (D = Z(it(Ee(D, { weekStartsOn: t }), 1)));
99
99
  }
100
100
  if (o.latest)
101
101
  f = C(o.latest);
102
102
  else {
103
103
  const y = Ee(f, { weekStartsOn: t });
104
- B(f, y) || (f = C(lt(ke(f, { weekStartsOn: t }), 1)));
104
+ B(f, y) || (f = C(ot(ke(f, { weekStartsOn: t }), 1)));
105
105
  }
106
106
  }
107
107
  if ((o == null ? void 0 : o.type) === "monthly") {
@@ -115,7 +115,7 @@ const Ot = ({
115
115
  f = C(o.latest);
116
116
  else {
117
117
  const y = Me(f);
118
- B(f, y) || (f = Me(ut(f, 1)));
118
+ B(f, y) || (f = Me(lt(f, 1)));
119
119
  }
120
120
  }
121
121
  if ((o == null ? void 0 : o.type) === "quarterly") {
@@ -197,9 +197,9 @@ const Mt = /[\d]/, Ct = /^\d{2}$/, At = /^\d{2}:\d{2}$/, xt = (t) => {
197
197
  i18n: { messages: Ut },
198
198
  name: "date-range-picker-calendar",
199
199
  components: {
200
- BentoDropdown: ft,
201
- BentoInputField: mt,
202
- BentoSegmentedControl: vt,
200
+ BentoDropdown: mt,
201
+ BentoInputField: Dt,
202
+ BentoSegmentedControl: ft,
203
203
  BentoTypography: Le,
204
204
  Calendar: $
205
205
  },
@@ -367,7 +367,7 @@ const Mt = /[\d]/, Ct = /^\d{2}$/, At = /^\d{2}:\d{2}$/, xt = (t) => {
367
367
  adjustEndDateInputForMonthly: H,
368
368
  adjustStartDateInputForQuarterly: ve,
369
369
  adjustEndDateInputForQuarterly: le
370
- } = dt(t.firstDayOfWeek), { savedRanges: N, saveRange: q, resetSavedRanges: W } = wt(), S = (a) => a ? ae(a, I.NUMERIC_DATE_YEAR_FIRST, {
370
+ } = ut(t.firstDayOfWeek), { savedRanges: N, saveRange: q, resetSavedRanges: W } = wt(), S = (a) => a ? ae(a, I.NUMERIC_DATE_YEAR_FIRST, {
371
371
  locale: D[l.value.substring(0, 2)] || D.enUS
372
372
  }) : "", L = (a) => a ? ae(a, I.HOUR_MINUTE_SECONDS, {
373
373
  locale: D[l.value.substring(0, 2)] || D.enUS
@@ -504,7 +504,7 @@ const Mt = /[\d]/, Ct = /^\d{2}$/, At = /^\d{2}:\d{2}$/, xt = (t) => {
504
504
  }, Ne), We = (a) => {
505
505
  s.endDate = we(a), He(s.endDate);
506
506
  }, Ve = (a) => {
507
- ct(a);
507
+ dt(a);
508
508
  }, Ke = ce((a) => {
509
509
  if (ue(a)) {
510
510
  K.value = !1, r.startDate = M(r.startDate, a);
@@ -606,7 +606,7 @@ const Mt = /[\d]/, Ct = /^\d{2}$/, At = /^\d{2}:\d{2}$/, xt = (t) => {
606
606
  quickSelectRangeDefaultItems: _,
607
607
  formInputWrapperConditionalClasses: ne,
608
608
  // Methods
609
- hasSlot: pt(n),
609
+ hasSlot: vt(n),
610
610
  t: o,
611
611
  // Events
612
612
  onDateInput: c,
@@ -722,7 +722,7 @@ const Lt = {
722
722
  BentoTypography: Le,
723
723
  BentoPopover: rt,
724
724
  DateRangePickerCalendar: P,
725
- DropdownInputDefault: it,
725
+ DropdownInputDefault: pt,
726
726
  ErrorMessage: Tt,
727
727
  FieldLabel: yt
728
728
  },
@@ -842,7 +842,7 @@ const Lt = {
842
842
  timeDifference: R
843
843
  }
844
844
  };
845
- })), _ = h(!1), A = h(null), k = h(!1), { isReadOnly: ee } = Dt(Se(t, "readonly"));
845
+ })), _ = h(!1), A = h(null), k = h(!1), { isReadOnly: ee } = ct(Se(t, "readonly"));
846
846
  pe(
847
847
  () => t.disabled,
848
848
  () => {
@@ -1002,4 +1002,4 @@ export {
1002
1002
  It as b,
1003
1003
  De as i
1004
1004
  };
1005
- //# sourceMappingURL=date-range-picker.CNB28UaM.js.map
1005
+ //# sourceMappingURL=date-range-picker.BER92nnT.js.map