@adyen/bento-vue2 2.0.1 → 2.1.0

package/dist/chunks/date-range-picker.B2B4hO6R.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-range-picker.B2B4hO6R.js","sources":["../../../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/getYear.js","../../../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/isEqual.js","../../../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/isSameQuarter.js","../../../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/startOfSecond.js","../../../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/isSameSecond.js","../../../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/isToday.js","../../src/components/date-range-picker/components/date-time-input/date-time-input.vue","../../src/components/internal/calendar/components/calendar-month/composables/granular-min-max-date.ts","../../src/components/date-range-picker/composables/use-granularity-memory.ts","../../src/components/date-range-picker/components/date-range-picker-calendar/date-range-picker-calendar.types.ts","../../src/components/date-range-picker/components/date-range-picker-calendar/date-range-picker-calendar.vue","../../src/components/date-range-picker/composables/use-date-range-picker-calendar-text.ts","../../src/components/date-range-picker/date-range-picker.vue"],"sourcesContent":["import { toDate } from \"./toDate.js\";\n\n/**\n * The {@link getYear} function options.\n */\n\n/**\n * @name getYear\n * @category Year Helpers\n * @summary Get the year of the given date.\n *\n * @description\n * Get the year of the given date.\n *\n * @param date - The given date\n * @param options - An object with options\n *\n * @returns The year\n *\n * @example\n * // Which year is 2 July 2014?\n * const result = getYear(new Date(2014, 6, 2))\n * //=> 2014\n */\nexport function getYear(date, options) {\n  return toDate(date, options?.in).getFullYear();\n}\n\n// Fallback for modularized imports:\nexport default getYear;\n","import { toDate } from \"./toDate.js\";\n\n/**\n * @name isEqual\n * @category Common Helpers\n * @summary Are the given dates equal?\n *\n * @description\n * Are the given dates equal?\n *\n * @param dateLeft - The first date to compare\n * @param dateRight - The second date to compare\n *\n * @returns The dates are equal\n *\n * @example\n * // Are 2 July 2014 06:30:45.000 and 2 July 2014 06:30:45.500 equal?\n * const result = isEqual(\n *   new Date(2014, 6, 2, 6, 30, 45, 0),\n *   new Date(2014, 6, 2, 6, 30, 45, 500)\n * )\n * //=> false\n */\nexport function isEqual(leftDate, rightDate) {\n  return +toDate(leftDate) === +toDate(rightDate);\n}\n\n// Fallback for modularized imports:\nexport default isEqual;\n","import { normalizeDates } from \"./_lib/normalizeDates.js\";\nimport { startOfQuarter } from \"./startOfQuarter.js\";\n\n/**\n * The {@link isSameQuarter} function options.\n */\n\n/**\n * @name isSameQuarter\n * @category Quarter Helpers\n * @summary Are the given dates in the same quarter (and year)?\n *\n * @description\n * Are the given dates in the same quarter (and year)?\n *\n * @param laterDate - The first date to check\n * @param earlierDate - The second date to check\n * @param options - An object with options\n *\n * @returns The dates are in the same quarter (and year)\n *\n * @example\n * // Are 1 January 2014 and 8 March 2014 in the same quarter?\n * const result = isSameQuarter(new Date(2014, 0, 1), new Date(2014, 2, 8))\n * //=> true\n *\n * @example\n * // Are 1 January 2014 and 1 January 2015 in the same quarter?\n * const result = isSameQuarter(new Date(2014, 0, 1), new Date(2015, 0, 1))\n * //=> false\n */\nexport function isSameQuarter(laterDate, earlierDate, options) {\n  const [dateLeft_, dateRight_] = normalizeDates(\n    options?.in,\n    laterDate,\n    earlierDate,\n  );\n  return +startOfQuarter(dateLeft_) === +startOfQuarter(dateRight_);\n}\n\n// Fallback for modularized imports:\nexport default isSameQuarter;\n","import { toDate } from \"./toDate.js\";\n\n/**\n * The {@link startOfSecond} function options.\n */\n\n/**\n * @name startOfSecond\n * @category Second Helpers\n * @summary Return the start of a second for the given date.\n *\n * @description\n * Return the start of a second for the given date.\n * The result will be in the local timezone.\n *\n * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).\n * @typeParam ResultDate - The result `Date` type, it is the type returned from the context function if it is passed, or inferred from the arguments.\n *\n * @param date - The original date\n * @param options - The options\n *\n * @returns The start of a second\n *\n * @example\n * // The start of a second for 1 December 2014 22:15:45.400:\n * const result = startOfSecond(new Date(2014, 11, 1, 22, 15, 45, 400))\n * //=> Mon Dec 01 2014 22:15:45.000\n */\nexport function startOfSecond(date, options) {\n  const date_ = toDate(date, options?.in);\n  date_.setMilliseconds(0);\n  return date_;\n}\n\n// Fallback for modularized imports:\nexport default startOfSecond;\n","import { startOfSecond } from \"./startOfSecond.js\";\n\n/**\n * @name isSameSecond\n * @category Second Helpers\n * @summary Are the given dates in the same second (and hour and day)?\n *\n * @description\n * Are the given dates in the same second (and hour and day)?\n *\n * @param laterDate - The first date to check\n * @param earlierDate - The second date to check\n *\n * @returns The dates are in the same second (and hour and day)\n *\n * @example\n * // Are 4 September 2014 06:30:15.000 and 4 September 2014 06:30.15.500 in the same second?\n * const result = isSameSecond(\n *   new Date(2014, 8, 4, 6, 30, 15),\n *   new Date(2014, 8, 4, 6, 30, 15, 500)\n * )\n * //=> true\n *\n * @example\n * // Are 4 September 2014 06:00:15.000 and 4 September 2014 06:01.15.000 in the same second?\n * const result = isSameSecond(\n *   new Date(2014, 8, 4, 6, 0, 15),\n *   new Date(2014, 8, 4, 6, 1, 15)\n * )\n * //=> false\n *\n * @example\n * // Are 4 September 2014 06:00:15.000 and 5 September 2014 06:00.15.000 in the same second?\n * const result = isSameSecond(\n *   new Date(2014, 8, 4, 6, 0, 15),\n *   new Date(2014, 8, 5, 6, 0, 15)\n * )\n * //=> false\n */\nexport function isSameSecond(laterDate, earlierDate) {\n  return +startOfSecond(laterDate) === +startOfSecond(earlierDate);\n}\n\n// Fallback for modularized imports:\nexport default isSameSecond;\n","import { constructFrom } from \"./constructFrom.js\";\nimport { constructNow } from \"./constructNow.js\";\nimport { isSameDay } from \"./isSameDay.js\";\n\n/**\n * The {@link isToday} function options.\n */\n\n/**\n * @name isToday\n * @category Day Helpers\n * @summary Is the given date today?\n * @pure false\n *\n * @description\n * Is the given date today?\n *\n * @param date - The date to check\n * @param options - An object with options\n *\n * @returns The date is today\n *\n * @example\n * // If today is 6 October 2014, is 6 October 14:00:00 today?\n * const result = isToday(new Date(2014, 9, 6, 14, 0))\n * //=> true\n */\nexport function isToday(date, options) {\n  return isSameDay(\n    constructFrom(options?.in || date, date),\n    constructNow(options?.in || date),\n  );\n}\n\n// Fallback for modularized imports:\nexport default isToday;\n","<template>\n    <bento-form-layout-group :layout=\"showTimeInput ? '50-50' : '100'\" :error-message=\"errorMessage\">\n        <bento-input-field\n            v-bind=\"resolvedDateProps\"\n            :model-value=\"dateModelValue\"\n            @click=\"$emit('click')\"\n            @update:model-value=\"$emit('update:date-model-value', $event)\"\n            @keydown=\"$emit('date:keydown', $event)\"\n        />\n\n        <bento-input-time\n            v-if=\"showTimeInput\"\n            v-bind=\"resolvedTimeProps\"\n            :model-value=\"timeModelValue\"\n            @click=\"$emit('click')\"\n            @update:model-value=\"$emit('update:time-model-value', $event)\"\n            @input:error=\"$emit('time:error')\"\n            @input:valid=\"$emit('time:valid')\"\n        />\n    </bento-form-layout-group>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed } from 'vue';\n    import { BentoFormLayoutGroup } from '@/components/form-layout';\n    import { BentoInputField } from '@/components/input-field';\n    import { BentoInputTime } from '@/components/input-time';\n\n    import type { BentoDateTimeInputEmits, BentoDateTimeInputProps } from './date-time-input.types';\n\n    const props = defineProps({\n  dateModelValue: { default: '' },\n  dateProps: { default: () => ({}) },\n  errorMessage: { default: null },\n  showTimeInput: { type: Boolean, default: false },\n  timeModelValue: { default: '' },\n  timeProps: { default: () => ({}) }\n});\n\n    defineEmits([\"click\", \"update:date-model-value\", \"date:keydown\", \"update:time-model-value\", \"time:error\", \"time:valid\"]);\n\n    const resolvedDateProps = computed(() => ({\n        errorMessage: props.errorMessage,\n        ...props.dateProps,\n    }));\n\n    const resolvedTimeProps = computed(() => ({\n        errorMessage: props.errorMessage,\n        ...props.timeProps,\n    }));\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Internal component that combines a date input field and an optional time input\n     * within a form layout group, providing a shared error message pattern.\n     *\n     * @example\n     * import { DateTimeInput } from '@/internal';\n     *\n     * export default {\n     *     components: { DateTimeInput },\n     *     template: `\n     *         <date-time-input\n     *             date-aria-label=\"Date from\"\n     *             :date-model-value=\"dateValue\"\n     *             :show-time-input=\"true\"\n     *             time-aria-label=\"Time from\"\n     *             :time-model-value=\"timeValue\"\n     *             :error-message=\"errorMsg\"\n     *             @update:date-model-value=\"onDateChange\"\n     *             @update:time-model-value=\"onTimeChange\"\n     *         />\n     *     `\n     * }\n     */\n    export default {\n        name: 'date-time-input',\n    };\n</script>\n","import { addDays } from 'date-fns/addDays';\nimport { addMonths } from 'date-fns/addMonths';\nimport { addQuarters } from 'date-fns/addQuarters';\nimport { endOfDay } from 'date-fns/endOfDay';\nimport { endOfMonth } from 'date-fns/endOfMonth';\nimport { endOfQuarter } from 'date-fns/endOfQuarter';\nimport { endOfWeek } from 'date-fns/endOfWeek';\nimport { isSameDay } from 'date-fns/isSameDay';\nimport { startOfDay } from 'date-fns/startOfDay';\nimport { startOfMonth } from 'date-fns/startOfMonth';\nimport { startOfQuarter } from 'date-fns/startOfQuarter';\nimport { startOfWeek } from 'date-fns/startOfWeek';\nimport { subDays } from 'date-fns/subDays';\nimport { subMonths } from 'date-fns/subMonths';\nimport { subQuarters } from 'date-fns/subQuarters';\n\nimport type { CalendarGranularityConfig } from '../../../calendar.types';\nimport type { UseGranularMinMaxDate } from './granular-min-max-date.types';\n\n/**\n * Provides utility function to set calendar min/max dates based on the granularity selected.\n * @param props Configured min/max dates, and the day the week starts on.\n * @returns Function to calculate calendar limits.\n */\nexport const useGranularMinMaxDate: UseGranularMinMaxDate = ({\n    firstDayOfWeek,\n    min: minimumDate,\n    max: maximumDate,\n}) => {\n    const getGranularCalendarLimits = (granularity: CalendarGranularityConfig) => {\n        if (!minimumDate && !maximumDate) {\n            return { min: null, max: null };\n        }\n\n        let min = minimumDate ? startOfDay(minimumDate) : null;\n        let max = maximumDate ? endOfDay(maximumDate) : null;\n\n        if (granularity?.type === 'weekly') {\n            if (granularity.earliest) {\n                min = startOfDay(granularity.earliest);\n            } else if (min) {\n                const startOfMin = startOfWeek(min, { weekStartsOn: firstDayOfWeek });\n\n                // If the minimum is in the middle of a week, set to the end (only allow full weeks)\n                if (!isSameDay(min, startOfMin)) {\n                    min = startOfDay(addDays(endOfWeek(min, { weekStartsOn: firstDayOfWeek }), 1));\n                }\n            }\n\n            if (granularity.latest) {\n                max = endOfDay(granularity.latest);\n            } else if (max) {\n                const endOfMax = endOfWeek(max, { weekStartsOn: firstDayOfWeek });\n\n                // If the maximum is in the middle of a week, set to the end of last week (only allow full weeks)\n                if (!isSameDay(max, endOfMax)) {\n                    max = endOfDay(subDays(startOfWeek(max, { weekStartsOn: firstDayOfWeek }), 1));\n                }\n            }\n        }\n\n        if (granularity?.type === 'monthly') {\n            if (granularity.earliest) {\n                min = startOfDay(granularity.earliest);\n            } else if (min) {\n                const startOfMin = startOfMonth(min);\n\n                // If the minimum is in the middle of a month, set to the start of next month (only allow full month)\n                if (!isSameDay(min, startOfMin)) {\n                    min = startOfMonth(addMonths(min, 1));\n                }\n            }\n\n            if (granularity.latest) {\n                max = endOfDay(granularity.latest);\n            } else if (max) {\n                const endOfMax = endOfMonth(max);\n\n                // If the maximum is in the middle of a month, set to the end of last month (only allow full months)\n                if (!isSameDay(max, endOfMax)) {\n                    max = endOfMonth(subMonths(max, 1));\n                }\n            }\n        }\n\n        if (granularity?.type === 'quarterly') {\n            if (granularity.earliest) {\n                min = startOfQuarter(granularity.earliest);\n            } else if (min) {\n                const startOfMin = startOfQuarter(min);\n\n                // If the minimum is in the middle of a quarter, set to the start of next quarter (only allow full fiscal quarters)\n                if (!isSameDay(min, startOfMin)) {\n                    min = startOfQuarter(addQuarters(min, 1));\n                }\n            }\n\n            if (granularity.latest) {\n                max = endOfDay(granularity.latest);\n            } else if (max) {\n                const endOfMax = endOfQuarter(max);\n\n                // If the maximum is in the middle of a quarter, set to the end of last quarter (only allow full fiscal quarters)\n                if (!isSameDay(max, endOfMax)) {\n                    max = endOfQuarter(subQuarters(max, 1));\n                }\n            }\n        }\n\n        return { min, max };\n    };\n\n    return { getGranularCalendarLimits };\n};\n","import { reactive } from 'vue';\n\nimport type { CalendarGranularityType } from '../../internal/calendar/calendar.types';\nimport type { UseGranularityMemory } from './use-granularity-memory.types';\n\n/**\n * Provides utility property and functions to store date ranges based on granularity.\n * This is used to revert back to the previously selected range when users switch between granularities\n * @returns Saved date ranges per granularity, and functions to save/reset ranges.\n */\nexport const useGranularityMemory: UseGranularityMemory = () => {\n    const savedRanges = reactive<{\n        daily: { startDate: Date; endDate: Date } | null;\n        weekly: { startDate: Date; endDate: Date } | null;\n        monthly: { startDate: Date; endDate: Date } | null;\n        quarterly: { startDate: Date; endDate: Date } | null;\n    }>({\n        daily: null,\n        weekly: null,\n        monthly: null,\n        quarterly: null,\n    });\n\n    const saveRange = (type: CalendarGranularityType, range: { startDate: Date; endDate: Date }) => {\n        savedRanges[type] = range;\n    };\n\n    const resetSavedRanges = () => {\n        savedRanges.daily = null;\n        savedRanges.weekly = null;\n        savedRanges.monthly = null;\n        savedRanges.quarterly = null;\n    };\n\n    return {\n        savedRanges,\n\n        saveRange,\n        resetSavedRanges,\n    };\n};\n","import { type CalendarGranularityType } from '@/internal/calendar/calendar.types';\n\nexport interface DateRangePickerCalendarFormData {\n    startDate: string;\n    endDate: string;\n    startTime?: string;\n    endTime?: string;\n    granularity?: CalendarGranularityType;\n}\n\nexport enum DateRangePickerCalendarEvent {\n    CUSTOM_RANGE = 'custom-range',\n    INPUT = 'input',\n    ERROR = 'error',\n    FORM_DATE = 'form-date',\n    START_DATE_SELECTED = 'start-date-selected',\n}\n\nexport interface DateRangePickerCalendarRangeSelectorItem {\n    label: string;\n    value: string;\n    data: {\n        startDate: Date;\n        endDate?: Date;\n        granularity?: CalendarGranularityType;\n        isRelativeToNow?: boolean;\n        timeDifference?: number;\n    };\n}\n\nexport type DateRangePickerCalendarRangeSelectorItems = Array<DateRangePickerCalendarRangeSelectorItem>;\n","<template>\n    <div class=\"b-date-range-picker-calendar\">\n        <!-- Form -->\n        <div\n            class=\"b-date-range-picker-calendar__form-container\"\n            :class=\"computedFormContainerClasses\"\n            data-testid=\"date-range-picker-calendar-form-container\"\n        >\n            <div class=\"b-date-range-picker-calendar__form\">\n                <template v-if=\"hasSlot('title')\">\n                    <slot name=\"title\" />\n                </template>\n\n                <bento-dropdown\n                    v-if=\"quickSelectRanges\"\n                    :aria-label=\"t('customRange')\"\n                    :items=\"quickSelectRangeDefaultItems\"\n                    :model-value=\"selectedRangeSelectorValue\"\n                    @update:model-value=\"onRangeSelectorInput\"\n                />\n\n                <bento-segmented-control\n                    v-if=\"granularities\"\n                    :items=\"granularityItems\"\n                    :model-value=\"internalRangeDate.granularity\"\n                    full-width\n                    @update:model-value=\"onGranularityInput\"\n                >\n                </bento-segmented-control>\n\n                <bento-alert v-if=\"maxRangeMessage\" variant=\"tip\">\n                    <template #description>\n                        {{ maxRangeMessage }}\n                    </template>\n                </bento-alert>\n\n                <div>\n                    <bento-typography stronger el=\"span\" class=\"b-date-range-picker-calendar__label\">\n                        {{ t('from') }}\n                    </bento-typography>\n\n                    <date-time-input\n                        :date-model-value=\"startDateValue\"\n                        :date-props=\"{\n                            'aria-label': t('dateFrom'),\n                            type: dateInputType,\n                            description: !isTouchDevice ? t(dateFormat) : undefined,\n                            errorMessage: startDateErrorText,\n                        }\"\n                        :error-message=\"startSharedError\"\n                        :show-time-input=\"allowTimeInput\"\n                        :time-model-value=\"dateTextInput.startTime\"\n                        :time-props=\"{\n                            'aria-label': t('timeFrom'),\n                            errorMessage: startSharedError,\n                            interval: timeInterval,\n                        }\"\n                        class=\"b-date-range-picker-calendar__form-input\"\n                        @click=\"finalizeHoveredRange\"\n                        @update:date-model-value=\"onStartDateInput\"\n                        @date:keydown=\"onDateInputKeyDown\"\n                        @update:time-model-value=\"onStartTimeInput\"\n                        @time:error=\"onStartTimeError\"\n                        @time:valid=\"onStartTimeValid\"\n                    />\n                </div>\n\n                <div>\n                    <bento-typography stronger el=\"span\" class=\"b-date-range-picker-calendar__label\">\n                        {{ t('to') }}\n                    </bento-typography>\n\n                    <date-time-input\n                        :date-model-value=\"endDateValue\"\n                        :date-props=\"{\n                            'aria-label': t('dateTo'),\n                            type: dateInputType,\n                            description: !isTouchDevice ? t(dateFormat) : undefined,\n                            errorMessage: endDateErrorText,\n                        }\"\n                        :error-message=\"endSharedError\"\n                        :show-time-input=\"allowTimeInput\"\n                        :time-model-value=\"dateTextInput.endTime\"\n                        :time-props=\"{\n                            'aria-label': t('timeTo'),\n                            errorMessage: endSharedError,\n                            interval: timeInterval,\n                        }\"\n                        class=\"b-date-range-picker-calendar__form-input\"\n                        @click=\"finalizeHoveredRange\"\n                        @update:date-model-value=\"onEndDateInput\"\n                        @date:keydown=\"onDateInputKeyDown\"\n                        @update:time-model-value=\"onEndTimeInput\"\n                        @time:error=\"onEndTimeError\"\n                        @time:valid=\"onEndTimeValid\"\n                    />\n                </div>\n            </div>\n\n            <div v-if=\"hasSlot('actions')\">\n                <slot name=\"actions\" />\n            </div>\n        </div>\n\n        <!-- Calendar -->\n        <div\n            v-if=\"!hasNoCalendars && !isTouchDevice\"\n            class=\"b-date-range-picker-calendar__calendars-container\"\n            data-testid=\"date-range-picker-calendar-calendar-container\"\n        >\n            <calendar\n                ref=\"calendarRef\"\n                :value=\"internalRangeDate\"\n                :first-day-of-week=\"firstDayOfWeek\"\n                :is-date-disabled=\"isDateDisabled\"\n                :max-range=\"maxRange\"\n                :min=\"computedMinMax.min\"\n                :max=\"computedMinMax.max\"\n                :number-of-months=\"numberOfMonths\"\n                :show-end-date-on-open=\"showEndDateOnOpen\"\n                :granularity=\"selectedGranularity\"\n                :variant=\"variant\"\n                :year-range=\"yearRange\"\n                is-range\n                @input=\"onDateInput\"\n                @start-date-selected=\"onStartDateSelected\"\n                @end-date-selected=\"onEndDateSelected\"\n            />\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, onMounted, type PropType, reactive, ref, toRaw, useSlots } from 'vue';\n    import { Calendar, type CalendarGranularityType } from '@/internal';\n    import { DateTimeInput } from '../date-time-input';\n    import { BentoAlert } from '@/components/alert';\n    import { BentoTypography } from '@/components/typography';\n    import BentoDropdown from '@/components/dropdown/dropdown.vue';\n    import { BentoSegmentedControl, type BentoSegmentedControlItem } from '@/components/segmented-control';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { debounce } from '@/utils/ts/debounce';\n    import { useDateInputFormatter, useHasSlot, useTouchDevice } from '@/composables';\n    import { useGranularityAdjustments } from '@/components/internal/calendar/composables/use-granularity-adjustments';\n    import { useGranularMinMaxDate } from '@/components/internal/calendar/components/calendar-month/composables/granular-min-max-date';\n    import { useGranularityMemory } from '../../composables/use-granularity-memory';\n    import {\n        DateRangePickerCalendarEvent,\n        type DateRangePickerCalendarFormData,\n        type DateRangePickerCalendarRangeSelectorItems,\n    } from './date-range-picker-calendar.types';\n    import type {\n        BentoDateRangePickerGranularityConfig,\n        BentoDateRangePickerValue,\n    } from '../../date-range-picker.types';\n    import { endOfDay } from 'date-fns/endOfDay';\n    import { startOfDay } from 'date-fns/startOfDay';\n    import { isSameSecond } from 'date-fns/isSameSecond';\n    import { isSameDay } from 'date-fns/isSameDay';\n    import { isEqual } from 'date-fns/isEqual';\n    import { isToday } from 'date-fns/isToday';\n    import { setMilliseconds } from 'date-fns/setMilliseconds';\n    import {\n        dateToNativeDateString,\n        dateToNativeMonthString,\n        dateToTimeInputString,\n        parseNativeMonthString,\n    } from '@/utils/ts/format-date/format-date';\n    import { isValidTimeString, snapTimeToInterval } from '@/utils/ts/time-input';\n    import { setTimeInDateObject } from '@/utils/ts/format-date';\n    import type { BentoRangeEndpoint } from '@/components/internal/calendar/composables/use-granularity-adjustments.types';\n\n    import messages from './messages.json';\n\n    const FORM_INPUT_DEBOUNCE_TIME = 300;\n    const RANGE_SELECTOR_CUSTOM_RANGE_KEY = 'customRange';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const maxRangeMessageKeyMap: Record<CalendarGranularityType, keyof MessageSchema> = {\n        daily: 'maxRangeDays',\n        weekly: 'maxRangeWeeks',\n        monthly: 'maxRangeMonths',\n        quarterly: 'maxRangeQuarters',\n    };\n\n    const props = defineProps({\n        /**\n         * Allows user to enter time values in the form\n         */\n        allowTimeInput: { type: Boolean, default: false },\n\n        /**\n         * Ranges form persistance data\n         */\n        dateFormData: {\n            type: Object as PropType<DateRangePickerCalendarFormData>,\n            default: () => ({ startDate: undefined, endDate: undefined, startTime: undefined, endTime: undefined }),\n        },\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         * A list of available granularities.\n         * If present, the date picker will display a segmented control to change granularity.\n         */\n        granularities: {\n            type: Array as PropType<Array<BentoDateRangePickerGranularityConfig>>,\n            default: null,\n        },\n\n        /**\n         * Indicate if a date should be disabled or not\n         */\n        isDateDisabled: Calendar.props.isDateDisabled,\n\n        /**\n         * Set a maximum number of dates to be selectable by the range.\n         */\n        maxRange: Calendar.props.maxRange,\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         * Number of months rendered on pane\n         */\n        numberOfMonths: {\n            type: Calendar.props.numberOfMonths.type,\n            default: Calendar.props.numberOfMonths.default,\n            validator: (n: number) => n >= 0,\n        },\n\n        /**\n         * Displays the end date's month when the calendar is opened. Defaults to false i.e. the start date's month is displayed.\n         */\n        showEndDateOnOpen: { type: Boolean, default: false },\n\n        /**\n         * Limits the selectable times to a fixed interval, expressed in minutes.\n         */\n        timeInterval: { type: Number, default: null },\n\n        /**\n         * Enables the custom range selector.\n         * If provided, must be an array that sets the custom range dropdown items. Items are of the structure:\n         * `label` - label of custom range item.\n         * `value` - a unique key of the custom range item.\n         * `data` - an object `{ startDate: Date; endDate: Date }` to set the date picker range to upon selecting.\n         */\n        quickSelectRanges: {\n            type: Array as PropType<DateRangePickerCalendarRangeSelectorItems>,\n            default: undefined,\n        },\n\n        /**\n         * Selected date\n         */\n        value: { type: Object as PropType<BentoDateRangePickerValue>, default: undefined },\n\n        /**\n         * The type of calendar to display. Defaults to showing days.\n         */\n        variant: Calendar.props.variant,\n\n        /**\n         * Range of years to be selectable from the year dropdown\n         */\n        yearRange: Calendar.props.yearRange,\n    });\n\n    const emit = defineEmits([\n        DateRangePickerCalendarEvent.CUSTOM_RANGE,\n        DateRangePickerCalendarEvent.INPUT,\n        DateRangePickerCalendarEvent.ERROR,\n        DateRangePickerCalendarEvent.FORM_DATE,\n        DateRangePickerCalendarEvent.START_DATE_SELECTED,\n    ]);\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n\n    const { t, tc } = useI18n<{ message: MessageSchema }>({ messages });\n    const { isTouchDevice } = useTouchDevice();\n    const {\n        dateFormat,\n        isFormatValid,\n        parseDate,\n        onKeyDown,\n        autoFormat,\n        formatDate: formatDateUtil,\n    } = useDateInputFormatter();\n    const calculatedIsRelativeToNowQuickSelectRanges = ref({});\n    const calendarRef = ref<InstanceType<typeof Calendar> | null>(null);\n\n    const defaultGranularity = computed(() => (props.variant === 'month' ? 'monthly' : 'daily'));\n    const hasNoCalendars = computed(() => props.numberOfMonths === 0);\n\n    /**\n     * Snaps a time to the closest time selectable through the time interval, if one is set.\n     * @param time The time string to snap\n     * @param direction Whether to round the time down or up\n     */\n    const snapTime = (time: string, direction: 'down' | 'up') =>\n        props.timeInterval ? snapTimeToInterval(time, props.timeInterval, direction) : time;\n\n    /**\n     * Returns the latest selectable moment of the day the given date falls on,\n     * which is the last time offered by the time interval when one is set.\n     * @param date The date to resolve the end of the day for\n     */\n    const resolveEndOfSelectableDay = (date: Date) => {\n        const dayEnd = endOfDay(date);\n\n        return props.timeInterval ? setTimeInDateObject(dayEnd, snapTime(dateToTimeInputString(dayEnd), 'up')) : dayEnd;\n    };\n\n    const internalRangeDate = reactive<BentoDateRangePickerValue>({\n        startDate: props.value?.startDate,\n        endDate: props.value?.endDate,\n        range: props.value?.range,\n        ...(props.granularities\n            ? {\n                  granularity: props.value?.granularity || defaultGranularity.value,\n              }\n            : {}),\n    });\n\n    /**\n     * Currently range selector dropdown item that is selected.\n     * The logic will try and find in each range item:\n     * - If an endDate does not exist, then only check if the startDate day matches and if today's day matches.\n     * - if time input has been enabled, then check if the seconds match.\n     * - if an endDate does exist then just check if the startDate day and the endDate day match.\n     *\n     * Note: All date comparisons use local time consistently. Both sides of each comparison\n     * originate from the same timezone context, so no UTC normalization is needed.\n     */\n    const selectedRangeSelectorValue = computed(() => {\n        return (\n            // eslint-disable-next-line consistent-return\n            props?.quickSelectRanges?.find(({ value, data }) => {\n                if (!data.endDate) {\n                    // Check if this quick select range is explicitly marked as \"relative to now\"\n                    if (data.isRelativeToNow) {\n                        // Retrieve previously calculated start/end dates for this relative range.\n                        // We use these if the user has already clicked on this time of quick range\n                        const newlyCalculatedQuickSelectDates =\n                            calculatedIsRelativeToNowQuickSelectRanges.value?.[value];\n                        return newlyCalculatedQuickSelectDates\n                            ? isEqual(newlyCalculatedQuickSelectDates.startDate, internalRangeDate.startDate) &&\n                                  isEqual(newlyCalculatedQuickSelectDates.endDate, internalRangeDate.endDate)\n                            : // If not stored calculated dates, fall back to comparing the quick select item's value\n                              // with the internal range's stored range identifier.\n                              value === internalRangeDate.range;\n                    }\n                    // This block handles quick select ranges that do not have an endDate\n                    // AND are NOT explicitly marked as 'isRelativeToNow'.\n                    // This means the endDate will be today at the end of the day.\n                    // Uses isEqual for startDate to prevent false matches (e.g. same-day selection\n                    // accidentally matching a \"This week\" range). When time input is enabled,\n                    // also verify the end time is at end of day so that manual time changes\n                    // correctly fall back to \"Custom range\".\n                    return (\n                        isEqual(data.startDate, internalRangeDate.startDate) &&\n                        isToday(internalRangeDate.endDate) &&\n                        (!props.allowTimeInput ||\n                            isSameSecond(\n                                internalRangeDate.endDate,\n                                resolveEndOfSelectableDay(internalRangeDate.endDate)\n                            )) &&\n                        (props.granularities ? data.granularity === internalRangeDate.granularity : true)\n                    );\n                }\n\n                if (props.allowTimeInput) {\n                    const res =\n                        isSameSecond(data.startDate, internalRangeDate.startDate) &&\n                        isSameSecond(data.endDate, internalRangeDate.endDate) &&\n                        (props.granularities ? data.granularity === internalRangeDate.granularity : true);\n                    return res;\n                }\n\n                if (data.endDate) {\n                    return (\n                        isSameDay(data.startDate, internalRangeDate.startDate) &&\n                        isSameDay(data.endDate, internalRangeDate.endDate) &&\n                        (props.granularities ? data.granularity === internalRangeDate.granularity : true)\n                    );\n                }\n            })?.value ?? RANGE_SELECTOR_CUSTOM_RANGE_KEY\n        );\n    });\n    const quickSelectRangeDefaultItems = computed(() => [\n        { label: t('customRange'), value: RANGE_SELECTOR_CUSTOM_RANGE_KEY },\n        ...(props.quickSelectRanges ? props.quickSelectRanges : []),\n    ]);\n\n    const selectedGranularity = computed(\n        () => props.granularities?.find(({ type }) => type === internalRangeDate.granularity) || null\n    );\n\n    const granularityItems = computed<Array<BentoSegmentedControlItem>>(\n        () =>\n            props.granularities?.map(({ type, disabled }) => ({\n                label: t(type),\n                value: type,\n                disabled,\n            })) ?? []\n    );\n\n    const { getGranularCalendarLimits } = useGranularMinMaxDate(props);\n\n    const computedMinMax = computed(() =>\n        props.granularities\n            ? getGranularCalendarLimits(selectedGranularity.value)\n            : { min: props.min ? startOfDay(props.min) : null, max: props.max ? endOfDay(props.max) : null }\n    );\n\n    const { normalizeRange } = useGranularityAdjustments(props.firstDayOfWeek);\n    const { savedRanges, saveRange, resetSavedRanges } = useGranularityMemory();\n\n    /**\n     * Format date to a string value in current format\n     * @param dateToFormat - Date to be formatted\n     */\n    const formatDate = (dateToFormat?: Date) => {\n        if (!dateToFormat) {\n            return '';\n        }\n        return formatDateUtil(dateToFormat);\n    };\n\n    /**\n     * Applies all active range constraints to the current value.\n     * @param fixedEndpoint - Endpoint to keep unchanged when maxRange shortens the range.\n     * @param alignToGranularity - Whether to expand dates to complete granularity units.\n     */\n    const normalizeInternalRange = (fixedEndpoint: BentoRangeEndpoint, alignToGranularity = true) => {\n        if (!internalRangeDate.startDate || !internalRangeDate.endDate) {\n            return;\n        }\n\n        const normalizedRange = normalizeRange({\n            startDate: internalRangeDate.startDate,\n            endDate: internalRangeDate.endDate,\n            fixedEndpoint,\n            granularity: selectedGranularity.value,\n            alignToGranularity,\n            fallbackMaxRange: props.maxRange,\n            min: computedMinMax.value.min,\n            max: computedMinMax.value.max,\n        });\n        if (\n            isEqual(normalizedRange.startDate, internalRangeDate.startDate) &&\n            isEqual(normalizedRange.endDate, internalRangeDate.endDate)\n        ) {\n            return;\n        }\n\n        internalRangeDate.startDate = normalizedRange.startDate;\n        internalRangeDate.endDate = normalizedRange.endDate;\n        dateTextInput.startDate = formatDate(normalizedRange.startDate);\n        dateTextInput.endDate = formatDate(normalizedRange.endDate);\n    };\n\n    // Form error keys\n    const startDateError = ref<keyof MessageSchema | null>(null);\n    const endDateError = ref<keyof MessageSchema | null>(null);\n\n    // Translated error messages for the template\n    const startDateErrorText = computed(() => (startDateError.value ? t(startDateError.value) : null));\n    const endDateErrorText = computed(() => (endDateError.value ? t(endDateError.value) : null));\n\n    // Shared errors exclude format errors since those only concern the date input\n    const startSharedError = computed(() =>\n        startDateError.value === 'invalidDateFormat' ? null : startDateErrorText.value\n    );\n    const endSharedError = computed(() => (endDateError.value === 'invalidDateFormat' ? null : endDateErrorText.value));\n\n    /**\n     * Returns a translated error message for a given date string, or null if valid.\n     * @param dateText The date string to validate.\n     * @param counterpartDate Optional date to compare against for range order validation.\n     * @param role Whether the date being validated is the 'start' or 'end' of the range.\n     */\n    const getDateErrorMessage = (\n        dateText: string,\n        counterpartDate?: Date,\n        role?: 'start' | 'end',\n        resolvedDateTime?: Date\n    ): keyof MessageSchema | null => {\n        if (!dateText || !isFormatValid(dateText)) {\n            return 'invalidDateFormat';\n        }\n\n        const date = parseDate(dateText);\n        const dayDate = startOfDay(date);\n\n        if ((props.min && dayDate < startOfDay(props.min)) || (props.max && dayDate > startOfDay(props.max))) {\n            return 'selectedDateIsNotAvailable';\n        }\n\n        if (props.isDateDisabled && props.isDateDisabled(dayDate)) {\n            return 'selectedDateIsNotAvailable';\n        }\n\n        if (counterpartDate) {\n            // When time input is enabled and we have a resolved datetime, compare full datetimes;\n            // otherwise fall back to day-level comparison.\n            const current = resolvedDateTime ? setMilliseconds(resolvedDateTime, 0).getTime() : dayDate.getTime();\n            const counterpart = resolvedDateTime\n                ? setMilliseconds(counterpartDate, 0).getTime()\n                : startOfDay(counterpartDate).getTime();\n\n            const isInvalid = role === 'start' ? current >= counterpart : current <= counterpart;\n\n            if (isInvalid) {\n                return 'startDateMustPrecedeEndDate';\n            }\n        }\n\n        return null;\n    };\n\n    // Form input text used in range variant\n    const dateTextInput = reactive({\n        startDate: props.dateFormData.startDate,\n        endDate: props.dateFormData.endDate,\n        startTime: snapTime(props.dateFormData.startTime, 'down'),\n        endTime: snapTime(props.dateFormData.endTime, 'up'),\n    });\n\n    /**\n     * Checks if a time string is valid and within the min/max bounds if a date is provided.\n     * @param timeText The time string to validate.\n     * @param date The date string to check the time against.\n     * @returns True if the time is valid, false otherwise.\n     */\n    const isValidTime = (timeText: string, date?: string) => {\n        const isTimeAllowed = () => {\n            if (date && isValidDate(date)) {\n                const dateToCheckWithTime = setTimeInDateObject(parseDate(date), timeText);\n                // Check if date is between min/max bounds, if there are any\n                if (\n                    (props.min && dateToCheckWithTime < setMilliseconds(props.min, 0)) ||\n                    (props.max && dateToCheckWithTime > setMilliseconds(props.max, 0))\n                ) {\n                    return false;\n                }\n            }\n\n            return true;\n        };\n\n        return isValidTimeString(timeText) && isTimeAllowed();\n    };\n\n    const isMonthVariant = computed(() => props.variant === 'month');\n\n    const formatNativeDate = (date: Date): string => {\n        if (!date) {\n            return '';\n        }\n\n        return isMonthVariant.value ? dateToNativeMonthString(date) : dateToNativeDateString(date);\n    };\n\n    const nativeStartDate = computed(() => formatNativeDate(internalRangeDate.startDate));\n    const nativeEndDate = computed(() => formatNativeDate(internalRangeDate.endDate));\n    const dateInputType = computed(() => (isTouchDevice.value ? (isMonthVariant.value ? 'month' : 'date') : 'text'));\n\n    const startDateValue = computed(() => (isTouchDevice.value ? nativeStartDate.value : dateTextInput.startDate));\n    const endDateValue = computed(() => (isTouchDevice.value ? nativeEndDate.value : dateTextInput.endDate));\n\n    /**\n     * Sets the time in a date object if the time is valid and the variant is not 'month'.\n     * @param date The date object to modify.\n     * @param time The time string to set.\n     * @returns The modified date object or the original if time is not set.\n     */\n    const setTimeInDateRef = (date: Date, time: string) => {\n        // Do not set time if month variant\n        if (!time || !isValidTimeString(time) || props.variant === 'month') {\n            return date;\n        }\n\n        return setTimeInDateObject(new Date(date), time);\n    };\n\n    const updateSelectedRange = (selectedRange: BentoDateRangePickerValue, preserveInputTimes = false) => {\n        if (!preserveInputTimes) {\n            const isStartLimitedByMin =\n                props.min && props.allowTimeInput && isSameDay(props.min, selectedRange.startDate);\n            const isEndLimitedByMax = props.max && props.allowTimeInput && isSameDay(props.max, selectedRange.endDate);\n\n            // Times taken from `min`/`max` are snapped towards the middle of the range to stay within bounds\n            dateTextInput.startTime = isStartLimitedByMin\n                ? snapTime(dateToTimeInputString(props.min), 'up')\n                : snapTime(dateToTimeInputString(startOfDay(selectedRange.startDate)), 'down');\n            dateTextInput.endTime = isEndLimitedByMax\n                ? snapTime(dateToTimeInputString(props.max), 'down')\n                : snapTime(dateToTimeInputString(endOfDay(selectedRange.endDate)), 'up');\n        }\n\n        internalRangeDate.startDate = setTimeInDateRef(selectedRange.startDate, dateTextInput.startTime);\n        internalRangeDate.endDate = setTimeInDateRef(selectedRange.endDate, dateTextInput.endTime);\n        // Resetting internal range date when selecting a custom range through the calendar\n        internalRangeDate.range = null;\n\n        if (props.granularities) {\n            // Reset saved ranges on input\n            resetSavedRanges();\n        }\n\n        emit(DateRangePickerCalendarEvent.INPUT, {\n            ...internalRangeDate,\n            range: selectedRangeSelectorValue.value,\n        });\n    };\n\n    const onDateInput = (selectedRange: BentoDateRangePickerValue) => {\n        updateSelectedRange(selectedRange);\n    };\n\n    const finalizeHoveredRange = () => {\n        const selectedRange = calendarRef.value?.finalizeRangeSelection();\n\n        if (selectedRange) {\n            updateSelectedRange(selectedRange, true);\n        }\n    };\n\n    /**\n     * Checks if a date string is in current format and if the date is enabled.\n     * @param dateText The date string to validate.\n     * @returns True if the date is valid and enabled, false otherwise.\n     */\n    const isValidDate = (dateText: string): boolean => !!dateText && !getDateErrorMessage(dateText);\n\n    /**\n     * When mounted, set the input error states to true if the values are not valid\n     */\n    onMounted(() => {\n        // Start date validation\n        startDateError.value = props.dateFormData.startDate ? getDateErrorMessage(props.dateFormData.startDate) : null;\n\n        // Start time validation is delegated to bento-input-time via events\n\n        // End date validation\n        endDateError.value = props.dateFormData.endDate ? getDateErrorMessage(props.dateFormData.endDate) : null;\n\n        // End time validation is delegated to bento-input-time via events\n    });\n\n    const onStartDateSelected = (newStartDate: Date) => {\n        dateTextInput.startDate = formatDate(newStartDate);\n        if (!dateTextInput.startTime) {\n            // Set the time to the beginning of the day\n            dateTextInput.startTime = snapTime(dateToTimeInputString(newStartDate), 'down');\n        }\n\n        startDateError.value = null;\n\n        if (endDateError.value === 'startDateMustPrecedeEndDate') {\n            endDateError.value = null;\n        }\n\n        emit(DateRangePickerCalendarEvent.START_DATE_SELECTED, newStartDate);\n    };\n\n    const onEndDateSelected = (newEndDate: Date) => {\n        dateTextInput.endDate = formatDate(newEndDate);\n        if (!dateTextInput.endTime) {\n            // Set the time to the end of the day\n            dateTextInput.endTime = snapTime(dateToTimeInputString(endOfDay(newEndDate)), 'up');\n        }\n\n        endDateError.value = null;\n\n        if (startDateError.value === 'startDateMustPrecedeEndDate') {\n            startDateError.value = null;\n        }\n    };\n\n    const getDate = (keyName: 'startDate' | 'endDate') => {\n        const dateProp = props.value?.[keyName];\n        if (dateProp) {\n            return dateProp;\n        }\n\n        if (props.dateFormData[keyName] && isValidDate(props.dateFormData[keyName])) {\n            return parseDate(props.dateFormData[keyName]);\n        }\n\n        return undefined;\n    };\n\n    const validateStartDate = (startDateText: string, alignToGranularity = false) => {\n        if (isValidDate(startDateText)) {\n            const dateText = startDateText;\n\n            startDateError.value = null;\n\n            dateTextInput.startDate = dateText;\n\n            const startDate = startOfDay(parseDate(dateText));\n            internalRangeDate.startDate = setTimeInDateRef(startDate, dateTextInput.startTime);\n\n            if (isValidDate(dateTextInput.endDate)) {\n                internalRangeDate.endDate = setTimeInDateRef(\n                    startOfDay(parseDate(dateTextInput.endDate)),\n                    dateTextInput.endTime\n                );\n            }\n\n            const endDate = getDate('endDate');\n            const rangeError = getDateErrorMessage(\n                dateText,\n                props.allowTimeInput ? internalRangeDate.endDate : endDate,\n                'start',\n                props.allowTimeInput ? internalRangeDate.startDate : undefined\n            );\n\n            if (rangeError) {\n                startDateError.value = rangeError;\n                emit(DateRangePickerCalendarEvent.ERROR, { ...dateTextInput });\n                return;\n            }\n\n            if (endDateError.value === 'startDateMustPrecedeEndDate') {\n                endDateError.value = null;\n            }\n\n            // The user changed the start date, so preserve the existing end date.\n            normalizeInternalRange('end', alignToGranularity);\n\n            // Resetting internal range date when selecting a custom range through the calendar\n            internalRangeDate.range = null;\n\n            emit(DateRangePickerCalendarEvent.FORM_DATE, {\n                startDate: internalRangeDate.startDate,\n                endDate: internalRangeDate.endDate,\n            });\n\n            emit(DateRangePickerCalendarEvent.INPUT, {\n                ...internalRangeDate,\n                range: selectedRangeSelectorValue.value,\n            });\n        } else {\n            // Indicate form error\n            startDateError.value = getDateErrorMessage(startDateText);\n            // Emit Date picker calendar error\n            emit(DateRangePickerCalendarEvent.ERROR, { ...dateTextInput });\n        }\n    };\n\n    const validateStartDateDebounced = debounce(validateStartDate, FORM_INPUT_DEBOUNCE_TIME);\n\n    const onStartDateInput = (startDateText: string) => {\n        // Set the date as string when input through the form\n        // Bypassing autoFormat for native month input since it doesn't support YYYY-MM\n        dateTextInput.startDate =\n            isTouchDevice.value && isMonthVariant.value ? startDateText : autoFormat(startDateText);\n\n        if (isTouchDevice.value) {\n            if (isMonthVariant.value && startDateText) {\n                validateStartDate(formatDate(parseNativeMonthString(startDateText)), true);\n            } else if (dateTextInput.startDate) {\n                validateStartDate(dateTextInput.startDate);\n            } else {\n                // on touch devices, skip the any intermediate values e.g. pressing zero first\n                startDateError.value = null;\n            }\n        } else {\n            validateStartDateDebounced(dateTextInput.startDate);\n        }\n    };\n\n    const validateEndDate = (endDateText: string, alignToGranularity = false) => {\n        if (isValidDate(endDateText)) {\n            const dateText = endDateText;\n\n            endDateError.value = null;\n\n            dateTextInput.endDate = dateText;\n\n            // Format date string to Date object\n            const endDate = startOfDay(parseDate(dateText));\n            internalRangeDate.endDate = setTimeInDateRef(endDate, dateTextInput.endTime);\n            if (isValidDate(dateTextInput.startDate)) {\n                internalRangeDate.startDate = setTimeInDateRef(\n                    startOfDay(parseDate(dateTextInput.startDate)),\n                    dateTextInput.startTime\n                );\n            }\n\n            const startDate = getDate('startDate');\n            const rangeError = getDateErrorMessage(\n                dateText,\n                props.allowTimeInput ? internalRangeDate.startDate : startDate,\n                'end',\n                props.allowTimeInput ? internalRangeDate.endDate : undefined\n            );\n\n            if (rangeError) {\n                endDateError.value = rangeError;\n                emit(DateRangePickerCalendarEvent.ERROR, { ...dateTextInput });\n                return;\n            }\n\n            if (startDateError.value === 'startDateMustPrecedeEndDate') {\n                startDateError.value = null;\n            }\n\n            // The user changed the end date, so preserve the existing start date.\n            normalizeInternalRange('start', alignToGranularity);\n\n            // Resetting internal range date when selecting a custom range through the calendar\n            internalRangeDate.range = null;\n\n            emit(DateRangePickerCalendarEvent.FORM_DATE, {\n                startDate: internalRangeDate.startDate,\n                endDate: internalRangeDate.endDate,\n            });\n\n            emit(DateRangePickerCalendarEvent.INPUT, {\n                ...internalRangeDate,\n                range: selectedRangeSelectorValue.value,\n            });\n        } else {\n            // Indicate form error\n            endDateError.value = getDateErrorMessage(endDateText);\n            // Emit Date picker calendar error\n            emit(DateRangePickerCalendarEvent.ERROR, { ...dateTextInput });\n        }\n    };\n\n    const validateEndDateDebounced = debounce(validateEndDate, FORM_INPUT_DEBOUNCE_TIME);\n\n    const onEndDateInput = (endDateText: string) => {\n        // Set the date as string when input through the form\n        // Bypassing autoFormat for native month input since it doesn't support YYYY-MM\n        dateTextInput.endDate = isTouchDevice.value && isMonthVariant.value ? endDateText : autoFormat(endDateText);\n\n        if (isTouchDevice.value) {\n            if (isMonthVariant.value && endDateText) {\n                validateEndDate(formatDate(parseNativeMonthString(endDateText)), true);\n            } else if (dateTextInput.endDate) {\n                validateEndDate(dateTextInput.endDate);\n            } else {\n                // on touch devices, skip the any intermediate values e.g. pressing zero first\n                endDateError.value = null;\n            }\n        } else {\n            validateEndDateDebounced(dateTextInput.endDate);\n        }\n    };\n\n    const onDateInputKeyDown = (event: KeyboardEvent) => {\n        onKeyDown(event);\n    };\n\n    const onStartTimeError = () => {\n        emit(DateRangePickerCalendarEvent.ERROR, { ...dateTextInput });\n    };\n\n    const onStartTimeValid = () => {\n        const startTimeText = dateTextInput.startTime;\n        if (!isValidTime(startTimeText, dateTextInput.startDate)) {\n            emit(DateRangePickerCalendarEvent.ERROR, { ...dateTextInput });\n            return;\n        }\n        internalRangeDate.startDate = setTimeInDateRef(internalRangeDate.startDate, startTimeText);\n\n        // Validate range order with updated time\n        if (dateTextInput.startDate && internalRangeDate.endDate) {\n            const rangeError = getDateErrorMessage(\n                dateTextInput.startDate,\n                internalRangeDate.endDate,\n                'start',\n                internalRangeDate.startDate\n            );\n\n            if (rangeError) {\n                startDateError.value = rangeError;\n                emit(DateRangePickerCalendarEvent.ERROR, { ...dateTextInput });\n                return;\n            }\n        }\n\n        startDateError.value = null;\n        if (endDateError.value === 'startDateMustPrecedeEndDate') {\n            endDateError.value = null;\n        }\n\n        const endDate = getDate('endDate');\n\n        emit(DateRangePickerCalendarEvent.FORM_DATE, {\n            startDate: internalRangeDate.startDate,\n            endDate,\n            startTime: startTimeText,\n            endTime: dateTextInput.endTime ?? props.dateFormData.endTime,\n        });\n\n        emit(DateRangePickerCalendarEvent.INPUT, {\n            ...internalRangeDate,\n            range: selectedRangeSelectorValue.value,\n        });\n    };\n\n    const onEndTimeError = () => {\n        emit(DateRangePickerCalendarEvent.ERROR, { ...dateTextInput });\n    };\n\n    const onEndTimeValid = () => {\n        const endTimeText = dateTextInput.endTime;\n        if (!isValidTime(endTimeText, dateTextInput.endDate)) {\n            emit(DateRangePickerCalendarEvent.ERROR, { ...dateTextInput });\n            return;\n        }\n        internalRangeDate.endDate = setTimeInDateRef(internalRangeDate.endDate, endTimeText);\n\n        // Validate range order with updated time\n        if (dateTextInput.endDate && internalRangeDate.startDate) {\n            const rangeError = getDateErrorMessage(\n                dateTextInput.endDate,\n                internalRangeDate.startDate,\n                'end',\n                internalRangeDate.endDate\n            );\n\n            if (rangeError) {\n                endDateError.value = rangeError;\n                emit(DateRangePickerCalendarEvent.ERROR, { ...dateTextInput });\n                return;\n            }\n        }\n\n        endDateError.value = null;\n        if (startDateError.value === 'startDateMustPrecedeEndDate') {\n            startDateError.value = null;\n        }\n\n        emit(DateRangePickerCalendarEvent.FORM_DATE, {\n            startDate: internalRangeDate.startDate,\n            endDate: internalRangeDate.endDate,\n            startTime: dateTextInput.startTime ?? props.dateFormData.startTime,\n            endTime: endTimeText,\n        });\n        emit(DateRangePickerCalendarEvent.INPUT, {\n            ...internalRangeDate,\n            range: selectedRangeSelectorValue.value,\n        });\n    };\n\n    const onStartTimeInput = (startTimeText: string) => {\n        dateTextInput.startTime = startTimeText;\n    };\n\n    const onEndTimeInput = (endTimeText: string) => {\n        dateTextInput.endTime = endTimeText;\n    };\n\n    const setInternalRange = (\n        startDate: Date,\n        endDate: Date,\n        granularity?: CalendarGranularityType,\n        range?: string\n    ) => {\n        internalRangeDate.startDate = startDate;\n        internalRangeDate.endDate = endDate;\n\n        if (granularity) {\n            internalRangeDate.granularity = granularity;\n        }\n\n        if (range) {\n            internalRangeDate.range = range;\n        }\n    };\n\n    const onRangeSelectorInput = (newCustomRangeValue: string) => {\n        const foundResult = props.quickSelectRanges?.find(({ value }) => value === newCustomRangeValue);\n\n        if (foundResult) {\n            resetSavedRanges();\n            const date = foundResult.data;\n            const rangeEndDate =\n                date.endDate || (date.isRelativeToNow ? new Date(Date.now()) : endOfDay(new Date(Date.now())));\n            // If the time difference between start and end dates is available,\n            // calculating start date dynamically\n            const rangeStartDate =\n                date.isRelativeToNow && date.timeDifference\n                    ? new Date(rangeEndDate.getTime() - date.timeDifference)\n                    : date.startDate;\n\n            // Set Form input time to quick select range time\n            const startTime = snapTime(dateToTimeInputString(rangeStartDate), 'down');\n            const endTime = snapTime(dateToTimeInputString(rangeEndDate), 'up');\n\n            // A quick select range can hold times the time dropdowns do not offer, so the range follows the snapped times\n            const shouldSnapRange = props.allowTimeInput && !!props.timeInterval;\n            const newStartDate = shouldSnapRange ? setTimeInDateRef(rangeStartDate, startTime) : rangeStartDate;\n            const newEndDate = shouldSnapRange ? setTimeInDateRef(rangeEndDate, endTime) : rangeEndDate;\n\n            // Set Form input Dates\n            dateTextInput.endDate = formatDate(newEndDate);\n            dateTextInput.startDate = formatDate(newStartDate);\n            dateTextInput.startTime = startTime;\n            dateTextInput.endTime = endTime;\n\n            setInternalRange(newStartDate, newEndDate, null, newCustomRangeValue);\n\n            if (props.granularities) {\n                internalRangeDate.granularity = date.granularity || defaultGranularity.value;\n            }\n\n            if (date.isRelativeToNow) {\n                // Store this calculated start and end dates to be used in the selectedRangeSelectorValue logic\n                calculatedIsRelativeToNowQuickSelectRanges.value = {\n                    ...calculatedIsRelativeToNowQuickSelectRanges.value,\n                    [newCustomRangeValue]: {\n                        startDate: newStartDate,\n                        endDate: newEndDate,\n                    },\n                };\n            }\n\n            // Emit everytime the date range changes\n            emit(DateRangePickerCalendarEvent.CUSTOM_RANGE, {\n                ...foundResult.data,\n                startDate: newStartDate,\n                endDate: newEndDate,\n                range: foundResult.value,\n            });\n        }\n    };\n\n    const onGranularityInput = (value: CalendarGranularityType) => {\n        const previousValue = internalRangeDate.granularity;\n\n        internalRangeDate.granularity = value;\n\n        // Save previously selected range\n        if (previousValue) {\n            saveRange(previousValue, structuredClone(toRaw(internalRangeDate)));\n        }\n\n        if (internalRangeDate.startDate && internalRangeDate.endDate) {\n            if (savedRanges[value]) {\n                setInternalRange(savedRanges[value].startDate, savedRanges[value].endDate, value);\n            }\n\n            // Keep the most recent endpoint when the new granularity shortens the range.\n            normalizeInternalRange('end');\n\n            dateTextInput.startDate = formatDate(internalRangeDate.startDate);\n            dateTextInput.endDate = formatDate(internalRangeDate.endDate);\n\n            emit(DateRangePickerCalendarEvent.INPUT, {\n                ...internalRangeDate,\n                range: selectedRangeSelectorValue.value,\n            });\n        }\n    };\n\n    const computedFormContainerClasses = computed(() => ({\n        'b-date-range-picker-calendar__form-container--no-calendars': hasNoCalendars.value || isTouchDevice.value,\n    }));\n\n    const maxRangeMessage = computed(() => {\n        const granularity = selectedGranularity.value;\n        const count = granularity?.maxRange || props.maxRange;\n        if (!count) {\n            return null;\n        }\n        const key = maxRangeMessageKeyMap[granularity?.type ?? 'daily'];\n        return tc(key, count, { count });\n    });\n\n    /**\n     * Aligns the initial range with the times the time dropdowns offer, so that\n     * any change emits a range the time interval can actually represent.\n     */\n    const alignInitialRangeWithTimeInterval = () => {\n        if (!props.allowTimeInput || !props.timeInterval) {\n            return;\n        }\n\n        if (internalRangeDate.startDate) {\n            internalRangeDate.startDate = setTimeInDateRef(internalRangeDate.startDate, dateTextInput.startTime);\n        }\n\n        if (internalRangeDate.endDate) {\n            internalRangeDate.endDate = setTimeInDateRef(internalRangeDate.endDate, dateTextInput.endTime);\n        }\n    };\n\n    alignInitialRangeWithTimeInterval();\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Calendar for range dates. Contains the logic to handle the range forms.\n     *\n     * @example\n     * import DatePickerCalendarRange from './date-range-picker-calendar.vue';\n     *\n     * export default {\n     *     components: { DatePickerCalendarRange },\n     *     template: `\n     *          <date-range-picker-calendar\n     *              :value=\"{startDate: new Date(), endDate: new Date() }\"\n     *              :first-day-of-week=\"BentoDatePickerFirstDayOfWeek.MONDAY\"\n     *              :is-date-disabled=\"(date: Date) => boolean\"\n     *              :number-of-months=\"2\"\n     *              @input=\"({ startDate, endDate }) => void\"\n     *          />\n     *     `\n     * }\n     */\n    export default {\n        name: 'date-range-picker-calendar',\n        i18n: { messages },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./date-range-picker-calendar.scss\" />\n","import { computed, reactive, watch } from 'vue';\nimport { useI18n } from '@/utils/ts/i18n';\nimport { type UseDateDisplayText } from './use-date-range-picker-calendar-text.types';\nimport { type CalendarRangeDateValue } from '@/internal';\nimport { type DateRangePickerCalendarFormData } from '../components/date-range-picker-calendar/date-range-picker-calendar.types';\nimport { getQuarter } from 'date-fns/getQuarter';\nimport { getYear } from 'date-fns/getYear';\nimport { isSameQuarter } from 'date-fns/isSameQuarter';\nimport { dateToTimeInputString, getDateTimeFormatter } from '@/utils/ts/format-date';\nimport { useDateInputFormatter } from '@/composables/use-date-input-formatter/use-date-input-formatter';\nimport messages from '../messages.json';\n\ntype MessageSchema = (typeof messages)['en-US'];\n\n/**\n * Composable that sets and formats the date to be displayed in the input box of a Date Range Picker\n * @param {Ref<Date>} option.datePickerValue Ref to the datePickerValue set in the DateRangePicker component\n * @param {Ref<boolean>} option.isDateIncorrect Indicates if the date is correct or not\n * @param {Ref<DateRangePickerCalendarRangeSelectorItems>} option.quickSelectRanges Ref to the quick select date ranges (optional)\n * @param {?Ref<boolean>} option.isMonthVariant Indicates if the date range picker has variant \"month\"\n */\nexport const useDateRangePickerCalendarText: UseDateDisplayText<CalendarRangeDateValue> = ({\n    datePickerValue,\n    isDateIncorrect,\n    quickSelectRanges,\n    isMonthVariant,\n    withTimeInput,\n    placeholder,\n}) => {\n    const { locale, t } = useI18n<{ message: MessageSchema }>({ messages });\n    const { dateToInputDateString } = useDateInputFormatter();\n\n    const isValidDate = date => !!date && !isNaN(date.getTime());\n\n    // Handle the form input text\n    const textInputDisplayValue = reactive<DateRangePickerCalendarFormData>({\n        startDate: null,\n        endDate: null,\n        startTime: null,\n        endTime: null,\n    });\n\n    watch(\n        datePickerValue,\n        newDatePickerValue => {\n            textInputDisplayValue.startDate = dateToInputDateString(newDatePickerValue?.startDate);\n            textInputDisplayValue.endDate = dateToInputDateString(newDatePickerValue?.endDate);\n            textInputDisplayValue.startTime = dateToTimeInputString(newDatePickerValue?.startDate);\n            textInputDisplayValue.endTime = dateToTimeInputString(newDatePickerValue?.endDate);\n        },\n        { immediate: true }\n    );\n\n    const dateDisplayValue = computed(() => {\n        // Display incorrect date when there's an error with the input\n        if (isDateIncorrect.value) {\n            return `${textInputDisplayValue.startDate || ''} - ${textInputDisplayValue.endDate || ''}`;\n        }\n\n        // Display \"Select a date\" when there's no date selected or input\n        if (!datePickerValue.value || (!datePickerValue.value.startDate && !datePickerValue.value.endDate)) {\n            return placeholder?.value || (t('selectDateRange') as string);\n        }\n\n        if (quickSelectRanges.value?.length) {\n            const customRangeSelected = quickSelectRanges.value.find(({ value }) => {\n                return value === datePickerValue.value?.range;\n            });\n\n            if (customRangeSelected) {\n                return customRangeSelected.label;\n            }\n        }\n\n        if (datePickerValue.value.granularity === 'quarterly') {\n            const { startDate, endDate } = datePickerValue.value;\n            const startQuarter = t('quarter', { quarter: getQuarter(startDate), year: getYear(startDate) });\n\n            // If a single quarter is selected, show it only (e.g.: `Q2 2024`)\n            if (isSameQuarter(startDate, endDate)) {\n                return startQuarter;\n            }\n\n            const endQuarter = t('quarter', { quarter: getQuarter(endDate), year: getYear(endDate) });\n            return `${startQuarter} - ${endQuarter}`;\n        }\n\n        if (!isValidDate(datePickerValue.value.startDate) || !isValidDate(datePickerValue.value.endDate)) {\n            return `${textInputDisplayValue.startDate || ''} - ${textInputDisplayValue.endDate || ''}`;\n        }\n\n        let formatRangeOptions: Intl.DateTimeFormatOptions = isMonthVariant?.value\n            ? { month: 'long', year: 'numeric' }\n            : { month: 'short', day: '2-digit', year: 'numeric' };\n\n        if (withTimeInput.value) {\n            formatRangeOptions = {\n                ...formatRangeOptions,\n                hour: 'numeric',\n                minute: 'numeric',\n                second: 'numeric',\n                hour12: false,\n            };\n        }\n\n        return getDateTimeFormatter(locale.value, formatRangeOptions).formatRange(\n            datePickerValue.value.startDate,\n            datePickerValue.value.endDate\n        );\n    });\n\n    const formatTextInputDisplayValue = () => '';\n\n    return {\n        // Values\n        dateDisplayValue,\n        textInputDisplayValue,\n\n        // Methods\n        formatTextInputDisplayValue,\n    };\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 v-bento-click-outside-directive=\"closeDateRangePicker\" class=\"b-date-range-picker\">\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 ref=\"inputWrapperRef\" @keydown.enter=\"onEnterPressedOverInput\">\n            <dropdown-input-default\n                ref=\"inputContainerRef\"\n                always-combobox-is-input\n                :ariaControls=\"datePickerContainerId\"\n                :ariaExpanded=\"isDateRangePickerOpen\"\n                :aria-labelledby=\"dropdownInputAriaLabelledBy\"\n                :aria-describedby=\"ariaDescribedBy\"\n                :aria-required=\"required\"\n                :disabled=\"disabled\"\n                :is-invalid=\"!!errorMessage || shouldDisplayError\"\n                :open=\"isDateRangePickerOpen\"\n                :display-value=\"localDateDisplayValue\"\n                :readonly=\"isReadOnly\"\n                @open=\"openDateRangePicker\"\n                @clear=\"clearDateRangePickerValue\"\n                @close=\"closeDateRangePicker\"\n            />\n        </div>\n\n        <!-- Error Messages -->\n        <error-message\n            v-if=\"shouldDisplayError\"\n            :id=\"dateErrorId\"\n            :error-message=\"t('invalidDateFormat')\"\n            class=\"b-date-range-picker__error-message\"\n        />\n        <error-message\n            v-if=\"!!errorMessage\"\n            :id=\"errorId\"\n            :error-message=\"errorMessage\"\n            class=\"b-date-range-picker__error-message\"\n        />\n\n        <!-- Description -->\n        <bento-typography\n            v-if=\"description\"\n            :id=\"descriptionId\"\n            class=\"b-date-range-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-range-picker__container\"\n            :open=\"isDateRangePickerOpen\"\n            :target-element=\"inputContainerRef\"\n            :aria-label=\"popoverAriaLabel\"\n            position=\"bottom-start\"\n            fallback-strategy=\"initialPlacement\"\n            without-space\n            fit-content\n            :match-width=\"shouldMatchPopoverWidth\"\n            trap-all\n            overflow-visible\n            :trap-all-options=\"trapAllOptions\"\n            @keydown.esc.native=\"closeDateRangePicker\"\n        >\n            <date-range-picker-calendar\n                :allow-time-input=\"withTimeInput\"\n                :quick-select-ranges=\"adjustedQuickSelectRanges\"\n                :value=\"selectedDate\"\n                :first-day-of-week=\"resolvedFirstDayOfWeek\"\n                :granularities=\"granularities\"\n                :is-date-disabled=\"isDateDisabled\"\n                :max-range=\"maxRange\"\n                :min=\"min\"\n                :max=\"max\"\n                :number-of-months=\"computedNumberOfMonths\"\n                :show-end-date-on-open=\"showEndDateOnOpen\"\n                :time-interval=\"resolvedTimeInterval\"\n                :date-form-data=\"displayedTextInputValue\"\n                :variant=\"variant\"\n                :year-range=\"yearRange\"\n                @custom-range=\"onRangeSelectorInput\"\n                @input=\"onDateRangePickerInput\"\n                @error=\"onDateRangePickerError\"\n                @form-date=\"onDateRangePickerFormDateInputUpdate\"\n            >\n                <template #actions>\n                    <bento-divider />\n\n                    <div class=\"b-date-range-picker__footer\">\n                        <bento-button-actions\n                            :actions=\"rangePickerButtonActions\"\n                            :layout=\"BentoButtonActionsLayout.SPACE_BETWEEN\"\n                        />\n                    </div>\n                </template>\n            </date-range-picker-calendar>\n        </bento-popover>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, type HTMLAttributes, onMounted, ref, toRaw, toRef, useAttrs, watch } from 'vue';\n    import { useBreakpoints, useElementSize } from '@vueuse/core';\n\n    // Components\n    import { BentoButtonActions, BentoButtonActionsLayout } from '../button';\n    import { BentoDivider } from '@/components/divider';\n    import { BentoPopover } from '@/components/popover';\n    import { BentoTypography } from '../typography';\n    import { DateRangePickerCalendar } from './components/date-range-picker-calendar';\n    import { DropdownInputDefault } from '@/components/dropdown/components';\n    import { ErrorMessage, FieldLabel } from '@/internal';\n\n    // Utils\n    import { generateUid } from '@/utils/ts/generate-uid';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { printDevelopmentWarning } from '@/utils/ts/print-development-warning';\n    import { snapTimeToInterval } from '@/utils/ts/time-input';\n    import { dateToTimeInputString, setTimeInDateObject } from '@/utils/ts/format-date';\n    import { useDateInputFormatter } from '@/composables/use-date-input-formatter/use-date-input-formatter';\n\n    // Composables\n    import { useDateRangePickerCalendarText } from './composables/use-date-range-picker-calendar-text';\n    import { useFirstDayOfWeek, useFormLayoutFieldLoading } from '@/composables';\n\n    // Directives\n    import { BentoClickOutsideDirective as vBentoClickOutsideDirective } from '@/directives';\n\n    // Types\n    import {\n        type BentoDateRangePickerEmits,\n        type BentoDateRangePickerProps,\n        type BentoDateRangePickerValue,\n    } from './date-range-picker.types';\n    import type { MaybeElement } from '@/types/elements';\n    import {\n        type DateRangePickerCalendarFormData,\n        type DateRangePickerCalendarRangeSelectorItem,\n    } from './components/date-range-picker-calendar/date-range-picker-calendar.types';\n\n    import messages from './messages.json';\n    import { useFormFieldEmits } from '@/utils/ts/form-field/form-field';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const emit = defineEmits([\"update:model-value\"]);\n    const props = defineProps({\n  description: { default: undefined },\n  disabled: { type: Boolean, default: false },\n  errorMessage: { default: null },\n  label: { default: undefined },\n  optional: { type: Boolean, default: false },\n  placeholder: { default: null },\n  readonly: { type: Boolean, default: false },\n  required: { type: Boolean, default: false },\n  tooltipText: { default: null },\n  allowTimeInput: { type: Boolean },\n  firstDayOfWeek: { default: undefined },\n  granularities: null,\n  isDateDisabled: { default: undefined },\n  showEndDateOnOpen: { type: Boolean, default: false },\n  quickSelectRanges: { default: undefined },\n  maxRange: { default: null },\n  min: { default: null },\n  max: { default: null },\n  numberOfMonths: { default: undefined },\n  timeInterval: { default: undefined },\n  modelValue: { default: null },\n  variant: { default: undefined },\n  yearRange: { default: undefined }\n});\n    const attrs: HTMLAttributes = useAttrs();\n\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n    const { dateToInputDateString } = useDateInputFormatter();\n    const datePickerContainerId = generateUid('bento-date-range-picker-container');\n    const labelId = generateUid('bento-date-range-picker-label');\n    const descriptionId = generateUid('bento-date-range-picker-description');\n    const errorId = generateUid('bento-date-range-picker-error');\n    const dateErrorId = generateUid('bento-date-range-picker-date-error');\n    const popoverAriaLabel = computed(() => props.label || t('dateRangePicker', { name: datePickerContainerId }));\n    const { resolvedFirstDayOfWeek } = useFirstDayOfWeek(toRef(props, 'firstDayOfWeek'));\n    const breakpoints = useBreakpoints({\n        none: 0,\n        one: 710, // width of date range picker with one panes\n        two: 1030, // width of date range picker with two panes\n        three: 1290, // width of date range picker with three panes\n    });\n    const computedNumberOfMonths = computed(() => {\n        const activeBreakpoint = breakpoints.active().value;\n        const breakpointToCalendarPanesMap = {\n            none: 0,\n            one: 1,\n            two: 2,\n        };\n\n        if (activeBreakpoint in breakpointToCalendarPanesMap) {\n            const maxPanes =\n                breakpointToCalendarPanesMap[activeBreakpoint as keyof typeof breakpointToCalendarPanesMap];\n            // If numberOfMonths is not provided, use the max panes for the breakpoint.\n            // Otherwise, use the smaller of the two values.\n            return props.numberOfMonths === undefined ? maxPanes : Math.min(props.numberOfMonths, maxPanes);\n        }\n\n        // Default case for 'three' and larger breakpoints, respect user-provided numberOfMonths.\n        return props.numberOfMonths;\n    });\n\n    /**\n     * Snaps the time of a date to the closest time selectable through the time interval.\n     * @param date Date whose time is snapped\n     * @param direction Whether to round the time down or up\n     */\n    const snapDateTime = (date: Date, direction: 'down' | 'up') =>\n        setTimeInDateObject(\n            date,\n            snapTimeToInterval(dateToTimeInputString(date), resolvedTimeInterval.value, direction)\n        );\n\n    const adjustedQuickSelectRanges = computed<Array<DateRangePickerCalendarRangeSelectorItem>>(() => {\n        return (\n            props?.quickSelectRanges &&\n            props.quickSelectRanges.map((range: DateRangePickerCalendarRangeSelectorItem) => {\n                const timeDiff = !range.data.endDate\n                    ? new Date(Date.now()).getTime() - range.data.startDate.getTime()\n                    : undefined;\n                // Quick select ranges can hold times the time dropdowns do not offer, so they are\n                // snapped to keep matching the range that gets selected from them\n                const snappedDates = resolvedTimeInterval.value\n                    ? {\n                          startDate: snapDateTime(range.data.startDate, 'down'),\n                          ...(range.data.endDate ? { endDate: snapDateTime(range.data.endDate, 'up') } : {}),\n                      }\n                    : {};\n\n                return {\n                    ...range,\n                    data: {\n                        ...range.data,\n                        ...snappedDates,\n                        // Adding timeDifference to calculate an up-to-date endDate on range selection\n                        timeDifference: timeDiff,\n                    },\n                };\n            })\n        );\n    });\n\n    const dropdownInputAriaLabelledBy = computed(() => (props.label ? labelId : (attrs?.['aria-labelledby'] ?? null)));\n\n    const isDateIncorrect = ref(false);\n    const inputContainerRef = ref<MaybeElement>(null);\n    const inputWrapperRef = ref<HTMLElement | null>(null);\n    const isDateRangePickerOpen = ref(false);\n\n    const { width: inputWrapperWidth } = useElementSize(inputWrapperRef);\n    const { isReadOnly } = useFormLayoutFieldLoading(toRef(props, 'readonly'));\n    const { emitValue } = useFormFieldEmits(emit);\n\n    watch(\n        () => props.disabled,\n        () => {\n            // Close date picker popover if it's opened when it's disabled\n            if (props.disabled && isDateRangePickerOpen.value) {\n                isDateRangePickerOpen.value = false;\n            }\n        }\n    );\n\n    const shouldMatchPopoverWidth = computed(\n        () => computedNumberOfMonths.value === 0 && inputWrapperWidth.value > 0 && inputWrapperWidth.value < 332 // size of date range picker form\n    );\n\n    const internalModelValue = computed(() => props.modelValue);\n\n    const shouldDisplayError = computed(() => !isApplyDisabled.value && isDateIncorrect.value);\n\n    const descriptionConditionalClasses = computed(() => ({\n        'b-date-range-picker__description--error': !!props.errorMessage || shouldDisplayError.value,\n    }));\n\n    const isMonthVariant = computed(() => props.variant === 'month');\n    const withTimeInput = computed(() => props.allowTimeInput && props.variant !== 'month');\n    const resolvedTimeInterval = computed(() => (withTimeInput.value ? props.timeInterval : null));\n\n    watch(\n        [() => props.timeInterval, () => props.allowTimeInput],\n        ([timeInterval, allowTimeInput]) => {\n            if (timeInterval && !allowTimeInput) {\n                printDevelopmentWarning(\n                    '\"bento-date-range-picker\" ignores the \"timeInterval\" prop unless \"allowTimeInput\" is enabled.'\n                );\n            }\n        },\n        { immediate: true }\n    );\n\n    const { dateDisplayValue, textInputDisplayValue, formatTextInputDisplayValue } = useDateRangePickerCalendarText({\n        datePickerValue: internalModelValue,\n        isDateIncorrect,\n        quickSelectRanges: adjustedQuickSelectRanges,\n        isMonthVariant,\n        withTimeInput,\n        placeholder: toRef(props, 'placeholder'),\n    });\n\n    const ariaDescribedBy = computed(\n        () =>\n            `${props.description ? descriptionId : ''} ${props.errorMessage ? errorId : ''} ${\n                isDateIncorrect.value ? dateErrorId : ''\n            }`.trim() || null\n    );\n\n    const closeDateRangePicker = () => {\n        isDateRangePickerOpen.value = false;\n    };\n\n    const openDateRangePicker = () => {\n        isDateRangePickerOpen.value = true;\n        formatTextInputDisplayValue();\n    };\n\n    const localDateDisplayValue = ref(dateDisplayValue.value);\n    const localTextInputDisplayValue = ref<DateRangePickerCalendarFormData>(\n        // textInputDisplayValue is a reactive object\n        structuredClone(toRaw(textInputDisplayValue))\n    );\n    const selectedDate = ref<BentoDateRangePickerValue>(props.modelValue);\n    const isApplyDisabled = ref(true);\n\n    const displayedTextInputValue = ref<DateRangePickerCalendarFormData>(localTextInputDisplayValue.value);\n\n    const trapAllOptions = {\n        allowOutsideClick: true,\n    };\n\n    onMounted(() => {\n        if (\n            props.granularities &&\n            props.variant !== 'month' &&\n            props.granularities.find(({ type }) => type === 'quarterly')\n        ) {\n            throw new Error('Quarterly granularity is only supported by BentoDateRangePicker with variant: \"month\"');\n        }\n    });\n\n    // Sync the local draft display state back to the committed model value.\n    // Since `displayedTextInputValue` is a mutable ref, it must point to the new cloned draft object.\n    const syncLocalDisplayStateFromCommittedValue = () => {\n        localDateDisplayValue.value = dateDisplayValue.value;\n        localTextInputDisplayValue.value = structuredClone(toRaw(textInputDisplayValue));\n        displayedTextInputValue.value = localTextInputDisplayValue.value;\n        selectedDate.value = internalModelValue.value;\n    };\n\n    // On update for the model value we need to update all the locally stored data\n    watch(\n        () => props.modelValue,\n        () => {\n            syncLocalDisplayStateFromCommittedValue();\n        }\n    );\n\n    const cancelDateRangePicker = () => {\n        // Reset local date range picker state\n        syncLocalDisplayStateFromCommittedValue();\n        isDateIncorrect.value = false;\n        isApplyDisabled.value = true;\n\n        closeDateRangePicker();\n    };\n\n    const rangePickerButtonActions = computed(() => [\n        {\n            title: t('apply'),\n            event: () => {\n                emitValue(selectedDate.value);\n                closeDateRangePicker();\n\n                isApplyDisabled.value = true;\n            },\n            disabled: isApplyDisabled.value,\n        },\n        {\n            title: t('cancel'),\n            event: cancelDateRangePicker,\n        },\n    ]);\n\n    watch(selectedDate, date => {\n        isApplyDisabled.value = isDateIncorrect.value || date === internalModelValue.value;\n    });\n\n    const onDateRangePickerInput = (selectedRange: BentoDateRangePickerValue) => {\n        // Reset the errors when the date is correct\n        isDateIncorrect.value = false;\n\n        displayedTextInputValue.value.startDate = dateToInputDateString(selectedRange.startDate);\n        displayedTextInputValue.value.endDate = dateToInputDateString(selectedRange.endDate);\n        displayedTextInputValue.value.startTime = dateToTimeInputString(selectedRange.startDate);\n        displayedTextInputValue.value.endTime = dateToTimeInputString(selectedRange.endDate);\n\n        selectedDate.value = selectedRange;\n    };\n\n    const clearDateRangePickerValue = async () => {\n        if (isDateIncorrect.value) {\n            isDateIncorrect.value = false;\n        }\n\n        selectedDate.value = null;\n    };\n\n    const onEnterPressedOverInput = () => {\n        // open the datepicker\n        if (!isDateRangePickerOpen.value) {\n            isDateRangePickerOpen.value = true;\n\n            return;\n        }\n\n        // Close the date picker if the date is correct and it is open\n        if (!isDateIncorrect.value) {\n            isDateRangePickerOpen.value = false;\n        }\n    };\n\n    const onDateRangePickerFormDateInputUpdate = (dateFormDate: DateRangePickerCalendarFormData) => {\n        isDateIncorrect.value = false;\n\n        if (dateFormDate.startTime) {\n            displayedTextInputValue.value.startTime = dateFormDate.startTime;\n        }\n\n        if (dateFormDate.endTime) {\n            displayedTextInputValue.value.endTime = dateFormDate.endTime;\n        }\n    };\n\n    const onDateRangePickerError = dateTextInput => {\n        isDateIncorrect.value = true;\n        displayedTextInputValue.value.startDate = dateTextInput.startDate;\n        displayedTextInputValue.value.endDate = dateTextInput.endDate;\n\n        // Remove current date range selection\n        selectedDate.value = { startDate: null, endDate: null };\n    };\n\n    const onRangeSelectorInput = (quickSelectRanges?: BentoDateRangePickerValue) => {\n        if (quickSelectRanges) {\n            displayedTextInputValue.value.startDate = dateToInputDateString(quickSelectRanges.startDate);\n            displayedTextInputValue.value.endDate = dateToInputDateString(quickSelectRanges.endDate);\n            displayedTextInputValue.value.startTime = dateToTimeInputString(quickSelectRanges.startDate);\n            displayedTextInputValue.value.endTime = dateToTimeInputString(quickSelectRanges.endDate);\n\n            selectedDate.value = quickSelectRanges;\n        }\n    };\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Date range picker selector.\n     *\n     * @example\n     * import { BentoDateRangePicker } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoDateRangePicker },\n     *     template: `\n     *          <bento-date-range-picker\n     *              label=\"Label\"\n     *              description=\"Supporting text\"\n     *              required\n     *              optional\n     *              disabled\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 {\n        i18n: { messages },\n        name: 'bento-date-range-picker',\n        model: { prop: 'modelValue', event: 'update:model-value' },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./date-range-picker.scss\" />\n"],"names":["getYear","date","options","toDate","isEqual","leftDate","rightDate","isSameQuarter","laterDate","earlierDate","dateLeft_","dateRight_","normalizeDates","startOfQuarter","startOfSecond","date_","isSameSecond","isToday","isSameDay","constructFrom","constructNow","__default__$2","resolvedDateProps","computed","props","resolvedTimeProps","useGranularMinMaxDate","firstDayOfWeek","minimumDate","maximumDate","granularity","min","startOfDay","max","endOfDay","startOfMin","startOfWeek","addDays","endOfWeek","endOfMax","subDays","startOfMonth","addMonths","endOfMonth","subMonths","addQuarters","endOfQuarter","subQuarters","useGranularityMemory","savedRanges","reactive","type","range","DateRangePickerCalendarEvent","DateRangePickerCalendarEvent2","__default__$1","messages$1","FORM_INPUT_DEBOUNCE_TIME","RANGE_SELECTOR_CUSTOM_RANGE_KEY","maxRangeMessageKeyMap","slots","useSlots","hasSlot","useHasSlot","t","tc","useI18n","isTouchDevice","useTouchDevice","dateFormat","isFormatValid","parseDate","onKeyDown","autoFormat","formatDateUtil","useDateInputFormatter","calculatedIsRelativeToNowQuickSelectRanges","ref","calendarRef","defaultGranularity","hasNoCalendars","snapTime","time","direction","snapTimeToInterval","resolveEndOfSelectableDay","dayEnd","setTimeInDateObject","dateToTimeInputString","internalRangeDate","selectedRangeSelectorValue","value","data","newlyCalculatedQuickSelectDates","quickSelectRangeDefaultItems","selectedGranularity","granularityItems","disabled","getGranularCalendarLimits","computedMinMax","normalizeRange","useGranularityAdjustments","saveRange","resetSavedRanges","formatDate","dateToFormat","normalizeInternalRange","fixedEndpoint","alignToGranularity","normalizedRange","dateTextInput","startDateError","endDateError","startDateErrorText","endDateErrorText","startSharedError","endSharedError","getDateErrorMessage","dateText","counterpartDate","role","resolvedDateTime","dayDate","current","setMilliseconds","counterpart","isValidTime","timeText","isTimeAllowed","isValidDate","dateToCheckWithTime","isValidTimeString","isMonthVariant","formatNativeDate","dateToNativeMonthString","dateToNativeDateString","nativeStartDate","nativeEndDate","dateInputType","startDateValue","endDateValue","setTimeInDateRef","updateSelectedRange","selectedRange","preserveInputTimes","isStartLimitedByMin","isEndLimitedByMax","emit","onDateInput","finalizeHoveredRange","onMounted","onStartDateSelected","newStartDate","onEndDateSelected","newEndDate","getDate","keyName","dateProp","validateStartDate","startDateText","startDate","endDate","rangeError","validateStartDateDebounced","debounce","onStartDateInput","parseNativeMonthString","validateEndDate","endDateText","validateEndDateDebounced","onEndDateInput","onDateInputKeyDown","event","onStartTimeError","onStartTimeValid","startTimeText","onEndTimeError","onEndTimeValid","endTimeText","onStartTimeInput","onEndTimeInput","setInternalRange","onRangeSelectorInput","newCustomRangeValue","foundResult","rangeEndDate","rangeStartDate","startTime","endTime","shouldSnapRange","onGranularityInput","previousValue","toRaw","computedFormContainerClasses","maxRangeMessage","count","key","alignInitialRangeWithTimeInterval","useDateRangePickerCalendarText","datePickerValue","isDateIncorrect","quickSelectRanges","withTimeInput","placeholder","locale","dateToInputDateString","textInputDisplayValue","watch","newDatePickerValue","customRangeSelected","startQuarter","getQuarter","endQuarter","formatRangeOptions","getDateTimeFormatter","__default__","messages","attrs","useAttrs","datePickerContainerId","generateUid","labelId","descriptionId","errorId","dateErrorId","popoverAriaLabel","resolvedFirstDayOfWeek","useFirstDayOfWeek","toRef","breakpoints","useBreakpoints","computedNumberOfMonths","activeBreakpoint","breakpointToCalendarPanesMap","maxPanes","snapDateTime","resolvedTimeInterval","adjustedQuickSelectRanges","timeDiff","snappedDates","dropdownInputAriaLabelledBy","inputContainerRef","inputWrapperRef","isDateRangePickerOpen","inputWrapperWidth","useElementSize","isReadOnly","useFormLayoutFieldLoading","emitValue","useFormFieldEmits","shouldMatchPopoverWidth","internalModelValue","shouldDisplayError","isApplyDisabled","descriptionConditionalClasses","timeInterval","allowTimeInput","printDevelopmentWarning","dateDisplayValue","formatTextInputDisplayValue","ariaDescribedBy","closeDateRangePicker","openDateRangePicker","localDateDisplayValue","localTextInputDisplayValue","selectedDate","displayedTextInputValue","trapAllOptions","syncLocalDisplayStateFromCommittedValue","cancelDateRangePicker","rangePickerButtonActions","dateFormDate"],"mappings":"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","x_google_ignoreList":[0,1,2,3,4,5]}

package/dist/chunks/date-range-picker.types.Ckt7zxGy.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-range-picker.types.Ckt7zxGy.js","sources":["../../src/components/date-range-picker/date-range-picker.types.ts"],"sourcesContent":["import type { FormField, FormFieldEmits } from '../../types/form-field';\n\nimport {\n    CalendarFirstDayOfWeek as BentoDateRangePickerFirstDayOfWeek,\n    type CalendarGranularityConfig as BentoDateRangePickerGranularityConfig,\n    type CalendarIsDateDisabled as BentoDateRangePickerIsDateDisabled,\n    type CalendarRangeDateValue as BentoDateRangePickerValue,\n    CalendarVariant as BentoDateRangePickerVariant,\n    type CalendarYearRange,\n} from '@/internal/calendar/calendar.types';\nimport type { DateRangePickerCalendarRangeSelectorItems as BentoDateRangePickerQuickSelectRanges } from './components/date-range-picker-calendar/date-range-picker-calendar.types';\n\nexport {\n    BentoDateRangePickerFirstDayOfWeek,\n    type BentoDateRangePickerIsDateDisabled,\n    type BentoDateRangePickerValue,\n    type BentoDateRangePickerGranularityConfig,\n    type BentoDateRangePickerQuickSelectRanges,\n    BentoDateRangePickerVariant,\n};\n\n/**\n * @deprecated Since v2.0.0. Use string literal instead.\n */\nexport enum BentoDateRangePickerEvent {\n    INPUT = 'input',\n}\n\nexport type BentoDateRangePickerEmits = FormFieldEmits<any>;\n\nexport type BentoDateRangePickerYearRange = CalendarYearRange;\n\nexport interface BentoDateRangePickerProps extends FormField {\n    /**\n     * Allows user to enter time values in the form\n     * @default false\n     */\n    allowTimeInput?: boolean;\n\n    /**\n     * Allows user to set the first day of the week. 0 is sunday, 1 is monday, 6 is saturday\n     * @default undefined\n     */\n    firstDayOfWeek?: BentoDateRangePickerFirstDayOfWeek | number;\n\n    /**\n     * A list of available granularities.\n     * If present, the date picker will display a segmented control to change granularity.\n     */\n    granularities?: Array<BentoDateRangePickerGranularityConfig>;\n\n    /**\n     * Indicate if a date should be disabled or not\n     */\n    isDateDisabled?: BentoDateRangePickerIsDateDisabled;\n\n    /**\n     * Upon opening date range picker, end date's month will be pre-selected.\n     * @default false\n     */\n    showEndDateOnOpen?: boolean;\n\n    /**\n     * Enables the range selector.\n     * If provided, must be an array that sets the custom range dropdown items.\n     */\n    quickSelectRanges?: BentoDateRangePickerQuickSelectRanges;\n\n    /**\n     * Set a maximum number of dates to be selectable by the range.\n     */\n    maxRange?: number;\n\n    /**\n     * Sets a minimum limit for selectable dates - dates before `min` will not be selectable\n     */\n    min?: Date;\n\n    /**\n     * Sets a maximum limit for selectable dates - dates after `max` will not be selectable\n     */\n    max?: Date;\n\n    /**\n     * Number of months rendered on pane\n     */\n    numberOfMonths?: number;\n\n    /**\n     * Selected date\n     */\n    modelValue?: BentoDateRangePickerValue | null;\n\n    /**\n     * The type of calendar to display. Defaults to showing days.\n     */\n    variant?: `${BentoDateRangePickerVariant}`;\n\n    /**\n     * Range of years to be selectable from the year dropdown\n     */\n    yearRange?: BentoDateRangePickerYearRange;\n}\n"],"names":["BentoDateRangePickerEvent"],"mappings":"AAwBO,IAAKA,sBAAAA,OACRA,EAAA,QAAQ,SADAA,IAAAA,KAAA,CAAA,CAAA;"}
+{"version":3,"file":"date-range-picker.types.Ckt7zxGy.js","sources":["../../src/components/date-range-picker/date-range-picker.types.ts"],"sourcesContent":["import type { FormField, FormFieldEmits } from '../../types/form-field';\n\nimport {\n    CalendarFirstDayOfWeek as BentoDateRangePickerFirstDayOfWeek,\n    type CalendarGranularityConfig as BentoDateRangePickerGranularityConfig,\n    type CalendarIsDateDisabled as BentoDateRangePickerIsDateDisabled,\n    type CalendarRangeDateValue as BentoDateRangePickerValue,\n    CalendarVariant as BentoDateRangePickerVariant,\n    type CalendarYearRange,\n} from '@/internal/calendar/calendar.types';\nimport type { DateRangePickerCalendarRangeSelectorItems as BentoDateRangePickerQuickSelectRanges } from './components/date-range-picker-calendar/date-range-picker-calendar.types';\n\nexport {\n    BentoDateRangePickerFirstDayOfWeek,\n    type BentoDateRangePickerIsDateDisabled,\n    type BentoDateRangePickerValue,\n    type BentoDateRangePickerGranularityConfig,\n    type BentoDateRangePickerQuickSelectRanges,\n    BentoDateRangePickerVariant,\n};\n\n/**\n * @deprecated Since v3.0.0. Use string literal instead.\n */\nexport enum BentoDateRangePickerEvent {\n    INPUT = 'input',\n}\n\nexport type BentoDateRangePickerEmits = FormFieldEmits<any>;\n\nexport type BentoDateRangePickerYearRange = CalendarYearRange;\n\nexport interface BentoDateRangePickerProps extends FormField {\n    /**\n     * Allows user to enter time values in the form\n     * @default false\n     */\n    allowTimeInput?: boolean;\n\n    /**\n     * Allows user to set the first day of the week. 0 is sunday, 1 is monday, 6 is saturday\n     * @default undefined\n     */\n    firstDayOfWeek?: BentoDateRangePickerFirstDayOfWeek | number;\n\n    /**\n     * A list of available granularities.\n     * If present, the date picker will display a segmented control to change granularity.\n     */\n    granularities?: Array<BentoDateRangePickerGranularityConfig>;\n\n    /**\n     * Indicate if a date should be disabled or not\n     */\n    isDateDisabled?: BentoDateRangePickerIsDateDisabled;\n\n    /**\n     * Upon opening date range picker, end date's month will be pre-selected.\n     * @default false\n     */\n    showEndDateOnOpen?: boolean;\n\n    /**\n     * Enables the range selector.\n     * If provided, must be an array that sets the custom range dropdown items.\n     */\n    quickSelectRanges?: BentoDateRangePickerQuickSelectRanges;\n\n    /**\n     * Set a maximum number of dates to be selectable by the range.\n     */\n    maxRange?: number;\n\n    /**\n     * Sets a minimum limit for selectable dates - dates before `min` will not be selectable\n     */\n    min?: Date;\n\n    /**\n     * Sets a maximum limit for selectable dates - dates after `max` will not be selectable\n     */\n    max?: Date;\n\n    /**\n     * Number of months rendered on pane\n     */\n    numberOfMonths?: number;\n\n    /**\n     * Limits the selectable times to a fixed interval, expressed in minutes.\n     * Requires `allowTimeInput` and is not supported by the `month` variant.\n     * @default undefined\n     */\n    timeInterval?: number;\n\n    /**\n     * Selected date\n     */\n    modelValue?: BentoDateRangePickerValue | null;\n\n    /**\n     * The type of calendar to display. Defaults to showing days.\n     */\n    variant?: `${BentoDateRangePickerVariant}`;\n\n    /**\n     * Range of years to be selectable from the year dropdown\n     */\n    yearRange?: BentoDateRangePickerYearRange;\n}\n"],"names":["BentoDateRangePickerEvent"],"mappings":"AAwBO,IAAKA,sBAAAA,OACRA,EAAA,QAAQ,SADAA,IAAAA,KAAA,CAAA,CAAA;"}

package/dist/chunks/{date-time-picker.Bktntun4.js → date-time-picker.DJxDa81N.js}

@@ -1,13 +1,13 @@
 import { defineComponent as k, ref as d, computed as n, watch as x, nextTick as E } from "vue";
 import { s as J, a as I } from "./set-time-in-date.B3K4C7CB.js";
-import { e as G, s as S } from "./calendar.CXdLEeN4.js";
-import { B as q } from "./date-picker.gDsw8bn1.js";
-import { B as z, i as P } from "./input-time.CXMuvF9N.js";
+import { e as G, s as S } from "./calendar.BalfhApP.js";
+import { B as q } from "./date-picker.RFus1MVJ.js";
+import { B as z, i as P } from "./input-time.D7IsprlH.js";
 import "./index.Cl4_42j5.js";
-import { u as U } from "./use-date-input-formatter.MgbFwUqJ.js";
+import { u as U } from "./use-date-input-formatter.CouOE5tF.js";
 import { u as R } from "./use-touch-device.DTqFAbXh.js";
 import { u as j } from "./index.CPOlyau9.js";
-import { B as L } from "./form-layout-group.D4T0Z5xk.js";
+import { B as L } from "./form-layout-group.BSC2esG8.js";
 import { n as O } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
 import "../assets/date-time-picker.css";
 const $ = {
@@ -124,4 +124,4 @@ const De = K.exports;
 export {
   De as d
 };
-//# sourceMappingURL=date-time-picker.Bktntun4.js.map
+//# sourceMappingURL=date-time-picker.DJxDa81N.js.map

package/dist/chunks/{date-time-picker.Bktntun4.js.map → date-time-picker.DJxDa81N.js.map}

@@ -1 +1 @@
-{"version":3,"file":"date-time-picker.Bktntun4.js","sources":["../../src/components/date-time-picker/date-time-picker.vue"],"sourcesContent":["<template>\n    <div class=\"b-date-time-picker\">\n        <bento-form-layout-group class=\"b-date-time-picker__inputs\" layout=\"50-50\" :error-message=\"props.errorMessage\">\n            <bento-date-picker\n                class=\"b-date-time-picker__date-input\"\n                v-bind=\"resolvedDateProps\"\n                :model-value=\"dateValue\"\n                @update:model-value=\"onDateChanged\"\n            />\n            <bento-input-time\n                class=\"b-date-time-picker__time-input\"\n                v-bind=\"resolvedTimeProps\"\n                :model-value=\"timeValue\"\n                @update:model-value=\"onTimeChanged\"\n            />\n        </bento-form-layout-group>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, nextTick, ref, watch } from 'vue';\n    import { setMilliseconds } from 'date-fns/setMilliseconds';\n    import { startOfDay } from 'date-fns/startOfDay';\n\n    // Components\n    import { BentoDatePicker } from '@/components/date-picker';\n    import { BentoFormLayoutGroup } from '@/components/form-layout';\n    import { BentoInputTime } from '@/components/input-time';\n\n    // Utils\n    import { useDateInputFormatter, useTouchDevice } from '@/composables';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { dateToTimeInputString, setTimeInDateObject } from '@/utils/ts/format-date';\n    import { isValidTimeString } from '@/utils/ts/time-input';\n\n    // Types\n    import type {\n        BentoDateTimePickerEmits,\n        BentoDateTimePickerProps,\n        BentoDateTimePickerValue,\n    } from './date-time-picker.types';\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const props = defineProps({\n  modelValue: { default: null },\n  disabled: { type: Boolean, default: false },\n  errorMessage: { default: null },\n  isDateDisabled: { default: undefined },\n  max: { default: null },\n  min: { default: null },\n  readonly: { type: Boolean, default: false },\n  required: { type: Boolean, default: false },\n  dateProps: { default: () => ({}) },\n  timeProps: { default: () => ({}) }\n});\n\n    const emit = defineEmits([\"update:model-value\", \"input:valid\", \"input:error\"]);\n    const currentDate = ref<Date | null>(null);\n    const currentTimeText = ref('');\n    const dateError = ref<keyof MessageSchema | null>(null);\n    const timeError = ref<keyof MessageSchema | null>(null);\n    const { dateFormat } = useDateInputFormatter();\n    const { isTouchDevice } = useTouchDevice();\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n    const dateValue = computed(() => currentDate.value);\n    const timeValue = computed(() => currentTimeText.value);\n    const resolvedIsDateDisabled = computed(() => props.dateProps?.isDateDisabled ?? props.isDateDisabled);\n    const dateDescription = computed(() => {\n        if (isTouchDevice.value) {\n            return props.dateProps?.description;\n        } else {\n            return props.dateProps?.description\n                ? `${props.dateProps.description} ${t(dateFormat.value)}`\n                : t(dateFormat.value);\n        }\n    });\n\n    const isMergedDateInBounds = (date: Date) => {\n        if (resolvedIsDateDisabled.value?.(startOfDay(date))) {\n            return false;\n        }\n\n        if (props.min && date < setMilliseconds(props.min, 0)) {\n            return false;\n        }\n\n        if (props.max && date > setMilliseconds(props.max, 0)) {\n            return false;\n        }\n\n        return true;\n    };\n\n    const resolvedDateProps = computed(() => ({\n        disabled: props.disabled,\n        isDateDisabled: props.isDateDisabled,\n        max: props.max,\n        min: props.min,\n        readonly: props.readonly,\n        required: props.required,\n        errorMessage: dateErrorMessage.value,\n        ...props.dateProps,\n        description: dateDescription.value,\n    }));\n\n    const resolvedTimeProps = computed(() => ({\n        disabled: props.disabled,\n        errorMessage: timeErrorMessage.value,\n        readonly: props.readonly,\n        required: props.required,\n        ...props.timeProps,\n    }));\n\n    const dateErrorMessage = computed(() => {\n        if (props.errorMessage) {\n            return props.errorMessage;\n        }\n        return dateError.value ? t(dateError.value) : null;\n    });\n\n    const timeErrorMessage = computed(() => {\n        if (props.errorMessage) {\n            return props.errorMessage;\n        }\n        return timeError.value ? t(timeError.value) : null;\n    });\n\n    const clearErrors = () => {\n        dateError.value = null;\n        timeError.value = null;\n    };\n\n    /**\n     * Guards the modelValue watcher from clearing user input when the null was emitted\n     * by our own validation logic (e.g. partial/invalid input). Without this flag,\n     * the parent's v-model round-trip would trigger the watcher and wipe the fields.\n     * Reset on nextTick so that genuine external resets (e.g. a form clear button)\n     * still clear the UI.\n     */\n    const isSelfEmittedUpdate = ref(false);\n\n    watch(\n        () => props.modelValue,\n        newValue => {\n            if (isSelfEmittedUpdate.value) {\n                return;\n            }\n\n            if (newValue) {\n                // Sync internal state when a valid Date is set (e.g. programmatic update from parent)\n                currentDate.value = newValue;\n                currentTimeText.value = dateToTimeInputString(newValue);\n            } else {\n                // External reset (e.g. parent sets modelValue to null via a form clear button):\n                // clear all internal state so the UI resets fully.\n                currentDate.value = null;\n                currentTimeText.value = '';\n                clearErrors();\n            }\n        },\n        { immediate: true }\n    );\n\n    const validateBounds = (value: BentoDateTimePickerValue) => !value || isMergedDateInBounds(value);\n\n    const emitValidationState = (isValid: boolean) => {\n        if (isValid) {\n            emit('input:valid');\n        } else {\n            emit('input:error');\n        }\n    };\n\n    const emitModelValue = (value: BentoDateTimePickerValue) => {\n        isSelfEmittedUpdate.value = true;\n        emit('update:model-value', value);\n        nextTick(() => {\n            isSelfEmittedUpdate.value = false;\n        });\n    };\n\n    const emitValidatedValue = (value: BentoDateTimePickerValue) => {\n        emitModelValue(value);\n        emitValidationState(validateBounds(value));\n    };\n\n    const emitInvalidModelValue = (value: BentoDateTimePickerValue) => {\n        emitModelValue(value);\n        emitValidationState(false);\n    };\n\n    const onDateChanged = (date: Date | null) => {\n        currentDate.value = date;\n\n        // Date invalid/cleared: error if time is populated, valid if both empty\n        if (!date) {\n            if (currentTimeText.value) {\n                dateError.value = 'invalidDateFormat';\n                emitInvalidModelValue(null);\n            } else {\n                clearErrors();\n                emitValidatedValue(null);\n            }\n            return;\n        }\n\n        clearErrors();\n\n        // Prefill time with midnight when empty so the user sees a value\n        if (!currentTimeText.value) {\n            currentTimeText.value = '00:00:00';\n        }\n\n        const time = currentTimeText.value;\n\n        // Date valid but time invalid: preserve date, signal error\n        if (!isValidTimeString(time)) {\n            emitInvalidModelValue(null);\n            return;\n        }\n\n        // Both valid: merge and emit\n        emitValidatedValue(setTimeInDateObject(date, time));\n    };\n\n    const onTimeChanged = (time: string) => {\n        currentTimeText.value = time;\n\n        // Time cleared: error if date is set (time is required once prefilled), valid-null if both empty\n        if (!time) {\n            if (currentDate.value) {\n                timeError.value = 'enterTimeForDate';\n                emitInvalidModelValue(null);\n            } else {\n                clearErrors();\n                emitValidatedValue(null);\n            }\n            return;\n        }\n\n        timeError.value = null;\n\n        // Time invalid: preserve date, signal error\n        if (!isValidTimeString(time)) {\n            emitInvalidModelValue(null);\n            return;\n        }\n\n        // Time valid but no date: signal error\n        if (!currentDate.value) {\n            dateError.value = 'invalidDateFormat';\n            emitInvalidModelValue(null);\n            return;\n        }\n\n        // Both valid: merge and emit\n        emitValidatedValue(setTimeInDateObject(currentDate.value, time));\n    };\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Date time picker that combines a date picker (single date) with a time input.\n     *\n     * @example\n     * import { BentoDateTimePicker } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoDateTimePicker },\n     *     template: `\n     *         <bento-date-time-picker\n     *             :date-props=\"{ label: 'Date' }\"\n     *             :time-props=\"{ label: 'Time' }\"\n     *             required\n     *             :model-value=\"dateTimeValue\"\n     *             @update:model-value=\"newValue => dateTimeValue = newValue\"\n     *         />\n     *     `\n     * }\n     */\n    export default {\n        i18n: { messages },\n        name: 'bento-date-time-picker',\n        inheritAttrs: false,\n        model: { prop: 'modelValue', event: 'update:model-value' },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./date-time-picker.scss\" />\n"],"names":["__default__","messages","currentDate","ref","currentTimeText","dateError","timeError","dateFormat","useDateInputFormatter","isTouchDevice","useTouchDevice","t","useI18n","dateValue","computed","timeValue","resolvedIsDateDisabled","props","dateDescription","isMergedDateInBounds","date","startOfDay","setMilliseconds","resolvedDateProps","dateErrorMessage","resolvedTimeProps","timeErrorMessage","clearErrors","isSelfEmittedUpdate","watch","newValue","dateToTimeInputString","validateBounds","value","emitValidationState","isValid","emit","emitModelValue","nextTick","emitValidatedValue","emitInvalidModelValue","time","isValidTimeString","setTimeInDateObject"],"mappings":"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"}
+{"version":3,"file":"date-time-picker.DJxDa81N.js","sources":["../../src/components/date-time-picker/date-time-picker.vue"],"sourcesContent":["<template>\n    <div class=\"b-date-time-picker\">\n        <bento-form-layout-group class=\"b-date-time-picker__inputs\" layout=\"50-50\" :error-message=\"props.errorMessage\">\n            <bento-date-picker\n                class=\"b-date-time-picker__date-input\"\n                v-bind=\"resolvedDateProps\"\n                :model-value=\"dateValue\"\n                @update:model-value=\"onDateChanged\"\n            />\n            <bento-input-time\n                class=\"b-date-time-picker__time-input\"\n                v-bind=\"resolvedTimeProps\"\n                :model-value=\"timeValue\"\n                @update:model-value=\"onTimeChanged\"\n            />\n        </bento-form-layout-group>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, nextTick, ref, watch } from 'vue';\n    import { setMilliseconds } from 'date-fns/setMilliseconds';\n    import { startOfDay } from 'date-fns/startOfDay';\n\n    // Components\n    import { BentoDatePicker } from '@/components/date-picker';\n    import { BentoFormLayoutGroup } from '@/components/form-layout';\n    import { BentoInputTime } from '@/components/input-time';\n\n    // Utils\n    import { useDateInputFormatter, useTouchDevice } from '@/composables';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { dateToTimeInputString, setTimeInDateObject } from '@/utils/ts/format-date';\n    import { isValidTimeString } from '@/utils/ts/time-input';\n\n    // Types\n    import type {\n        BentoDateTimePickerEmits,\n        BentoDateTimePickerProps,\n        BentoDateTimePickerValue,\n    } from './date-time-picker.types';\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const props = defineProps({\n  modelValue: { default: null },\n  disabled: { type: Boolean, default: false },\n  errorMessage: { default: null },\n  isDateDisabled: { default: undefined },\n  max: { default: null },\n  min: { default: null },\n  readonly: { type: Boolean, default: false },\n  required: { type: Boolean, default: false },\n  dateProps: { default: () => ({}) },\n  timeProps: { default: () => ({}) }\n});\n\n    const emit = defineEmits([\"update:model-value\", \"input:valid\", \"input:error\"]);\n    const currentDate = ref<Date | null>(null);\n    const currentTimeText = ref('');\n    const dateError = ref<keyof MessageSchema | null>(null);\n    const timeError = ref<keyof MessageSchema | null>(null);\n    const { dateFormat } = useDateInputFormatter();\n    const { isTouchDevice } = useTouchDevice();\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n    const dateValue = computed(() => currentDate.value);\n    const timeValue = computed(() => currentTimeText.value);\n    const resolvedIsDateDisabled = computed(() => props.dateProps?.isDateDisabled ?? props.isDateDisabled);\n    const dateDescription = computed(() => {\n        if (isTouchDevice.value) {\n            return props.dateProps?.description;\n        } else {\n            return props.dateProps?.description\n                ? `${props.dateProps.description} ${t(dateFormat.value)}`\n                : t(dateFormat.value);\n        }\n    });\n\n    const isMergedDateInBounds = (date: Date) => {\n        if (resolvedIsDateDisabled.value?.(startOfDay(date))) {\n            return false;\n        }\n\n        if (props.min && date < setMilliseconds(props.min, 0)) {\n            return false;\n        }\n\n        if (props.max && date > setMilliseconds(props.max, 0)) {\n            return false;\n        }\n\n        return true;\n    };\n\n    const resolvedDateProps = computed(() => ({\n        disabled: props.disabled,\n        isDateDisabled: props.isDateDisabled,\n        max: props.max,\n        min: props.min,\n        readonly: props.readonly,\n        required: props.required,\n        errorMessage: dateErrorMessage.value,\n        ...props.dateProps,\n        description: dateDescription.value,\n    }));\n\n    const resolvedTimeProps = computed(() => ({\n        disabled: props.disabled,\n        errorMessage: timeErrorMessage.value,\n        readonly: props.readonly,\n        required: props.required,\n        ...props.timeProps,\n    }));\n\n    const dateErrorMessage = computed(() => {\n        if (props.errorMessage) {\n            return props.errorMessage;\n        }\n        return dateError.value ? t(dateError.value) : null;\n    });\n\n    const timeErrorMessage = computed(() => {\n        if (props.errorMessage) {\n            return props.errorMessage;\n        }\n        return timeError.value ? t(timeError.value) : null;\n    });\n\n    const clearErrors = () => {\n        dateError.value = null;\n        timeError.value = null;\n    };\n\n    /**\n     * Guards the modelValue watcher from clearing user input when the null was emitted\n     * by our own validation logic (e.g. partial/invalid input). Without this flag,\n     * the parent's v-model round-trip would trigger the watcher and wipe the fields.\n     * Reset on nextTick so that genuine external resets (e.g. a form clear button)\n     * still clear the UI.\n     */\n    const isSelfEmittedUpdate = ref(false);\n\n    watch(\n        () => props.modelValue,\n        newValue => {\n            if (isSelfEmittedUpdate.value) {\n                return;\n            }\n\n            if (newValue) {\n                // Sync internal state when a valid Date is set (e.g. programmatic update from parent)\n                currentDate.value = newValue;\n                currentTimeText.value = dateToTimeInputString(newValue);\n            } else {\n                // External reset (e.g. parent sets modelValue to null via a form clear button):\n                // clear all internal state so the UI resets fully.\n                currentDate.value = null;\n                currentTimeText.value = '';\n                clearErrors();\n            }\n        },\n        { immediate: true }\n    );\n\n    const validateBounds = (value: BentoDateTimePickerValue) => !value || isMergedDateInBounds(value);\n\n    const emitValidationState = (isValid: boolean) => {\n        if (isValid) {\n            emit('input:valid');\n        } else {\n            emit('input:error');\n        }\n    };\n\n    const emitModelValue = (value: BentoDateTimePickerValue) => {\n        isSelfEmittedUpdate.value = true;\n        emit('update:model-value', value);\n        nextTick(() => {\n            isSelfEmittedUpdate.value = false;\n        });\n    };\n\n    const emitValidatedValue = (value: BentoDateTimePickerValue) => {\n        emitModelValue(value);\n        emitValidationState(validateBounds(value));\n    };\n\n    const emitInvalidModelValue = (value: BentoDateTimePickerValue) => {\n        emitModelValue(value);\n        emitValidationState(false);\n    };\n\n    const onDateChanged = (date: Date | null) => {\n        currentDate.value = date;\n\n        // Date invalid/cleared: error if time is populated, valid if both empty\n        if (!date) {\n            if (currentTimeText.value) {\n                dateError.value = 'invalidDateFormat';\n                emitInvalidModelValue(null);\n            } else {\n                clearErrors();\n                emitValidatedValue(null);\n            }\n            return;\n        }\n\n        clearErrors();\n\n        // Prefill time with midnight when empty so the user sees a value\n        if (!currentTimeText.value) {\n            currentTimeText.value = '00:00:00';\n        }\n\n        const time = currentTimeText.value;\n\n        // Date valid but time invalid: preserve date, signal error\n        if (!isValidTimeString(time)) {\n            emitInvalidModelValue(null);\n            return;\n        }\n\n        // Both valid: merge and emit\n        emitValidatedValue(setTimeInDateObject(date, time));\n    };\n\n    const onTimeChanged = (time: string) => {\n        currentTimeText.value = time;\n\n        // Time cleared: error if date is set (time is required once prefilled), valid-null if both empty\n        if (!time) {\n            if (currentDate.value) {\n                timeError.value = 'enterTimeForDate';\n                emitInvalidModelValue(null);\n            } else {\n                clearErrors();\n                emitValidatedValue(null);\n            }\n            return;\n        }\n\n        timeError.value = null;\n\n        // Time invalid: preserve date, signal error\n        if (!isValidTimeString(time)) {\n            emitInvalidModelValue(null);\n            return;\n        }\n\n        // Time valid but no date: signal error\n        if (!currentDate.value) {\n            dateError.value = 'invalidDateFormat';\n            emitInvalidModelValue(null);\n            return;\n        }\n\n        // Both valid: merge and emit\n        emitValidatedValue(setTimeInDateObject(currentDate.value, time));\n    };\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Date time picker that combines a date picker (single date) with a time input.\n     *\n     * @example\n     * import { BentoDateTimePicker } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoDateTimePicker },\n     *     template: `\n     *         <bento-date-time-picker\n     *             :date-props=\"{ label: 'Date' }\"\n     *             :time-props=\"{ label: 'Time' }\"\n     *             required\n     *             :model-value=\"dateTimeValue\"\n     *             @update:model-value=\"newValue => dateTimeValue = newValue\"\n     *         />\n     *     `\n     * }\n     */\n    export default {\n        i18n: { messages },\n        name: 'bento-date-time-picker',\n        inheritAttrs: false,\n        model: { prop: 'modelValue', event: 'update:model-value' },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./date-time-picker.scss\" />\n"],"names":["__default__","messages","currentDate","ref","currentTimeText","dateError","timeError","dateFormat","useDateInputFormatter","isTouchDevice","useTouchDevice","t","useI18n","dateValue","computed","timeValue","resolvedIsDateDisabled","props","dateDescription","isMergedDateInBounds","date","startOfDay","setMilliseconds","resolvedDateProps","dateErrorMessage","resolvedTimeProps","timeErrorMessage","clearErrors","isSelfEmittedUpdate","watch","newValue","dateToTimeInputString","validateBounds","value","emitValidationState","isValid","emit","emitModelValue","nextTick","emitValidatedValue","emitInvalidModelValue","time","isValidTimeString","setTimeInDateObject"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;GA2RIA,IAAA;AAAA,EAAe,MAAA,EAAA,UAAAC,EAAA;AAAA,EACM,MAAA;AAAA,EACX,cAAA;AAAA,EACQ,OAAA,EAAA,MAAA,cAAA,OAAA,qBAAA;AAElB;;;;;;;;;;;;;;;;iBArOAC,IAAAC,EAAA,IAAA,GACAC,IAAAD,EAAA,EAAA,GACAE,IAAAF,EAAA,IAAA,GACAG,IAAAH,EAAA,IAAA,GACA,EAAA,YAAAI,EAAA,IAAAC,EAAA,GACA,EAAA,eAAAC,EAAA,IAAAC,EAAA,GACA,EAAA,GAAAC,EAAA,IAAAC,EAAA,GAEAC,IAAAC,EAAA,MAAAZ,EAAA,KAAA,GACAa,IAAAD,EAAA,MAAAV,EAAA,KAAA,GACAY,IAAAF,EAAA,MAAAG,EAAA,WAAA,kBAAAA,EAAA,cAAA,GACAC,IAAAJ,EAAA,MACIL,EAAA,QACIQ,EAAA,WAAA,cAEAA,EAAA,WAAA,cAAA,GAAAA,EAAA,UAAA,WAAA,IAAAN,EAAAJ,EAAA,KAAA,CAAA,KAAAI,EAAAJ,EAAA,KAAA,CAGJ,GAGJY,IAAA,CAAAC,MACI,EAAAJ,EAAA,QAAAK,EAAAD,CAAA,CAAA,KAIAH,EAAA,OAAAG,IAAAE,EAAAL,EAAA,KAAA,CAAA,KAIAA,EAAA,OAAAG,IAAAE,EAAAL,EAAA,KAAA,CAAA,IAOJM,IAAAT,EAAA,OAAA;AAAA,MAA0C,UAAAG,EAAA;AAAA,MACtB,gBAAAA,EAAA;AAAA,MACM,KAAAA,EAAA;AAAA,MACX,KAAAA,EAAA;AAAA,MACA,UAAAA,EAAA;AAAA,MACK,UAAAA,EAAA;AAAA,MACA,cAAAO,EAAA;AAAA,MACe,GAAAP,EAAA;AAAA,MACtB,aAAAC,EAAA;AAAA,IACoB,EAAA,GAGjCO,IAAAX,EAAA,OAAA;AAAA,MAA0C,UAAAG,EAAA;AAAA,MACtB,cAAAS,EAAA;AAAA,MACe,UAAAT,EAAA;AAAA,MACf,UAAAA,EAAA;AAAA,MACA,GAAAA,EAAA;AAAA,IACP,EAAA,GAGbO,IAAAV,EAAA,MACIG,EAAA,eACIA,EAAA,eAEJZ,EAAA,QAAAM,EAAAN,EAAA,KAAA,IAAA,IAA8C,GAGlDqB,IAAAZ,EAAA,MACIG,EAAA,eACIA,EAAA,eAEJX,EAAA,QAAAK,EAAAL,EAAA,KAAA,IAAA,IAA8C,GAGlDqB,IAAA,MAAA;AACI,MAAAtB,EAAA,QAAA,MACAC,EAAA,QAAA;AAAA,IAAkB,GAUtBsB,IAAAzB,EAAA,EAAA;AAEA,IAAA0B;AAAA,MAAA,MAAAZ,EAAA;AAAA,MACgB,CAAAa,MAAA;AAER,QAAAF,EAAA,UAIAE,KAEI5B,EAAA,QAAA4B,GACA1B,EAAA,QAAA2B,EAAAD,CAAA,MAIA5B,EAAA,QAAA,MACAE,EAAA,QAAA,IACAuB,EAAA;AAAA,MACJ;AAAA,MACJ,EAAA,WAAA,GAAA;AAAA,IACkB;AAGtB,UAAAK,IAAA,CAAAC,MAAA,CAAAA,KAAAd,EAAAc,CAAA,GAEAC,IAAA,CAAAC,MAAA;AACI,MACIC,EADJD,IACI,gBAEA,aAFA;AAAA,IAGJ,GAGJE,IAAA,CAAAJ,MAAA;AACI,MAAAL,EAAA,QAAA,IACAQ,EAAA,sBAAAH,CAAA,GACAK,EAAA,MAAA;AACI,QAAAV,EAAA,QAAA;AAAA,MAA4B,CAAA;AAAA,IAC/B,GAGLW,IAAA,CAAAN,MAAA;AACI,MAAAI,EAAAJ,CAAA,GACAC,EAAAF,EAAAC,CAAA,CAAA;AAAA,IAAyC,GAG7CO,IAAA,CAAAP,MAAA;AACI,MAAAI,EAAAJ,CAAA,GACAC,EAAA,EAAA;AAAA,IAAyB;kfAG7B,CAAAd,MAAA;AAII,UAHAlB,EAAA,QAAAkB,GAGA,CAAAA,GAAA;AACI,QAAAhB,EAAA,SACIC,EAAA,QAAA,qBACAmC,EAAA,IAAA,MAEAb,EAAA,GACAY,EAAA,IAAA;AAEJ;AAAA,MAAA;AAGJ,MAAAZ,EAAA,GAGAvB,EAAA,UACIA,EAAA,QAAA;AAGJ,YAAAqC,IAAArC,EAAA;AAGA,UAAA,CAAAsC,EAAAD,CAAA,GAAA;AACI,QAAAD,EAAA,IAAA;AACA;AAAA,MAAA;AAIJ,MAAAD,EAAAI,EAAAvB,GAAAqB,CAAA,CAAA;AAAA,IAAkD,kBAGtD,CAAAA,MAAA;AAII,UAHArC,EAAA,QAAAqC,GAGA,CAAAA,GAAA;AACI,QAAAvC,EAAA,SACII,EAAA,QAAA,oBACAkC,EAAA,IAAA,MAEAb,EAAA,GACAY,EAAA,IAAA;AAEJ;AAAA,MAAA;AAMJ,UAHAjC,EAAA,QAAA,MAGA,CAAAoC,EAAAD,CAAA,GAAA;AACI,QAAAD,EAAA,IAAA;AACA;AAAA,MAAA;AAIJ,UAAA,CAAAtC,EAAA,OAAA;AACI,QAAAG,EAAA,QAAA,qBACAmC,EAAA,IAAA;AACA;AAAA,MAAA;AAIJ,MAAAD,EAAAI,EAAAzC,EAAA,OAAAuC,CAAA,CAAA;AAAA,IAA+D;;;;;;;;;;;;;;;"}

package/dist/chunks/{date.CPo8t1n9.js → date.P3Xx7JdV.js}

@@ -1,6 +1,6 @@
 import { defineComponent as I, computed as t } from "vue";
 import { u as c } from "./index.CPOlyau9.js";
-import { B as d } from "./typography.D1OZJbEa.js";
+import { B as d } from "./typography.Cd386LC_.js";
 import { n as y } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
 import "../assets/date.css";
 var E = /* @__PURE__ */ ((e) => (e.SHORT_MONTH = "LLL", e.DAY_OF_MONTH = "d", e.LONG_WEEKDAY = "EEEE", e.SHORT_TIME_WITH_PERIOD = "h:mm aa", e.SHORT_TIME_WITHOUT_PERIOD = "H:mm", e.EXACT_TIME_WITH_PERIOD = "h:mm:ss aa", e.EXACT_TIME_WITHOUT_PERIOD = "H:mm:ss", e.LONG_DATE = "LLLL dd, yyyy", e.SHORT_DATE = "LLL dd, yyyy", e.FULL_DATE_EXACT_TIME_WITH_PERIOD = "LLL dd, yyyy, h:mm:ss aa", e.FULL_DATE_EXACT_TIME_WITHOUT_PERIOD = "LLL dd, yyyy, H:mm:ss", e.FULL_DATE_EXACT_TIME_WITH_TIMEZONE_AND_PERIOD = "LLL dd, yyyy, h:mm:ss aa O", e.FULL_DATE_EXACT_TIME_WITH_TIMEZONE_AND_WITHOUT_PERIOD = "LLL dd, yyyy, H:mm:ss O", e.FULL_DATE_TIME_WITH_PERIOD = "LLL dd, yyyy, h:mm aa", e.FULL_DATE_TIME_WITH_TIMEZONE_AND_PERIOD = "LLL dd, yyyy, h:mm aa O", e.FULL_DATE_TIME_WITHOUT_PERIOD = "LLL dd, yyyy, H:mm", e.FULL_DATE_TIME_WITH_TIMEZONE_AND_WITHOUT_PERIOD = "LLL dd, yyyy, H:mm O", e))(E || {});
@@ -159,4 +159,4 @@ export {
   N as B,
   E as a
 };
-//# sourceMappingURL=date.CPo8t1n9.js.map
+//# sourceMappingURL=date.P3Xx7JdV.js.map

package/dist/chunks/{date.CPo8t1n9.js.map → date.P3Xx7JdV.js.map}

@@ -1 +1 @@
-{"version":3,"file":"date.CPo8t1n9.js","sources":["../../src/components/date/date.types.ts","../../src/components/date/date.vue"],"sourcesContent":["export enum BentoDateFormat {\n    // MONTH\n    SHORT_MONTH = 'LLL', // Jun\n\n    // DAY\n    DAY_OF_MONTH = 'd', // 1, 2, ..., 31,\n    LONG_WEEKDAY = 'EEEE', // Friday\n\n    // TIME\n    SHORT_TIME_WITH_PERIOD = `h:mm aa`, // 2:44 PM\n    SHORT_TIME_WITHOUT_PERIOD = 'H:mm', // 14:45\n    EXACT_TIME_WITH_PERIOD = 'h:mm:ss aa', // 2:05:11 PM\n    EXACT_TIME_WITHOUT_PERIOD = 'H:mm:ss', // 14:05:11\n\n    // DATE\n    LONG_DATE = 'LLLL dd, yyyy', // June 30, 2023\n    SHORT_DATE = 'LLL dd, yyyy', // Jun 30, 2023\n    FULL_DATE_EXACT_TIME_WITH_PERIOD = `${SHORT_DATE}, h:mm:ss aa`, // June 30, 2023, 2:54:10 PM\n    FULL_DATE_EXACT_TIME_WITHOUT_PERIOD = `${SHORT_DATE}, H:mm:ss`, // June 30, 2023, 14:54:42\n    FULL_DATE_EXACT_TIME_WITH_TIMEZONE_AND_PERIOD = `${SHORT_DATE}, h:mm:ss aa O`, // June 30, 2023, 2:56:07 PM GMT+2\n    FULL_DATE_EXACT_TIME_WITH_TIMEZONE_AND_WITHOUT_PERIOD = `${SHORT_DATE}, H:mm:ss O`, // June 30, 2023, 14:56:28 GMT+2\n    FULL_DATE_TIME_WITH_PERIOD = `${SHORT_DATE}, h:mm aa`, // Jun 30, 2023, 2:48 PM\n    FULL_DATE_TIME_WITH_TIMEZONE_AND_PERIOD = `${SHORT_DATE}, h:mm aa O`, // Jun 30, 2023, 2:44 PM GMT+2\n    FULL_DATE_TIME_WITHOUT_PERIOD = `${SHORT_DATE}, H:mm`, // Jun 30, 2023, 14:48\n    FULL_DATE_TIME_WITH_TIMEZONE_AND_WITHOUT_PERIOD = `${SHORT_DATE}, H:mm O`, // Jun 30, 2023, 14:43 GMT+2\n}\n\nexport interface BentoDateProps {\n    /**\n     * The date to format. The data can be supplied as:\n     * - a Date object.\n     * - a number of milliseconds elapsed since the epoch.\n     * - a date string e.g. '2023-07-31T10:55:22+02:00'.\n     */\n    date?: Date | number | string | null;\n    /**\n     * The string format of the date to be displayed\n     */\n    format?: BentoDateFormat | `${BentoDateFormat}`;\n    /**\n     * Disable the default typography for the component. Only use this when the component is inside another typography\n     */\n    disableTypography?: boolean;\n}\n","<template>\n    <div class=\"b-date\">\n        <bento-typography v-if=\"!disableTypography\" class=\"b-date__label\" el=\"span\" variant=\"body\" strong>\n            <time :datetime=\"dateTime\">{{ formattedDate }}</time>\n        </bento-typography>\n        <time v-else :datetime=\"dateTime\">{{ formattedDate }}</time>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed } from 'vue';\n    import { BentoDateFormat, type BentoDateProps } from './date.types';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { BentoTypography } from '@/components/typography';\n\n    const props = defineProps({\n  date: { default: null },\n  format: { default: BentoDateFormat.FULL_DATE_EXACT_TIME_WITHOUT_PERIOD },\n  disableTypography: { type: Boolean, default: false }\n});\n\n    const { locale } = useI18n(undefined, true);\n\n    /**\n     * This is a reverse mapping of the BentoDateFormat enum.\n     * It allows us to get the key of the enum by its value, which is then used to look up the\n     * corresponding formatting options in `BentoDateFormatPresets`.\n     */\n    const bentoDateFormatKeyValuePairs = Object.entries(BentoDateFormat).reduce<\n        Record<BentoDateFormat, keyof typeof BentoDateFormat>\n    >(\n        (acc, [key, value]) => {\n            acc[value.toString()] = key;\n            return acc;\n        },\n        {} as Record<BentoDateFormat, keyof typeof BentoDateFormat>\n    );\n\n    const datePropAsDateObject = computed(() => {\n        if (!props.date) {\n            return null;\n        }\n\n        return props.date instanceof Date ? props.date : new Date(props.date);\n    });\n\n    const dateTime = computed(() =>\n        datePropAsDateObject.value && !Number.isNaN(datePropAsDateObject.value.getTime())\n            ? datePropAsDateObject.value.toISOString()\n            : undefined\n    );\n\n    const formattedDate = computed(() => {\n        if (!datePropAsDateObject.value || Number.isNaN(datePropAsDateObject.value.getTime())) {\n            return '';\n        }\n\n        const formatKeyEntry = bentoDateFormatKeyValuePairs?.[props.format];\n\n        let dateFormat: Intl.DateTimeFormatOptions | undefined = undefined;\n        // Translate the key of the enum to the Intl.DateTimeFormatOptions configuration object\n        if (formatKeyEntry && BentoDateFormatPresets?.[formatKeyEntry]) {\n            dateFormat = BentoDateFormatPresets?.[formatKeyEntry];\n        }\n        return new Intl.DateTimeFormat(locale.value, dateFormat).format(datePropAsDateObject.value);\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * The format presets to use when being supplied with a key name in BentoDateFormat.\n     * They translate to configuration options that are used in the Intl.DateTimeFormat function\n     *\n     * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat#using_options\n     */\n    const BentoDateFormatPresets: { [key in keyof typeof BentoDateFormat]: Intl.DateTimeFormatOptions } = {\n        SHORT_MONTH: {\n            month: 'short',\n        },\n        DAY_OF_MONTH: {\n            day: 'numeric',\n        },\n        LONG_WEEKDAY: {\n            weekday: 'long',\n        },\n        SHORT_TIME_WITH_PERIOD: {\n            hour: 'numeric',\n            minute: 'numeric',\n            hour12: true,\n        },\n        SHORT_TIME_WITHOUT_PERIOD: {\n            hour: 'numeric',\n            minute: 'numeric',\n            hour12: false,\n        },\n        EXACT_TIME_WITH_PERIOD: {\n            hour: 'numeric',\n            minute: 'numeric',\n            second: 'numeric',\n            hour12: true,\n        },\n        EXACT_TIME_WITHOUT_PERIOD: {\n            hour: 'numeric',\n            minute: 'numeric',\n            second: 'numeric',\n            hour12: false,\n        },\n        LONG_DATE: {\n            year: 'numeric',\n            month: 'long',\n            day: 'numeric',\n        },\n        SHORT_DATE: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n        },\n        FULL_DATE_TIME_WITH_PERIOD: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n            hour: 'numeric',\n            minute: 'numeric',\n            hour12: true,\n        },\n        FULL_DATE_TIME_WITHOUT_PERIOD: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n            hour: 'numeric',\n            minute: 'numeric',\n            hour12: false,\n        },\n        FULL_DATE_EXACT_TIME_WITH_PERIOD: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n            hour: 'numeric',\n            minute: 'numeric',\n            second: 'numeric',\n            hour12: true,\n        },\n        FULL_DATE_EXACT_TIME_WITHOUT_PERIOD: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n            hour: '2-digit',\n            minute: '2-digit',\n            second: '2-digit',\n            hour12: false,\n        },\n        FULL_DATE_TIME_WITH_TIMEZONE_AND_PERIOD: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n            hour: 'numeric',\n            minute: 'numeric',\n            hour12: true,\n            timeZoneName: 'short',\n        },\n        FULL_DATE_TIME_WITH_TIMEZONE_AND_WITHOUT_PERIOD: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n            hour: 'numeric',\n            minute: 'numeric',\n            hour12: false,\n            timeZoneName: 'short',\n        },\n        FULL_DATE_EXACT_TIME_WITH_TIMEZONE_AND_PERIOD: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n            hour: 'numeric',\n            minute: 'numeric',\n            second: 'numeric',\n            hour12: true,\n            timeZoneName: 'short',\n        },\n        FULL_DATE_EXACT_TIME_WITH_TIMEZONE_AND_WITHOUT_PERIOD: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n            hour: 'numeric',\n            minute: 'numeric',\n            second: 'numeric',\n            hour12: false,\n            timeZoneName: 'short',\n        },\n    };\n\n    /**\n     * A Date component is used to display a formatted date value.\n     *\n     * @example\n     * import { BentoDate } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoDate },\n     *     template: `\n     *          <bento-date :date=\"dateObject\" :format=\"BentoDateFormat.LONG_DATE\"/>\n     *     `\n     * }\n     */\n    export default {\n        name: 'bento-date',\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./date.scss\" />\n"],"names":["BentoDateFormat","BentoDateFormat2","BentoDateFormatPresets","__default__","locale","useI18n","bentoDateFormatKeyValuePairs","acc","key","value","datePropAsDateObject","computed","props","dateTime","formattedDate","formatKeyEntry","dateFormat"],"mappings":"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"}
+{"version":3,"file":"date.P3Xx7JdV.js","sources":["../../src/components/date/date.types.ts","../../src/components/date/date.vue"],"sourcesContent":["export enum BentoDateFormat {\n    // MONTH\n    SHORT_MONTH = 'LLL', // Jun\n\n    // DAY\n    DAY_OF_MONTH = 'd', // 1, 2, ..., 31,\n    LONG_WEEKDAY = 'EEEE', // Friday\n\n    // TIME\n    SHORT_TIME_WITH_PERIOD = `h:mm aa`, // 2:44 PM\n    SHORT_TIME_WITHOUT_PERIOD = 'H:mm', // 14:45\n    EXACT_TIME_WITH_PERIOD = 'h:mm:ss aa', // 2:05:11 PM\n    EXACT_TIME_WITHOUT_PERIOD = 'H:mm:ss', // 14:05:11\n\n    // DATE\n    LONG_DATE = 'LLLL dd, yyyy', // June 30, 2023\n    SHORT_DATE = 'LLL dd, yyyy', // Jun 30, 2023\n    FULL_DATE_EXACT_TIME_WITH_PERIOD = `${SHORT_DATE}, h:mm:ss aa`, // June 30, 2023, 2:54:10 PM\n    FULL_DATE_EXACT_TIME_WITHOUT_PERIOD = `${SHORT_DATE}, H:mm:ss`, // June 30, 2023, 14:54:42\n    FULL_DATE_EXACT_TIME_WITH_TIMEZONE_AND_PERIOD = `${SHORT_DATE}, h:mm:ss aa O`, // June 30, 2023, 2:56:07 PM GMT+2\n    FULL_DATE_EXACT_TIME_WITH_TIMEZONE_AND_WITHOUT_PERIOD = `${SHORT_DATE}, H:mm:ss O`, // June 30, 2023, 14:56:28 GMT+2\n    FULL_DATE_TIME_WITH_PERIOD = `${SHORT_DATE}, h:mm aa`, // Jun 30, 2023, 2:48 PM\n    FULL_DATE_TIME_WITH_TIMEZONE_AND_PERIOD = `${SHORT_DATE}, h:mm aa O`, // Jun 30, 2023, 2:44 PM GMT+2\n    FULL_DATE_TIME_WITHOUT_PERIOD = `${SHORT_DATE}, H:mm`, // Jun 30, 2023, 14:48\n    FULL_DATE_TIME_WITH_TIMEZONE_AND_WITHOUT_PERIOD = `${SHORT_DATE}, H:mm O`, // Jun 30, 2023, 14:43 GMT+2\n}\n\nexport interface BentoDateProps {\n    /**\n     * The date to format. The data can be supplied as:\n     * - a Date object.\n     * - a number of milliseconds elapsed since the epoch.\n     * - a date string e.g. '2023-07-31T10:55:22+02:00'.\n     */\n    date?: Date | number | string | null;\n    /**\n     * The string format of the date to be displayed\n     */\n    format?: BentoDateFormat | `${BentoDateFormat}`;\n    /**\n     * Disable the default typography for the component. Only use this when the component is inside another typography\n     */\n    disableTypography?: boolean;\n}\n","<template>\n    <div class=\"b-date\">\n        <bento-typography v-if=\"!disableTypography\" class=\"b-date__label\" el=\"span\" variant=\"body\" strong>\n            <time :datetime=\"dateTime\">{{ formattedDate }}</time>\n        </bento-typography>\n        <time v-else :datetime=\"dateTime\">{{ formattedDate }}</time>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed } from 'vue';\n    import { BentoDateFormat, type BentoDateProps } from './date.types';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { BentoTypography } from '@/components/typography';\n\n    const props = defineProps({\n  date: { default: null },\n  format: { default: BentoDateFormat.FULL_DATE_EXACT_TIME_WITHOUT_PERIOD },\n  disableTypography: { type: Boolean, default: false }\n});\n\n    const { locale } = useI18n(undefined, true);\n\n    /**\n     * This is a reverse mapping of the BentoDateFormat enum.\n     * It allows us to get the key of the enum by its value, which is then used to look up the\n     * corresponding formatting options in `BentoDateFormatPresets`.\n     */\n    const bentoDateFormatKeyValuePairs = Object.entries(BentoDateFormat).reduce<\n        Record<BentoDateFormat, keyof typeof BentoDateFormat>\n    >(\n        (acc, [key, value]) => {\n            acc[value.toString()] = key;\n            return acc;\n        },\n        {} as Record<BentoDateFormat, keyof typeof BentoDateFormat>\n    );\n\n    const datePropAsDateObject = computed(() => {\n        if (!props.date) {\n            return null;\n        }\n\n        return props.date instanceof Date ? props.date : new Date(props.date);\n    });\n\n    const dateTime = computed(() =>\n        datePropAsDateObject.value && !Number.isNaN(datePropAsDateObject.value.getTime())\n            ? datePropAsDateObject.value.toISOString()\n            : undefined\n    );\n\n    const formattedDate = computed(() => {\n        if (!datePropAsDateObject.value || Number.isNaN(datePropAsDateObject.value.getTime())) {\n            return '';\n        }\n\n        const formatKeyEntry = bentoDateFormatKeyValuePairs?.[props.format];\n\n        let dateFormat: Intl.DateTimeFormatOptions | undefined = undefined;\n        // Translate the key of the enum to the Intl.DateTimeFormatOptions configuration object\n        if (formatKeyEntry && BentoDateFormatPresets?.[formatKeyEntry]) {\n            dateFormat = BentoDateFormatPresets?.[formatKeyEntry];\n        }\n        return new Intl.DateTimeFormat(locale.value, dateFormat).format(datePropAsDateObject.value);\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * The format presets to use when being supplied with a key name in BentoDateFormat.\n     * They translate to configuration options that are used in the Intl.DateTimeFormat function\n     *\n     * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat#using_options\n     */\n    const BentoDateFormatPresets: { [key in keyof typeof BentoDateFormat]: Intl.DateTimeFormatOptions } = {\n        SHORT_MONTH: {\n            month: 'short',\n        },\n        DAY_OF_MONTH: {\n            day: 'numeric',\n        },\n        LONG_WEEKDAY: {\n            weekday: 'long',\n        },\n        SHORT_TIME_WITH_PERIOD: {\n            hour: 'numeric',\n            minute: 'numeric',\n            hour12: true,\n        },\n        SHORT_TIME_WITHOUT_PERIOD: {\n            hour: 'numeric',\n            minute: 'numeric',\n            hour12: false,\n        },\n        EXACT_TIME_WITH_PERIOD: {\n            hour: 'numeric',\n            minute: 'numeric',\n            second: 'numeric',\n            hour12: true,\n        },\n        EXACT_TIME_WITHOUT_PERIOD: {\n            hour: 'numeric',\n            minute: 'numeric',\n            second: 'numeric',\n            hour12: false,\n        },\n        LONG_DATE: {\n            year: 'numeric',\n            month: 'long',\n            day: 'numeric',\n        },\n        SHORT_DATE: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n        },\n        FULL_DATE_TIME_WITH_PERIOD: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n            hour: 'numeric',\n            minute: 'numeric',\n            hour12: true,\n        },\n        FULL_DATE_TIME_WITHOUT_PERIOD: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n            hour: 'numeric',\n            minute: 'numeric',\n            hour12: false,\n        },\n        FULL_DATE_EXACT_TIME_WITH_PERIOD: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n            hour: 'numeric',\n            minute: 'numeric',\n            second: 'numeric',\n            hour12: true,\n        },\n        FULL_DATE_EXACT_TIME_WITHOUT_PERIOD: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n            hour: '2-digit',\n            minute: '2-digit',\n            second: '2-digit',\n            hour12: false,\n        },\n        FULL_DATE_TIME_WITH_TIMEZONE_AND_PERIOD: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n            hour: 'numeric',\n            minute: 'numeric',\n            hour12: true,\n            timeZoneName: 'short',\n        },\n        FULL_DATE_TIME_WITH_TIMEZONE_AND_WITHOUT_PERIOD: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n            hour: 'numeric',\n            minute: 'numeric',\n            hour12: false,\n            timeZoneName: 'short',\n        },\n        FULL_DATE_EXACT_TIME_WITH_TIMEZONE_AND_PERIOD: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n            hour: 'numeric',\n            minute: 'numeric',\n            second: 'numeric',\n            hour12: true,\n            timeZoneName: 'short',\n        },\n        FULL_DATE_EXACT_TIME_WITH_TIMEZONE_AND_WITHOUT_PERIOD: {\n            year: 'numeric',\n            month: 'short',\n            day: 'numeric',\n            hour: 'numeric',\n            minute: 'numeric',\n            second: 'numeric',\n            hour12: false,\n            timeZoneName: 'short',\n        },\n    };\n\n    /**\n     * A Date component is used to display a formatted date value.\n     *\n     * @example\n     * import { BentoDate } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoDate },\n     *     template: `\n     *          <bento-date :date=\"dateObject\" :format=\"BentoDateFormat.LONG_DATE\"/>\n     *     `\n     * }\n     */\n    export default {\n        name: 'bento-date',\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./date.scss\" />\n"],"names":["BentoDateFormat","BentoDateFormat2","BentoDateFormatPresets","__default__","locale","useI18n","bentoDateFormatKeyValuePairs","acc","key","value","datePropAsDateObject","computed","props","dateTime","formattedDate","formatKeyEntry","dateFormat"],"mappings":"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"}

package/dist/chunks/{dialog-page.Bct3zOQO.js → dialog-page.DORdXmEm.js}

@@ -1,9 +1,9 @@
 import { defineComponent as J, useSlots as M, ref as _, computed as n, inject as O, watch as P, nextTick as h, onMounted as U, onUnmounted as z } from "vue";
-import { B as K } from "./button.DII5Ifwa.js";
+import { B as K } from "./button.tsTeQRcP.js";
 import { A as Y } from "./arrow-left.BBflhjQa.js";
 import { u as $ } from "./use-has-slot.C9lQZ6nz.js";
 import { u as X } from "./index.CPOlyau9.js";
-import { i as Z } from "./typography.D1OZJbEa.js";
+import { i as Z } from "./typography.Cd386LC_.js";
 import { D as q, a as Q, B as G } from "./dialog-page.keys.Dym9e6k3.js";
 import { c as W } from "./index.CL3TXc0a.js";
 import { n as ee } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
@@ -130,4 +130,4 @@ const me = ie.exports;
 export {
   me as D
 };
-//# sourceMappingURL=dialog-page.Bct3zOQO.js.map
+//# sourceMappingURL=dialog-page.DORdXmEm.js.map

package/dist/chunks/{dialog-page.Bct3zOQO.js.map → dialog-page.DORdXmEm.js.map}

@@ -1 +1 @@
-{"version":3,"file":"dialog-page.Bct3zOQO.js","sources":["../../src/components/internal/dialog-page/dialog-page.vue"],"sourcesContent":["<template>\n    <Transition :name=\"animation\" mode=\"out-in\" @after-leave=\"updateAnimation\" @leave=\"startAnimation\">\n        <div v-if=\"isOpen && showPage\" class=\"b-dialog-page\" :class=\"computedClasses\">\n            <div v-if=\"hasSlot('header')\" class=\"b-dialog-page__header\" :class=\"headerConditionalClasses\">\n                <div\n                    v-if=\"showBackButton\"\n                    class=\"b-dialog-page__back-button\"\n                    :style=\"backButtonStyling\"\n                    data-testid=\"back-button\"\n                >\n                    <bento-button variant=\"tertiary\" @click=\"goToPreviousPage(previousPage)\">\n                        <arrow-left-icon :svg-title=\"t('goToPreviousPage')\" />\n                    </bento-button>\n                </div>\n                <slot name=\"header\"></slot>\n            </div>\n            <div\n                v-if=\"hasSlot('content')\"\n                ref=\"contentElement\"\n                class=\"b-dialog-page__content\"\n                :tabindex=\"isScrollable ? 0 : null\"\n                @scroll=\"onScroll\"\n            >\n                <slot name=\"content\" />\n            </div>\n            <div v-if=\"hasSlot('footer')\" class=\"b-dialog-page__footer\" :class=\"footerConditionalClasses\">\n                <slot name=\"footer\" />\n            </div>\n        </div>\n    </Transition>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, inject, nextTick, onMounted, onUnmounted, type PropType, ref, useSlots, watch } from 'vue';\n\n    import { BentoButton } from '@/components/button';\n    import ArrowLeftIcon from '@adyen/ui-assets-icons-16/vue/arrow-left';\n\n    import { useHasSlot } from '@/composables/use-has-slot/use-has-slot';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { isDevelopmentEnviroment } from '@/utils/ts/dev-environment';\n\n    import {\n        BentoDialogPageAnimation,\n        type BentoDialogPageConfigData,\n        type BentoDialogPageRegisterPage,\n    } from './dialog-page.types';\n    import type { CSSProperties } from 'vue/types/jsx.d.ts';\n\n    import { DIALOG_PAGE_CONFIG_INJECTION_KEY, DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY } from './dialog-page.keys';\n\n    import messages from './messages.json';\n    import { useScroll } from '@vueuse/core';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const props = defineProps({\n        /**\n         * Sets `position: absolute` on the dialog page root element.\n         * Enabled by default as it is used by default in most places.\n         * Inspector requires it to not be absolute positioned.\n         * @default true\n         */\n        absolutePosition: {\n            type: Boolean,\n            default: true,\n        },\n\n        /**\n         * Show header and actions border\n         */\n        alwaysShowBorder: {\n            type: Boolean,\n            default: false,\n        },\n\n        /**\n         * Pass custom styling to the back button to position it correctly with the header slot\n         */\n        backButtonStyling: { type: Object as PropType<CSSProperties>, default: null },\n\n        /**\n         * Identifier of the page, used with activePage prop to handle navigation\n         */\n        pageId: {\n            type: String,\n            default: undefined,\n        },\n\n        /**\n         * ID of the page for the back button to navigate to. Only use it to overwrite the default back behavior\n         * Used when the back button should not take the user to the natural previous page\n         * Set to `null` to hide back button in the page\n         */\n        previousPage: {\n            type: String,\n            default: undefined,\n        },\n    });\n\n    const emit = defineEmits([\"animationend\"]);\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n    // Refs\n    const contentElement = ref<HTMLDivElement>(null);\n    const hasScroll = ref(false);\n    const isMounted = ref(false);\n\n    const { arrivedState, measure } = useScroll(contentElement);\n\n    // Logic to choose which page is active/shown\n    const showPage = computed(() => (activePage.value ? activePage.value === props.pageId : true));\n\n    const computedClasses = computed(() => ({\n        'b-dialog-page--absolute-position': props.absolutePosition,\n    }));\n\n    // Scrolling styling logic\n    const headerConditionalClasses = computed(() => ({\n        'b-dialog-page__header--with-border': props.alwaysShowBorder || (hasScroll.value && !arrivedState.top),\n    }));\n\n    const footerConditionalClasses = computed(() => ({\n        'b-dialog-page__footer--with-border': props.alwaysShowBorder || (hasScroll.value && !arrivedState.bottom),\n    }));\n\n    const isScrollable = computed(() => !(arrivedState.bottom && arrivedState.top));\n\n    const onScroll = () => {\n        if (!contentElement.value) {\n            return;\n        }\n    };\n\n    const calculateScroll = async watchedValue => {\n        if (!watchedValue) {\n            return;\n        }\n        // Wait for content to be rendered to be able to calculate the height\n        await nextTick();\n        if (!isMounted.value) {\n            return;\n        }\n        // Refresh the scroll position after the content is rendered so isScrollable can apply tabindex to the content.\n        measure();\n        hasScroll.value = contentElement.value && contentElement.value.scrollHeight > contentElement.value.clientHeight;\n    };\n\n    const { activePage, animation, isAnimationActive, isOpen, pages, previousPages, updatePage } =\n        inject<BentoDialogPageConfigData>(DIALOG_PAGE_CONFIG_INJECTION_KEY);\n\n    watch(() => isOpen.value, calculateScroll, { immediate: true });\n    watch(() => showPage.value, calculateScroll, { immediate: true });\n\n    // Logic to determine whether the back button should be shown on the page\n    const showBackButton = computed(() => {\n        if (props.previousPage) {\n            return true;\n        }\n        if (props.previousPage === null) {\n            return false;\n        }\n        return hasPreviousPages.value && showPage.value;\n    });\n\n    // Animation\n    const updateAnimation = () => {\n        animation.value = BentoDialogPageAnimation.TRANSITION_LEVEL_DEEPER;\n        if (isAnimationActive) {\n            isAnimationActive.value = false;\n        }\n\n        emit('animationend');\n    };\n\n    const startAnimation = () => {\n        if (isAnimationActive) {\n            isAnimationActive.value = true;\n        }\n    };\n\n    // Previous page logic\n    const hasPreviousPages = computed(() => previousPages.value.length > 1);\n    const lastPage = computed(() => previousPages.value[previousPages.value.length - 1]);\n    const isActivePageValid = computed(() => pages.value.some(page => page === activePage.value));\n\n    const goToPreviousPage = async (page: string) => {\n        if (page) {\n            const index = previousPages.value.indexOf(page);\n            if (index !== -1) {\n                previousPages.value = previousPages.value.slice(0, index + 1);\n            } else {\n                previousPages.value = [page];\n            }\n        } else {\n            previousPages.value.pop();\n        }\n\n        animation.value = BentoDialogPageAnimation.TRANSITION_LEVEL_UPPER;\n        await nextTick();\n        if (!isMounted.value) {\n            return;\n        }\n        updatePage(lastPage.value);\n    };\n\n    // Add new page to the previousPage array to keep track of user navigation\n    watch(\n        () => activePage.value,\n        async () => {\n            await nextTick();\n            if (!isMounted.value || !isOpen.value) {\n                return;\n            }\n\n            if (!!activePage.value && !isActivePageValid.value) {\n                if (isDevelopmentEnviroment) {\n                    // eslint-disable-next-line no-console\n                    console.error(\n                        `The activePage passed \"${activePage.value}\" does not match the id of any of the pages`\n                    );\n                    return;\n                }\n            }\n\n            if (activePage.value !== lastPage.value) {\n                previousPages.value.push(activePage.value);\n            }\n        },\n        { immediate: true }\n    );\n\n    // Register page to parent component and inject data from parent component\n    const registerPage = inject<BentoDialogPageRegisterPage>(DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY);\n    const { unregisterPage } = registerPage(props.pageId);\n\n    onMounted(() => {\n        isMounted.value = true;\n        // Recalculate on mount because the initial useScroll measurement can run before the content is fully sized.\n        // Without this, a scrollable content container does not receive tabindex until the user scrolls.\n        calculateScroll(true);\n    });\n\n    // Unregister page on unmounting the page\n    onUnmounted(() => {\n        isMounted.value = false;\n        unregisterPage();\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * DialogPage is an internal component used to render different pages of dialog components (Modal, ModalFullscreen and Sidepanel)\n     *\n     * @example\n     * import { DialogPage } from '@/internal';\n     *\n     * export default {\n     *     components: { DialogPage },\n     *     template: `\n     *          <dialog-page pageId='step1' always-show-border>\n     *              <template #header>Header</template>\n     *              <template #content>Content</template>\n     *              <template #footer>Footer</template>\n     *          </dialog-page>\n     *     `\n     * }\n     */\n    export default {\n        i18n: { messages },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./dialog-page.scss\" />\n"],"names":["__default__","messages","slots","useSlots","hasSlot","useHasSlot","t","useI18n","contentElement","ref","hasScroll","isMounted","arrivedState","measure","useScroll","showPage","computed","activePage","props","computedClasses","headerConditionalClasses","footerConditionalClasses","isScrollable","onScroll","calculateScroll","watchedValue","nextTick","animation","isAnimationActive","isOpen","pages","previousPages","updatePage","inject","DIALOG_PAGE_CONFIG_INJECTION_KEY","watch","showBackButton","hasPreviousPages","updateAnimation","BentoDialogPageAnimation","emit","startAnimation","lastPage","isActivePageValid","page","goToPreviousPage","index","isDevelopmentEnviroment","registerPage","DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY","unregisterPage","onMounted","onUnmounted"],"mappings":"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"}
+{"version":3,"file":"dialog-page.DORdXmEm.js","sources":["../../src/components/internal/dialog-page/dialog-page.vue"],"sourcesContent":["<template>\n    <Transition :name=\"animation\" mode=\"out-in\" @after-leave=\"updateAnimation\" @leave=\"startAnimation\">\n        <div v-if=\"isOpen && showPage\" class=\"b-dialog-page\" :class=\"computedClasses\">\n            <div v-if=\"hasSlot('header')\" class=\"b-dialog-page__header\" :class=\"headerConditionalClasses\">\n                <div\n                    v-if=\"showBackButton\"\n                    class=\"b-dialog-page__back-button\"\n                    :style=\"backButtonStyling\"\n                    data-testid=\"back-button\"\n                >\n                    <bento-button variant=\"tertiary\" @click=\"goToPreviousPage(previousPage)\">\n                        <arrow-left-icon :svg-title=\"t('goToPreviousPage')\" />\n                    </bento-button>\n                </div>\n                <slot name=\"header\"></slot>\n            </div>\n            <div\n                v-if=\"hasSlot('content')\"\n                ref=\"contentElement\"\n                class=\"b-dialog-page__content\"\n                :tabindex=\"isScrollable ? 0 : null\"\n                @scroll=\"onScroll\"\n            >\n                <slot name=\"content\" />\n            </div>\n            <div v-if=\"hasSlot('footer')\" class=\"b-dialog-page__footer\" :class=\"footerConditionalClasses\">\n                <slot name=\"footer\" />\n            </div>\n        </div>\n    </Transition>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, inject, nextTick, onMounted, onUnmounted, type PropType, ref, useSlots, watch } from 'vue';\n\n    import { BentoButton } from '@/components/button';\n    import ArrowLeftIcon from '@adyen/ui-assets-icons-16/vue/arrow-left';\n\n    import { useHasSlot } from '@/composables/use-has-slot/use-has-slot';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { isDevelopmentEnviroment } from '@/utils/ts/dev-environment';\n\n    import {\n        BentoDialogPageAnimation,\n        type BentoDialogPageConfigData,\n        type BentoDialogPageRegisterPage,\n    } from './dialog-page.types';\n    import type { CSSProperties } from 'vue/types/jsx.d.ts';\n\n    import { DIALOG_PAGE_CONFIG_INJECTION_KEY, DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY } from './dialog-page.keys';\n\n    import messages from './messages.json';\n    import { useScroll } from '@vueuse/core';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const props = defineProps({\n        /**\n         * Sets `position: absolute` on the dialog page root element.\n         * Enabled by default as it is used by default in most places.\n         * Inspector requires it to not be absolute positioned.\n         * @default true\n         */\n        absolutePosition: {\n            type: Boolean,\n            default: true,\n        },\n\n        /**\n         * Show header and actions border\n         */\n        alwaysShowBorder: {\n            type: Boolean,\n            default: false,\n        },\n\n        /**\n         * Pass custom styling to the back button to position it correctly with the header slot\n         */\n        backButtonStyling: { type: Object as PropType<CSSProperties>, default: null },\n\n        /**\n         * Identifier of the page, used with activePage prop to handle navigation\n         */\n        pageId: {\n            type: String,\n            default: undefined,\n        },\n\n        /**\n         * ID of the page for the back button to navigate to. Only use it to overwrite the default back behavior\n         * Used when the back button should not take the user to the natural previous page\n         * Set to `null` to hide back button in the page\n         */\n        previousPage: {\n            type: String,\n            default: undefined,\n        },\n    });\n\n    const emit = defineEmits([\"animationend\"]);\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n    // Refs\n    const contentElement = ref<HTMLDivElement>(null);\n    const hasScroll = ref(false);\n    const isMounted = ref(false);\n\n    const { arrivedState, measure } = useScroll(contentElement);\n\n    // Logic to choose which page is active/shown\n    const showPage = computed(() => (activePage.value ? activePage.value === props.pageId : true));\n\n    const computedClasses = computed(() => ({\n        'b-dialog-page--absolute-position': props.absolutePosition,\n    }));\n\n    // Scrolling styling logic\n    const headerConditionalClasses = computed(() => ({\n        'b-dialog-page__header--with-border': props.alwaysShowBorder || (hasScroll.value && !arrivedState.top),\n    }));\n\n    const footerConditionalClasses = computed(() => ({\n        'b-dialog-page__footer--with-border': props.alwaysShowBorder || (hasScroll.value && !arrivedState.bottom),\n    }));\n\n    const isScrollable = computed(() => !(arrivedState.bottom && arrivedState.top));\n\n    const onScroll = () => {\n        if (!contentElement.value) {\n            return;\n        }\n    };\n\n    const calculateScroll = async watchedValue => {\n        if (!watchedValue) {\n            return;\n        }\n        // Wait for content to be rendered to be able to calculate the height\n        await nextTick();\n        if (!isMounted.value) {\n            return;\n        }\n        // Refresh the scroll position after the content is rendered so isScrollable can apply tabindex to the content.\n        measure();\n        hasScroll.value = contentElement.value && contentElement.value.scrollHeight > contentElement.value.clientHeight;\n    };\n\n    const { activePage, animation, isAnimationActive, isOpen, pages, previousPages, updatePage } =\n        inject<BentoDialogPageConfigData>(DIALOG_PAGE_CONFIG_INJECTION_KEY);\n\n    watch(() => isOpen.value, calculateScroll, { immediate: true });\n    watch(() => showPage.value, calculateScroll, { immediate: true });\n\n    // Logic to determine whether the back button should be shown on the page\n    const showBackButton = computed(() => {\n        if (props.previousPage) {\n            return true;\n        }\n        if (props.previousPage === null) {\n            return false;\n        }\n        return hasPreviousPages.value && showPage.value;\n    });\n\n    // Animation\n    const updateAnimation = () => {\n        animation.value = BentoDialogPageAnimation.TRANSITION_LEVEL_DEEPER;\n        if (isAnimationActive) {\n            isAnimationActive.value = false;\n        }\n\n        emit('animationend');\n    };\n\n    const startAnimation = () => {\n        if (isAnimationActive) {\n            isAnimationActive.value = true;\n        }\n    };\n\n    // Previous page logic\n    const hasPreviousPages = computed(() => previousPages.value.length > 1);\n    const lastPage = computed(() => previousPages.value[previousPages.value.length - 1]);\n    const isActivePageValid = computed(() => pages.value.some(page => page === activePage.value));\n\n    const goToPreviousPage = async (page: string) => {\n        if (page) {\n            const index = previousPages.value.indexOf(page);\n            if (index !== -1) {\n                previousPages.value = previousPages.value.slice(0, index + 1);\n            } else {\n                previousPages.value = [page];\n            }\n        } else {\n            previousPages.value.pop();\n        }\n\n        animation.value = BentoDialogPageAnimation.TRANSITION_LEVEL_UPPER;\n        await nextTick();\n        if (!isMounted.value) {\n            return;\n        }\n        updatePage(lastPage.value);\n    };\n\n    // Add new page to the previousPage array to keep track of user navigation\n    watch(\n        () => activePage.value,\n        async () => {\n            await nextTick();\n            if (!isMounted.value || !isOpen.value) {\n                return;\n            }\n\n            if (!!activePage.value && !isActivePageValid.value) {\n                if (isDevelopmentEnviroment) {\n                    // eslint-disable-next-line no-console\n                    console.error(\n                        `The activePage passed \"${activePage.value}\" does not match the id of any of the pages`\n                    );\n                    return;\n                }\n            }\n\n            if (activePage.value !== lastPage.value) {\n                previousPages.value.push(activePage.value);\n            }\n        },\n        { immediate: true }\n    );\n\n    // Register page to parent component and inject data from parent component\n    const registerPage = inject<BentoDialogPageRegisterPage>(DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY);\n    const { unregisterPage } = registerPage(props.pageId);\n\n    onMounted(() => {\n        isMounted.value = true;\n        // Recalculate on mount because the initial useScroll measurement can run before the content is fully sized.\n        // Without this, a scrollable content container does not receive tabindex until the user scrolls.\n        calculateScroll(true);\n    });\n\n    // Unregister page on unmounting the page\n    onUnmounted(() => {\n        isMounted.value = false;\n        unregisterPage();\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * DialogPage is an internal component used to render different pages of dialog components (Modal, ModalFullscreen and Sidepanel)\n     *\n     * @example\n     * import { DialogPage } from '@/internal';\n     *\n     * export default {\n     *     components: { DialogPage },\n     *     template: `\n     *          <dialog-page pageId='step1' always-show-border>\n     *              <template #header>Header</template>\n     *              <template #content>Content</template>\n     *              <template #footer>Footer</template>\n     *          </dialog-page>\n     *     `\n     * }\n     */\n    export default {\n        i18n: { messages },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./dialog-page.scss\" />\n"],"names":["__default__","messages","slots","useSlots","hasSlot","useHasSlot","t","useI18n","contentElement","ref","hasScroll","isMounted","arrivedState","measure","useScroll","showPage","computed","activePage","props","computedClasses","headerConditionalClasses","footerConditionalClasses","isScrollable","onScroll","calculateScroll","watchedValue","nextTick","animation","isAnimationActive","isOpen","pages","previousPages","updatePage","inject","DIALOG_PAGE_CONFIG_INJECTION_KEY","watch","showBackButton","hasPreviousPages","updateAnimation","BentoDialogPageAnimation","emit","startAnimation","lastPage","isActivePageValid","page","goToPreviousPage","index","isDevelopmentEnviroment","registerPage","DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY","unregisterPage","onMounted","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;GA+QIA,KAAA;AAAA,EAAe,MAAA,EAAA,UAAAC,GAAA;AAEf;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBA3KAC,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GACA,EAAA,GAAAI,EAAA,IAAAC,EAAA,GAGAC,IAAAC,EAAA,IAAA,GACAC,IAAAD,EAAA,EAAA,GACAE,IAAAF,EAAA,EAAA,GAEA,EAAA,cAAAG,GAAA,SAAAC,EAAA,IAAAC,EAAAN,CAAA,GAGAO,IAAAC,EAAA,MAAAC,EAAA,QAAAA,EAAA,UAAAC,EAAA,SAAA,EAAA,GAEAC,IAAAH,EAAA,OAAA;AAAA,MAAwC,oCAAAE,EAAA;AAAA,IACM,EAAA,GAI9CE,IAAAJ,EAAA,OAAA;AAAA,MAAiD,sCAAAE,EAAA,oBAAAR,EAAA,SAAA,CAAAE,EAAA;AAAA,IACqD,EAAA,GAGtGS,IAAAL,EAAA,OAAA;AAAA,MAAiD,sCAAAE,EAAA,oBAAAR,EAAA,SAAA,CAAAE,EAAA;AAAA,IACqD,EAAA,GAGtGU,IAAAN,EAAA,MAAA,EAAAJ,EAAA,UAAAA,EAAA,IAAA,GAEAW,IAAA,MAAA;AACI,MAAAf,EAAA;AAAA,IAEA,GAGJgB,IAAA,OAAAC,MAAA;AACI,MAAAA,MAIA,MAAAC,EAAA,GACAf,EAAA,UAIAE,EAAA,GACAH,EAAA,QAAAF,EAAA,SAAAA,EAAA,MAAA,eAAAA,EAAA,MAAA;AAAA,IAAmG,GAGvG,EAAA,YAAAS,GAAA,WAAAU,GAAA,mBAAAC,GAAA,QAAAC,GAAA,OAAAC,GAAA,eAAAC,GAAA,YAAAC,EAAA,IAAAC,EAAAC,CAAA;AAGA,IAAAC,EAAA,MAAAN,EAAA,OAAAL,GAAA,EAAA,WAAA,GAAA,CAAA,GACAW,EAAA,MAAApB,EAAA,OAAAS,GAAA,EAAA,WAAA,GAAA,CAAA;AAGA,UAAAY,IAAApB,EAAA,MACIE,EAAA,eACI,KAEJA,EAAA,iBAAA,OACI,KAEJmB,EAAA,SAAAtB,EAAA,KAA0C,GAI9CuB,IAAA,MAAA;AACI,MAAAX,EAAA,QAAAY,EAAA,yBACAX,MACIA,EAAA,QAAA,KAGJY,EAAA,cAAA;AAAA,IAAmB,GAGvBC,IAAA,MAAA;AACI,MAAAb,MACIA,EAAA,QAAA;AAAA,IACJ,GAIJS,IAAArB,EAAA,MAAAe,EAAA,MAAA,SAAA,CAAA,GACAW,IAAA1B,EAAA,MAAAe,EAAA,MAAAA,EAAA,MAAA,SAAA,CAAA,CAAA,GACAY,IAAA3B,EAAA,MAAAc,EAAA,MAAA,KAAA,CAAAc,MAAAA,MAAA3B,EAAA,KAAA,CAAA,GAEA4B,IAAA,OAAAD,MAAA;AACI,UAAAA,GAAA;AACI,cAAAE,IAAAf,EAAA,MAAA,QAAAa,CAAA;AACA,QAAAE,MAAA,KACIf,EAAA,QAAAA,EAAA,MAAA,MAAA,GAAAe,IAAA,CAAA,IAEAf,EAAA,QAAA,CAAAa,CAAA;AAAA,MACJ;AAEA,QAAAb,EAAA,MAAA,IAAA;AAKJ,MAFAJ,EAAA,QAAAY,EAAA,wBACA,MAAAb,EAAA,GACAf,EAAA,SAGAqB,EAAAU,EAAA,KAAA;AAAA,IAAyB;AAI7B,IAAAP;AAAA,MAAA,MAAAlB,EAAA;AAAA,MACqB,YAAA;AAGb,YADA,MAAAS,EAAA,GACA,GAAAf,EAAA,SAAA,CAAAkB,EAAA,QAIA;AAAA,cAAAZ,EAAA,SAAA,CAAA0B,EAAA,SACII,GAAA;AAEI,oBAAA;AAAA,cAAQ,0BAAA9B,EAAA,KAAA;AAAA,YACsC;AAE9C;AAAA,UAAA;AAIR,UAAAA,EAAA,UAAAyB,EAAA,SACIX,EAAA,MAAA,KAAAd,EAAA,KAAA;AAAA;AAAA,MACJ;AAAA,MACJ,EAAA,WAAA,GAAA;AAAA,IACkB;AAItB,UAAA+B,IAAAf,EAAAgB,CAAA,GACA,EAAA,gBAAAC,EAAA,IAAAF,EAAA9B,EAAA,MAAA;AAEA,WAAAiC,EAAA,MAAA;AACI,MAAAxC,EAAA,QAAA,IAGAa,EAAA,EAAA;AAAA,IAAoB,CAAA,GAIxB4B,EAAA,MAAA;AACI,MAAAzC,EAAA,QAAA,IACAuC,EAAA;AAAA,IAAe,CAAA;;;;;;;;;;;;;;;;;"}