@adyen/bento-vue2 1.49.0 → 1.51.0

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

@@ -0,0 +1 @@
+{"version":3,"file":"date-range-picker.Jysfo6h3.js","sources":["../../../../node_modules/.pnpm/date-fns@2.28.0/node_modules/date-fns/esm/isEqual/index.js","../../../../node_modules/.pnpm/date-fns@2.28.0/node_modules/date-fns/esm/startOfSecond/index.js","../../../../node_modules/.pnpm/date-fns@2.28.0/node_modules/date-fns/esm/isSameSecond/index.js","../../../../node_modules/.pnpm/date-fns@2.28.0/node_modules/date-fns/esm/isToday/index.js","../../../../node_modules/.pnpm/date-fns@2.28.0/node_modules/date-fns/esm/setHours/index.js","../../../../node_modules/.pnpm/date-fns@2.28.0/node_modules/date-fns/esm/setMinutes/index.js","../../../../node_modules/.pnpm/date-fns@2.28.0/node_modules/date-fns/esm/setSeconds/index.js","../../src/components/date-range-picker/utils/date-text-to-start-of-day.ts","../../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/utils/ts/time-input.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.types.ts","../../src/components/date-range-picker/date-range-picker.vue"],"sourcesContent":["import toDate from \"../toDate/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\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 * ### v2.0.0 breaking changes:\n *\n * - [Changes that are common for the whole library](https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#Common-Changes).\n *\n * @param {Date|Number} dateLeft - the first date to compare\n * @param {Date|Number} dateRight - the second date to compare\n * @returns {Boolean} the dates are equal\n * @throws {TypeError} 2 arguments required\n *\n * @example\n * // Are 2 July 2014 06:30:45.000 and 2 July 2014 06:30:45.500 equal?\n * var 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 */\n\nexport default function isEqual(dirtyLeftDate, dirtyRightDate) {\n  requiredArgs(2, arguments);\n  var dateLeft = toDate(dirtyLeftDate);\n  var dateRight = toDate(dirtyRightDate);\n  return dateLeft.getTime() === dateRight.getTime();\n}","import toDate from \"../toDate/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\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 * ### v2.0.0 breaking changes:\n *\n * - [Changes that are common for the whole library](https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#Common-Changes).\n *\n * @param {Date|Number} date - the original date\n * @returns {Date} the start of a second\n * @throws {TypeError} 1 argument required\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 */\n\nexport default function startOfSecond(dirtyDate) {\n  requiredArgs(1, arguments);\n  var date = toDate(dirtyDate);\n  date.setMilliseconds(0);\n  return date;\n}","import startOfSecond from \"../startOfSecond/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\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 * ### v2.0.0 breaking changes:\n *\n * - [Changes that are common for the whole library](https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#Common-Changes).\n *\n * @param {Date|Number} dateLeft - the first date to check\n * @param {Date|Number} dateRight - the second date to check\n * @returns {Boolean} the dates are in the same second (and hour and day)\n * @throws {TypeError} 2 arguments required\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 * var 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 * var 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 * var result = isSameSecond(\n *   new Date(2014, 8, 4, 6, 0, 15),\n *   new Date(2014, 8, 5, 6, 0, 15)\n * )\n * //=> false\n */\n\nexport default function isSameSecond(dirtyDateLeft, dirtyDateRight) {\n  requiredArgs(2, arguments);\n  var dateLeftStartOfSecond = startOfSecond(dirtyDateLeft);\n  var dateRightStartOfSecond = startOfSecond(dirtyDateRight);\n  return dateLeftStartOfSecond.getTime() === dateRightStartOfSecond.getTime();\n}","import isSameDay from \"../isSameDay/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\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 * > ⚠️ Please note that this function is not present in the FP submodule as\n * > it uses `Date.now()` internally hence impure and can't be safely curried.\n *\n * ### v2.0.0 breaking changes:\n *\n * - [Changes that are common for the whole library](https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#Common-Changes).\n *\n * @param {Date|Number} date - the date to check\n * @returns {Boolean} the date is today\n * @throws {TypeError} 1 argument required\n *\n * @example\n * // If today is 6 October 2014, is 6 October 14:00:00 today?\n * var result = isToday(new Date(2014, 9, 6, 14, 0))\n * //=> true\n */\n\nexport default function isToday(dirtyDate) {\n  requiredArgs(1, arguments);\n  return isSameDay(dirtyDate, Date.now());\n}","import toInteger from \"../_lib/toInteger/index.js\";\nimport toDate from \"../toDate/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name setHours\n * @category Hour Helpers\n * @summary Set the hours to the given date.\n *\n * @description\n * Set the hours to the given date.\n *\n * ### v2.0.0 breaking changes:\n *\n * - [Changes that are common for the whole library](https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#Common-Changes).\n *\n * @param {Date|Number} date - the date to be changed\n * @param {Number} hours - the hours of the new date\n * @returns {Date} the new date with the hours set\n * @throws {TypeError} 2 arguments required\n *\n * @example\n * // Set 4 hours to 1 September 2014 11:30:00:\n * var result = setHours(new Date(2014, 8, 1, 11, 30), 4)\n * //=> Mon Sep 01 2014 04:30:00\n */\n\nexport default function setHours(dirtyDate, dirtyHours) {\n  requiredArgs(2, arguments);\n  var date = toDate(dirtyDate);\n  var hours = toInteger(dirtyHours);\n  date.setHours(hours);\n  return date;\n}","import toInteger from \"../_lib/toInteger/index.js\";\nimport toDate from \"../toDate/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name setMinutes\n * @category Minute Helpers\n * @summary Set the minutes to the given date.\n *\n * @description\n * Set the minutes to the given date.\n *\n * ### v2.0.0 breaking changes:\n *\n * - [Changes that are common for the whole library](https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#Common-Changes).\n *\n * @param {Date|Number} date - the date to be changed\n * @param {Number} minutes - the minutes of the new date\n * @returns {Date} the new date with the minutes set\n * @throws {TypeError} 2 arguments required\n *\n * @example\n * // Set 45 minutes to 1 September 2014 11:30:40:\n * const result = setMinutes(new Date(2014, 8, 1, 11, 30, 40), 45)\n * //=> Mon Sep 01 2014 11:45:40\n */\n\nexport default function setMinutes(dirtyDate, dirtyMinutes) {\n  requiredArgs(2, arguments);\n  var date = toDate(dirtyDate);\n  var minutes = toInteger(dirtyMinutes);\n  date.setMinutes(minutes);\n  return date;\n}","import toInteger from \"../_lib/toInteger/index.js\";\nimport toDate from \"../toDate/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name setSeconds\n * @category Second Helpers\n * @summary Set the seconds to the given date.\n *\n * @description\n * Set the seconds to the given date.\n *\n * ### v2.0.0 breaking changes:\n *\n * - [Changes that are common for the whole library](https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#Common-Changes).\n *\n * @param {Date|Number} date - the date to be changed\n * @param {Number} seconds - the seconds of the new date\n * @returns {Date} the new date with the seconds set\n * @throws {TypeError} 2 arguments required\n *\n * @example\n * // Set 45 seconds to 1 September 2014 11:30:40:\n * const result = setSeconds(new Date(2014, 8, 1, 11, 30, 40), 45)\n * //=> Mon Sep 01 2014 11:30:45\n */\n\nexport default function setSeconds(dirtyDate, dirtySeconds) {\n  requiredArgs(2, arguments);\n  var date = toDate(dirtyDate);\n  var seconds = toInteger(dirtySeconds);\n  date.setSeconds(seconds);\n  return date;\n}","import startOfDay from 'date-fns/startOfDay';\n\n/**\n * Parses an ISO date string and returns a Date set to the\n * start of that calendar day (00:00:00) in the system’s local time zone.\n *\n * Uses the numeric Date constructor `new Date(year, monthIndex, day)`\n * which interprets its arguments as local time.\n *\n * @param dateText - A date in `YYYY-MM-DD` format.\n * @returns A `Date` at the local start of the specified day.\n */\nexport function parseDateTextToStartOfDay(dateText?: string) {\n    if (dateText == null) {\n        return startOfDay(new Date());\n    }\n\n    const [year, month, day] = dateText.split('-').map(s => parseInt(s, 10));\n    return new Date(year, month - 1, day);\n}\n","import addDays from 'date-fns/addDays';\nimport addMonths from 'date-fns/addMonths';\nimport endOfDay from 'date-fns/endOfDay';\nimport endOfMonth from 'date-fns/endOfMonth';\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 startOfWeek from 'date-fns/startOfWeek';\nimport subDays from 'date-fns/subDays';\nimport subMonths from 'date-fns/subMonths';\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        let min = startOfDay(minimumDate);\n        let max = endOfDay(maximumDate);\n\n        if (granularity?.type === 'weekly') {\n            if (granularity.earliest) {\n                min = startOfDay(granularity.earliest);\n            } else {\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 {\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 {\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 {\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        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    }>({\n        daily: null,\n        weekly: null,\n        monthly: 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    };\n\n    return {\n        savedRanges,\n\n        saveRange,\n        resetSavedRanges,\n    };\n};\n","import { CalendarGranularityType } from '@/internal';\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        timeDifference?: number;\n    };\n}\n\nexport type DateRangePickerCalendarRangeSelectorItems = Array<DateRangePickerCalendarRangeSelectorItem>;\n","const validDigitRegex = /[\\d]/;\n\nconst hourRegex = /^\\d{2}$/;\nconst minuteRegex = /^\\d{2}:\\d{2}$/;\n\nexport const validateTimeInput = (event: KeyboardEvent) => {\n    const { selectionStart } = event.target as HTMLInputElement;\n\n    const isValidKey = validDigitRegex.test(event.key) || event.key === 'Backspace';\n    const isValidColon = [1, 2, 4, 5].includes(selectionStart) && event.key === ':';\n\n    if (!isValidKey && !isValidColon) {\n        event.preventDefault();\n    }\n};\n\nexport const formatTimeInputValue = (value: string) => {\n    if (!value) {\n        return value;\n    }\n\n    let formattedValue = value;\n\n    // Format if the first value is bigger than 2, because it can't be bigger than 24 hours\n    if (formattedValue.length === 1 && parseInt(value, 10) > 2) {\n        return `0${formattedValue}:`;\n    }\n\n    const [secondToLastDigit, lastDigit] = formattedValue.slice(-2);\n    if ([2, 5].includes(formattedValue.length) && lastDigit === ':') {\n        formattedValue = `${formattedValue.slice(0, formattedValue.length - 2)}0${secondToLastDigit}`;\n    }\n\n    // Add `:` after hour/minute\n    if (hourRegex.test(formattedValue) || minuteRegex.test(formattedValue)) {\n        formattedValue += ':';\n    }\n    return formattedValue;\n};\n","<template>\n    <div class=\"b-date-range-picker-calendar\">\n        <!-- Form -->\n        <div class=\"b-date-range-picker-calendar__form-container\">\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=\"adjustedQuickSelectRanges\"\n                    :aria-label=\"t('customRange')\"\n                    :items=\"quickSelectRangeDefaultItems\"\n                    :value=\"selectedRangeSelectorValue\"\n                    @input=\"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                <div>\n                    <bento-typography stronger el=\"span\" class=\"b-date-range-picker-calendar__label\">\n                        From\n                    </bento-typography>\n                    <div :class=\"formInputWrapperConditionalClasses\">\n                        <bento-input-field\n                            :aria-label=\"t('dateFrom')\"\n                            :value=\"dateTextInput.startDate\"\n                            :error=\"startDateError\"\n                            class=\"b-date-range-picker-calendar__form-input\"\n                            @input=\"onStartDateInput\"\n                            @keydown=\"onDateInputKeyDown\"\n                        >\n                            <template #description>YYYY-MM-DD</template>\n                        </bento-input-field>\n\n                        <bento-input-field\n                            v-if=\"allowTimeInput\"\n                            :aria-label=\"t('timeFrom')\"\n                            :value=\"dateTextInput.startTime\"\n                            :error=\"startTimeError\"\n                            class=\"b-date-range-picker-calendar__form-input\"\n                            @input=\"onStartTimeInput\"\n                            @keydown=\"onTimeInputKeyDown\"\n                        >\n                            <template #description>HH:MM:SS</template>\n                        </bento-input-field>\n                    </div>\n                </div>\n\n                <div>\n                    <bento-typography stronger el=\"span\" class=\"b-date-range-picker-calendar__label\">\n                        To\n                    </bento-typography>\n                    <div :class=\"formInputWrapperConditionalClasses\">\n                        <bento-input-field\n                            class=\"b-date-range-picker-calendar__form-input\"\n                            :aria-label=\"t('dateTo')\"\n                            :value=\"dateTextInput.endDate\"\n                            :error=\"endDateError\"\n                            @input=\"onEndDateInput\"\n                            @keydown=\"onDateInputKeyDown\"\n                        >\n                            <template #description>YYYY-MM-DD</template>\n                        </bento-input-field>\n\n                        <bento-input-field\n                            v-if=\"allowTimeInput\"\n                            :aria-label=\"t('timeTo')\"\n                            :value=\"dateTextInput.endTime\"\n                            :error=\"endTimeError\"\n                            class=\"b-date-range-picker-calendar__form-input\"\n                            @input=\"onEndTimeInput\"\n                            @keydown=\"onTimeInputKeyDown\"\n                        >\n                            <template #description>HH:MM:SS</template>\n                        </bento-input-field>\n                    </div>\n                </div>\n            </div>\n\n            <div v-if=\"hasSlot('actions')\">\n                <slot name=\"actions\" />\n            </div>\n        </div>\n\n        <!-- Calendar -->\n        <div class=\"b-date-range-picker-calendar__calendars-container\">\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                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 lang=\"ts\">\n    import { computed, defineComponent, onMounted, PropType, reactive, ref, toRaw } from 'vue';\n    import { Calendar, CalendarGranularityType } from '@/internal';\n    import { BentoTypography } from '@/components/typography';\n    import { BentoInputField } from '@/components/input-field';\n    import { BentoDropdown } from '@/components/dropdown';\n    import { BentoSegmentedControl, type BentoSegmentedControlItem } from '@/components/segmented-control';\n    import { getDateLocale } from '@/utils/ts/get-date-locale/get-date-locale';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { parseDateTextToStartOfDay } from '../../utils/date-text-to-start-of-day';\n    import { debounce } from '@/utils/ts/debounce';\n    import { useHasSlot } 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 { formatDateInputValue, validateDateInput } from '@/utils/ts/date-input';\n    import {\n        DateRangePickerCalendarEvent,\n        DateRangePickerCalendarFormData,\n        DateRangePickerCalendarRangeSelectorItem,\n        DateRangePickerCalendarRangeSelectorItems,\n    } from './date-range-picker-calendar.types';\n    import type {\n        BentoDateRangePickerGranularityConfig,\n        BentoDateRangePickerValue,\n    } from '../../date-range-picker.types';\n    import { DateFormat } from '@/types';\n    import { formatTimeInputValue, validateTimeInput } from '@/utils/ts/time-input';\n    import endOfDay from 'date-fns/endOfDay';\n    import format from 'date-fns/format';\n    import setHours from 'date-fns/setHours';\n    import setMinutes from 'date-fns/setMinutes';\n    import setSeconds from 'date-fns/setSeconds';\n    import startOfDay from 'date-fns/startOfDay';\n    import messages from './messages.json';\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\n    const FORM_INPUT_DEBOUNCE_TIME = 300;\n    const RANGE_SELECTOR_CUSTOM_RANGE_KEY = 'customRange';\n    const DEFAULT_GRANULARITY = 'daily';\n    type MessageSchema = (typeof messages)['en-US'];\n\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 defineComponent({\n        i18n: { messages },\n        name: 'date-range-picker-calendar',\n        components: {\n            BentoDropdown,\n            BentoInputField,\n            BentoSegmentedControl,\n            BentoTypography,\n            Calendar,\n        },\n        props: {\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: Calendar.props.numberOfMonths,\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        emits: [\n            DateRangePickerCalendarEvent.CUSTOM_RANGE,\n            DateRangePickerCalendarEvent.INPUT,\n            DateRangePickerCalendarEvent.ERROR,\n            DateRangePickerCalendarEvent.FORM_DATE,\n            DateRangePickerCalendarEvent.START_DATE_SELECTED,\n        ],\n        setup(props, { emit, slots }) {\n            const { locale, t } = useI18n<{ message: MessageSchema }>({ messages });\n            const locales = getDateLocale();\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 || DEFAULT_GRANULARITY,\n                      }\n                    : {}),\n            });\n\n            /**\n             * Deserializes a date to transform it to a UTC standard so it can be compared regardless of timezone.\n             * src: https://stackoverflow.com/a/38050824\n             * @param date Date to deserialize/normalize for comparisson\n             */\n            function deserializeDate(date: Date) {\n                return new Date(\n                    date.getUTCFullYear(),\n                    date.getUTCMonth(),\n                    date.getUTCDate(),\n                    date.getUTCHours(),\n                    date.getUTCMinutes(),\n                    date.getUTCSeconds()\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            const selectedRangeSelectorValue = computed(() => {\n                return (\n                    props?.quickSelectRanges?.find(({ value, data }) => {\n                        // Quick filter has no end date\n                        if (!data.endDate) {\n                            return (\n                                value === internalRangeDate.range ||\n                                (isEqual(\n                                    deserializeDate(data.startDate),\n                                    deserializeDate(internalRangeDate.startDate)\n                                ) &&\n                                    isToday(internalRangeDate.endDate))\n                            );\n                        }\n\n                        if (props.allowTimeInput) {\n                            const res =\n                                isSameSecond(\n                                    deserializeDate(data.startDate),\n                                    deserializeDate(internalRangeDate.startDate)\n                                ) &&\n                                isSameSecond(deserializeDate(data.endDate), deserializeDate(internalRangeDate.endDate));\n                            return res;\n                        }\n\n                        if (data.endDate) {\n                            return (\n                                isSameDay(data.startDate, internalRangeDate.startDate) &&\n                                isSameDay(data.endDate, internalRangeDate.endDate)\n                            );\n                        }\n                    })?.value ?? RANGE_SELECTOR_CUSTOM_RANGE_KEY\n                );\n            });\n            const formInputWrapperConditionalClasses = computed(() => ({\n                'b-date-range-picker-calendar__form-input-wrapper': props.allowTimeInput,\n            }));\n            const quickSelectRangeDefaultItems = computed(() => [\n                { label: t('customRange'), value: RANGE_SELECTOR_CUSTOM_RANGE_KEY },\n                ...(adjustedQuickSelectRanges.value ? adjustedQuickSelectRanges.value : []),\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 adjustedQuickSelectRanges = computed<Array<DateRangePickerCalendarRangeSelectorItem>>(\n                () =>\n                    props.quickSelectRanges &&\n                    props.quickSelectRanges.map((range: DateRangePickerCalendarRangeSelectorItem) => ({\n                        ...range,\n                        data: {\n                            ...range.data,\n                            // Adding timeDifference to calculate an up-to-date endDate on range selection\n                            timeDifference: !range.data.endDate\n                                ? new Date(Date.now()).getTime() - range.data.startDate.getTime()\n                                : undefined,\n                        },\n                    }))\n            );\n\n            const { getGranularCalendarLimits } = useGranularMinMaxDate(props);\n\n            const computedMinMax = computed(() =>\n                props.granularities\n                    ? getGranularCalendarLimits(selectedGranularity.value)\n                    : { min: startOfDay(props.min), max: endOfDay(props.max) }\n            );\n\n            const {\n                adjustDateForMonthly,\n                adjustDateForWeekly,\n                adjustStartDateInputForWeekly,\n                adjustEndDateInputForWeekly,\n                adjustStartDateInputForMonthly,\n                adjustEndDateInputForMonthly,\n            } = useGranularityAdjustments(props.firstDayOfWeek);\n            const { savedRanges, saveRange, resetSavedRanges } = useGranularityMemory();\n\n            /**\n             * Format date to a string value in format yyyy-MM-dd\n             * @param {Date} dateToFormat Date to be formatted\n             */\n            const formatDate = (dateToFormat?: Date) => {\n                if (!dateToFormat) {\n                    return '';\n                }\n                return format(dateToFormat, DateFormat.NUMERIC_DATE_YEAR_FIRST, {\n                    locale: locales[locale.value.substring(0, 2)] || locales.enUS,\n                });\n            };\n\n            const formatTime = (dateToFormat?: Date) => {\n                if (!dateToFormat) {\n                    return '';\n                }\n\n                return format(dateToFormat, DateFormat.HOUR_MINUTE_SECONDS, {\n                    locale: locales[locale.value.substring(0, 2)] || locales.enUS,\n                });\n            };\n\n            // Form error flags\n            const startDateError = ref(false);\n            const endDateError = ref(false);\n            const startTimeError = ref(false);\n            const endTimeError = ref(false);\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            // Validate time\n            const isValidTime = (timeText: string) => {\n                // HH:MM:SS regex\n                const timeRegex = /^(?:[01]\\d|2[01234]):(?:[012345]\\d):(?:[012345]\\d)$/;\n                return timeRegex.test(timeText);\n            };\n\n            const setTimeInDate = (date: Date, time: string) => {\n                if (!time || !isValidTime(time)) {\n                    return date;\n                }\n\n                let dateWithTime = new Date(date);\n\n                const [hours, minutes, seconds] = time.split(':');\n                dateWithTime = setHours(dateWithTime, parseInt(hours, 10));\n                dateWithTime = setMinutes(dateWithTime, parseInt(minutes, 10));\n                dateWithTime = setSeconds(dateWithTime, parseInt(seconds, 10));\n                return dateWithTime;\n            };\n\n            const onDateInput = (selectedRange: BentoDateRangePickerValue) => {\n                internalRangeDate.startDate = setTimeInDate(selectedRange.startDate, dateTextInput.startTime);\n                internalRangeDate.endDate = setTimeInDate(selectedRange.endDate, dateTextInput.endTime);\n                // Resetting internal range date when selecting a custom range through the calendar\n                internalRangeDate.range = null;\n\n                if (props.granularities) {\n                    // Reset saved ranges on input\n                    resetSavedRanges();\n                }\n\n                emit(DateRangePickerCalendarEvent.INPUT, {\n                    ...internalRangeDate,\n                    range: selectedRangeSelectorValue.value,\n                });\n            };\n\n            const isValidDate = (dateText: string) => {\n                // Is date selectable\n                const isDateEnabled = (date: Date) => {\n                    // Check if date is between min/max bounds, if there are any\n                    if ((props.min && date <= props.min) || (props.max && date >= props.max)) {\n                        return false;\n                    }\n\n                    // Check if function is set, otherwise all dates are enabled\n                    if (props.isDateDisabled) {\n                        return !props.isDateDisabled(date);\n                    }\n\n                    return true;\n                };\n\n                // YYYY-MM-DD regex\n                const dateRegex = /^\\d{4}-(0?[1-9]|1[012])-(0?[1-9]|[12][0-9]|3[01])$/;\n                // Date matches text regex\n                return dateRegex.test(dateText) && isDateEnabled(new Date(dateText));\n            };\n\n            /**\n             * When mounted, set the input error states to true if the values are not valid\n             */\n            onMounted(() => {\n                if (props.dateFormData.startDate && !isValidDate(props.dateFormData.startDate)) {\n                    startDateError.value = true;\n                } else {\n                    startDateError.value = false;\n                    startTimeError.value = false;\n                }\n\n                if (props.dateFormData.endDate && !isValidDate(props.dateFormData.endDate)) {\n                    endDateError.value = true;\n                } else {\n                    endDateError.value = false;\n                    endTimeError.value = false;\n                }\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 = formatTime(newStartDate);\n                } else if (startTimeError.value) {\n                    // Set the form time if it was previously set\n                    dateTextInput.startTime = props.dateFormData?.startTime;\n                }\n\n                // Reset errors\n                startDateError.value = false;\n                startTimeError.value = false;\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 = formatTime(endOfDay(newEndDate));\n                } else if (endTimeError.value) {\n                    // Set the form time if it was previously set\n                    dateTextInput.endTime = props.dateFormData?.endTime;\n                }\n\n                // Reset errors\n                endDateError.value = false;\n                endTimeError.value = false;\n            };\n\n            const getDate = (keyName: keyof BentoDateRangePickerValue) => {\n                const dateProp = (props.value as BentoDateRangePickerValue)[keyName];\n                if (dateProp) {\n                    return dateProp;\n                }\n\n                if (props.dateFormData[keyName] && isValidDate(props.dateFormData[keyName])) {\n                    return new Date(props.dateFormData[keyName]);\n                }\n\n                return undefined;\n            };\n\n            const validateStartDate = debounce((startDateText: string) => {\n                // Checks for YYYY-MM-DD format\n                if (isValidDate(startDateText)) {\n                    let dateText = startDateText;\n\n                    startDateError.value = false;\n\n                    switch (selectedGranularity.value?.type) {\n                        case 'weekly':\n                            dateText = adjustStartDateInputForWeekly(\n                                startDateText,\n                                formatDate,\n                                computedMinMax.value.min,\n                                computedMinMax.value.max\n                            );\n                            dateTextInput.startDate = dateText;\n                            break;\n                        case 'monthly':\n                            dateText = adjustStartDateInputForMonthly(\n                                startDateText,\n                                formatDate,\n                                computedMinMax.value.min,\n                                computedMinMax.value.max\n                            );\n                            dateTextInput.startDate = dateText;\n                            break;\n                        case 'daily':\n                        default:\n                            break;\n                    }\n\n                    // Format date string to Date object\n                    const startDate = parseDateTextToStartOfDay(dateText);\n                    internalRangeDate.startDate = setTimeInDate(startDate, dateTextInput.startTime);\n\n                    const endDate = getDate('endDate');\n\n                    emit(DateRangePickerCalendarEvent.FORM_DATE, {\n                        startDate,\n                        endDate,\n                    });\n\n                    emit(DateRangePickerCalendarEvent.INPUT, {\n                        ...internalRangeDate,\n                        range: selectedRangeSelectorValue.value,\n                    });\n                } else {\n                    // Indicate form error\n                    startDateError.value = true;\n                    // Emit Date picker calendar error\n                    emit(DateRangePickerCalendarEvent.ERROR, { ...dateTextInput });\n                }\n            }, FORM_INPUT_DEBOUNCE_TIME);\n\n            const onStartDateInput = (startDateText: string) => {\n                // Set the date as string when input through the form\n                dateTextInput.startDate = formatDateInputValue(startDateText);\n                validateStartDate(dateTextInput.startDate);\n            };\n\n            const validateEndDate = debounce((endDateText: string) => {\n                // Checks for YYYY-MM-DD format\n                if (isValidDate(endDateText)) {\n                    let dateText = endDateText;\n\n                    endDateError.value = false;\n\n                    switch (selectedGranularity.value?.type) {\n                        case 'weekly':\n                            dateText = adjustEndDateInputForWeekly(\n                                endDateText,\n                                formatDate,\n                                computedMinMax.value.min,\n                                computedMinMax.value.max\n                            );\n                            dateTextInput.endDate = dateText;\n                            break;\n                        case 'monthly':\n                            dateText = adjustEndDateInputForMonthly(\n                                endDateText,\n                                formatDate,\n                                computedMinMax.value.min,\n                                computedMinMax.value.max\n                            );\n                            dateTextInput.endDate = dateText;\n                            break;\n                        case 'daily':\n                        default:\n                            break;\n                    }\n\n                    const endDate = parseDateTextToStartOfDay(dateText);\n                    internalRangeDate.endDate = setTimeInDate(endDate, dateTextInput.endTime);\n\n                    const startDate = getDate('startDate');\n\n                    emit(DateRangePickerCalendarEvent.FORM_DATE, {\n                        startDate,\n                        endDate,\n                    });\n\n                    emit(DateRangePickerCalendarEvent.INPUT, {\n                        ...internalRangeDate,\n                        range: selectedRangeSelectorValue.value,\n                    });\n                } else {\n                    // Indicate form error\n                    endDateError.value = true;\n                    // Emit Date picker calendar error\n                    emit(DateRangePickerCalendarEvent.ERROR, { ...dateTextInput });\n                }\n            }, FORM_INPUT_DEBOUNCE_TIME);\n\n            const onEndDateInput = (endDateText: string) => {\n                // Set the date as string when input through the form\n                dateTextInput.endDate = formatDateInputValue(endDateText);\n                validateEndDate(dateTextInput.endDate);\n            };\n\n            const onDateInputKeyDown = (event: KeyboardEvent) => {\n                validateDateInput(event);\n            };\n\n            const validateStartTime = debounce((startTimeText: string) => {\n                if (isValidTime(startTimeText)) {\n                    startTimeError.value = false;\n                    internalRangeDate.startDate = setTimeInDate(internalRangeDate.startDate, startTimeText);\n\n                    const endDate = getDate('endDate');\n\n                    emit(DateRangePickerCalendarEvent.FORM_DATE, {\n                        startDate: new Date(internalRangeDate.startDate),\n                        endDate,\n                        startTime: startTimeText,\n                        endTime: props.dateFormData.endTime,\n                    });\n\n                    emit(DateRangePickerCalendarEvent.INPUT, {\n                        ...internalRangeDate,\n                        range: selectedRangeSelectorValue.value,\n                    });\n                } else {\n                    // Indicate form error\n                    startTimeError.value = true;\n                    // Emit Date picker calendar error\n                    emit(DateRangePickerCalendarEvent.ERROR, { ...dateTextInput });\n                }\n            });\n\n            const validateEndTime = debounce((endTimeText: string) => {\n                if (isValidTime(endTimeText)) {\n                    endTimeError.value = false;\n                    internalRangeDate.endDate = setTimeInDate(internalRangeDate.endDate, endTimeText);\n\n                    const startDate = getDate('startDate');\n                    internalRangeDate.startDate = setTimeInDate(new Date(startDate), props.dateFormData.startTime);\n\n                    emit(DateRangePickerCalendarEvent.FORM_DATE, {\n                        startDate: setTimeInDate(new Date(startDate), props.dateFormData.startTime),\n                        endDate: new Date(internalRangeDate.endDate),\n                        startTime: props.dateFormData.startTime,\n                        endTime: endTimeText,\n                    });\n                    emit(DateRangePickerCalendarEvent.INPUT, {\n                        ...internalRangeDate,\n                        range: selectedRangeSelectorValue.value,\n                    });\n                } else {\n                    // Indicate form error\n                    endTimeError.value = true;\n                    // Emit Date picker calendar error\n                    emit(DateRangePickerCalendarEvent.ERROR, { ...dateTextInput });\n                }\n            });\n\n            const onStartTimeInput = (startTimeText: string) => {\n                dateTextInput.startTime = formatTimeInputValue(startTimeText);\n                validateStartTime(dateTextInput.startTime);\n            };\n\n            const onEndTimeInput = (endDateText: string) => {\n                dateTextInput.endTime = formatTimeInputValue(endDateText);\n                validateEndTime(dateTextInput.endTime);\n            };\n\n            const onTimeInputKeyDown = (event: KeyboardEvent) => {\n                validateTimeInput(event);\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 = adjustedQuickSelectRanges.value?.find(({ value }) => value === newCustomRangeValue);\n\n                if (foundResult) {\n                    resetSavedRanges();\n                    const date = foundResult.data;\n\n                    const newEndDate = date.endDate || new Date(Date.now());\n                    // If the time difference between start and end dates is available,\n                    // calculating start date dynamically\n                    const newStartDate = 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 || DEFAULT_GRANULARITY;\n                    }\n\n                    // Set Form input time to EOD if no time is set\n                    if (!dateTextInput.startTime) {\n                        dateTextInput.startTime = formatTime(endOfDay(newStartDate));\n                    }\n                    if (!dateTextInput.endTime) {\n                        dateTextInput.endTime = formatTime(endOfDay(newEndDate));\n                    }\n\n                    // Set calendar selection\n                    internalRangeDate.startDate = newStartDate;\n                    internalRangeDate.endDate = newEndDate;\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                    // Adjust date range based on new granularity\n                    switch (value) {\n                        case 'monthly': {\n                            if (savedRanges.monthly) {\n                                setInternalRange(savedRanges.monthly.startDate, savedRanges.monthly.endDate, value);\n                                break;\n                            }\n\n                            const { startDate, endDate } = adjustDateForMonthly(\n                                internalRangeDate.startDate,\n                                internalRangeDate.endDate,\n                                computedMinMax.value.min,\n                                computedMinMax.value.max\n                            );\n                            setInternalRange(startDate, endDate, value);\n                            break;\n                        }\n                        case 'weekly': {\n                            if (savedRanges.weekly) {\n                                setInternalRange(savedRanges.weekly.startDate, savedRanges.weekly.endDate, value);\n                                break;\n                            }\n\n                            const { startDate, endDate } = adjustDateForWeekly(\n                                internalRangeDate.startDate,\n                                internalRangeDate.endDate,\n                                computedMinMax.value.min,\n                                computedMinMax.value.max\n                            );\n                            setInternalRange(startDate, endDate, value);\n                            break;\n                        }\n                        case 'daily':\n                            if (savedRanges.daily) {\n                                setInternalRange(savedRanges.daily.startDate, savedRanges.daily.endDate, value);\n                            }\n                            break;\n                        default:\n                            break;\n                    }\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            return {\n                // Values\n                internalRangeDate,\n                dateTextInput,\n                endDateError,\n                endTimeError,\n                granularityItems,\n                selectedGranularity,\n                computedMinMax,\n                selectedRangeSelectorValue,\n                startDateError,\n                startTimeError,\n                adjustedQuickSelectRanges,\n                quickSelectRangeDefaultItems,\n                formInputWrapperConditionalClasses,\n\n                // Methods\n                hasSlot: useHasSlot(slots),\n                t,\n\n                // Events\n                onDateInput,\n                onDateInputKeyDown,\n                onEndDateInput,\n                onEndDateSelected,\n                onEndTimeInput,\n                onGranularityInput,\n                onRangeSelectorInput,\n                onStartDateInput,\n                onStartDateSelected,\n                onStartTimeInput,\n                onTimeInputKeyDown,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./date-range-picker-calendar.scss\" />\n","import { computed, reactive } from 'vue';\nimport { getDateLocale } from '@/utils/ts/get-date-locale/get-date-locale';\nimport { useI18n } from '@/utils/ts/i18n';\nimport { parseDateTextToStartOfDay } from '../utils/date-text-to-start-of-day';\nimport { UseDateDisplayText } from './use-date-range-picker-calendar-text.types';\nimport { DateFormat } from '@/types';\nimport { CalendarRangeDateValue } from '@/internal';\nimport { DateRangePickerCalendarFormData } from '../components/date-range-picker-calendar/date-range-picker-calendar.types';\nimport format from 'date-fns/format';\n\nexport const useDateRangePickerCalendarText: UseDateDisplayText<CalendarRangeDateValue> = ({\n    datePickerValue,\n    isDateIncorrect,\n    quickSelectRanges,\n}) => {\n    const { locale, t } = useI18n();\n    const locales = getDateLocale();\n\n    const isValidDate = date => !!date && !isNaN(date.getTime());\n\n    const formatDate = (date: Date, dateFormat: DateFormat) =>\n        isValidDate(date)\n            ? format(date, dateFormat, {\n                  locale: locales[locale.value.substring(0, 2)] || locales.enUS,\n              })\n            : undefined;\n\n    // Handle the form input text\n    const textInputDisplayValue = reactive<DateRangePickerCalendarFormData>({\n        startDate: formatDate(datePickerValue.value?.startDate, DateFormat.NUMERIC_DATE_YEAR_FIRST),\n        endDate: formatDate(datePickerValue.value?.endDate, DateFormat.NUMERIC_DATE_YEAR_FIRST),\n        startTime: formatDate(datePickerValue.value?.startDate, DateFormat.HOUR_MINUTE_SECONDS),\n        endTime: formatDate(datePickerValue.value?.endDate, DateFormat.HOUR_MINUTE_SECONDS),\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 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        const { startDate, endDate } = textInputDisplayValue;\n        return `${formatDate(parseDateTextToStartOfDay(startDate), DateFormat.FULL_DATE_MONTH_FIRST)} - ${formatDate(\n            parseDateTextToStartOfDay(endDate),\n            DateFormat.FULL_DATE_MONTH_FIRST\n        )}`;\n    });\n\n    const formatTextInputDisplayValue = () => '';\n\n    return {\n        // Values\n        dateDisplayValue,\n        textInputDisplayValue,\n\n        // Methods\n        formatTextInputDisplayValue,\n    };\n};\n","export { CalendarFirstDayOfWeek as BentoDateRangePickerFirstDayOfWeek } from '@/internal';\nexport type {\n    CalendarIsDateDisabled as BentoDateRangePickerIsDateDisabled,\n    CalendarRangeDateValue as BentoDateRangePickerValue,\n    CalendarGranularityConfig as BentoDateRangePickerGranularityConfig,\n} from '@/internal';\n\nexport enum BentoDateRangePickerEvent {\n    INPUT = 'input',\n}\n","<!-- TODO: Remove aria props as these are part of JSX elements /vue/types/jsx.d.ts -->\n<!-- eslint-disable vue/attribute-hyphenation -->\n<template>\n    <div 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 @keydown.enter=\"onEnterPressedOverInput\">\n            <dropdown-input-default\n                ref=\"inputContainerRef\"\n                always-combobox-is-input\n                :ariaControls=\"datePickerContainerId\"\n                :ariaExpanded=\"isDateRangePickerOpen\"\n                :aria-labelledby=\"label ? labelId : null\"\n                :aria-describedby=\"ariaDescribedBy\"\n                :disabled=\"disabled\"\n                :is-invalid=\"!!errorMessage || shouldDisplayError\"\n                :open=\"isDateRangePickerOpen\"\n                :display-value=\"displayedDateValue\"\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('provideDateInAFormat')\"\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            :disable-focus-trap=\"true\"\n            :aria-label=\"popoverAriaLabel\"\n            position=\"bottom-start\"\n            without-space\n            fit-content\n        >\n            <date-range-picker-calendar\n                :allow-time-input=\"allowTimeInput\"\n                :quick-select-ranges=\"quickSelectRanges\"\n                :value=\"value\"\n                :first-day-of-week=\"firstDayOfWeek\"\n                :granularities=\"granularities\"\n                :is-date-disabled=\"isDateDisabled\"\n                :max-range=\"maxRange\"\n                :min=\"min\"\n                :max=\"max\"\n                :number-of-months=\"numberOfMonths\"\n                :show-end-date-on-open=\"showEndDateOnOpen\"\n                :date-form-data=\"displayedTextInputValue\"\n                @custom-range=\"onRangeSelectorInput\"\n                @input=\"onDateRangePickerInput\"\n                @error=\"onDateRangePickerError\"\n                @form-date=\"onDateRangePickerFormDateInputUpdate\"\n            >\n                <template v-if=\"hasActions\" #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 lang=\"ts\">\n    import { computed, defineComponent, onMounted, PropType, ref, toRaw, toRef, watch } from 'vue';\n\n    // Components\n    import { BentoButtonActions, BentoButtonActionsLayout } from '@/components/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 { getDateLocale } from '@/utils/ts/get-date-locale/get-date-locale';\n    import { generateUid } from '@/core/utils/ts';\n    import { useI18n } from '@/utils/ts/i18n';\n    import format from 'date-fns/format';\n\n    // Composables\n    import { useDateRangePickerCalendarText } from './composables/use-date-range-picker-calendar-text';\n    import { useFormLayoutFieldLoading } from '@/composables';\n\n    // Directives\n    import { BentoClickOutsideDirective } from '@/directives';\n\n    // Types\n    import { BentoDateRangePickerEvent, BentoDateRangePickerValue } from './date-range-picker.types';\n    import { DateFormat } from '@/types';\n    import {\n        DateRangePickerCalendarFormData,\n        DateRangePickerCalendarRangeSelectorItems,\n    } from './components/date-range-picker-calendar/date-range-picker-calendar.types';\n\n    import { deprecate } from '@/utils/ts/deprecate';\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\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     *              @input=\"onDateChanged\"\n     *              v-model=\"selectedDate\"\n     *          />\n     *     `,\n     *      setup() {\n     *          const selectedDate = ref(new Date()); // reactive({ startDate: new Date(), endDate: new Date() })\n     *          return {\n     *              selectedDate,\n     *          }\n     *      }\n     * }\n     */\n    export default defineComponent({\n        i18n: { messages },\n        name: 'bento-date-range-picker',\n        components: {\n            BentoButtonActions,\n            BentoDivider,\n            BentoTypography,\n            BentoPopover,\n            DateRangePickerCalendar,\n            DropdownInputDefault,\n            ErrorMessage,\n            FieldLabel,\n        },\n        directives: { BentoClickOutsideDirective },\n        props: {\n            /**\n             * Allows user to enter time values in the form\n             */\n            allowTimeInput: { type: Boolean, default: false },\n\n            /**\n             * Descriptive supporting text visbile underneath the dropdown.\n             */\n            description: { type: String, default: undefined },\n\n            /**\n             * Disables dropdown functionality.\n             */\n            disabled: { type: Boolean, default: false },\n\n            /**\n             * Displays component in an error state with an error message\n             */\n            errorMessage: { type: String, default: null },\n\n            /**\n             * Allows user to set the first day of the week. 0 is sunday, 1 is monday, 6 is saturday\n             */\n            firstDayOfWeek: DateRangePickerCalendar.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: DateRangePickerCalendar.props.granularities,\n\n            /**\n             * Indicate if a date should be disabled or not\n             */\n            isDateDisabled: DateRangePickerCalendar.props.isDateDisabled,\n\n            /**\n             * Text that is displayed as a label above the element.\n             */\n            label: { type: String, default: undefined },\n\n            /**\n             * Upon opening date range picker, end date's month will be pre-selected.\n             */\n            showEndDateOnOpen: { type: Boolean, default: false },\n\n            /**\n             * Highlights the dropdown is optional.\n             */\n            optional: { type: Boolean, default: false },\n\n            /**\n             * The Boolean readonly property, when present, makes the element not mutable, meaning the user can not edit the date range picker.\n             */\n            readonly: { type: Boolean, default: false },\n\n            /**\n             * Highlights the dropdown is required.\n             */\n            required: { type: Boolean, default: false },\n\n            /**\n             * Adds a info icon next to the label to display the passed tooltip message.\n             */\n            tooltipText: { type: String, default: null },\n\n            /**\n             * Enables the 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             * Set a maximum number of dates to be selectable by the range.\n             */\n            maxRange: DateRangePickerCalendar.props.maxRange,\n\n            /**\n             * Sets a minimum limit for selectable dates - dates before `min` will not be selectable\n             */\n            min: DateRangePickerCalendar.props.min,\n\n            /**\n             * Sets a maximum limit for selectable dates - dates after `max` will not be selectable\n             */\n            max: DateRangePickerCalendar.props.max,\n\n            /**\n             * Number of months rendered on pane\n             */\n            numberOfMonths: DateRangePickerCalendar.props.numberOfMonths,\n\n            /**\n             * Selected date\n             */\n            value: DateRangePickerCalendar.props.value,\n\n            /**\n             * Enables the date picker selection to persist until it is explicitly applied.\n             * Displays a set of buttons: Apply and Cancel.\n             *\n             * @deprecated This will be the default behaviour in v2.0.0.\n             */\n            hasActions: { type: Boolean, default: false },\n        },\n        emits: [BentoDateRangePickerEvent.INPUT],\n        setup(props, { emit }) {\n            const { locale, t } = useI18n<{ message: MessageSchema }>({ messages });\n            const locales = getDateLocale();\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(\n                () => props.label || t('dateRangePicker', { name: datePickerContainerId })\n            );\n\n            const isDateIncorrect = ref(false);\n            const inputContainerRef = ref(null);\n            const isDateRangePickerOpen = ref(false);\n            const { isReadOnly } = useFormLayoutFieldLoading(toRef(props, 'readonly'));\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 shouldDisplayError = computed(() => {\n                if (props.hasActions) {\n                    return !isApplyDisabled.value && isDateIncorrect.value;\n                }\n\n                return isDateIncorrect.value;\n            });\n\n            const descriptionConditionalClasses = computed(() => ({\n                'b-date-range-picker__description--error': !!props.errorMessage || shouldDisplayError.value,\n            }));\n\n            const { dateDisplayValue, textInputDisplayValue, formatTextInputDisplayValue } =\n                useDateRangePickerCalendarText({\n                    datePickerValue: toRef(props, 'value'),\n                    isDateIncorrect,\n                    quickSelectRanges: toRef(props, 'quickSelectRanges'),\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            /*\n             * Used when `hasActions` is set to true\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.value);\n            const isApplyDisabled = ref(true);\n\n            const displayedTextInputValue = computed(() =>\n                props.hasActions ? localTextInputDisplayValue.value : textInputDisplayValue\n            );\n\n            const displayedDateValue = computed(() =>\n                props.hasActions ? localDateDisplayValue.value : dateDisplayValue.value\n            );\n\n            onMounted(() => {\n                if (!props.hasActions) {\n                    deprecate(\n                        'BentoDateRangePicker \"hasActions\" property',\n                        `Set the BentoDateRangePicker \"hasActions\" property true which will display the \"Apply\" and \"Cancel\" buttons.\n                        This will be the default behavior in the v2 and \"hasActions\" will be removed.`,\n                        '2.0.0'\n                    );\n                }\n            });\n\n            // On update for the value we need to update all the locally stored data\n            watch(\n                () => props.value,\n                () => {\n                    localDateDisplayValue.value = dateDisplayValue.value;\n                    localTextInputDisplayValue.value = structuredClone(toRaw(textInputDisplayValue));\n                }\n            );\n\n            const rangePickerButtonActions = computed(() => [\n                {\n                    title: t('apply'),\n                    event: () => {\n                        emit(BentoDateRangePickerEvent.INPUT, selectedDate.value);\n                        closeDateRangePicker();\n\n                        isApplyDisabled.value = true;\n                    },\n                    disabled: isApplyDisabled.value,\n                },\n                {\n                    title: t('cancel'),\n                    event: closeDateRangePicker,\n                },\n            ]);\n\n            watch(selectedDate, date => {\n                // skip emit until Apply button is clicked\n                if (props.hasActions) {\n                    isApplyDisabled.value = isDateIncorrect.value;\n\n                    return;\n                }\n\n                emit(BentoDateRangePickerEvent.INPUT, date);\n            });\n\n            const onDateRangePickerInput = (selectedRange: BentoDateRangePickerValue) => {\n                // Reset the errors when the date is correct\n                isDateIncorrect.value = false;\n\n                const formatDate = (date: Date, dateFormat: DateFormat) =>\n                    date\n                        ? format(date, dateFormat, {\n                              locale: locales[locale.value.substring(0, 2)] || locales.enUS,\n                          })\n                        : undefined;\n\n                textInputDisplayValue.startDate = formatDate(\n                    selectedRange.startDate,\n                    DateFormat.NUMERIC_DATE_YEAR_FIRST\n                );\n                textInputDisplayValue.endDate = formatDate(selectedRange.endDate, DateFormat.NUMERIC_DATE_YEAR_FIRST);\n                textInputDisplayValue.startTime = formatDate(selectedRange.startDate, DateFormat.HOUR_MINUTE_SECONDS);\n                textInputDisplayValue.endTime = formatDate(selectedRange.endDate, DateFormat.HOUR_MINUTE_SECONDS);\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                // Close the date picker if the date is correct\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                    textInputDisplayValue.startTime = dateFormDate.startTime;\n                }\n\n                if (dateFormDate.endTime) {\n                    textInputDisplayValue.endTime = dateFormDate.endTime;\n                }\n            };\n\n            const onDateRangePickerError = dateTextInput => {\n                isDateIncorrect.value = true;\n                textInputDisplayValue.startDate = dateTextInput.startDate;\n                textInputDisplayValue.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                    const formatDate = (date: Date) =>\n                        format(date, DateFormat.NUMERIC_DATE_YEAR_FIRST, {\n                            locale: locales[locale.value.substring(0, 2)] || locales.enUS,\n                        });\n                    textInputDisplayValue.startDate = formatDate(quickSelectRanges.startDate);\n                    textInputDisplayValue.endDate = formatDate(quickSelectRanges.endDate);\n\n                    selectedDate.value = quickSelectRanges;\n                }\n            };\n\n            return {\n                // Refs\n                inputContainerRef,\n\n                // Values,\n                dateDisplayValue,\n                datePickerContainerId,\n                descriptionConditionalClasses,\n                displayedTextInputValue,\n                displayedDateValue,\n                isDateIncorrect,\n                isDateRangePickerOpen,\n                isReadOnly,\n                labelId,\n                descriptionId,\n                dateErrorId,\n                errorId,\n                popoverAriaLabel,\n                shouldDisplayError,\n                ariaDescribedBy,\n                textInputDisplayValue,\n                rangePickerButtonActions,\n                BentoButtonActionsLayout,\n\n                // Events\n                closeDateRangePicker,\n                clearDateRangePickerValue,\n                openDateRangePicker,\n                onRangeSelectorInput,\n                onEnterPressedOverInput,\n                onDateRangePickerInput,\n                onDateRangePickerError,\n                onDateRangePickerFormDateInputUpdate,\n\n                // Translations\n                t,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./date-range-picker.scss\" />\n"],"names":["isEqual","dirtyLeftDate","dirtyRightDate","requiredArgs","dateLeft","toDate","dateRight","startOfSecond","dirtyDate","date","isSameSecond","dirtyDateLeft","dirtyDateRight","dateLeftStartOfSecond","dateRightStartOfSecond","isToday","isSameDay","setHours","dirtyHours","hours","toInteger","setMinutes","dirtyMinutes","minutes","setSeconds","dirtySeconds","seconds","parseDateTextToStartOfDay","dateText","startOfDay","year","month","day","s","useGranularMinMaxDate","firstDayOfWeek","minimumDate","maximumDate","granularity","min","max","endOfDay","startOfMin","startOfWeek","addDays","endOfWeek","endOfMax","subDays","startOfMonth","addMonths","endOfMonth","subMonths","useGranularityMemory","savedRanges","reactive","type","range","DateRangePickerCalendarEvent","DateRangePickerCalendarEvent2","validDigitRegex","hourRegex","minuteRegex","validateTimeInput","event","selectionStart","isValidKey","isValidColon","formatTimeInputValue","value","formattedValue","secondToLastDigit","lastDigit","FORM_INPUT_DEBOUNCE_TIME","RANGE_SELECTOR_CUSTOM_RANGE_KEY","DEFAULT_GRANULARITY","_sfc_main$1","defineComponent","messages$1","BentoDropdown","BentoInputField","BentoSegmentedControl","BentoTypography","Calendar","props","emit","slots","locale","t","useI18n","locales","getDateLocale","internalRangeDate","_a","_b","_c","_d","deserializeDate","selectedRangeSelectorValue","computed","data","formInputWrapperConditionalClasses","quickSelectRangeDefaultItems","adjustedQuickSelectRanges","selectedGranularity","granularityItems","disabled","getGranularCalendarLimits","computedMinMax","adjustDateForMonthly","adjustDateForWeekly","adjustStartDateInputForWeekly","adjustEndDateInputForWeekly","adjustStartDateInputForMonthly","adjustEndDateInputForMonthly","useGranularityAdjustments","saveRange","resetSavedRanges","formatDate","dateToFormat","format","DateFormat","formatTime","startDateError","ref","endDateError","startTimeError","endTimeError","dateTextInput","isValidTime","timeText","setTimeInDate","time","dateWithTime","onDateInput","selectedRange","isValidDate","isDateEnabled","onMounted","onStartDateSelected","newStartDate","onEndDateSelected","newEndDate","getDate","keyName","dateProp","validateStartDate","debounce","startDateText","startDate","endDate","onStartDateInput","formatDateInputValue","validateEndDate","endDateText","onEndDateInput","onDateInputKeyDown","validateDateInput","validateStartTime","startTimeText","validateEndTime","endTimeText","onStartTimeInput","onEndTimeInput","onTimeInputKeyDown","setInternalRange","onRangeSelectorInput","newCustomRangeValue","foundResult","onGranularityInput","previousValue","toRaw","useHasSlot","useDateRangePickerCalendarText","datePickerValue","isDateIncorrect","quickSelectRanges","dateFormat","textInputDisplayValue","customRangeSelected","BentoDateRangePickerEvent","BentoDateRangePickerEvent2","_sfc_main","messages","BentoButtonActions","BentoDivider","BentoPopover","DateRangePickerCalendar","DropdownInputDefault","ErrorMessage","FieldLabel","BentoClickOutsideDirective","datePickerContainerId","generateUid","labelId","descriptionId","errorId","dateErrorId","popoverAriaLabel","inputContainerRef","isDateRangePickerOpen","isReadOnly","useFormLayoutFieldLoading","toRef","watch","shouldDisplayError","isApplyDisabled","descriptionConditionalClasses","dateDisplayValue","ariaDescribedBy","closeDateRangePicker","openDateRangePicker","localDateDisplayValue","localTextInputDisplayValue","selectedDate","displayedTextInputValue","displayedDateValue","deprecate","rangePickerButtonActions","BentoButtonActionsLayout","dateFormDate"],"mappings":"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","x_google_ignoreList":[0,1,2,3,4,5,6]}

package/dist/chunks/{dialog-page.Bf07JxdG.js → dialog-page.BfF5_hmG.js}

@@ -1,5 +1,6 @@
 import { defineComponent as j, useSlots as U, ref as v, computed as r, inject as B, watch as P, nextTick as E, onUnmounted as F } from "vue";
-import { B as J } from "./button.CdAFZa4V.js";
+import { B as J } from "./button.D-3uUhuG.js";
+/* empty css              */
 import { n as O } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
 import { u as K } from "./use-has-slot.C9lQZ6nz.js";
 import { u as Y } from "./i18n.BQkEbtPM.js";
@@ -118,12 +119,12 @@ var se = function() {
   null,
   "06db4ab2"
 );
-const ge = le.exports;
+const de = le.exports;
 export {
   W as A,
   S as B,
-  ge as D,
+  de as D,
   X as a,
   ee as b
 };
-//# sourceMappingURL=dialog-page.Bf07JxdG.js.map
+//# sourceMappingURL=dialog-page.BfF5_hmG.js.map

package/dist/chunks/dialog-page.BfF5_hmG.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-page.BfF5_hmG.js","sources":["../../../ui-assets/icons-16/dist/vue/arrow-left.vue","../../src/components/internal/dialog-page/dialog-page.types.ts","../../src/components/internal/dialog-page/dialog-page.keys.ts","../../src/components/internal/dialog-page/dialog-page.vue"],"sourcesContent":["\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M3.80655 7.25434L8.06077 3.00011L7.00011 1.93945L0.939453 8.00011L7.00011 14.0608L8.06077 13.0001L3.81499 8.75433L14.7508 8.74316L14.7492 7.24316L3.80655 7.25434Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n","import { Ref } from 'vue';\n\nexport enum BentoDialogPageAnimation {\n    TRANSITION_LEVEL_DEEPER = 'b-dialog-page__animation--level-deeper',\n    TRANSITION_LEVEL_UPPER = 'b-dialog-page__animation--level-upper',\n}\n\nexport interface BentoDialogPageConfigData {\n    activePage: Ref<string>;\n    animation: Ref<string>;\n    isAnimationActive?: Ref<boolean>;\n    isOpen: Ref<boolean>;\n    pages: Ref<string[]>;\n    previousPages: Ref<string[]>;\n    updatePage: (page: string) => void;\n}\n\nexport type BentoDialogPageRegisterPage = (pageId: string) => { unregisterPage: () => void };\n","export const DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY = Symbol('dialog registerPage injection key');\nexport const DIALOG_PAGE_CONFIG_INJECTION_KEY = Symbol('dialog page config data injection key');\n","<template>\n    <Transition :name=\"animation\" mode=\"out-in\" @after-leave=\"updateAnimation\" @leave=\"startAnimation\">\n        <div v-if=\"isOpen && showPage\" class=\"b-dialog-page\">\n            <div v-if=\"hasSlot('header')\" class=\"b-dialog-page__header\" :class=\"headerConditionalClasses\">\n                <div\n                    v-if=\"showBackButton\"\n                    class=\"b-dialog-page__back-button\"\n                    :style=\"backButtonStyling\"\n                    data-testid=\"back-button\"\n                >\n                    <bento-button variant=\"tertiary\" @click=\"goToPreviousPage(previousPage)\">\n                        <arrow-left-icon :svg-title=\"t('goToPreviousPage')\" />\n                    </bento-button>\n                </div>\n                <slot name=\"header\"></slot>\n            </div>\n            <div v-if=\"hasSlot('content')\" ref=\"contentElement\" class=\"b-dialog-page__content\" @scroll=\"onScroll\">\n                <slot name=\"content\" />\n            </div>\n            <div v-if=\"hasSlot('footer')\" class=\"b-dialog-page__footer\" :class=\"footerConditionalClasses\">\n                <slot name=\"footer\" />\n            </div>\n        </div>\n    </Transition>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, inject, nextTick, onUnmounted, PropType, ref, useSlots, watch } from 'vue';\n\n    import { BentoButton } from '@/components/button';\n    import ArrowLeftIcon from '@adyen/ui-assets-icons-16/vue/arrow-left';\n\n    import { useHasSlot } from '@/composables/use-has-slot/use-has-slot';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { isDevelopmentEnviroment } from '@/utils/ts/dev-environment';\n\n    import {\n        BentoDialogPageAnimation,\n        BentoDialogPageConfigData,\n        BentoDialogPageRegisterPage,\n    } from './dialog-page.types';\n    import type { CSSProperties } from 'vue/types/jsx.d.ts';\n\n    import { DIALOG_PAGE_CONFIG_INJECTION_KEY, DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY } from './dialog-page.keys';\n\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const props = defineProps({\n        /**\n         * Identifier of the page, used with activePage prop to handle navigation\n         */\n        pageId: {\n            type: String,\n            default: undefined,\n        },\n\n        /**\n         * Show header and actions border\n         */\n        alwaysShowBorder: {\n            type: Boolean,\n            default: false,\n        },\n\n        /**\n         * Pass custom styling to the back button to position it correctly with the header slot\n         */\n        backButtonStyling: { type: Object as PropType<CSSProperties>, default: null },\n\n        /**\n         * ID of the page for the back button to navigate to. Only use it to overwrite the default back behavior\n         * Used when the back button should not take the user to the natural previous page\n         * Set to `null` to hide back button in the page\n         */\n        previousPage: {\n            type: String,\n            default: undefined,\n        },\n    });\n\n    const emit = defineEmits([\"animationend\"]);\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n    // Refs\n    const contentElement = ref<HTMLDivElement>(null);\n    const hasScroll = ref(false);\n    const isScrollAtTop = ref(true);\n    const isScrollAtBottom = ref(false);\n\n    // Logic to choose which page is active/shown\n    const showPage = computed(() => (activePage.value ? activePage.value === props.pageId : true));\n\n    // Scrolling styling logic\n    const headerConditionalClasses = computed(() => ({\n        'b-dialog-page__header--with-border': props.alwaysShowBorder || (hasScroll.value && !isScrollAtTop.value),\n    }));\n\n    const footerConditionalClasses = computed(() => ({\n        'b-dialog-page__footer--with-border': props.alwaysShowBorder || (hasScroll.value && !isScrollAtBottom.value),\n    }));\n\n    const onScroll = () => {\n        if (!contentElement.value) {\n            return;\n        }\n\n        isScrollAtTop.value = contentElement.value.scrollTop === 0;\n        isScrollAtBottom.value =\n            contentElement.value.scrollHeight - contentElement.value.clientHeight === contentElement.value.scrollTop;\n    };\n\n    const calculateScroll = async watchedValue => {\n        if (!watchedValue) {\n            return;\n        }\n        // Wait for content to be rendered to be able to calculate the height\n        await nextTick();\n        hasScroll.value = contentElement.value && contentElement.value.scrollHeight > contentElement.value.clientHeight;\n    };\n\n    const { activePage, animation, isAnimationActive, isOpen, pages, previousPages, updatePage } =\n        inject<BentoDialogPageConfigData>(DIALOG_PAGE_CONFIG_INJECTION_KEY);\n\n    watch(() => isOpen.value, calculateScroll, { immediate: true });\n    watch(() => showPage.value, calculateScroll, { immediate: true });\n\n    // Logic to determine whether the back button should be shown on the page\n    const showBackButton = computed(() => {\n        if (props.previousPage) {\n            return true;\n        }\n        if (props.previousPage === null) {\n            return false;\n        }\n        return hasPreviousPages.value && showPage.value;\n    });\n\n    // Animation\n    const updateAnimation = () => {\n        animation.value = BentoDialogPageAnimation.TRANSITION_LEVEL_DEEPER;\n        if (isAnimationActive) {\n            isAnimationActive.value = false;\n        }\n\n        emit('animationend');\n    };\n\n    const startAnimation = () => {\n        if (isAnimationActive) {\n            isAnimationActive.value = true;\n        }\n    };\n\n    // Previous page logic\n    const hasPreviousPages = computed(() => previousPages.value.length > 1);\n    const lastPage = computed(() => previousPages.value[previousPages.value.length - 1]);\n    const isActivePageValid = computed(() => pages.value.some(page => page === activePage.value));\n\n    const goToPreviousPage = async (page: string) => {\n        if (page) {\n            const index = previousPages.value.indexOf(page);\n            if (index !== -1) {\n                previousPages.value = previousPages.value.slice(0, index + 1);\n            } else {\n                previousPages.value = [page];\n            }\n        } else {\n            previousPages.value.pop();\n        }\n\n        animation.value = BentoDialogPageAnimation.TRANSITION_LEVEL_UPPER;\n        await nextTick();\n        updatePage(lastPage.value);\n    };\n\n    // Add new page to the previousPage array to keep track of user navigation\n    watch(\n        () => activePage.value,\n        async () => {\n            await nextTick();\n            if (!isOpen.value) {\n                return;\n            }\n\n            if (!!activePage.value && !isActivePageValid.value) {\n                if (isDevelopmentEnviroment) {\n                    // eslint-disable-next-line no-console\n                    console.error(\n                        `The activePage passed \"${activePage.value}\" does not match the id of any of the pages`\n                    );\n                    return;\n                }\n            }\n\n            if (activePage.value !== lastPage.value) {\n                previousPages.value.push(activePage.value);\n            }\n        },\n        { immediate: true }\n    );\n\n    // Register page to parent component and inject data from parent component\n    const registerPage = inject<BentoDialogPageRegisterPage>(DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY);\n    const { unregisterPage } = registerPage(props.pageId);\n\n    // Unregister page on unmounting the page\n    onUnmounted(() => unregisterPage());\n</script>\n\n<script lang=\"ts\">\n    /**\n     * DialogPage is an internal component used to render different pages of dialog components (Modal, ModalFullscreen and Sidepanel)\n     *\n     * @example\n     * import { DialogPage } from '@/internal';\n     *\n     * export default {\n     *     components: { DialogPage },\n     *     template: `\n     *          <dialog-page pageId='step1' always-show-border>\n     *              <template #header>Header</template>\n     *              <template #content>Content</template>\n     *              <template #footer>Footer</template>\n     *          </dialog-page>\n     *     `\n     * }\n     */\n    export default {\n        i18n: { messages },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./dialog-page.scss\" />\n"],"names":["uuid","_sfc_main$1","BentoDialogPageAnimation","BentoDialogPageAnimation2","DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY","DIALOG_PAGE_CONFIG_INJECTION_KEY","__default__","messages","slots","useSlots","hasSlot","useHasSlot","t","useI18n","contentElement","ref","hasScroll","isScrollAtTop","isScrollAtBottom","showPage","computed","activePage","props","headerConditionalClasses","footerConditionalClasses","onScroll","calculateScroll","watchedValue","nextTick","animation","isAnimationActive","isOpen","pages","previousPages","updatePage","inject","watch","showBackButton","hasPreviousPages","updateAnimation","emit","startAnimation","lastPage","isActivePageValid","page","goToPreviousPage","index","isDevelopmentEnviroment","registerPage","unregisterPage","onUnmounted"],"mappings":"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"}

package/dist/chunks/{dot.BCX4w7eT.js → dot.CnkXzRn3.js}

@@ -1,5 +1,5 @@
+/* empty css              */
 import { n as r } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
-import "../assets/cross.css";
 let e = 0;
 const n = {
   beforeCreate() {
@@ -17,8 +17,8 @@ var i = function() {
   null,
   null
 );
-const c = o.exports;
+const f = o.exports;
 export {
-  c as D
+  f as D
 };
-//# sourceMappingURL=dot.BCX4w7eT.js.map
+//# sourceMappingURL=dot.CnkXzRn3.js.map

package/dist/chunks/dot.CnkXzRn3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dot.CnkXzRn3.js","sources":["../../../ui-assets/icons-16/dist/vue/dot.vue"],"sourcesContent":["\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M8 5.25C6.48122 5.25 5.25 6.48122 5.25 8C5.25 9.51878 6.48122 10.75 8 10.75C9.51878 10.75 10.75 9.51878 10.75 8C10.75 6.48122 9.51878 5.25 8 5.25Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n"],"names":["uuid","_sfc_main"],"mappings":";;AAOA,IAAAA,IAAA;AAEA,MAAAC,IAAA;AAAA,EACA,eAAA;AACA,SAAA,OAAAD,EAAA,SAAA,GACAA,KAAA;AAAA,EACA;AACA;;;;;;;;;;;;;"}

package/dist/chunks/{dropdown-default-textbox.CC9Z_RFG.js → dropdown-default-textbox.DzPBw4CV.js}

@@ -4,11 +4,11 @@ import { u as T } from "./i18n.BQkEbtPM.js";
 import { u as U } from "./use-has-slot.C9lQZ6nz.js";
 import { B as M } from "./typography.J1v_SPG3.js";
 import { d as $ } from "./debounce.DUTu11PS.js";
-import { C as Y } from "./cross-circle-fill.CnYH4R_h.js";
-import { C as q } from "./cross-circle-fill-small.Oj6lPaDy.js";
+import { C as Y } from "./cross-circle-fill.BawVYNw7.js";
+import { C as q } from "./cross-circle-fill-small.YhLgeipP.js";
 import { n as E } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
 import { s as S } from "./events.CMzGybJJ.js";
-import { C as z, a as K } from "./chevron-up.DVfo78kV.js";
+import { C as z, a as K } from "./chevron-up.CSVyoaTy.js";
 import "../assets/dropdown-default-textbox.css";
 var k = /* @__PURE__ */ ((n) => (n.DEFAULT = "DropdownInputDefault", n.SMALL = "DropdownInputSmall", n))(k || {}), p = /* @__PURE__ */ ((n) => (n.DISABLED = "disabled", n.READONLY = "readonly", n.HAS_ITEMS = "has-items", n.OPENED = "opened", n.ERROR = "error", n))(p || {}), s = /* @__PURE__ */ ((n) => (n.OPEN = "dropdown-base-open", n.KEYDOWN = "dropdown-base-keydown", n.CLOSE = "dropdown-base-close", n.INPUT = "dropdown-base-input", n.CLEAR = "dropdown-base-clear", n))(s || {});
 const j = {
@@ -345,4 +345,4 @@ export {
   s as b,
   X as c
 };
-//# sourceMappingURL=dropdown-default-textbox.CC9Z_RFG.js.map
+//# sourceMappingURL=dropdown-default-textbox.DzPBw4CV.js.map

package/dist/chunks/{dropdown-default-textbox.CC9Z_RFG.js.map → dropdown-default-textbox.DzPBw4CV.js.map}

@@ -1 +1 @@
-{"version":3,"file":"dropdown-default-textbox.CC9Z_RFG.js","sources":["../../src/components/dropdown/dropdown.types.ts","../../src/components/dropdown/components/dropdown-base-textbox/dropdown-base-textbox.types.ts","../../src/components/dropdown/components/dropdown-base-textbox/dropdown-base-textbox.vue","../../src/components/dropdown/components/dropdown-default-textbox/dropdown-default-textbox.vue"],"sourcesContent":["/**\n * @deprecated Do not use. Only 'default' size should be used.\n */\nexport enum BentoDropdownSize {\n    DEFAULT = 'DropdownInputDefault',\n    SMALL = 'DropdownInputSmall',\n}\n\nexport {\n    /**\n     * @deprecated since version 2.0. Use the string literal instead.\n     */\n    BentoListboxLazyLoadType as BentoDropdownLazyLoadType,\n    BentoListboxEvent as BentoDropdownEvent,\n} from '@/types';\n\nexport type { BentoListboxSearchOptions as BentoDropdownSearchOptions } from '@/types';\nexport type { BentoListboxEmptyStateProps as BentoDropdownEmptyStateProps } from '@/types';\nexport type { BentoListboxVirtulisationOptions as BentoDropdownVirtulisationOptions } from '@/types';\n","import { PropType } from 'vue';\nimport { Booleanish } from '@/types';\n\n// TODO: Change this to script setup + Typescript interface\nexport const DropdownBaseTextboxProps = {\n    /**\n     * The number of additional items that have been selected in the dropdown.\n     */\n    additionalItemsSelected: { type: [Number, String] as PropType<number | string>, default: 0 },\n\n    /**\n     * Sets the possibility to type into the textbox\n     */\n    dynamicFiltering: {\n        type: Boolean,\n        default: false,\n    },\n\n    /**\n     * Sets the aria-controls attribute on the textbox. This should correspond to the popover's id that the textbox triggers.\n     */\n    ariaControls: {\n        type: String,\n        required: true,\n    },\n\n    /**\n     * Indicates whether the content the textbox triggers is visible or not. Needs to be set accordingly when the textbox is used and changed every time the popover is shown/hidden.\n     */\n    ariaExpanded: {\n        type: [String, Boolean] as PropType<Booleanish>,\n        required: true,\n    },\n\n    /**\n     * Corresponds to the label's id that labels the textbox element.\n     */\n    ariaLabelledby: {\n        type: String,\n        default: null,\n    },\n\n    /**\n     * Disables any textbox functionality\n     */\n    disabled: { type: Boolean, default: false },\n\n    /**\n     * Marks the textbox as invalid, rendering an error state\n     */\n    isInvalid: { type: Boolean, default: false },\n\n    /**\n     * Selected option's label\n     */\n    displayValue: { type: String, default: null },\n\n    /**\n     * Indicates if the dropdown is open so that\n     * the respective event can be emitted\n     */\n    open: { type: Boolean, default: false },\n\n    /**\n     * The input value\n     */\n    value: { type: String, default: '' },\n\n    /**\n     * Custom debounce time. Default: 300\n     */\n    debounceTime: { type: Number, default: 300 },\n};\n\nexport enum DropdownBaseTextboxState {\n    DISABLED = 'disabled',\n    READONLY = 'readonly',\n    HAS_ITEMS = 'has-items',\n    OPENED = 'opened',\n    ERROR = 'error',\n}\n\nexport enum DropdownBaseTextboxEvent {\n    OPEN = 'dropdown-base-open',\n    KEYDOWN = 'dropdown-base-keydown',\n    CLOSE = 'dropdown-base-close',\n    INPUT = 'dropdown-base-input',\n    CLEAR = 'dropdown-base-clear',\n}\n\nexport default DropdownBaseTextboxProps;\n","<template>\n    <div\n        :class=\"$attrs.class\"\n        data-testid=\"textbox-wrapper\"\n        @click=\"onToggleDropdown\"\n        @keydown.escape=\"onCloseDropdown\"\n    >\n        <bento-typography\n            class=\"b-dropdown-base-textbox\"\n            :class=\"conditionalClasses\"\n            el=\"div\"\n            data-testid=\"base-textbox\"\n        >\n            <input\n                v-if=\"shouldShowInput\"\n                v-bind=\"ariaAttributes\"\n                :id=\"textboxId\"\n                ref=\"textbox\"\n                class=\"b-dropdown-base-textbox__input\"\n                role=\"combobox\"\n                type=\"text\"\n                aria-autocomplete=\"list\"\n                size=\"1\"\n                :value=\"open ? value : displayValue\"\n                :disabled=\"disabled ? true : null\"\n                :readonly=\"readonly\"\n                @keydown=\"$emit(DropdownBaseTextboxEvent.KEYDOWN, $event)\"\n                @keydown.enter=\"onToggleDropdown\"\n                @input=\"onInputEvent\"\n            />\n            <div\n                v-else\n                :id=\"textboxId\"\n                v-bind=\"ariaAttributes\"\n                ref=\"textbox\"\n                class=\"b-dropdown-base-textbox__input\"\n                :class=\"comboboxConditionalClasses\"\n                role=\"combobox\"\n                :tabindex=\"0\"\n            >\n                <slot v-if=\"shouldShowSingleSelectSlot\" v-bind=\"selectedValueItem\">\n                    {{ displayValue }}\n                </slot>\n                <template v-else-if=\"shouldShowMultipleSlot\">\n                    <div class=\"b-dropdown-base-textbox__input-multiple-selected\">\n                        <div v-for=\"singleItem of selectedValueItems\" :key=\"singleItem.value\">\n                            <div class=\"b-dropdown-base-textbox__input-selected-element\">\n                                <slot v-bind=\"singleItem\">\n                                    {{ displayValue }}\n                                </slot>\n                            </div>\n                        </div>\n                    </div>\n                </template>\n                <template v-else>{{ displayValue }}</template>\n            </div>\n            <span v-if=\"additionalItemsSelected\" class=\"b-dropdown-base-textbox__additional-items\">\n                {{ additionalItemsSelected }}\n            </span>\n            <span v-if=\"hasSlot('icon') && !isFiltering\" class=\"b-dropdown-base-textbox__icon\" aria-hidden=\"true\">\n                <slot name=\"icon\"></slot>\n            </span>\n            <span\n                v-if=\"isFiltering\"\n                class=\"b-dropdown-base-textbox__clear-search\"\n                tabindex=\"0\"\n                data-testid=\"clear-search-button\"\n                @click.stop=\"onClearSearch\"\n                @keydown.enter.stop=\"onClearSearch\"\n                @keyup.space=\"onClearSearch\"\n            >\n                <cross-circle-fill-small-icon v-if=\"size === BentoDropdownSize.SMALL\" :svg-title=\"t('clearSearch')\" />\n                <cross-circle-fill-icon v-else :svg-title=\"t('clearSearch')\" />\n            </span>\n        </bento-typography>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, defineComponent, nextTick, PropType, ref, useAttrs, useSlots, watch } from 'vue';\n    import { generateUid } from '@/core/utils/ts';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { useHasSlot } from '@/composables';\n    import { BentoTypography } from '@/components/typography';\n    import { debounce } from '@/utils/ts/debounce';\n    import { BentoListboxOptionItem, Booleanish } from '@/types';\n    import type { HTMLAttributes } from 'vue/types/jsx.d.ts';\n    import { DropdownBaseTextboxEvent, DropdownBaseTextboxState } from './dropdown-base-textbox.types';\n    import CrossCircleFillIcon from '@adyen/ui-assets-icons-16/vue/cross-circle-fill';\n    import CrossCircleFillSmallIcon from '@adyen/ui-assets-icons-16/vue/cross-circle-fill-small';\n    import { BentoDropdownSize } from '@/components/dropdown/dropdown.types';\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n    const attrs = useAttrs();\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n    const props = defineProps({\n        /**\n         * The number of additional items that have been selected in the dropdown.\n         */\n        additionalItemsSelected: { type: [Number, String] as PropType<number | string>, default: 0 },\n\n        /**\n         * If the combobox DOM element should be an `input` element.\n         */\n        alwaysComboboxIsInput: {\n            type: Boolean,\n            default: false,\n        },\n\n        /**\n         * Sets the aria-controls attribute on the textbox. This should correspond to the popover's id that the textbox triggers.\n         */\n        ariaControls: { type: String, required: true },\n\n        /**\n         * Indicates whether the content the textbox triggers is visible or not. Needs to be set accordingly when the textbox is used and changed every time the popover is shown/hidden.\n         */\n        ariaExpanded: {\n            type: [String, Boolean] as PropType<Booleanish>,\n            required: true,\n        },\n\n        /**\n         * If no label element is used then the aria-label is be set should be set.\n         */\n        ariaLabel: { type: String, default: null },\n\n        /**\n         * Corresponds to the label's id that labels the textbox element.\n         */\n        ariaLabelledby: { type: String, default: null },\n\n        /**\n         * Custom debounce time for the user type event.\n         */\n        debounceTime: { type: Number, default: 300 },\n\n        /**\n         * Disables any textbox functionality\n         */\n        disabled: { type: Boolean, default: false },\n\n        /**\n         * Selected option's label\n         */\n        displayValue: { type: String, default: null },\n\n        /**\n         * Sets the possibility to type into the textbox.\n         */\n        dynamicFiltering: { type: Boolean, default: false },\n\n        /**\n         * Marks the textbox as invalid, rendering an error state\n         */\n        isInvalid: { type: Boolean, default: false },\n\n        /*\n         * If enabled, the user will be able to select multiple items.\n         */\n        multiple: { type: Boolean, default: false },\n\n        /**\n         * Indicates if the dropdown is open so that\n         * the respective event can be emitted\n         */\n        open: { type: Boolean, default: false },\n\n        /**\n         * Sets the dropdown to readonly state\n         */\n        readonly: { type: Boolean, default: false },\n\n        /**\n         * The input value\n         */\n        value: { type: String, default: '' },\n\n        /**\n         * The selected value's list box item.\n         */\n        selectedValueItem: {\n            type: [Object, Array] as PropType<BentoListboxOptionItem | BentoListboxOptionItem[]>,\n            default: undefined,\n        },\n\n        /**\n         * Toggles whether to use the slot content select items shown in the textbox in multiple mode.\n         */\n        showSlotContentInMultiple: { type: Boolean, default: false },\n\n        /**\n         * Dropdown size\n         */\n        size: {\n            type: String as PropType<BentoDropdownSize | `${BentoDropdownSize}`>,\n            default: null,\n        },\n    });\n\n    const emit = defineEmits([]);\n\n    const textbox = ref(null);\n    const textboxId = generateUid('textbox');\n\n    const conditionalClasses = computed(() => ({\n        [`b-dropdown-base-textbox--${DropdownBaseTextboxState.DISABLED}`]: props.disabled,\n        [`b-dropdown-base-textbox--${DropdownBaseTextboxState.READONLY}`]: props.readonly,\n        [`b-dropdown-base-textbox--${DropdownBaseTextboxState.HAS_ITEMS}`]: !!props.additionalItemsSelected,\n    }));\n\n    const comboboxConditionalClasses = computed(() => ({\n        [`b-dropdown-base-textbox__input--dynamic-filtering`]: props.dynamicFiltering,\n    }));\n\n    const isFiltering = computed(() => props.dynamicFiltering && !!props.value && props.open);\n\n    const ariaAttributes = computed(\n        () =>\n            ({\n                'aria-haspopup': 'listbox',\n                'aria-controls': props.ariaControls,\n                'aria-describedby': attrs['aria-describedby']?.toString() as string,\n                'aria-expanded': props.ariaExpanded ? 'true' : 'false',\n                'aria-labelledby': props.ariaLabelledby,\n                'aria-label': props.ariaLabelledby ? null : props.ariaLabel,\n                'aria-invalid': props.isInvalid,\n                'aria-disabled': props.disabled ? true : null,\n            } as HTMLAttributes)\n    );\n    // Cast selectedValueItem if it is an array of selected items\n    const selectedValueItems = computed(() =>\n        props.multiple ? (props.selectedValueItem as BentoListboxOptionItem[]) : []\n    );\n\n    const shouldShowInput = computed(() => props.dynamicFiltering && (props.open || props.alwaysComboboxIsInput));\n    const shouldShowSingleSelectSlot = computed(() => props.selectedValueItem && !props.multiple);\n    const shouldShowMultipleSlot = computed(\n        () =>\n            props.multiple &&\n            props.selectedValueItem &&\n            selectedValueItems.value.length > 0 &&\n            props.showSlotContentInMultiple\n    );\n\n    watch(\n        () => shouldShowInput.value,\n        () => {\n            if (shouldShowInput.value && !props.alwaysComboboxIsInput) {\n                nextTick(() => {\n                    textbox.value.focus();\n                });\n            }\n        }\n    );\n\n    const onOpenDropdown = () => {\n        if (!props.disabled && !props.readonly) {\n            textbox.value.focus();\n            emit(DropdownBaseTextboxEvent.OPEN);\n        }\n    };\n\n    const onCloseDropdown = () => {\n        if (props.open) {\n            textbox.value.focus();\n            emit(DropdownBaseTextboxEvent.CLOSE);\n        }\n    };\n\n    const onToggleDropdown = (event: Event) => {\n        const isDynamicFilteringInputClickEvent = props.open && (event.target as HTMLDivElement).tagName === 'INPUT';\n        if (isDynamicFilteringInputClickEvent) {\n            /**\n             * When there's a click even on the input during filtering\n             * and the popover is open, do not toggle the popover.\n             * Allow for click events inside the input field\n             */\n            return null;\n        }\n\n        return props.open ? onCloseDropdown() : onOpenDropdown();\n    };\n\n    const onClearSearch = () => {\n        emit(DropdownBaseTextboxEvent.CLEAR);\n        emit(DropdownBaseTextboxEvent.INPUT, '');\n        textbox.value.focus();\n    };\n    const onInputEvent = debounce<(event: Event) => void>((event: Event) => {\n        if (!props.readonly && !props.disabled) {\n            emit(DropdownBaseTextboxEvent.INPUT, (event.target as HTMLInputElement).value);\n        } else {\n            event.preventDefault();\n            event.stopPropagation();\n        }\n    }, props.debounceTime);\n\n    const focus = () => {\n        textbox.value.focus();\n    };\n\n    defineExpose({\n        focus,\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Only for internal use, implements the logic of the textbox element to be implemented in the combobox.\n     */\n    export default defineComponent({\n        i18n: { messages },\n        name: 'dropdown-base-textbox',\n        inheritAttrs: false,\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./dropdown-base-textbox.scss\" />\n","<template>\n    <div class=\"b-dropdown-default-textbox\" :class=\"conditionalClasses\" data-testid=\"default-textbox\">\n        <dropdown-base-textbox\n            ref=\"baseTextbox\"\n            v-bind=\"{ ...$attrs, ...$props }\"\n            class=\"b-dropdown-default-textbox__textbox\"\n            :value=\"value\"\n            v-on=\"listeners\"\n        >\n            <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n                <slot :name=\"innerSlot\" v-bind=\"scope\" />\n            </template>\n            <template #icon>\n                <div class=\"b-dropdown-default-textbox__chevron\">\n                    <chevron-up-icon v-show=\"isDropdownOpen\" svg-title=\"opened\" />\n                    <chevron-down-icon v-show=\"!isDropdownOpen\" svg-title=\"closed\" />\n                </div>\n            </template>\n        </dropdown-base-textbox>\n    </div>\n</template>\n\n<script lang=\"ts\" setup>\n    import { computed, defineComponent, PropType, ref, useSlots } from 'vue';\n    import DropdownBaseTextbox from '@/components/dropdown/components/dropdown-base-textbox/dropdown-base-textbox.vue';\n    import { BentoListboxOptionItem, Booleanish } from '@/types';\n    import { stopEventPropagation } from '@/utils/ts/events';\n    import {\n        DropdownBaseTextboxEvent,\n        DropdownBaseTextboxState,\n    } from '../dropdown-base-textbox/dropdown-base-textbox.types';\n    import ChevronDownIcon from '@adyen/ui-assets-icons-16/vue/chevron-down';\n    import ChevronUpIcon from '@adyen/ui-assets-icons-16/vue/chevron-up';\n\n    const emit = defineEmits([\"clear\", \"close\", \"input\", \"keydown\", \"open\"]);\n\n    const slots = useSlots();\n\n    const props = defineProps({\n        /**\n         * The number of additional items that have been selected in the dropdown.\n         */\n        additionalItemsSelected: { type: [Number, String] as PropType<number | string>, default: 0 },\n\n        /**\n         * Sets the aria-controls attribute on the textbox. This should correspond to the popover's id that the textbox triggers.\n         */\n        ariaControls: {\n            type: String,\n            required: true,\n        },\n\n        /**\n         * Indicates whether the content the textbox triggers is visible or not. Needs to be set accordingly when the textbox is used and changed every time the popover is shown/hidden.\n         */\n        ariaExpanded: {\n            type: [String, Boolean] as PropType<Booleanish>,\n            required: true,\n        },\n\n        /**\n         * If no label element is used then the aria-label is be set should be set.\n         */\n        ariaLabel: {\n            type: String,\n            default: null,\n        },\n\n        /**\n         * Corresponds to the label's id that labels the textbox element.\n         */\n        ariaLabelledby: {\n            type: String,\n            default: null,\n        },\n\n        /**\n         * Renders the dropdown with a condensed style.\n         */\n        condensed: { type: Boolean, default: false },\n\n        /**\n         * Custom debounce time. Default: 300\n         */\n        debounceTime: { type: Number, default: 300 },\n\n        /**\n         * Disables any textbox functionality\n         */\n        disabled: { type: Boolean, default: false },\n\n        /**\n         * Selected option's label\n         */\n        displayValue: { type: String, default: null },\n\n        /**\n         * Sets the possibility to type into the textbox\n         */\n        dynamicFiltering: {\n            type: Boolean,\n            default: false,\n        },\n\n        /**\n         * Marks the textbox as invalid, rendering an error state\n         */\n        isInvalid: { type: Boolean, default: false },\n\n        /**\n         * Indicates if the dropdown is open so that\n         * the respective event can be emitted\n         */\n        open: { type: Boolean, default: false },\n\n        /**\n         * Sets the dropdown to readonly state\n         */\n        readonly: { type: Boolean, default: false },\n\n        /**\n         * The selected value's list box item.\n         */\n        selectedValueItem: {\n            type: [Object, Array] as PropType<BentoListboxOptionItem | BentoListboxOptionItem[]>,\n            default: undefined,\n        },\n\n        /**\n         * Toggles whether to use the slot content select items shown in the textbox in multiple mode.\n         */\n        showSlotContentInMultiple: { type: Boolean, default: false },\n\n        /**\n         * The input value\n         */\n        value: { type: String, default: '' },\n\n        /*\n         * If enabled, the user will be able to select multiple items.\n         */\n        multiple: { type: Boolean, default: false },\n    });\n\n    const baseTextbox = ref(null);\n\n    const conditionalClasses = computed(() => ({\n        [`b-dropdown-default-textbox--${DropdownBaseTextboxState.ERROR}`]:\n            !props.disabled && !props.readonly && props.isInvalid,\n        [`b-dropdown-default-textbox--${DropdownBaseTextboxState.DISABLED}`]: props.disabled,\n        [`b-dropdown-default-textbox--${DropdownBaseTextboxState.READONLY}`]: props.readonly,\n        [`b-dropdown-default-textbox--${DropdownBaseTextboxState.OPENED}`]: props.open,\n        'b-dropdown-default-textbox--condensed': props.condensed,\n    }));\n\n    const isDropdownOpen = computed(() => props.open && !props.disabled && !props.readonly);\n\n    const onInput = (newInput: string) => {\n        emit('input', newInput);\n    };\n    const onKeyDown = (e: KeyboardEvent) => {\n        emit('keydown', e);\n    };\n    const openDropdown = (e: Event) => {\n        stopEventPropagation(e);\n        emit('open');\n    };\n    const closeDropdown = (e: Event) => {\n        stopEventPropagation(e);\n        emit('close');\n    };\n    const clearValue = (e: Event) => {\n        stopEventPropagation(e);\n        emit('clear');\n    };\n\n    const listeners = {\n        [DropdownBaseTextboxEvent.INPUT]: onInput,\n        [DropdownBaseTextboxEvent.OPEN]: openDropdown,\n        [DropdownBaseTextboxEvent.CLOSE]: closeDropdown,\n        [DropdownBaseTextboxEvent.CLEAR]: clearValue,\n        [DropdownBaseTextboxEvent.KEYDOWN]: onKeyDown,\n    };\n\n    const focus = () => {\n        baseTextbox.value.focus();\n    };\n\n    defineExpose({\n        focus,\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * For internal use only, textbox component used in the dropdown component.\n     */\n    export default defineComponent({\n        name: 'dropdown-default-textbox',\n        inheritAttrs: false,\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./dropdown-default-textbox.scss\" />\n"],"names":["BentoDropdownSize","BentoDropdownSize2","DropdownBaseTextboxState","DropdownBaseTextboxState2","DropdownBaseTextboxEvent","DropdownBaseTextboxEvent2","__default__$1","defineComponent","messages","t","useI18n","attrs","useAttrs","slots","useSlots","hasSlot","useHasSlot","textbox","ref","textboxId","generateUid","conditionalClasses","computed","props","comboboxConditionalClasses","isFiltering","ariaAttributes","_a","selectedValueItems","shouldShowInput","shouldShowSingleSelectSlot","shouldShowMultipleSlot","watch","nextTick","onOpenDropdown","emit","onCloseDropdown","onToggleDropdown","event","onClearSearch","onInputEvent","debounce","focus","expose","__default__","baseTextbox","isDropdownOpen","onInput","newInput","onKeyDown","e","openDropdown","stopEventPropagation","closeDropdown","clearValue","listeners"],"mappings":"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"}
+{"version":3,"file":"dropdown-default-textbox.DzPBw4CV.js","sources":["../../src/components/dropdown/dropdown.types.ts","../../src/components/dropdown/components/dropdown-base-textbox/dropdown-base-textbox.types.ts","../../src/components/dropdown/components/dropdown-base-textbox/dropdown-base-textbox.vue","../../src/components/dropdown/components/dropdown-default-textbox/dropdown-default-textbox.vue"],"sourcesContent":["/**\n * @deprecated Do not use. Only 'default' size should be used.\n */\nexport enum BentoDropdownSize {\n    DEFAULT = 'DropdownInputDefault',\n    SMALL = 'DropdownInputSmall',\n}\n\nexport {\n    /**\n     * @deprecated since version 2.0. Use the string literal instead.\n     */\n    BentoListboxLazyLoadType as BentoDropdownLazyLoadType,\n    BentoListboxEvent as BentoDropdownEvent,\n} from '@/types';\n\nexport type { BentoListboxSearchOptions as BentoDropdownSearchOptions } from '@/types';\nexport type { BentoListboxEmptyStateProps as BentoDropdownEmptyStateProps } from '@/types';\nexport type { BentoListboxVirtulisationOptions as BentoDropdownVirtulisationOptions } from '@/types';\n","import { PropType } from 'vue';\nimport { Booleanish } from '@/types';\n\n// TODO: Change this to script setup + Typescript interface\nexport const DropdownBaseTextboxProps = {\n    /**\n     * The number of additional items that have been selected in the dropdown.\n     */\n    additionalItemsSelected: { type: [Number, String] as PropType<number | string>, default: 0 },\n\n    /**\n     * Sets the possibility to type into the textbox\n     */\n    dynamicFiltering: {\n        type: Boolean,\n        default: false,\n    },\n\n    /**\n     * Sets the aria-controls attribute on the textbox. This should correspond to the popover's id that the textbox triggers.\n     */\n    ariaControls: {\n        type: String,\n        required: true,\n    },\n\n    /**\n     * Indicates whether the content the textbox triggers is visible or not. Needs to be set accordingly when the textbox is used and changed every time the popover is shown/hidden.\n     */\n    ariaExpanded: {\n        type: [String, Boolean] as PropType<Booleanish>,\n        required: true,\n    },\n\n    /**\n     * Corresponds to the label's id that labels the textbox element.\n     */\n    ariaLabelledby: {\n        type: String,\n        default: null,\n    },\n\n    /**\n     * Disables any textbox functionality\n     */\n    disabled: { type: Boolean, default: false },\n\n    /**\n     * Marks the textbox as invalid, rendering an error state\n     */\n    isInvalid: { type: Boolean, default: false },\n\n    /**\n     * Selected option's label\n     */\n    displayValue: { type: String, default: null },\n\n    /**\n     * Indicates if the dropdown is open so that\n     * the respective event can be emitted\n     */\n    open: { type: Boolean, default: false },\n\n    /**\n     * The input value\n     */\n    value: { type: String, default: '' },\n\n    /**\n     * Custom debounce time. Default: 300\n     */\n    debounceTime: { type: Number, default: 300 },\n};\n\nexport enum DropdownBaseTextboxState {\n    DISABLED = 'disabled',\n    READONLY = 'readonly',\n    HAS_ITEMS = 'has-items',\n    OPENED = 'opened',\n    ERROR = 'error',\n}\n\nexport enum DropdownBaseTextboxEvent {\n    OPEN = 'dropdown-base-open',\n    KEYDOWN = 'dropdown-base-keydown',\n    CLOSE = 'dropdown-base-close',\n    INPUT = 'dropdown-base-input',\n    CLEAR = 'dropdown-base-clear',\n}\n\nexport default DropdownBaseTextboxProps;\n","<template>\n    <div\n        :class=\"$attrs.class\"\n        data-testid=\"textbox-wrapper\"\n        @click=\"onToggleDropdown\"\n        @keydown.escape=\"onCloseDropdown\"\n    >\n        <bento-typography\n            class=\"b-dropdown-base-textbox\"\n            :class=\"conditionalClasses\"\n            el=\"div\"\n            data-testid=\"base-textbox\"\n        >\n            <input\n                v-if=\"shouldShowInput\"\n                v-bind=\"ariaAttributes\"\n                :id=\"textboxId\"\n                ref=\"textbox\"\n                class=\"b-dropdown-base-textbox__input\"\n                role=\"combobox\"\n                type=\"text\"\n                aria-autocomplete=\"list\"\n                size=\"1\"\n                :value=\"open ? value : displayValue\"\n                :disabled=\"disabled ? true : null\"\n                :readonly=\"readonly\"\n                @keydown=\"$emit(DropdownBaseTextboxEvent.KEYDOWN, $event)\"\n                @keydown.enter=\"onToggleDropdown\"\n                @input=\"onInputEvent\"\n            />\n            <div\n                v-else\n                :id=\"textboxId\"\n                v-bind=\"ariaAttributes\"\n                ref=\"textbox\"\n                class=\"b-dropdown-base-textbox__input\"\n                :class=\"comboboxConditionalClasses\"\n                role=\"combobox\"\n                :tabindex=\"0\"\n            >\n                <slot v-if=\"shouldShowSingleSelectSlot\" v-bind=\"selectedValueItem\">\n                    {{ displayValue }}\n                </slot>\n                <template v-else-if=\"shouldShowMultipleSlot\">\n                    <div class=\"b-dropdown-base-textbox__input-multiple-selected\">\n                        <div v-for=\"singleItem of selectedValueItems\" :key=\"singleItem.value\">\n                            <div class=\"b-dropdown-base-textbox__input-selected-element\">\n                                <slot v-bind=\"singleItem\">\n                                    {{ displayValue }}\n                                </slot>\n                            </div>\n                        </div>\n                    </div>\n                </template>\n                <template v-else>{{ displayValue }}</template>\n            </div>\n            <span v-if=\"additionalItemsSelected\" class=\"b-dropdown-base-textbox__additional-items\">\n                {{ additionalItemsSelected }}\n            </span>\n            <span v-if=\"hasSlot('icon') && !isFiltering\" class=\"b-dropdown-base-textbox__icon\" aria-hidden=\"true\">\n                <slot name=\"icon\"></slot>\n            </span>\n            <span\n                v-if=\"isFiltering\"\n                class=\"b-dropdown-base-textbox__clear-search\"\n                tabindex=\"0\"\n                data-testid=\"clear-search-button\"\n                @click.stop=\"onClearSearch\"\n                @keydown.enter.stop=\"onClearSearch\"\n                @keyup.space=\"onClearSearch\"\n            >\n                <cross-circle-fill-small-icon v-if=\"size === BentoDropdownSize.SMALL\" :svg-title=\"t('clearSearch')\" />\n                <cross-circle-fill-icon v-else :svg-title=\"t('clearSearch')\" />\n            </span>\n        </bento-typography>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, defineComponent, nextTick, PropType, ref, useAttrs, useSlots, watch } from 'vue';\n    import { generateUid } from '@/core/utils/ts';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { useHasSlot } from '@/composables';\n    import { BentoTypography } from '@/components/typography';\n    import { debounce } from '@/utils/ts/debounce';\n    import { BentoListboxOptionItem, Booleanish } from '@/types';\n    import type { HTMLAttributes } from 'vue/types/jsx.d.ts';\n    import { DropdownBaseTextboxEvent, DropdownBaseTextboxState } from './dropdown-base-textbox.types';\n    import CrossCircleFillIcon from '@adyen/ui-assets-icons-16/vue/cross-circle-fill';\n    import CrossCircleFillSmallIcon from '@adyen/ui-assets-icons-16/vue/cross-circle-fill-small';\n    import { BentoDropdownSize } from '@/components/dropdown/dropdown.types';\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n    const attrs = useAttrs();\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n    const props = defineProps({\n        /**\n         * The number of additional items that have been selected in the dropdown.\n         */\n        additionalItemsSelected: { type: [Number, String] as PropType<number | string>, default: 0 },\n\n        /**\n         * If the combobox DOM element should be an `input` element.\n         */\n        alwaysComboboxIsInput: {\n            type: Boolean,\n            default: false,\n        },\n\n        /**\n         * Sets the aria-controls attribute on the textbox. This should correspond to the popover's id that the textbox triggers.\n         */\n        ariaControls: { type: String, required: true },\n\n        /**\n         * Indicates whether the content the textbox triggers is visible or not. Needs to be set accordingly when the textbox is used and changed every time the popover is shown/hidden.\n         */\n        ariaExpanded: {\n            type: [String, Boolean] as PropType<Booleanish>,\n            required: true,\n        },\n\n        /**\n         * If no label element is used then the aria-label is be set should be set.\n         */\n        ariaLabel: { type: String, default: null },\n\n        /**\n         * Corresponds to the label's id that labels the textbox element.\n         */\n        ariaLabelledby: { type: String, default: null },\n\n        /**\n         * Custom debounce time for the user type event.\n         */\n        debounceTime: { type: Number, default: 300 },\n\n        /**\n         * Disables any textbox functionality\n         */\n        disabled: { type: Boolean, default: false },\n\n        /**\n         * Selected option's label\n         */\n        displayValue: { type: String, default: null },\n\n        /**\n         * Sets the possibility to type into the textbox.\n         */\n        dynamicFiltering: { type: Boolean, default: false },\n\n        /**\n         * Marks the textbox as invalid, rendering an error state\n         */\n        isInvalid: { type: Boolean, default: false },\n\n        /*\n         * If enabled, the user will be able to select multiple items.\n         */\n        multiple: { type: Boolean, default: false },\n\n        /**\n         * Indicates if the dropdown is open so that\n         * the respective event can be emitted\n         */\n        open: { type: Boolean, default: false },\n\n        /**\n         * Sets the dropdown to readonly state\n         */\n        readonly: { type: Boolean, default: false },\n\n        /**\n         * The input value\n         */\n        value: { type: String, default: '' },\n\n        /**\n         * The selected value's list box item.\n         */\n        selectedValueItem: {\n            type: [Object, Array] as PropType<BentoListboxOptionItem | BentoListboxOptionItem[]>,\n            default: undefined,\n        },\n\n        /**\n         * Toggles whether to use the slot content select items shown in the textbox in multiple mode.\n         */\n        showSlotContentInMultiple: { type: Boolean, default: false },\n\n        /**\n         * Dropdown size\n         */\n        size: {\n            type: String as PropType<BentoDropdownSize | `${BentoDropdownSize}`>,\n            default: null,\n        },\n    });\n\n    const emit = defineEmits([]);\n\n    const textbox = ref(null);\n    const textboxId = generateUid('textbox');\n\n    const conditionalClasses = computed(() => ({\n        [`b-dropdown-base-textbox--${DropdownBaseTextboxState.DISABLED}`]: props.disabled,\n        [`b-dropdown-base-textbox--${DropdownBaseTextboxState.READONLY}`]: props.readonly,\n        [`b-dropdown-base-textbox--${DropdownBaseTextboxState.HAS_ITEMS}`]: !!props.additionalItemsSelected,\n    }));\n\n    const comboboxConditionalClasses = computed(() => ({\n        [`b-dropdown-base-textbox__input--dynamic-filtering`]: props.dynamicFiltering,\n    }));\n\n    const isFiltering = computed(() => props.dynamicFiltering && !!props.value && props.open);\n\n    const ariaAttributes = computed(\n        () =>\n            ({\n                'aria-haspopup': 'listbox',\n                'aria-controls': props.ariaControls,\n                'aria-describedby': attrs['aria-describedby']?.toString() as string,\n                'aria-expanded': props.ariaExpanded ? 'true' : 'false',\n                'aria-labelledby': props.ariaLabelledby,\n                'aria-label': props.ariaLabelledby ? null : props.ariaLabel,\n                'aria-invalid': props.isInvalid,\n                'aria-disabled': props.disabled ? true : null,\n            } as HTMLAttributes)\n    );\n    // Cast selectedValueItem if it is an array of selected items\n    const selectedValueItems = computed(() =>\n        props.multiple ? (props.selectedValueItem as BentoListboxOptionItem[]) : []\n    );\n\n    const shouldShowInput = computed(() => props.dynamicFiltering && (props.open || props.alwaysComboboxIsInput));\n    const shouldShowSingleSelectSlot = computed(() => props.selectedValueItem && !props.multiple);\n    const shouldShowMultipleSlot = computed(\n        () =>\n            props.multiple &&\n            props.selectedValueItem &&\n            selectedValueItems.value.length > 0 &&\n            props.showSlotContentInMultiple\n    );\n\n    watch(\n        () => shouldShowInput.value,\n        () => {\n            if (shouldShowInput.value && !props.alwaysComboboxIsInput) {\n                nextTick(() => {\n                    textbox.value.focus();\n                });\n            }\n        }\n    );\n\n    const onOpenDropdown = () => {\n        if (!props.disabled && !props.readonly) {\n            textbox.value.focus();\n            emit(DropdownBaseTextboxEvent.OPEN);\n        }\n    };\n\n    const onCloseDropdown = () => {\n        if (props.open) {\n            textbox.value.focus();\n            emit(DropdownBaseTextboxEvent.CLOSE);\n        }\n    };\n\n    const onToggleDropdown = (event: Event) => {\n        const isDynamicFilteringInputClickEvent = props.open && (event.target as HTMLDivElement).tagName === 'INPUT';\n        if (isDynamicFilteringInputClickEvent) {\n            /**\n             * When there's a click even on the input during filtering\n             * and the popover is open, do not toggle the popover.\n             * Allow for click events inside the input field\n             */\n            return null;\n        }\n\n        return props.open ? onCloseDropdown() : onOpenDropdown();\n    };\n\n    const onClearSearch = () => {\n        emit(DropdownBaseTextboxEvent.CLEAR);\n        emit(DropdownBaseTextboxEvent.INPUT, '');\n        textbox.value.focus();\n    };\n    const onInputEvent = debounce<(event: Event) => void>((event: Event) => {\n        if (!props.readonly && !props.disabled) {\n            emit(DropdownBaseTextboxEvent.INPUT, (event.target as HTMLInputElement).value);\n        } else {\n            event.preventDefault();\n            event.stopPropagation();\n        }\n    }, props.debounceTime);\n\n    const focus = () => {\n        textbox.value.focus();\n    };\n\n    defineExpose({\n        focus,\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Only for internal use, implements the logic of the textbox element to be implemented in the combobox.\n     */\n    export default defineComponent({\n        i18n: { messages },\n        name: 'dropdown-base-textbox',\n        inheritAttrs: false,\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./dropdown-base-textbox.scss\" />\n","<template>\n    <div class=\"b-dropdown-default-textbox\" :class=\"conditionalClasses\" data-testid=\"default-textbox\">\n        <dropdown-base-textbox\n            ref=\"baseTextbox\"\n            v-bind=\"{ ...$attrs, ...$props }\"\n            class=\"b-dropdown-default-textbox__textbox\"\n            :value=\"value\"\n            v-on=\"listeners\"\n        >\n            <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n                <slot :name=\"innerSlot\" v-bind=\"scope\" />\n            </template>\n            <template #icon>\n                <div class=\"b-dropdown-default-textbox__chevron\">\n                    <chevron-up-icon v-show=\"isDropdownOpen\" svg-title=\"opened\" />\n                    <chevron-down-icon v-show=\"!isDropdownOpen\" svg-title=\"closed\" />\n                </div>\n            </template>\n        </dropdown-base-textbox>\n    </div>\n</template>\n\n<script lang=\"ts\" setup>\n    import { computed, defineComponent, PropType, ref, useSlots } from 'vue';\n    import DropdownBaseTextbox from '@/components/dropdown/components/dropdown-base-textbox/dropdown-base-textbox.vue';\n    import { BentoListboxOptionItem, Booleanish } from '@/types';\n    import { stopEventPropagation } from '@/utils/ts/events';\n    import {\n        DropdownBaseTextboxEvent,\n        DropdownBaseTextboxState,\n    } from '../dropdown-base-textbox/dropdown-base-textbox.types';\n    import ChevronDownIcon from '@adyen/ui-assets-icons-16/vue/chevron-down';\n    import ChevronUpIcon from '@adyen/ui-assets-icons-16/vue/chevron-up';\n\n    const emit = defineEmits([\"clear\", \"close\", \"input\", \"keydown\", \"open\"]);\n\n    const slots = useSlots();\n\n    const props = defineProps({\n        /**\n         * The number of additional items that have been selected in the dropdown.\n         */\n        additionalItemsSelected: { type: [Number, String] as PropType<number | string>, default: 0 },\n\n        /**\n         * Sets the aria-controls attribute on the textbox. This should correspond to the popover's id that the textbox triggers.\n         */\n        ariaControls: {\n            type: String,\n            required: true,\n        },\n\n        /**\n         * Indicates whether the content the textbox triggers is visible or not. Needs to be set accordingly when the textbox is used and changed every time the popover is shown/hidden.\n         */\n        ariaExpanded: {\n            type: [String, Boolean] as PropType<Booleanish>,\n            required: true,\n        },\n\n        /**\n         * If no label element is used then the aria-label is be set should be set.\n         */\n        ariaLabel: {\n            type: String,\n            default: null,\n        },\n\n        /**\n         * Corresponds to the label's id that labels the textbox element.\n         */\n        ariaLabelledby: {\n            type: String,\n            default: null,\n        },\n\n        /**\n         * Renders the dropdown with a condensed style.\n         */\n        condensed: { type: Boolean, default: false },\n\n        /**\n         * Custom debounce time. Default: 300\n         */\n        debounceTime: { type: Number, default: 300 },\n\n        /**\n         * Disables any textbox functionality\n         */\n        disabled: { type: Boolean, default: false },\n\n        /**\n         * Selected option's label\n         */\n        displayValue: { type: String, default: null },\n\n        /**\n         * Sets the possibility to type into the textbox\n         */\n        dynamicFiltering: {\n            type: Boolean,\n            default: false,\n        },\n\n        /**\n         * Marks the textbox as invalid, rendering an error state\n         */\n        isInvalid: { type: Boolean, default: false },\n\n        /**\n         * Indicates if the dropdown is open so that\n         * the respective event can be emitted\n         */\n        open: { type: Boolean, default: false },\n\n        /**\n         * Sets the dropdown to readonly state\n         */\n        readonly: { type: Boolean, default: false },\n\n        /**\n         * The selected value's list box item.\n         */\n        selectedValueItem: {\n            type: [Object, Array] as PropType<BentoListboxOptionItem | BentoListboxOptionItem[]>,\n            default: undefined,\n        },\n\n        /**\n         * Toggles whether to use the slot content select items shown in the textbox in multiple mode.\n         */\n        showSlotContentInMultiple: { type: Boolean, default: false },\n\n        /**\n         * The input value\n         */\n        value: { type: String, default: '' },\n\n        /*\n         * If enabled, the user will be able to select multiple items.\n         */\n        multiple: { type: Boolean, default: false },\n    });\n\n    const baseTextbox = ref(null);\n\n    const conditionalClasses = computed(() => ({\n        [`b-dropdown-default-textbox--${DropdownBaseTextboxState.ERROR}`]:\n            !props.disabled && !props.readonly && props.isInvalid,\n        [`b-dropdown-default-textbox--${DropdownBaseTextboxState.DISABLED}`]: props.disabled,\n        [`b-dropdown-default-textbox--${DropdownBaseTextboxState.READONLY}`]: props.readonly,\n        [`b-dropdown-default-textbox--${DropdownBaseTextboxState.OPENED}`]: props.open,\n        'b-dropdown-default-textbox--condensed': props.condensed,\n    }));\n\n    const isDropdownOpen = computed(() => props.open && !props.disabled && !props.readonly);\n\n    const onInput = (newInput: string) => {\n        emit('input', newInput);\n    };\n    const onKeyDown = (e: KeyboardEvent) => {\n        emit('keydown', e);\n    };\n    const openDropdown = (e: Event) => {\n        stopEventPropagation(e);\n        emit('open');\n    };\n    const closeDropdown = (e: Event) => {\n        stopEventPropagation(e);\n        emit('close');\n    };\n    const clearValue = (e: Event) => {\n        stopEventPropagation(e);\n        emit('clear');\n    };\n\n    const listeners = {\n        [DropdownBaseTextboxEvent.INPUT]: onInput,\n        [DropdownBaseTextboxEvent.OPEN]: openDropdown,\n        [DropdownBaseTextboxEvent.CLOSE]: closeDropdown,\n        [DropdownBaseTextboxEvent.CLEAR]: clearValue,\n        [DropdownBaseTextboxEvent.KEYDOWN]: onKeyDown,\n    };\n\n    const focus = () => {\n        baseTextbox.value.focus();\n    };\n\n    defineExpose({\n        focus,\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * For internal use only, textbox component used in the dropdown component.\n     */\n    export default defineComponent({\n        name: 'dropdown-default-textbox',\n        inheritAttrs: false,\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./dropdown-default-textbox.scss\" />\n"],"names":["BentoDropdownSize","BentoDropdownSize2","DropdownBaseTextboxState","DropdownBaseTextboxState2","DropdownBaseTextboxEvent","DropdownBaseTextboxEvent2","__default__$1","defineComponent","messages","t","useI18n","attrs","useAttrs","slots","useSlots","hasSlot","useHasSlot","textbox","ref","textboxId","generateUid","conditionalClasses","computed","props","comboboxConditionalClasses","isFiltering","ariaAttributes","_a","selectedValueItems","shouldShowInput","shouldShowSingleSelectSlot","shouldShowMultipleSlot","watch","nextTick","onOpenDropdown","emit","onCloseDropdown","onToggleDropdown","event","onClearSearch","onInputEvent","debounce","focus","expose","__default__","baseTextbox","isDropdownOpen","onInput","newInput","onKeyDown","e","openDropdown","stopEventPropagation","closeDropdown","clearValue","listeners"],"mappings":"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"}

package/dist/chunks/{dropdown-tag.DhENnOHT.js → dropdown-tag.K4idCLeu.js}

@@ -1,12 +1,12 @@
 import { defineComponent as a, computed as i, toRefs as m } from "vue";
 import { B as v } from "./avatar.BgwjpLQO.js";
-import { B as p } from "./dropdown.BBHNOorv.js";
+import { B as p } from "./dropdown.DFEGHxjw.js";
 import { n as c } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
 import { d as y, B as b } from "./typography.J1v_SPG3.js";
 import { u as w } from "./use-country-items.HFnjuDsG.js";
 import { B as d } from "./country.types.C0Q_hhgJ.js";
-import { L as f } from "./listbox-option-tag.BJBWnC2r.js";
-import { B as $ } from "./payment-method.BKr_q5cZ.js";
+import { L as f } from "./listbox-option-tag.bPRcATJK.js";
+import { B as $ } from "./payment-method.BudFG3aC.js";
 import "../assets/dropdown-tag.css";
 const B = a({
   name: "bento-dropdown-avatar"
@@ -212,4 +212,4 @@ export {
   nt as d,
   st as e
 };
-//# sourceMappingURL=dropdown-tag.DhENnOHT.js.map
+//# sourceMappingURL=dropdown-tag.K4idCLeu.js.map