@adyen/bento-vue3 1.47.0 → 1.47.1

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 (55) hide show
  1. package/dist/@types/index.d.ts +1 -15
  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/dialog-page.css +1 -1
  8. package/dist/assets/file-uploader.css +1 -1
  9. package/dist/assets/inspector.css +1 -1
  10. package/dist/assets/menu.css +1 -1
  11. package/dist/assets/modal-fullscreen.css +1 -1
  12. package/dist/assets/popover.css +1 -1
  13. package/dist/assets/sidepanel.css +1 -1
  14. package/dist/chunks/{code-snippet.CUzz3c-V.js → code-snippet.Cpik3i9g.js} +2 -2
  15. package/dist/chunks/{code-snippet.CUzz3c-V.js.map → code-snippet.Cpik3i9g.js.map} +1 -1
  16. package/dist/chunks/{data-grid.V4b5UdXZ.js → data-grid.DSWWz-QK.js} +5 -5
  17. package/dist/chunks/{data-grid.V4b5UdXZ.js.map → data-grid.DSWWz-QK.js.map} +1 -1
  18. package/dist/chunks/{date-picker.DjuQyWzZ.js → date-picker.Ck51Ng3N.js} +14 -14
  19. package/dist/chunks/{date-picker.DjuQyWzZ.js.map → date-picker.Ck51Ng3N.js.map} +1 -1
  20. package/dist/chunks/{date-range-picker.CmxXWnBc.js → date-range-picker.D_N3gZ-n.js} +23 -23
  21. package/dist/chunks/{date-range-picker.CmxXWnBc.js.map → date-range-picker.D_N3gZ-n.js.map} +1 -1
  22. package/dist/chunks/{dropdown-tag.D8hXRrMj.js → dropdown-tag.B33Tsgtl.js} +2 -2
  23. package/dist/chunks/{dropdown-tag.D8hXRrMj.js.map → dropdown-tag.B33Tsgtl.js.map} +1 -1
  24. package/dist/chunks/{dropdown.BWu3fV-K.js → dropdown.WdgHycb4.js} +25 -25
  25. package/dist/chunks/{dropdown.BWu3fV-K.js.map → dropdown.WdgHycb4.js.map} +1 -1
  26. package/dist/chunks/{filter-bar.Db-KfD-S.js → filter-bar.Cq3pYzD3.js} +6 -6
  27. package/dist/chunks/{filter-bar.Db-KfD-S.js.map → filter-bar.Cq3pYzD3.js.map} +1 -1
  28. package/dist/chunks/{input-field-password.CS7rxMCK.js → input-field-password.OfQkQre5.js} +2 -2
  29. package/dist/chunks/{input-field-password.CS7rxMCK.js.map → input-field-password.OfQkQre5.js.map} +1 -1
  30. package/dist/chunks/{input-field.Cx4fMIb7.js → input-field.BrJ-Zb36.js} +2 -2
  31. package/dist/chunks/{input-field.Cx4fMIb7.js.map → input-field.BrJ-Zb36.js.map} +1 -1
  32. package/dist/chunks/{pagination.CbzgV2xT.js → pagination.CGuEx7mk.js} +2 -2
  33. package/dist/chunks/{pagination.CbzgV2xT.js.map → pagination.CGuEx7mk.js.map} +1 -1
  34. package/dist/chunks/{search-bar.BTu1j3Ll.js → search-bar.5iUfOW7J.js} +3 -3
  35. package/dist/chunks/{search-bar.BTu1j3Ll.js.map → search-bar.5iUfOW7J.js.map} +1 -1
  36. package/dist/chunks/{secondary-nav.Bqvz5hjH.js → secondary-nav.JfPd7s37.js} +2 -2
  37. package/dist/chunks/{secondary-nav.Bqvz5hjH.js.map → secondary-nav.JfPd7s37.js.map} +1 -1
  38. package/dist/chunks/status.types.Bdv2zuuh.js +44 -0
  39. package/dist/chunks/{status.types.DsYAH3RM.js.map → status.types.Bdv2zuuh.js.map} +1 -1
  40. package/dist/code-snippet.js +1 -1
  41. package/dist/data-grid.js +1 -1
  42. package/dist/date-picker.js +1 -1
  43. package/dist/date-range-picker.js +1 -1
  44. package/dist/dropdown.js +2 -2
  45. package/dist/filter-bar.js +1 -1
  46. package/dist/index.js +13 -13
  47. package/dist/input-field-password.js +1 -1
  48. package/dist/input-field.js +1 -1
  49. package/dist/pagination.js +1 -1
  50. package/dist/search-bar.js +2 -2
  51. package/dist/secondary-nav.js +1 -1
  52. package/dist/status.js +1 -1
  53. package/dist/web-types.json +1 -1
  54. package/package.json +2 -2
  55. package/dist/chunks/status.types.DsYAH3RM.js +0 -45
@@ -1,23 +1,23 @@
1
1
  import { ref as C, computed as P, defineComponent as H, toRef as V, watch as Q, nextTick as N, resolveComponent as c, resolveDirective as X, withDirectives as Z, createElementBlock as _, openBlock as f, withKeys as U, createBlock as y, createCommentVNode as k, createElementVNode as x, createVNode as h, normalizeClass as ee, withCtx as M, createTextVNode as ae, toDisplayString as te } from "vue";
2
2
  import { B as re } from "./popover.Bzb-pzfB.js";
3
3
  import { B as ne } from "./typography.DN5eC5ch.js";
4
- import { d as oe } from "./debounce.DUTu11PS.js";
5
- import { D as $, v as le, f as ie } from "./date-input.BqBdAO1E.js";
4
+ import { D as oe } from "./dropdown-default-textbox.Dl8Jv2bS.js";
5
+ import { d as le } from "./debounce.DUTu11PS.js";
6
+ import { D as $, v as ie, f as se } from "./date-input.BqBdAO1E.js";
6
7
  import { g } from "./generate-uid.NJ8tVoha.js";
7
8
  import { u as L } from "./i18n.WMYWtwxB.js";
8
- import { g as se } from "./get-date-locale.BN8xEjY0.js";
9
+ import { g as de } from "./get-date-locale.BN8xEjY0.js";
9
10
  import { f as A } from "./date.DeaBl297.js";
10
- import { u as de } from "./use-form-layout-loading.D3lALhtC.js";
11
- import { B as ue } from "./directive.O3yEdalv.js";
11
+ import { u as ue } from "./use-form-layout-loading.D3lALhtC.js";
12
+ import { B as pe } from "./directive.O3yEdalv.js";
12
13
  import "./events.FNmSWp_P.js";
13
14
  import { a as I } from "./calendar.CKY08nCx.js";
14
- import { D as pe } from "./dropdown-default-textbox.Dl8Jv2bS.js";
15
15
  import { F as ce, E as fe } from "./error-message.qsc0nOWT.js";
16
16
  import { _ as me } from "./_plugin-vue_export-helper.CHgC5LLL.js";
17
17
  import "../assets/date-picker.css";
18
18
  const De = ({ datePickerValue: e, isDateIncorrect: t }) => {
19
19
  var s;
20
- const { locale: o, t: m } = L(), l = se(), i = C((s = e.value) == null ? void 0 : s.toDateString());
20
+ const { locale: o, t: m } = L(), l = de(), i = C((s = e.value) == null ? void 0 : s.toDateString());
21
21
  return {
22
22
  // Values
23
23
  dateDisplayValue: P(() => t.value ? i.value : e.value ? A(e.value, $.FULL_DATE, {
@@ -57,10 +57,10 @@ const F = {
57
57
  BentoPopover: re,
58
58
  Calendar: I,
59
59
  ErrorMessage: fe,
60
- DropdownInputDefault: pe,
60
+ DropdownInputDefault: oe,
61
61
  FieldLabel: ce
62
62
  },
63
- directives: { BentoClickOutsideDirective: ue },
63
+ directives: { BentoClickOutsideDirective: pe },
64
64
  props: {
65
65
  /**
66
66
  * Descriptive supporting text visbile underneath the dropdown.
@@ -125,7 +125,7 @@ const F = {
125
125
  },
126
126
  emits: [u.INPUT],
127
127
  setup(e, { emit: t }) {
128
- const { t: o } = L({ messages: F }), m = g("bento-date-picker-container"), l = g("bento-date-picker-label"), i = g("bento-date-picker-description"), D = g("bento-date-picker-error"), v = g("bento-date-picker-date-error"), s = P(() => e.label || o("datePicker", { name: m })), d = C(null), E = C(null), r = C(!1), n = C(!1), { isReadOnly: b } = de(V(e, "readonly"));
128
+ const { t: o } = L({ messages: F }), m = g("bento-date-picker-container"), l = g("bento-date-picker-label"), i = g("bento-date-picker-description"), D = g("bento-date-picker-error"), v = g("bento-date-picker-date-error"), s = P(() => e.label || o("datePicker", { name: m })), d = C(null), E = C(null), r = C(!1), n = C(!1), { isReadOnly: b } = ue(V(e, "readonly"));
129
129
  Q(
130
130
  () => e.disabled,
131
131
  (a) => {
@@ -148,12 +148,12 @@ const F = {
148
148
  }, z = async () => {
149
149
  r.value && (r.value = !1, p.value = null), t(u.INPUT, null);
150
150
  }, J = (a) => {
151
- le(a);
151
+ ie(a);
152
152
  }, R = (a) => {
153
153
  if (a.length < 10)
154
154
  return;
155
155
  /^\d{4}-(0?[1-9]|1[012])-(0?[1-9]|[12][0-9]|3[01])$/.test(a) && W(new Date(a)) ? (r.value = !1, t(u.INPUT, new Date(a))) : a && (r.value = !0, t(u.INPUT, null));
156
- }, G = oe(R, ve);
156
+ }, G = le(R, ve);
157
157
  return {
158
158
  // Refs
159
159
  inputContainerRef: E,
@@ -180,7 +180,7 @@ const F = {
180
180
  openDatePicker: O,
181
181
  onDateKeyDown: J,
182
182
  onDateInputChange: (a) => {
183
- p.value = ie(a), n.value ? G(p.value) : R(p.value);
183
+ p.value = se(a), n.value ? G(p.value) : R(p.value);
184
184
  },
185
185
  // Keyboard navigation
186
186
  onSpaceBarOrEnter: async (a) => {
@@ -289,4 +289,4 @@ export {
289
289
  Fe as B,
290
290
  u as a
291
291
  };
292
- //# sourceMappingURL=date-picker.DjuQyWzZ.js.map
292
+ //# sourceMappingURL=date-picker.Ck51Ng3N.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"date-picker.DjuQyWzZ.js","sources":["../../../vue2/src/components/date-picker/composables/use-date-picker-single-calendar-text.ts","../../../vue2/src/components/date-picker/date-picker.types.ts","../../../vue2/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';\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 */\nexport const useDatePickerSingleCalendarText: UseDateDisplayText<Date> = ({ datePickerValue, isDateIncorrect }) => {\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)\" if there's a valid date selected\n return format(datePickerValue.value as Date, DateFormat.FULL_DATE, {\n locale: locales[locale.value.substring(0, 2)] || locales.enUS,\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 textInputValue.value = dateToFormat\n ? format(dateToFormat, 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} 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 @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\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 } 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 * 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 { dateDisplayValue, textInputValue, formatTextInputDisplayValue } = useDatePickerSingleCalendarText({\n datePickerValue: toRef(props, 'value') as Ref<Date>,\n isDateIncorrect,\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(props.value);\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","locale","t","useI18n","locales","getDateLocale","textInputValue","ref","_a","computed","format","DateFormat","dateToFormat","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","date","closeDatePicker","openDatePicker","onDateSelected","selectedDate","clearDatePickerValue","onDateKeyDown","event","validateDateInput","validateDate","stringDate","validateDateDebounced","debounce","formatDateInputValue","nextTick","withDirectives","openBlock","createElementBlock","_ctx","createBlock","_component_field_label","optional","required","createCommentVNode","createElementVNode","createVNode","_component_dropdown_input_default","label","onDateInputChange","_component_error_message","_component_bento_typography","normalizeClass","createTextVNode","toDisplayString","_component_bento_popover","withCtx","_component_calendar","defaultDisplayMonth","isDateDisabled","max"],"mappings":"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"}
1
+ {"version":3,"file":"date-picker.Ck51Ng3N.js","sources":["../../../vue2/src/components/date-picker/composables/use-date-picker-single-calendar-text.ts","../../../vue2/src/components/date-picker/date-picker.types.ts","../../../vue2/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';\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 */\nexport const useDatePickerSingleCalendarText: UseDateDisplayText<Date> = ({ datePickerValue, isDateIncorrect }) => {\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)\" if there's a valid date selected\n return format(datePickerValue.value as Date, DateFormat.FULL_DATE, {\n locale: locales[locale.value.substring(0, 2)] || locales.enUS,\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 textInputValue.value = dateToFormat\n ? format(dateToFormat, 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} 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 @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\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 } 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 * 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 { dateDisplayValue, textInputValue, formatTextInputDisplayValue } = useDatePickerSingleCalendarText({\n datePickerValue: toRef(props, 'value') as Ref<Date>,\n isDateIncorrect,\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(props.value);\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","locale","t","useI18n","locales","getDateLocale","textInputValue","ref","_a","computed","format","DateFormat","dateToFormat","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","date","closeDatePicker","openDatePicker","onDateSelected","selectedDate","clearDatePickerValue","onDateKeyDown","event","validateDateInput","validateDate","stringDate","validateDateDebounced","debounce","formatDateInputValue","nextTick","withDirectives","openBlock","createElementBlock","_ctx","createBlock","_component_field_label","optional","required","createCommentVNode","createElementVNode","createVNode","_component_dropdown_input_default","label","onDateInputChange","_component_error_message","_component_bento_typography","normalizeClass","createTextVNode","toDisplayString","_component_bento_popover","withCtx","_component_calendar","defaultDisplayMonth","isDateDisabled","max"],"mappings":"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"}
@@ -2,24 +2,24 @@ import { reactive as me, defineComponent as Ke, computed as I, ref as C, onMount
2
2
  import { B as ia } from "./divider.qUOSAbU6.js";
3
3
  import { B as da } from "./popover.Bzb-pzfB.js";
4
4
  import { B as Ge, d as ua } from "./typography.DN5eC5ch.js";
5
+ import { D as ma } from "./dropdown-default-textbox.Dl8Jv2bS.js";
5
6
  import { r as ne, t as te, g as ye } from "./get-date-locale.BN8xEjY0.js";
6
7
  import { g as se } from "./generate-uid.NJ8tVoha.js";
7
8
  import { u as Te } from "./i18n.WMYWtwxB.js";
8
9
  import { t as be, f as le } from "./date.DeaBl297.js";
9
- import { s as ee, c as we, i as ae, d as ma, e as Me, f as ca, g as Ae, h as Da, j as pa, a as z, u as fa } from "./calendar.CKY08nCx.js";
10
- import { f as Ce, v as va, D as S } from "./date-input.BqBdAO1E.js";
11
- import { u as ga } from "./use-form-layout-loading.D3lALhtC.js";
12
- import { B as ya } from "./directive.O3yEdalv.js";
10
+ import { s as ee, c as we, i as ae, d as ca, e as Me, f as Da, g as Ae, h as pa, j as fa, a as z, u as va } from "./calendar.CKY08nCx.js";
11
+ import { f as Ce, v as ga, D as S } from "./date-input.BqBdAO1E.js";
12
+ import { u as ya } from "./use-form-layout-loading.D3lALhtC.js";
13
+ import { B as Ta } from "./directive.O3yEdalv.js";
13
14
  import "./events.FNmSWp_P.js";
14
- import { B as Ta } from "./input-field.Cx4fMIb7.js";
15
- import { B as ba } from "./dropdown.BWu3fV-K.js";
16
- import { B as Ia } from "./segmented-control.BIwBQ8i3.js";
15
+ import { B as ba } from "./input-field.BrJ-Zb36.js";
16
+ import { B as Ia } from "./dropdown.WdgHycb4.js";
17
+ import { B as Ra } from "./segmented-control.BIwBQ8i3.js";
17
18
  import { d as de } from "./debounce.DUTu11PS.js";
18
- import { u as Ra } from "./use-has-slot.B7eQSabc.js";
19
+ import { u as ka } from "./use-has-slot.B7eQSabc.js";
19
20
  import { e as H } from "./index.DPafeRJa.js";
20
21
  import { e as _e } from "./index.CrhTVr5J.js";
21
22
  import { _ as We } from "./_plugin-vue_export-helper.CHgC5LLL.js";
22
- import { D as ka } from "./dropdown-default-textbox.Dl8Jv2bS.js";
23
23
  import { F as Sa, E as Ea } from "./error-message.qsc0nOWT.js";
24
24
  import { B as ha, c as Oa } from "./button-actions.DBgK5Qwo.js";
25
25
  import "../assets/date-range-picker.css";
@@ -70,13 +70,13 @@ const Ca = ({
70
70
  D = ee(i.earliest);
71
71
  else {
72
72
  const u = we(D, { weekStartsOn: e });
73
- ae(D, u) || (D = ee(ma(Me(D, { weekStartsOn: e }), 1)));
73
+ ae(D, u) || (D = ee(ca(Me(D, { weekStartsOn: e }), 1)));
74
74
  }
75
75
  if (i.latest)
76
76
  n = H(i.latest);
77
77
  else {
78
78
  const u = Me(n, { weekStartsOn: e });
79
- ae(n, u) || (n = H(ca(we(n, { weekStartsOn: e }), 1)));
79
+ ae(n, u) || (n = H(Da(we(n, { weekStartsOn: e }), 1)));
80
80
  }
81
81
  }
82
82
  if ((i == null ? void 0 : i.type) === "monthly") {
@@ -84,13 +84,13 @@ const Ca = ({
84
84
  D = ee(i.earliest);
85
85
  else {
86
86
  const u = Ae(D);
87
- ae(D, u) || (D = Ae(Da(D, 1)));
87
+ ae(D, u) || (D = Ae(pa(D, 1)));
88
88
  }
89
89
  if (i.latest)
90
90
  n = H(i.latest);
91
91
  else {
92
92
  const u = _e(n);
93
- ae(n, u) || (n = _e(pa(n, 1)));
93
+ ae(n, u) || (n = _e(fa(n, 1)));
94
94
  }
95
95
  }
96
96
  return { min: D, max: n };
@@ -156,9 +156,9 @@ const Fa = /[\d]/, Ua = /^\d{2}$/, Ba = /^\d{2}:\d{2}$/, Pa = (e) => {
156
156
  i18n: { messages: Ne },
157
157
  name: "date-range-picker-calendar",
158
158
  components: {
159
- BentoDropdown: ba,
160
- BentoInputField: Ta,
161
- BentoSegmentedControl: Ia,
159
+ BentoDropdown: Ia,
160
+ BentoInputField: ba,
161
+ BentoSegmentedControl: Ra,
162
162
  BentoTypography: Ge,
163
163
  Calendar: z
164
164
  },
@@ -274,7 +274,7 @@ const Fa = /[\d]/, Ua = /^\d{2}$/, Ba = /^\d{2}:\d{2}$/, Pa = (e) => {
274
274
  adjustEndDateInputForWeekly: U,
275
275
  adjustStartDateInputForMonthly: g,
276
276
  adjustEndDateInputForMonthly: F
277
- } = fa(e.firstDayOfWeek), { savedRanges: y, saveRange: Q, resetSavedRanges: re } = _a(), R = (a) => a ? le(a, S.NUMERIC_DATE_YEAR_FIRST, {
277
+ } = va(e.firstDayOfWeek), { savedRanges: y, saveRange: Q, resetSavedRanges: re } = _a(), R = (a) => a ? le(a, S.NUMERIC_DATE_YEAR_FIRST, {
278
278
  locale: D[d.value.substring(0, 2)] || D.enUS
279
279
  }) : "", M = (a) => a ? le(a, S.HOUR_MINUTE_SECONDS, {
280
280
  locale: D[d.value.substring(0, 2)] || D.enUS
@@ -386,7 +386,7 @@ const Fa = /[\d]/, Ua = /^\d{2}$/, Ba = /^\d{2}:\d{2}$/, Pa = (e) => {
386
386
  }, $e), je = (a) => {
387
387
  o.endDate = Ce(a), He(o.endDate);
388
388
  }, ze = (a) => {
389
- va(a);
389
+ ga(a);
390
390
  }, Je = de((a) => {
391
391
  if (ie(a)) {
392
392
  G.value = !1, n.startDate = B(n.startDate, a);
@@ -490,7 +490,7 @@ const Fa = /[\d]/, Ua = /^\d{2}$/, Ba = /^\d{2}:\d{2}$/, Pa = (e) => {
490
490
  quickSelectRangeDefaultItems: E,
491
491
  formInputWrapperConditionalClasses: T,
492
492
  // Methods
493
- hasSlot: Ra(l),
493
+ hasSlot: ka(l),
494
494
  t: i,
495
495
  // Events
496
496
  onDateInput: Ie,
@@ -710,11 +710,11 @@ const Ye = {
710
710
  BentoTypography: Ge,
711
711
  BentoPopover: da,
712
712
  DateRangePickerCalendar: P,
713
- DropdownInputDefault: ka,
713
+ DropdownInputDefault: ma,
714
714
  ErrorMessage: Ea,
715
715
  FieldLabel: Sa
716
716
  },
717
- directives: { BentoClickOutsideDirective: ya },
717
+ directives: { BentoClickOutsideDirective: Ta },
718
718
  props: {
719
719
  /**
720
720
  * Allows user to enter time values in the form
@@ -812,7 +812,7 @@ const Ye = {
812
812
  setup(e, { emit: t }) {
813
813
  const { locale: l, t: d } = Te({ messages: Ye }), i = ye(), D = se("bento-date-range-picker-container"), n = se("bento-date-range-picker-label"), u = se("bento-date-range-picker-description"), T = se("bento-date-range-picker-error"), E = se("bento-date-range-picker-date-error"), w = I(
814
814
  () => e.label || d("dateRangePicker", { name: D })
815
- ), v = C(!1), Y = C(null), m = C(!1), { isReadOnly: K } = ga(pe(e, "readonly"));
815
+ ), v = C(!1), Y = C(null), m = C(!1), { isReadOnly: K } = ya(pe(e, "readonly"));
816
816
  Oe(
817
817
  () => e.disabled,
818
818
  () => {
@@ -1039,4 +1039,4 @@ export {
1039
1039
  ue as a,
1040
1040
  Fe as i
1041
1041
  };
1042
- //# sourceMappingURL=date-range-picker.CmxXWnBc.js.map
1042
+ //# sourceMappingURL=date-range-picker.D_N3gZ-n.js.map