@adyen/bento-vue2 2.0.1 → 2.1.0

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

@@ -1 +0,0 @@
-{"version":3,"file":"date-range-picker.CqixIJxG.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            @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            @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([\"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                        }\"\n                        class=\"b-date-range-picker-calendar__form-input\"\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                        }\"\n                        class=\"b-date-range-picker-calendar__form-input\"\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                :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 } 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         * 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\n    const defaultGranularity = computed(() => (props.variant === 'month' ? 'monthly' : 'daily'));\n    const hasNoCalendars = computed(() => props.numberOfMonths === 0);\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(internalRangeDate.endDate, endOfDay(internalRangeDate.endDate))) &&\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: props.dateFormData.startTime,\n        endTime: props.dateFormData.endTime,\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 onDateInput = (selectedRange: BentoDateRangePickerValue) => {\n        dateTextInput.startTime = dateToTimeInputString(\n            props.min && props.allowTimeInput && isSameDay(props.min, selectedRange.startDate)\n                ? props.min\n                : startOfDay(selectedRange.startDate)\n        );\n        dateTextInput.endTime = dateToTimeInputString(\n            props.max && props.allowTimeInput && isSameDay(props.max, selectedRange.endDate)\n                ? props.max\n                : endOfDay(selectedRange.endDate)\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    /**\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 = dateToTimeInputString(newStartDate);\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 = dateToTimeInputString(endOfDay(newEndDate));\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 newEndDate =\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 newStartDate =\n                date.isRelativeToNow && date.timeDifference\n                    ? new Date(newEndDate.getTime() - date.timeDifference)\n                    : date.startDate;\n\n            // Set Form input Dates\n            dateTextInput.endDate = formatDate(newEndDate);\n            dateTextInput.startDate = formatDate(newStartDate);\n\n            setInternalRange(newStartDate, newEndDate, null, newCustomRangeValue);\n\n            if (props.granularities) {\n                internalRangeDate.granularity = date.granularity || defaultGranularity.value;\n            }\n\n            // Set Form input time to quick select range time\n            dateTextInput.startTime = dateToTimeInputString(newStartDate);\n            dateTextInput.endTime = dateToTimeInputString(newEndDate);\n\n            // Set calendar selection\n            internalRangeDate.startDate = newStartDate;\n            internalRangeDate.endDate = newEndDate;\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</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                :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 { dateToTimeInputString } 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  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    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                return {\n                    ...range,\n                    data: {\n                        ...range.data,\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\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","defaultGranularity","hasNoCalendars","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","setTimeInDateObject","isValidTimeString","isMonthVariant","formatNativeDate","dateToNativeMonthString","dateToNativeDateString","nativeStartDate","nativeEndDate","dateInputType","startDateValue","endDateValue","setTimeInDateRef","time","onDateInput","selectedRange","dateToTimeInputString","emit","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","onGranularityInput","previousValue","toRaw","computedFormContainerClasses","maxRangeMessage","count","key","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","adjustedQuickSelectRanges","timeDiff","dropdownInputAriaLabelledBy","inputContainerRef","inputWrapperRef","isDateRangePickerOpen","inputWrapperWidth","useElementSize","isReadOnly","useFormLayoutFieldLoading","emitValue","useFormFieldEmits","shouldMatchPopoverWidth","internalModelValue","shouldDisplayError","isApplyDisabled","descriptionConditionalClasses","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/draggable.DYKdXdbj.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"draggable.DYKdXdbj.js","sources":["../../src/components/draggable/composables/use-track-keyboard-user/use-track-keyboard-user.ts","../../src/components/draggable/draggable.vue"],"sourcesContent":["import { createGlobalState, useEventListener } from '@vueuse/core';\nimport { ref } from 'vue';\n\nexport const useTrackKeyboardUser = createGlobalState(() => {\n    // 1. Define this OUTSIDE the setup function so it acts as a global singleton\n    const isKeyboardUser = ref(false);\n\n    if (typeof window !== 'undefined') {\n        // Switch to keyboard mode on Tab\n        useEventListener(\n            window,\n            'keydown',\n            e => {\n                if (e.key === 'Tab') {\n                    isKeyboardUser.value = true;\n                }\n            },\n            { capture: true }\n        );\n\n        // Switch back to mouse mode on click/touch\n        useEventListener(\n            window,\n            'mousedown',\n            () => {\n                isKeyboardUser.value = false;\n            },\n            { capture: true }\n        );\n\n        useEventListener(\n            window,\n            'touchstart',\n            () => {\n                isKeyboardUser.value = false;\n            },\n            { capture: true, passive: true }\n        );\n\n        useEventListener(window, 'blur', () => {\n            isKeyboardUser.value = false;\n        });\n    }\n\n    return { isKeyboardUser };\n});\n","<template>\n    <component :is=\"el\" ref=\"containerRef\">\n        <slot\n            v-for=\"(item, index) of items\"\n            :item=\"item\"\n            :index=\"index\"\n            :move-up=\"() => moveItemUp(index)\"\n            :move-right=\"() => moveItemRight(index)\"\n            :move-down=\"() => moveItemDown(index)\"\n            :move-left=\"() => moveItemLeft(index)\"\n            :move-top=\"() => moveItemTop(index)\"\n            :move-bottom=\"() => moveItemBottom(index)\"\n            :disabled-menus=\"disabledMenuItems(index)\"\n            name=\"default\"\n        ></slot>\n        <div class=\"b-draggable__announcement\" role=\"status\" aria-live=\"polite\">\n            {{ announcementMessage }}\n        </div>\n    </component>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, nextTick, ref, watch } from 'vue';\n    import type {\n        BentoDraggableEmits,\n        BentoDraggableItems,\n        BentoDraggableOptions,\n        BentoDraggableProps,\n        BentoDraggableSortableEvent,\n    } from './draggable.types';\n    import { useBentoDraggable } from './composables/use-bento-draggable/use-bento-draggable';\n    import { useDraggableAnnouncement } from './composables/use-draggable-announcement';\n    import { useTrackKeyboardUser } from './composables/use-track-keyboard-user';\n    import { useI18n } from '@/utils/ts/i18n';\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const ALL_CHILDREN_EXCEPT_SCREEN_READER_ELEMENTS = '>:not(.b-draggable__announcement)';\n\n    const props = defineProps({\n  announcement: { default: '' },\n  disableAutoSort: { type: Boolean, default: false },\n  el: { default: 'div' },\n  items: { default: () => [] },\n  options: { default: () => ({}) }\n});\n\n    const emit = defineEmits([\"update:items\"]);\n\n    /**\n     * Reference to the container of the draggable elements.\n     */\n    const containerRef = ref<HTMLElement | null>(null);\n    /**\n     * Indicates if there is an element being dragged inside the container.\n     */\n    const isDragging = ref<boolean>(false);\n\n    /**\n     * Internal copy of items used to track position changes for focus restoration.\n     */\n    const internalItems = ref<BentoDraggableItems>([]);\n\n    /**\n     * Tracks the item being moved via keyboard so focus can be restored to the correct element.\n     */\n    const lastMovedItem = ref<BentoDraggableItems[number] | null>(null);\n\n    const computedOptions = computed<BentoDraggableOptions>(() => {\n        if (!containerRef.value) {\n            return {};\n        }\n\n        return {\n            ...props.options,\n            draggable: props.options?.draggable ?? ALL_CHILDREN_EXCEPT_SCREEN_READER_ELEMENTS,\n            onStart: (event: BentoDraggableSortableEvent) => {\n                isDragging.value = true;\n\n                if (props.options?.onStart) {\n                    props.options?.onStart(event);\n                }\n            },\n            onEnd: (event: BentoDraggableSortableEvent) => {\n                // This is a hack to move the event to the end of the event queue.\n                // cf this issue: https://github.com/SortableJS/Sortable/issues/1184\n                setTimeout(() => {\n                    isDragging.value = false;\n\n                    if (props.options?.onEnd) {\n                        props.options?.onEnd(event);\n                    }\n                });\n            },\n            onSort: (event: BentoDraggableSortableEvent) => {\n                // Always execute the user's custom onSort callback if provided\n                if (props.options?.onSort) {\n                    props.options.onSort(event);\n                    return;\n                }\n\n                // Automatically sync the v-model unless the user explicitly disabled it\n                if (!props.disableAutoSort) {\n                    const { oldIndex, newIndex, from, to } = event;\n\n                    if (\n                        from === to &&\n                        from === containerRef.value &&\n                        oldIndex !== undefined &&\n                        newIndex !== undefined\n                    ) {\n                        moveItem(oldIndex, newIndex);\n                    }\n                }\n            },\n        };\n    });\n\n    /**\n     * Handle reordering announcements for screen readers.\n     */\n    const { announcementMessage, announce } = useDraggableAnnouncement();\n\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n    const { draggableElement } = useBentoDraggable(containerRef, computedOptions);\n\n    // When moving items between sibling `bento-draggable`, the item may be removed, causing the DOM to be destroyed and temporarily lose focus\n    // This is an alternative to query element `:focus-within` as the `:focus-within` will be gone until the other `bento-draggable` adds it into the list\n    const { isKeyboardUser } = useTrackKeyboardUser();\n\n    /**\n     * Focuses the draggable handle button at the given index.\n     * Waits for the next tick to ensure the DOM has been updated before focusing.\n     *\n     * @param index - The index of the item whose handle should receive focus.\n     */\n    const focus = async (index: number) => {\n        await nextTick();\n\n        if (index !== -1 && containerRef.value) {\n            const itemElement = containerRef.value.children[index] as HTMLElement;\n            const button = itemElement?.querySelector<HTMLButtonElement>('.b-draggable-handle button');\n            await nextTick();\n            button?.focus();\n        }\n    };\n\n    /**\n     * Moves an item from one position to another within the list,\n     * emits the updated list, and announces the change for screen readers.\n     *\n     * @param indexOrigin - The current index of the item to move.\n     * @param indexTarget - The desired index to move the item to.\n     */\n    const moveItem = async (indexOrigin: number, indexTarget: number) => {\n        if (\n            indexOrigin < 0 ||\n            indexTarget < 0 ||\n            indexOrigin >= props.items.length ||\n            indexTarget >= props.items.length ||\n            indexOrigin === indexTarget\n        ) {\n            return;\n        }\n\n        const newList = Array.from(props.items as BentoDraggableItems);\n        const [removed] = newList.splice(indexOrigin, 1);\n        newList.splice(indexTarget, 0, removed);\n\n        lastMovedItem.value = removed;\n\n        // Occasionally, there may be race conditions where the index is out-of-date due to the fast drag-and-drop or\n        // other async operations like onEnd > setTimeout.\n        // Filtering out null/undefined values ensures the list remains valid.\n        emit('update:items', newList.filter(Boolean));\n\n        const itemLabel = removed.label;\n\n        const message =\n            props?.announcement ||\n            t('youHaveMovedFromPositionToPosition', {\n                itemLabel,\n                indexOrigin: indexOrigin + 1,\n                indexTarget: indexTarget + 1,\n                total: props.items.length,\n            });\n\n        if (props.announcement !== 'disabled') {\n            announce(message);\n        }\n    };\n\n    const moveItemUp = (index: number) => moveItem(index, index - 1);\n\n    const moveItemDown = (index: number) => moveItem(index, index + 1);\n\n    const moveItemLeft = (index: number) => moveItem(index, index - 1);\n\n    const moveItemRight = (index: number) => moveItem(index, index + 1);\n\n    const moveItemTop = (index: number) => moveItem(index, 0);\n\n    const moveItemBottom = (index: number) => moveItem(index, props.items.length - 1);\n\n    /**\n     * Returns a pre-calculated disabled menus object for the current item.\n     */\n    const disabledMenuItems = (index: number) => {\n        return {\n            up: index === 0,\n            top: index === 0,\n            down: index === props.items.length - 1,\n            bottom: index === props.items.length - 1,\n            left: true,\n            right: true,\n        };\n    };\n\n    /**\n     * Watch for items changes and restore focus automatically\n     */\n    watch(\n        () => props.items,\n        async newItems => {\n            if (!newItems) {\n                return;\n            }\n\n            if (isKeyboardUser.value && newItems.length > 0 && internalItems.value.length > 0) {\n                if (lastMovedItem.value) {\n                    // Within-list reorder: focus the moved item at its new position\n                    const movedItemIndex = newItems.indexOf(lastMovedItem.value);\n\n                    if (movedItemIndex !== -1) {\n                        await focus(movedItemIndex);\n                    }\n\n                    lastMovedItem.value = null;\n                } else if (newItems.length > internalItems.value.length) {\n                    // Cross-list addition: focus the newly added item\n                    const newItemIndex = newItems.findIndex(item => !internalItems.value.includes(item));\n\n                    if (newItemIndex !== -1) {\n                        await focus(newItemIndex);\n                    }\n                }\n            }\n\n            internalItems.value = [...newItems];\n        },\n        { deep: true, immediate: true }\n    );\n\n    defineExpose({\n        /**\n         * A ref to the container DOM element.\n         */\n        containerRef,\n        /**\n         * The underlying SortableJS instance, which provides methods like `toArray()`, `sort()`, and `destroy()`.\n         */\n        draggableElement,\n        /**\n         * A boolean ref that is `true` when an item is being dragged.\n         */\n        isDragging,\n        /**\n         * Announces a message to screen reader users via the live region.\n         */\n        announce,\n        /**\n         * Moves an item from one index to another and emits the updated list.\n         */\n        moveItem,\n        /**\n         * Programmatically focuses the draggable handle button at the given index.\n         */\n        focus,\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Drag and drop container that transforms a list of items into draggable elements.\n     * The library is based on SortableJS.\n     * @see {@link https://github.com/SortableJS/Sortable#readme | SortableJS documentation}\n     *\n     * @example\n     * import { BentoDraggable, BentoDraggableHandle, type BentoDraggableEvents } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoDraggable, BentoDraggableHandle },\n     *     template: `\n     *          <bento-draggable\n     *              v-model=\"items\"\n     *              condensed\n     *              :options=\"{\n     *                  group: 'nested',\n     *                  animation: 150\n     *              }\"\n     *          >\n     *              <template #default=\"{ item, index, moveUp, moveDown }\">\n     *                  <div :key=\"item.id\">\n     *                      <bento-draggable-handle\n     *                          :label=\"item.label\"\n     *                          @move-up=\"moveUp\"\n     *                          @move-down=\"moveDown\"\n     *                      />\n     *                  </div>\n     *              </template>\n     *          </bento-draggable>\n     *     `,\n     *      setup () {\n     *          const items = ref([\n     *              { id: '1', label: 'Item 1' },\n     *              { id: '2', label: 'Item 2' }\n     *          ]);\n     *          return {\n     *              items,\n     *          }\n     *      }\n     * }\n     */\n\n    export default {\n        name: 'bento-draggable',\n        model: { prop: 'items', event: 'update:items' },\n        i18n: { messages },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./draggable.scss\" />\n"],"names":["useTrackKeyboardUser","createGlobalState","isKeyboardUser","ref","useEventListener","e","__default__","messages","ALL_CHILDREN_EXCEPT_SCREEN_READER_ELEMENTS","containerRef","isDragging","internalItems","lastMovedItem","computedOptions","computed","props","event","oldIndex","newIndex","from","to","moveItem","announcementMessage","announce","useDraggableAnnouncement","t","useI18n","draggableElement","useBentoDraggable","focus","index","nextTick","button","indexOrigin","indexTarget","newList","removed","emit","itemLabel","message","moveItemUp","moveItemDown","moveItemLeft","moveItemRight","moveItemTop","moveItemBottom","disabledMenuItems","watch","newItems","movedItemIndex","newItemIndex","item","expose"],"mappings":"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"}