@dialpad/dialtone-vue 2.197.0-next.1 → 2.198.0

package/dist/lib/datepicker/datepicker.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"datepicker.cjs","sources":["../../../components/datepicker/modules/month-year-picker.vue","../../../components/datepicker/modules/calendar.vue","../../../components/datepicker/datepicker.vue"],"sourcesContent":["<template>\n  <dt-stack\n    class=\"d-datepicker__month-year\"\n    direction=\"row\"\n    gap=\"300\"\n  >\n    <dt-stack\n      as=\"nav\"\n      class=\"d-datepicker__nav\"\n      direction=\"row\"\n      gap=\"200\"\n    >\n      <dt-tooltip\n        :fallback-placements=\"['top-start', 'auto']\"\n        :message=\"i18n.$t('DIALTONE_DATEPICKER_PREVIOUS_YEAR')\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-button\n            id=\"prevYearButton\"\n            :ref=\"refNames[0]\"\n            :aria-label=\"previousYearAriaLabel\"\n            :circle=\"true\"\n            class=\"d-datepicker__nav-btn\"\n            importance=\"clear\"\n            kind=\"muted\"\n            size=\"xs\"\n            type=\"button\"\n            @click=\"changeYear(-1)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            <dt-icon-chevrons-left\n              size=\"200\"\n            />\n          </dt-button>\n        </template>\n      </dt-tooltip>\n      <dt-tooltip\n        :fallback-placements=\"['top-start', 'auto']\"\n        :message=\"i18n.$t('DIALTONE_DATEPICKER_PREVIOUS_MONTH')\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-button\n            id=\"prevMonthButton\"\n            :ref=\"refNames[1]\"\n            :aria-label=\"previousMonthAriaLabel\"\n            :circle=\"true\"\n            class=\"d-datepicker__nav-btn\"\n            importance=\"clear\"\n            kind=\"muted\"\n            size=\"xs\"\n            type=\"button\"\n            @click=\"changeMonth(-1)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            <dt-icon-chevron-left\n              size=\"200\"\n            />\n          </dt-button>\n        </template>\n      </dt-tooltip>\n    </dt-stack>\n    <div\n      id=\"calendar-heading\"\n      class=\"d-datepicker__month-year-title\"\n    >\n      {{ formattedMonth(selectMonth) }}\n\n      {{ selectYear }}\n    </div>\n    <dt-stack\n      as=\"nav\"\n      class=\"d-datepicker__nav\"\n      direction=\"row\"\n      gap=\"200\"\n    >\n      <dt-tooltip\n        :fallback-placements=\"['top-end', 'auto']\"\n        :message=\"i18n.$t('DIALTONE_DATEPICKER_NEXT_MONTH')\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-button\n            id=\"nextMonthButton\"\n            :ref=\"refNames[2]\"\n            :aria-label=\"nextMonthAriaLabel\"\n            :circle=\"true\"\n            class=\"d-datepicker__nav-btn\"\n            importance=\"clear\"\n            kind=\"muted\"\n            size=\"xs\"\n            type=\"button\"\n            @click=\"changeMonth(1)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            <dt-icon-chevron-right\n              size=\"200\"\n            />\n          </dt-button>\n        </template>\n      </dt-tooltip>\n      <dt-tooltip\n        :fallback-placements=\"['top-end', 'auto']\"\n        :message=\"i18n.$t('DIALTONE_DATEPICKER_NEXT_YEAR')\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-button\n            id=\"nextYearButton\"\n            :ref=\"refNames[3]\"\n            :aria-label=\"nextYearAriaLabel\"\n            :circle=\"true\"\n            class=\"d-datepicker__nav-btn\"\n            importance=\"clear\"\n            kind=\"muted\"\n            size=\"xs\"\n            type=\"button\"\n            @click=\"changeYear(1)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            <dt-icon-chevrons-right\n              size=\"200\"\n            />\n          </dt-button>\n        </template>\n      </dt-tooltip>\n    </dt-stack>\n  </dt-stack>\n</template>\n\n<script>\nimport {\n  DtIconChevronLeft,\n  DtIconChevronsLeft,\n  DtIconChevronRight,\n  DtIconChevronsRight,\n} from '@dialpad/dialtone-icons/vue2';\nimport { getYear, addMonths, getMonth, set, subMonths, getDate } from 'date-fns';\nimport { getCalendarDays, formatMonth } from '../utils';\nimport { INTL_MONTH_FORMAT } from '../datepicker_constants';\nimport { DtStack } from '@/components/stack';\nimport { DtTooltip } from '@/components/tooltip';\nimport { DtButton } from '@/components/button';\nimport { DialtoneLocalization } from '@/localization';\n\nexport default {\n  name: 'DtDatepickerMonthYearPicker',\n\n  components: {\n    DtButton,\n    DtTooltip,\n    DtStack,\n    DtIconChevronLeft,\n    DtIconChevronsLeft,\n    DtIconChevronRight,\n    DtIconChevronsRight,\n  },\n\n  props: {\n    selectedDate: {\n      type: Date,\n      required: true,\n    },\n  },\n\n  emits: [\n    /**\n     * Will retrieve the calendar days of the given date\n     *\n     * @event calendar-days\n     * @type {Array}\n     */\n    'calendar-days',\n\n    /**\n     * Will focus first day in calendar\n     *\n     * @event focus-first-day\n     */\n    'focus-first-day',\n\n    /**\n     * Will focus last day in calendar\n     *\n     * @event focus-last-day\n     */\n    'focus-last-day',\n\n    /**\n     * Will close the datepicker\n     *\n     * @event close-datepicker\n     */\n    'close-datepicker',\n  ],\n\n  data () {\n    return {\n      selectMonth: getMonth(this.selectedDate),\n      selectYear: getYear(this.selectedDate),\n      highlightedDay: null,\n      focusPicker: 0,\n      focusRefs: [],\n      refNames: ['prevYearButtonRef', 'prevMonthButtonRef', 'nextMonthButtonRef', 'nextYearButtonRef'],\n      i18n: new DialtoneLocalization(),\n    };\n  },\n\n  computed: {\n    // Get days for the currently selected month and year and highlight the selected day\n    calendarDays () {\n      return getCalendarDays(this.selectMonth, this.selectYear, this.highlightedDay);\n    },\n\n    formattedMonth () {\n      return (month) => formatMonth(month, INTL_MONTH_FORMAT, this.i18n.currentLocale);\n    },\n\n    previousYearAriaLabel () {\n      return `${this.i18n.$t('DIALTONE_DATEPICKER_CHANGE_TO')} ${this.i18n.$t('DIALTONE_DATEPICKER_PREVIOUS_YEAR')} ${this.selectYear - 1}`;\n    },\n\n    previousMonthAriaLabel () {\n      return `${this.i18n.$t('DIALTONE_DATEPICKER_CHANGE_TO')} ${this.i18n.$t('DIALTONE_DATEPICKER_PREVIOUS_MONTH')} ${this.formattedMonth(this.selectMonth - 1)}`;\n    },\n\n    nextYearAriaLabel () {\n      return `${this.i18n.$t('DIALTONE_DATEPICKER_CHANGE_TO')} ${this.i18n.$t('DIALTONE_DATEPICKER_NEXT_YEAR')} ${this.selectYear + 1}`;\n    },\n\n    nextMonthAriaLabel () {\n      return `${this.i18n.$t('DIALTONE_DATEPICKER_CHANGE_TO')} ${this.i18n.$t('DIALTONE_DATEPICKER_NEXT_MONTH')} ${this.formattedMonth(this.selectMonth + 1)}`;\n    },\n  },\n\n  watch: {\n    selectMonth: {\n      handler () {\n        this.highlightDay();\n        this.$emit('calendar-days', this.calendarDays);\n      },\n\n      immediate: true,\n    },\n\n    selectYear: {\n      handler () {\n        this.highlightDay();\n        this.$emit('calendar-days', this.calendarDays);\n      },\n\n      immediate: true,\n    },\n\n  },\n\n  mounted () {\n    this.setButtonsRef();\n    this.focusMonthYearPicker();\n  },\n\n  methods: {\n    setButtonsRef () {\n      this.focusRefs = this.refNames.map(refName => this.$refs[refName]);\n    },\n\n    focusMonthYearPicker () {\n      this.focusPicker = 0;\n      this.focusRefs[0].$el.focus();\n    },\n\n    handleKeyDown (event) {\n      switch (event.key) {\n        case 'ArrowLeft':\n          event.preventDefault();\n          if (this.focusPicker === 0) {\n            this.focusPicker = 3;\n            this.focusRefs[this.focusPicker].$el.focus();\n          } else {\n            this.focusPicker--;\n            this.focusRefs[this.focusPicker].$el.focus();\n          }\n          break;\n\n        case 'ArrowRight':\n          event.preventDefault();\n          if (this.focusPicker === 3) {\n            this.focusPicker = 0;\n            this.focusRefs[this.focusPicker].$el.focus();\n          } else {\n            this.focusPicker++;\n            this.focusRefs[this.focusPicker].$el.focus();\n          }\n          break;\n\n        case 'ArrowDown':\n          event.preventDefault();\n          this.$emit('focus-first-day');\n          break;\n\n        case 'Tab':\n          event.preventDefault();\n          this.$emit('focus-first-day');\n          break;\n\n        case 'Escape':\n          this.$emit('close-datepicker');\n          break;\n      }\n    },\n\n    highlightDay () {\n      const year = getYear(this.selectedDate);\n      const month = getMonth(this.selectedDate);\n\n      if (year !== this.selectYear || month !== this.selectMonth) {\n        this.highlightedDay = null;\n      } else {\n        this.highlightedDay = getDate(this.selectedDate);\n      }\n    },\n\n    changeMonth (value) {\n      // Adjust year when changing from January to December or vice versa\n      if ((this.selectMonth === 0 && value === -1) || (this.selectMonth === 11 && value === 1)) {\n        this.selectYear += value;\n      }\n\n      // Calculate the new date by adding or subtracting months\n      const initialDate = set(this.selectedDate, { month: this.selectMonth, year: this.selectYear });\n      const newDate = value === 1 ? addMonths(initialDate, 1) : subMonths(initialDate, 1);\n\n      // Update the selected month\n      this.selectMonth = getMonth(newDate);\n    },\n\n    changeYear (value) {\n      this.selectYear = this.selectYear + value;\n    },\n\n    goToNextMonth () {\n      this.changeMonth(1);\n    },\n\n    goToPrevMonth () {\n      this.changeMonth(-1);\n    },\n  },\n};\n</script>\n","<template>\n  <table\n    class=\"d-datepicker__calendar\"\n    aria-labelledby=\"calendar-heading\"\n  >\n    <thead>\n      <tr>\n        <th\n          v-for=\"day in weekDays\"\n          :key=\"day\"\n          scope=\"col\"\n          class=\"d-datepicker__cell d-datepicker__cell--header\"\n        >\n          <span\n            class=\"d-datepicker__weekday\"\n            :title=\"day\"\n            :aria-label=\"day\"\n          > {{ day }}</span>\n        </th>\n      </tr>\n    </thead>\n    <tbody>\n      <tr\n        v-for=\"(week, indexWeek) in calendarDays\"\n        :key=\"indexWeek\"\n      >\n        <td\n          v-for=\"(day, indexDays) in week.days\"\n          :key=\"indexWeek + indexDays\"\n          class=\"d-datepicker__cell\"\n          role=\"listbox\"\n        >\n          <dt-button\n            :ref=\"`buttonRef_${indexWeek}_${indexDays}`\"\n            class=\"d-datepicker__day\"\n            :circle=\"true\"\n            size=\"sm\"\n            importance=\"clear\"\n            :disabled=\"!day.currentMonth\"\n            :class=\"{\n              'd-datepicker__day--disabled': !day.currentMonth,\n              'd-datepicker__day--selected': selectedDay\n                ? ((day.text === selectedDay) && day.currentMonth)\n                : day.selected,\n            }\"\n            type=\"button\"\n            :aria-selected=\"!!selectedDay ? ((day.text === selectedDay) && day.currentMonth) : day.selected\"\n            :aria-label=\"dayAriaLabel(day)\"\n            role=\"option\"\n            @click=\"selectDay(day)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            {{ day.text }}\n          </dt-button>\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</template>\n\n<script>\nimport { getWeekDayNames, calculateNextFocusDate, calculatePrevFocusDate, formatDate } from '../utils';\nimport { WEEK_START, INTL_MONTH_FORMAT } from '../datepicker_constants.js';\nimport { DtButton } from '@/components/button';\nimport { DialtoneLocalization } from '@/localization';\n\nexport default {\n  name: 'DtDatepickerCalendar',\n  components: { DtButton },\n\n  props: {\n    calendarDays: {\n      type: Array,\n      required: true,\n    },\n  },\n\n  emits: [\n    /**\n     * Event fired when a date is selected\n     *\n     * @event select-date\n     * @type {Date}\n     */\n    'select-date',\n\n    /**\n     * Will focus the month and year picker\n     *\n     * @event focus-month-year-picker\n     */\n    'focus-month-year-picker',\n\n    /**\n     * Will close the datepicker\n     *\n     * @event close-datepicker\n     */\n    'close-datepicker',\n  ],\n\n  data () {\n    return {\n      // local selectedDay to override the received by props calendarDays\n      selectedDay: null,\n      focusDay: 0,\n      daysRef: [],\n      i18n: new DialtoneLocalization(),\n    };\n  },\n\n  computed: {\n    weekDays () {\n      return getWeekDayNames(this.i18n.currentLocale, WEEK_START);\n    },\n  },\n\n  watch: {\n    calendarDays () {\n      // on calendarDays update, reset our local variables\n      this.focusDay = 0;\n      this.selectedDay = null;\n\n      this.daysRef = [];\n\n      this.$nextTick(() => {\n        this.daysRef = [];\n        this.setDayRef();\n      });\n    },\n  },\n\n  methods: {\n    dayAriaLabel (day) {\n      return this.i18n.$t('DIALTONE_DATEPICKER_SELECT_DAY') + ` ${formatDate(day.value, INTL_MONTH_FORMAT, this.i18n.currentLocale)}`;\n    },\n\n    setDayRef () {\n      this.calendarDays.forEach((week, weekIndex) => {\n        week.days.forEach((day, dayIndex) => {\n          const refKey = `buttonRef_${weekIndex}_${dayIndex}`;\n          const dayButton = this.$refs[refKey];\n          if (dayButton && day.currentMonth) {\n            this.daysRef.push({ el: dayButton[0], day });\n          }\n        });\n      });\n    },\n\n    handleKeyDown (event) {\n      switch (event.key) {\n        case 'ArrowUp':\n          event.preventDefault();\n          this.focusDay -= 7;\n          try {\n            this.daysRef[this.focusDay].el.$el.focus();\n          } catch {\n            const prevFocusDate = calculatePrevFocusDate(this.daysRef[this.focusDay + 7].day.value);\n            this.$emit('go-to-prev-month');\n            this.$nextTick(() => {\n              this.setDayRef();\n              this.daysRef[prevFocusDate - 1].el.$el.focus();\n              this.focusDay += prevFocusDate - 1;\n            });\n          }\n          break;\n\n        case 'ArrowDown':\n          event.preventDefault();\n          this.focusDay += 7;\n          try {\n            this.daysRef[this.focusDay].el.$el.focus();\n          } catch {\n            const nextFocusDate = calculateNextFocusDate(this.daysRef[this.focusDay - 7].day.value);\n            this.$emit('go-to-next-month');\n            this.$nextTick(() => {\n              this.setDayRef();\n              this.daysRef[nextFocusDate - 1].el.$el.focus();\n              this.focusDay += nextFocusDate - 1;\n            });\n          }\n          break;\n\n        case 'ArrowLeft':\n          event.preventDefault();\n          if (this.focusDay > 0) {\n            this.focusDay -= 1;\n            this.daysRef[this.focusDay].el.$el.focus();\n          } else {\n            // if we are on month first day, jump to last day of prev month\n            this.$emit('go-to-prev-month');\n            this.$nextTick(() => {\n              this.focusLastDay();\n            });\n          }\n          break;\n\n        case 'ArrowRight':\n          event.preventDefault();\n          if (this.focusDay < this.daysRef.length - 1) {\n            this.focusDay += 1;\n            this.daysRef[this.focusDay].el.$el.focus();\n          } else {\n            // if we are on month last day, jump to first day of next month\n            this.$emit('go-to-next-month');\n            this.$nextTick(() => {\n              this.focusFirstDay();\n            });\n          }\n          break;\n\n        case 'Tab':\n          event.preventDefault();\n          this.$emit('focus-month-year-picker');\n          break;\n\n        case 'Escape':\n          this.$emit('close-datepicker');\n          break;\n      }\n    },\n\n    focusFirstDay () {\n      this.focusDay = 0;\n      this.$nextTick(() => {\n        this.daysRef[this.focusDay].el.$el.focus();\n      });\n    },\n\n    focusLastDay () {\n      this.$nextTick(() => {\n        this.focusDay = this.daysRef.length - 1;\n        this.daysRef[this.focusDay].el.$el.focus();\n      });\n    },\n\n    selectDay (day) {\n      if (!day.currentMonth) { return; }\n\n      // local selectedDay is updated when a day is selected\n      this.selectedDay = day.text;\n      this.$emit('select-date', day.value);\n    },\n  },\n};\n</script>\n","<!-- eslint-disable vue/multi-word-component-names -->\n<template>\n  <dt-stack\n    class=\"d-datepicker\"\n    gap=\"400\"\n  >\n    <div class=\"d-datepicker__hd\">\n      <month-year-picker\n        ref=\"monthYearPicker\"\n        :selected-date=\"selectedDate\"\n        @calendar-days=\"updateCalendarDays\"\n        @focus-first-day=\"$refs.calendar.focusFirstDay()\"\n        @focus-last-day=\"$refs.calendar.focusLastDay()\"\n        @close-datepicker=\"$emit('close-datepicker')\"\n      />\n    </div>\n    <div class=\"d-datepicker__bd\">\n      <calendar\n        ref=\"calendar\"\n        :calendar-days=\"calendarDays\"\n        @select-date=\"$emit('selected-date', $event)\"\n        @focus-month-year-picker=\"$refs.monthYearPicker.focusMonthYearPicker()\"\n        @close-datepicker=\"$emit('close-datepicker')\"\n        @go-to-next-month=\"$refs.monthYearPicker.goToNextMonth()\"\n        @go-to-prev-month=\"$refs.monthYearPicker.goToPrevMonth()\"\n      />\n    </div>\n  </dt-stack>\n</template>\n\n<script>\nimport MonthYearPicker from './modules/month-year-picker.vue';\nimport Calendar from './modules/calendar.vue';\nimport { DtStack } from '@/components/stack';\nimport { warnIfUnmounted } from '@/common/utils';\n\nexport default {\n  name: 'DtDatepicker',\n\n  components: { DtStack, MonthYearPicker, Calendar },\n\n  props: {\n    /**\n     * Selected date\n     *\n     * @type {Date}\n     */\n    selectedDate: {\n      type: Date,\n      default: () => (new Date()),\n    },\n  },\n\n  emits: [\n    /**\n     * Event fired when a date is selected\n     *\n     * @event selected-date\n     * @type {Date}\n     */\n    'selected-date',\n\n    /**\n     * Event fired when user presses the esc key\n     *\n     * @event close-datepicker\n     */\n    'close-datepicker',\n  ],\n\n  data () {\n    return {\n      calendarDays: [],\n    };\n  },\n\n  mounted () {\n    warnIfUnmounted(this.$el, this.$options.name);\n  },\n\n  methods: {\n    updateCalendarDays (days) {\n      this.calendarDays = days;\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtButton","DtTooltip","DtStack","DtIconChevronLeft","DtIconChevronsLeft","DtIconChevronRight","DtIconChevronsRight","getMonth","getYear","DialtoneLocalization","getCalendarDays","month","formatMonth","INTL_MONTH_FORMAT","refName","event","year","getDate","value","initialDate","set","newDate","addMonths","subMonths","getWeekDayNames","WEEK_START","day","formatDate","week","weekIndex","dayIndex","refKey","dayButton","prevFocusDate","calculatePrevFocusDate","nextFocusDate","calculateNextFocusDate","MonthYearPicker","Calendar","warnIfUnmounted","days"],"mappings":"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"}
+{"version":3,"file":"datepicker.cjs","sources":["../../../components/datepicker/modules/month-year-picker.vue","../../../components/datepicker/modules/calendar.vue","../../../components/datepicker/datepicker.vue"],"sourcesContent":["<template>\n  <dt-stack\n    class=\"d-datepicker__month-year\"\n    direction=\"row\"\n    gap=\"300\"\n  >\n    <dt-stack\n      as=\"nav\"\n      class=\"d-datepicker__nav\"\n      direction=\"row\"\n      gap=\"200\"\n    >\n      <dt-tooltip\n        :fallback-placements=\"['top-start', 'auto']\"\n        :message=\"i18n.$t('DIALTONE_DATEPICKER_PREVIOUS_YEAR')\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-button\n            id=\"prevYearButton\"\n            :ref=\"refNames[0]\"\n            :aria-label=\"previousYearAriaLabel\"\n            :circle=\"true\"\n            class=\"d-datepicker__nav-btn\"\n            importance=\"clear\"\n            kind=\"muted\"\n            size=\"xs\"\n            type=\"button\"\n            @click=\"changeYear(-1)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            <dt-icon-chevrons-left\n              size=\"200\"\n            />\n          </dt-button>\n        </template>\n      </dt-tooltip>\n      <dt-tooltip\n        :fallback-placements=\"['top-start', 'auto']\"\n        :message=\"i18n.$t('DIALTONE_DATEPICKER_PREVIOUS_MONTH')\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-button\n            id=\"prevMonthButton\"\n            :ref=\"refNames[1]\"\n            :aria-label=\"previousMonthAriaLabel\"\n            :circle=\"true\"\n            class=\"d-datepicker__nav-btn\"\n            importance=\"clear\"\n            kind=\"muted\"\n            size=\"xs\"\n            type=\"button\"\n            @click=\"changeMonth(-1)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            <dt-icon-chevron-left\n              size=\"200\"\n            />\n          </dt-button>\n        </template>\n      </dt-tooltip>\n    </dt-stack>\n    <div\n      id=\"calendar-heading\"\n      class=\"d-datepicker__month-year-title\"\n    >\n      {{ formattedMonth(selectMonth) }}\n\n      {{ selectYear }}\n    </div>\n    <dt-stack\n      as=\"nav\"\n      class=\"d-datepicker__nav\"\n      direction=\"row\"\n      gap=\"200\"\n    >\n      <dt-tooltip\n        :fallback-placements=\"['top-end', 'auto']\"\n        :message=\"i18n.$t('DIALTONE_DATEPICKER_NEXT_MONTH')\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-button\n            id=\"nextMonthButton\"\n            :ref=\"refNames[2]\"\n            :aria-label=\"nextMonthAriaLabel\"\n            :circle=\"true\"\n            class=\"d-datepicker__nav-btn\"\n            importance=\"clear\"\n            kind=\"muted\"\n            size=\"xs\"\n            type=\"button\"\n            @click=\"changeMonth(1)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            <dt-icon-chevron-right\n              size=\"200\"\n            />\n          </dt-button>\n        </template>\n      </dt-tooltip>\n      <dt-tooltip\n        :fallback-placements=\"['top-end', 'auto']\"\n        :message=\"i18n.$t('DIALTONE_DATEPICKER_NEXT_YEAR')\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-button\n            id=\"nextYearButton\"\n            :ref=\"refNames[3]\"\n            :aria-label=\"nextYearAriaLabel\"\n            :circle=\"true\"\n            class=\"d-datepicker__nav-btn\"\n            importance=\"clear\"\n            kind=\"muted\"\n            size=\"xs\"\n            type=\"button\"\n            @click=\"changeYear(1)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            <dt-icon-chevrons-right\n              size=\"200\"\n            />\n          </dt-button>\n        </template>\n      </dt-tooltip>\n    </dt-stack>\n  </dt-stack>\n</template>\n\n<script>\nimport {\n  DtIconChevronLeft,\n  DtIconChevronsLeft,\n  DtIconChevronRight,\n  DtIconChevronsRight,\n} from '@dialpad/dialtone-icons/vue2';\nimport { getYear, addMonths, getMonth, set, subMonths, getDate } from 'date-fns';\nimport { getCalendarDays, formatMonth } from '../utils';\nimport { INTL_MONTH_FORMAT } from '../datepicker_constants';\nimport { DtStack } from '@/components/stack';\nimport { DtTooltip } from '@/components/tooltip';\nimport { DtButton } from '@/components/button';\nimport { DialtoneLocalization } from '@/localization';\n\nexport default {\n  name: 'DtDatepickerMonthYearPicker',\n\n  components: {\n    DtButton,\n    DtTooltip,\n    DtStack,\n    DtIconChevronLeft,\n    DtIconChevronsLeft,\n    DtIconChevronRight,\n    DtIconChevronsRight,\n  },\n\n  props: {\n    selectedDate: {\n      type: Date,\n      required: true,\n    },\n  },\n\n  emits: [\n    /**\n     * Will retrieve the calendar days of the given date\n     *\n     * @event calendar-days\n     * @type {Array}\n     */\n    'calendar-days',\n\n    /**\n     * Will focus first day in calendar\n     *\n     * @event focus-first-day\n     */\n    'focus-first-day',\n\n    /**\n     * Will focus last day in calendar\n     *\n     * @event focus-last-day\n     */\n    'focus-last-day',\n\n    /**\n     * Will close the datepicker\n     *\n     * @event close-datepicker\n     */\n    'close-datepicker',\n  ],\n\n  data () {\n    return {\n      selectMonth: getMonth(this.selectedDate),\n      selectYear: getYear(this.selectedDate),\n      highlightedDay: null,\n      focusPicker: 0,\n      focusRefs: [],\n      refNames: ['prevYearButtonRef', 'prevMonthButtonRef', 'nextMonthButtonRef', 'nextYearButtonRef'],\n      i18n: new DialtoneLocalization(),\n    };\n  },\n\n  computed: {\n    // Get days for the currently selected month and year and highlight the selected day\n    calendarDays () {\n      return getCalendarDays(this.selectMonth, this.selectYear, this.highlightedDay);\n    },\n\n    formattedMonth () {\n      return (month) => formatMonth(month, INTL_MONTH_FORMAT, this.i18n.currentLocale);\n    },\n\n    previousYearAriaLabel () {\n      return `${this.i18n.$t('DIALTONE_DATEPICKER_CHANGE_TO')} ${this.i18n.$t('DIALTONE_DATEPICKER_PREVIOUS_YEAR')} ${this.selectYear - 1}`;\n    },\n\n    previousMonthAriaLabel () {\n      return `${this.i18n.$t('DIALTONE_DATEPICKER_CHANGE_TO')} ${this.i18n.$t('DIALTONE_DATEPICKER_PREVIOUS_MONTH')} ${this.formattedMonth(this.selectMonth - 1)}`;\n    },\n\n    nextYearAriaLabel () {\n      return `${this.i18n.$t('DIALTONE_DATEPICKER_CHANGE_TO')} ${this.i18n.$t('DIALTONE_DATEPICKER_NEXT_YEAR')} ${this.selectYear + 1}`;\n    },\n\n    nextMonthAriaLabel () {\n      return `${this.i18n.$t('DIALTONE_DATEPICKER_CHANGE_TO')} ${this.i18n.$t('DIALTONE_DATEPICKER_NEXT_MONTH')} ${this.formattedMonth(this.selectMonth + 1)}`;\n    },\n  },\n\n  watch: {\n    selectMonth: {\n      handler () {\n        this.highlightDay();\n        this.$emit('calendar-days', this.calendarDays);\n      },\n\n      immediate: true,\n    },\n\n    selectYear: {\n      handler () {\n        this.highlightDay();\n        this.$emit('calendar-days', this.calendarDays);\n      },\n\n      immediate: true,\n    },\n\n  },\n\n  mounted () {\n    this.setButtonsRef();\n    this.focusMonthYearPicker();\n  },\n\n  methods: {\n    setButtonsRef () {\n      this.focusRefs = this.refNames.map(refName => this.$refs[refName]);\n    },\n\n    focusMonthYearPicker () {\n      this.focusPicker = 0;\n      this.focusRefs[0].$el.focus();\n    },\n\n    handleKeyDown (event) {\n      switch (event.key) {\n        case 'ArrowLeft':\n          event.preventDefault();\n          if (this.focusPicker === 0) {\n            this.focusPicker = 3;\n            this.focusRefs[this.focusPicker].$el.focus();\n          } else {\n            this.focusPicker--;\n            this.focusRefs[this.focusPicker].$el.focus();\n          }\n          break;\n\n        case 'ArrowRight':\n          event.preventDefault();\n          if (this.focusPicker === 3) {\n            this.focusPicker = 0;\n            this.focusRefs[this.focusPicker].$el.focus();\n          } else {\n            this.focusPicker++;\n            this.focusRefs[this.focusPicker].$el.focus();\n          }\n          break;\n\n        case 'ArrowDown':\n          event.preventDefault();\n          this.$emit('focus-first-day');\n          break;\n\n        case 'Tab':\n          event.preventDefault();\n          this.$emit('focus-first-day');\n          break;\n\n        case 'Escape':\n          this.$emit('close-datepicker');\n          break;\n      }\n    },\n\n    highlightDay () {\n      const year = getYear(this.selectedDate);\n      const month = getMonth(this.selectedDate);\n\n      if (year !== this.selectYear || month !== this.selectMonth) {\n        this.highlightedDay = null;\n      } else {\n        this.highlightedDay = getDate(this.selectedDate);\n      }\n    },\n\n    changeMonth (value) {\n      // Adjust year when changing from January to December or vice versa\n      if ((this.selectMonth === 0 && value === -1) || (this.selectMonth === 11 && value === 1)) {\n        this.selectYear += value;\n      }\n\n      // Calculate the new date by adding or subtracting months\n      const initialDate = set(this.selectedDate, { month: this.selectMonth, year: this.selectYear });\n      const newDate = value === 1 ? addMonths(initialDate, 1) : subMonths(initialDate, 1);\n\n      // Update the selected month\n      this.selectMonth = getMonth(newDate);\n    },\n\n    changeYear (value) {\n      this.selectYear = this.selectYear + value;\n    },\n\n    goToNextMonth () {\n      this.changeMonth(1);\n    },\n\n    goToPrevMonth () {\n      this.changeMonth(-1);\n    },\n  },\n};\n</script>\n","<template>\n  <table\n    class=\"d-datepicker__calendar\"\n    aria-labelledby=\"calendar-heading\"\n  >\n    <thead>\n      <tr>\n        <th\n          v-for=\"day in weekDays\"\n          :key=\"day\"\n          scope=\"col\"\n          class=\"d-datepicker__cell d-datepicker__cell--header\"\n        >\n          <span\n            class=\"d-datepicker__weekday\"\n            :title=\"day\"\n            :aria-label=\"day\"\n          > {{ day }}</span>\n        </th>\n      </tr>\n    </thead>\n    <tbody>\n      <tr\n        v-for=\"(week, indexWeek) in calendarDays\"\n        :key=\"indexWeek\"\n      >\n        <td\n          v-for=\"(day, indexDays) in week.days\"\n          :key=\"indexWeek + indexDays\"\n          class=\"d-datepicker__cell\"\n          role=\"listbox\"\n        >\n          <dt-button\n            :ref=\"`buttonRef_${indexWeek}_${indexDays}`\"\n            class=\"d-datepicker__day\"\n            :circle=\"true\"\n            size=\"sm\"\n            importance=\"clear\"\n            :disabled=\"!day.currentMonth\"\n            :class=\"{\n              'd-datepicker__day--disabled': !day.currentMonth,\n              'd-datepicker__day--selected': selectedDay\n                ? ((day.text === selectedDay) && day.currentMonth)\n                : day.selected,\n            }\"\n            type=\"button\"\n            :aria-selected=\"!!selectedDay ? ((day.text === selectedDay) && day.currentMonth) : day.selected\"\n            :aria-label=\"dayAriaLabel(day)\"\n            role=\"option\"\n            @click=\"selectDay(day)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            {{ day.text }}\n          </dt-button>\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</template>\n\n<script>\nimport { getWeekDayNames, calculateNextFocusDate, calculatePrevFocusDate, formatDate } from '../utils';\nimport { WEEK_START, INTL_MONTH_FORMAT } from '../datepicker_constants.js';\nimport { DtButton } from '@/components/button';\nimport { DialtoneLocalization } from '@/localization';\n\nexport default {\n  name: 'DtDatepickerCalendar',\n  components: { DtButton },\n\n  props: {\n    calendarDays: {\n      type: Array,\n      required: true,\n    },\n  },\n\n  emits: [\n    /**\n     * Event fired when a date is selected\n     *\n     * @event select-date\n     * @type {Date}\n     */\n    'select-date',\n\n    /**\n     * Will focus the month and year picker\n     *\n     * @event focus-month-year-picker\n     */\n    'focus-month-year-picker',\n\n    /**\n     * Will close the datepicker\n     *\n     * @event close-datepicker\n     */\n    'close-datepicker',\n  ],\n\n  data () {\n    return {\n      // local selectedDay to override the received by props calendarDays\n      selectedDay: null,\n      focusDay: 0,\n      daysRef: [],\n      i18n: new DialtoneLocalization(),\n    };\n  },\n\n  computed: {\n    weekDays () {\n      return getWeekDayNames(this.i18n.currentLocale, WEEK_START);\n    },\n  },\n\n  watch: {\n    calendarDays () {\n      // on calendarDays update, reset our local variables\n      this.focusDay = 0;\n      this.selectedDay = null;\n\n      this.daysRef = [];\n\n      this.$nextTick(() => {\n        this.daysRef = [];\n        this.setDayRef();\n      });\n    },\n  },\n\n  methods: {\n    dayAriaLabel (day) {\n      return this.i18n.$t('DIALTONE_DATEPICKER_SELECT_DAY') + ` ${formatDate(day.value, INTL_MONTH_FORMAT, this.i18n.currentLocale)}`;\n    },\n\n    setDayRef () {\n      this.calendarDays.forEach((week, weekIndex) => {\n        week.days.forEach((day, dayIndex) => {\n          const refKey = `buttonRef_${weekIndex}_${dayIndex}`;\n          const dayButton = this.$refs[refKey];\n          if (dayButton && day.currentMonth) {\n            this.daysRef.push({ el: dayButton[0], day });\n          }\n        });\n      });\n    },\n\n    handleKeyDown (event) {\n      switch (event.key) {\n        case 'ArrowUp':\n          event.preventDefault();\n          this.focusDay -= 7;\n          try {\n            this.daysRef[this.focusDay].el.$el.focus();\n          } catch {\n            const prevFocusDate = calculatePrevFocusDate(this.daysRef[this.focusDay + 7].day.value);\n            this.$emit('go-to-prev-month');\n            this.$nextTick(() => {\n              this.setDayRef();\n              this.daysRef[prevFocusDate - 1].el.$el.focus();\n              this.focusDay += prevFocusDate - 1;\n            });\n          }\n          break;\n\n        case 'ArrowDown':\n          event.preventDefault();\n          this.focusDay += 7;\n          try {\n            this.daysRef[this.focusDay].el.$el.focus();\n          } catch {\n            const nextFocusDate = calculateNextFocusDate(this.daysRef[this.focusDay - 7].day.value);\n            this.$emit('go-to-next-month');\n            this.$nextTick(() => {\n              this.setDayRef();\n              this.daysRef[nextFocusDate - 1].el.$el.focus();\n              this.focusDay += nextFocusDate - 1;\n            });\n          }\n          break;\n\n        case 'ArrowLeft':\n          event.preventDefault();\n          if (this.focusDay > 0) {\n            this.focusDay -= 1;\n            this.daysRef[this.focusDay].el.$el.focus();\n          } else {\n            // if we are on month first day, jump to last day of prev month\n            this.$emit('go-to-prev-month');\n            this.$nextTick(() => {\n              this.focusLastDay();\n            });\n          }\n          break;\n\n        case 'ArrowRight':\n          event.preventDefault();\n          if (this.focusDay < this.daysRef.length - 1) {\n            this.focusDay += 1;\n            this.daysRef[this.focusDay].el.$el.focus();\n          } else {\n            // if we are on month last day, jump to first day of next month\n            this.$emit('go-to-next-month');\n            this.$nextTick(() => {\n              this.focusFirstDay();\n            });\n          }\n          break;\n\n        case 'Tab':\n          event.preventDefault();\n          this.$emit('focus-month-year-picker');\n          break;\n\n        case 'Escape':\n          this.$emit('close-datepicker');\n          break;\n      }\n    },\n\n    focusFirstDay () {\n      this.focusDay = 0;\n      this.$nextTick(() => {\n        this.daysRef[this.focusDay].el.$el.focus();\n      });\n    },\n\n    focusLastDay () {\n      this.$nextTick(() => {\n        this.focusDay = this.daysRef.length - 1;\n        this.daysRef[this.focusDay].el.$el.focus();\n      });\n    },\n\n    selectDay (day) {\n      if (!day.currentMonth) { return; }\n\n      // local selectedDay is updated when a day is selected\n      this.selectedDay = day.text;\n      this.$emit('select-date', day.value);\n    },\n  },\n};\n</script>\n","<!-- eslint-disable vue/multi-word-component-names -->\n<template>\n  <dt-stack\n    class=\"d-datepicker\"\n    gap=\"400\"\n  >\n    <div class=\"d-datepicker__hd\">\n      <month-year-picker\n        ref=\"monthYearPicker\"\n        :selected-date=\"selectedDate\"\n        @calendar-days=\"updateCalendarDays\"\n        @focus-first-day=\"$refs.calendar.focusFirstDay()\"\n        @focus-last-day=\"$refs.calendar.focusLastDay()\"\n        @close-datepicker=\"$emit('close-datepicker')\"\n      />\n    </div>\n    <div class=\"d-datepicker__bd\">\n      <calendar\n        ref=\"calendar\"\n        :calendar-days=\"calendarDays\"\n        @select-date=\"$emit('selected-date', $event)\"\n        @focus-month-year-picker=\"$refs.monthYearPicker.focusMonthYearPicker()\"\n        @close-datepicker=\"$emit('close-datepicker')\"\n        @go-to-next-month=\"$refs.monthYearPicker.goToNextMonth()\"\n        @go-to-prev-month=\"$refs.monthYearPicker.goToPrevMonth()\"\n      />\n    </div>\n  </dt-stack>\n</template>\n\n<script>\nimport MonthYearPicker from './modules/month-year-picker.vue';\nimport Calendar from './modules/calendar.vue';\nimport { DtStack } from '@/components/stack';\nimport { warnIfUnmounted } from '@/common/utils';\n\nexport default {\n  name: 'DtDatepicker',\n\n  components: { DtStack, MonthYearPicker, Calendar },\n\n  props: {\n    /**\n     * Selected date\n     *\n     * @type {Date}\n     */\n    selectedDate: {\n      type: Date,\n      default: () => (new Date()),\n    },\n  },\n\n  emits: [\n    /**\n     * Event fired when a date is selected\n     *\n     * @event selected-date\n     * @type {Date}\n     */\n    'selected-date',\n\n    /**\n     * Event fired when user presses the esc key\n     *\n     * @event close-datepicker\n     */\n    'close-datepicker',\n  ],\n\n  data () {\n    return {\n      calendarDays: [],\n    };\n  },\n\n  mounted () {\n    warnIfUnmounted(this.$el, this.$options.name);\n  },\n\n  methods: {\n    updateCalendarDays (days) {\n      this.calendarDays = days;\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtButton","DtTooltip","DtStack","DtIconChevronLeft","DtIconChevronsLeft","DtIconChevronRight","DtIconChevronsRight","getMonth","getYear","DialtoneLocalization","getCalendarDays","month","formatMonth","INTL_MONTH_FORMAT","refName","event","year","getDate","value","initialDate","set","newDate","addMonths","subMonths","getWeekDayNames","WEEK_START","day","formatDate","week","weekIndex","dayIndex","refKey","dayButton","prevFocusDate","calculatePrevFocusDate","nextFocusDate","calculateNextFocusDate","MonthYearPicker","Calendar","warnIfUnmounted","days"],"mappings":"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"}

package/dist/lib/datepicker/datepicker.js

@@ -1,23 +1,23 @@
-import { DtIconChevronLeft as D, DtIconChevronsLeft as _, DtIconChevronRight as y, DtIconChevronsRight as m } from "@dialpad/dialtone-icons/vue2";
-import { getMonth as c, getYear as l, getDate as k, set as $, addMonths as v, subMonths as R } from "date-fns";
-import { getCalendarDays as E, formatMonth as b, getWeekDayNames as T, formatDate as g, calculateNextFocusDate as A, calculatePrevFocusDate as M } from "./utils.js";
+import { DtIconChevronsRight as D, DtIconChevronRight as _, DtIconChevronsLeft as y, DtIconChevronLeft as m } from "@dialpad/dialtone-icons/vue2";
+import { set as k, addMonths as $, subMonths as v, getMonth as c, getYear as l, getDate as R } from "date-fns";
+import { formatMonth as E, getCalendarDays as b, calculateNextFocusDate as T, calculatePrevFocusDate as g, formatDate as A, getWeekDayNames as M } from "./utils.js";
 import { INTL_MONTH_FORMAT as u, WEEK_START as C } from "./datepicker-constants.js";
 import { DialtoneLocalization as d } from "../../localization/index.js";
 import { n as i } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
-import f from "../button/button.js";
+import f from "../stack/stack.js";
 import P from "../tooltip/tooltip.js";
-import p from "../stack/stack.js";
+import p from "../button/button.js";
 import { warnIfUnmounted as I } from "../../common/utils/index.js";
 const N = {
   name: "DtDatepickerMonthYearPicker",
   components: {
-    DtButton: f,
+    DtButton: p,
     DtTooltip: P,
-    DtStack: p,
-    DtIconChevronLeft: D,
-    DtIconChevronsLeft: _,
-    DtIconChevronRight: y,
-    DtIconChevronsRight: m
+    DtStack: f,
+    DtIconChevronLeft: m,
+    DtIconChevronsLeft: y,
+    DtIconChevronRight: _,
+    DtIconChevronsRight: D
   },
   props: {
     selectedDate: {
@@ -66,10 +66,10 @@ const N = {
   computed: {
     // Get days for the currently selected month and year and highlight the selected day
     calendarDays() {
-      return E(this.selectMonth, this.selectYear, this.highlightedDay);
+      return b(this.selectMonth, this.selectYear, this.highlightedDay);
     },
     formattedMonth() {
-      return (e) => b(e, u, this.i18n.currentLocale);
+      return (e) => E(e, u, this.i18n.currentLocale);
     },
     previousYearAriaLabel() {
       return `${this.i18n.$t("DIALTONE_DATEPICKER_CHANGE_TO")} ${this.i18n.$t("DIALTONE_DATEPICKER_PREVIOUS_YEAR")} ${this.selectYear - 1}`;
@@ -129,11 +129,11 @@ const N = {
     },
     highlightDay() {
       const e = l(this.selectedDate), t = c(this.selectedDate);
-      e !== this.selectYear || t !== this.selectMonth ? this.highlightedDay = null : this.highlightedDay = k(this.selectedDate);
+      e !== this.selectYear || t !== this.selectMonth ? this.highlightedDay = null : this.highlightedDay = R(this.selectedDate);
     },
     changeMonth(e) {
       (this.selectMonth === 0 && e === -1 || this.selectMonth === 11 && e === 1) && (this.selectYear += e);
-      const t = $(this.selectedDate, { month: this.selectMonth, year: this.selectYear }), s = e === 1 ? v(t, 1) : R(t, 1);
+      const t = k(this.selectedDate, { month: this.selectMonth, year: this.selectYear }), s = e === 1 ? $(t, 1) : v(t, 1);
       this.selectMonth = c(s);
     },
     changeYear(e) {
@@ -181,7 +181,7 @@ var Y = function() {
 );
 const L = x.exports, O = {
   name: "DtDatepickerCalendar",
-  components: { DtButton: f },
+  components: { DtButton: p },
   props: {
     calendarDays: {
       type: Array,
@@ -220,7 +220,7 @@ const L = x.exports, O = {
   },
   computed: {
     weekDays() {
-      return T(this.i18n.currentLocale, C);
+      return M(this.i18n.currentLocale, C);
     }
   },
   watch: {
@@ -232,7 +232,7 @@ const L = x.exports, O = {
   },
   methods: {
     dayAriaLabel(e) {
-      return this.i18n.$t("DIALTONE_DATEPICKER_SELECT_DAY") + ` ${g(e.value, u, this.i18n.currentLocale)}`;
+      return this.i18n.$t("DIALTONE_DATEPICKER_SELECT_DAY") + ` ${A(e.value, u, this.i18n.currentLocale)}`;
     },
     setDayRef() {
       this.calendarDays.forEach((e, t) => {
@@ -249,7 +249,7 @@ const L = x.exports, O = {
           try {
             this.daysRef[this.focusDay].el.$el.focus();
           } catch {
-            const t = M(this.daysRef[this.focusDay + 7].day.value);
+            const t = g(this.daysRef[this.focusDay + 7].day.value);
             this.$emit("go-to-prev-month"), this.$nextTick(() => {
               this.setDayRef(), this.daysRef[t - 1].el.$el.focus(), this.focusDay += t - 1;
             });
@@ -260,7 +260,7 @@ const L = x.exports, O = {
           try {
             this.daysRef[this.focusDay].el.$el.focus();
           } catch {
-            const t = A(this.daysRef[this.focusDay - 7].day.value);
+            const t = T(this.daysRef[this.focusDay - 7].day.value);
             this.$emit("go-to-next-month"), this.$nextTick(() => {
               this.setDayRef(), this.daysRef[t - 1].el.$el.focus(), this.focusDay += t - 1;
             });
@@ -322,7 +322,7 @@ var K = function() {
 );
 const z = F.exports, S = {
   name: "DtDatepicker",
-  components: { DtStack: p, MonthYearPicker: L, Calendar: z },
+  components: { DtStack: f, MonthYearPicker: L, Calendar: z },
   props: {
     /**
      * Selected date

package/dist/lib/datepicker/datepicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"datepicker.js","sources":["../../../components/datepicker/modules/month-year-picker.vue","../../../components/datepicker/modules/calendar.vue","../../../components/datepicker/datepicker.vue"],"sourcesContent":["<template>\n  <dt-stack\n    class=\"d-datepicker__month-year\"\n    direction=\"row\"\n    gap=\"300\"\n  >\n    <dt-stack\n      as=\"nav\"\n      class=\"d-datepicker__nav\"\n      direction=\"row\"\n      gap=\"200\"\n    >\n      <dt-tooltip\n        :fallback-placements=\"['top-start', 'auto']\"\n        :message=\"i18n.$t('DIALTONE_DATEPICKER_PREVIOUS_YEAR')\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-button\n            id=\"prevYearButton\"\n            :ref=\"refNames[0]\"\n            :aria-label=\"previousYearAriaLabel\"\n            :circle=\"true\"\n            class=\"d-datepicker__nav-btn\"\n            importance=\"clear\"\n            kind=\"muted\"\n            size=\"xs\"\n            type=\"button\"\n            @click=\"changeYear(-1)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            <dt-icon-chevrons-left\n              size=\"200\"\n            />\n          </dt-button>\n        </template>\n      </dt-tooltip>\n      <dt-tooltip\n        :fallback-placements=\"['top-start', 'auto']\"\n        :message=\"i18n.$t('DIALTONE_DATEPICKER_PREVIOUS_MONTH')\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-button\n            id=\"prevMonthButton\"\n            :ref=\"refNames[1]\"\n            :aria-label=\"previousMonthAriaLabel\"\n            :circle=\"true\"\n            class=\"d-datepicker__nav-btn\"\n            importance=\"clear\"\n            kind=\"muted\"\n            size=\"xs\"\n            type=\"button\"\n            @click=\"changeMonth(-1)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            <dt-icon-chevron-left\n              size=\"200\"\n            />\n          </dt-button>\n        </template>\n      </dt-tooltip>\n    </dt-stack>\n    <div\n      id=\"calendar-heading\"\n      class=\"d-datepicker__month-year-title\"\n    >\n      {{ formattedMonth(selectMonth) }}\n\n      {{ selectYear }}\n    </div>\n    <dt-stack\n      as=\"nav\"\n      class=\"d-datepicker__nav\"\n      direction=\"row\"\n      gap=\"200\"\n    >\n      <dt-tooltip\n        :fallback-placements=\"['top-end', 'auto']\"\n        :message=\"i18n.$t('DIALTONE_DATEPICKER_NEXT_MONTH')\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-button\n            id=\"nextMonthButton\"\n            :ref=\"refNames[2]\"\n            :aria-label=\"nextMonthAriaLabel\"\n            :circle=\"true\"\n            class=\"d-datepicker__nav-btn\"\n            importance=\"clear\"\n            kind=\"muted\"\n            size=\"xs\"\n            type=\"button\"\n            @click=\"changeMonth(1)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            <dt-icon-chevron-right\n              size=\"200\"\n            />\n          </dt-button>\n        </template>\n      </dt-tooltip>\n      <dt-tooltip\n        :fallback-placements=\"['top-end', 'auto']\"\n        :message=\"i18n.$t('DIALTONE_DATEPICKER_NEXT_YEAR')\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-button\n            id=\"nextYearButton\"\n            :ref=\"refNames[3]\"\n            :aria-label=\"nextYearAriaLabel\"\n            :circle=\"true\"\n            class=\"d-datepicker__nav-btn\"\n            importance=\"clear\"\n            kind=\"muted\"\n            size=\"xs\"\n            type=\"button\"\n            @click=\"changeYear(1)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            <dt-icon-chevrons-right\n              size=\"200\"\n            />\n          </dt-button>\n        </template>\n      </dt-tooltip>\n    </dt-stack>\n  </dt-stack>\n</template>\n\n<script>\nimport {\n  DtIconChevronLeft,\n  DtIconChevronsLeft,\n  DtIconChevronRight,\n  DtIconChevronsRight,\n} from '@dialpad/dialtone-icons/vue2';\nimport { getYear, addMonths, getMonth, set, subMonths, getDate } from 'date-fns';\nimport { getCalendarDays, formatMonth } from '../utils';\nimport { INTL_MONTH_FORMAT } from '../datepicker_constants';\nimport { DtStack } from '@/components/stack';\nimport { DtTooltip } from '@/components/tooltip';\nimport { DtButton } from '@/components/button';\nimport { DialtoneLocalization } from '@/localization';\n\nexport default {\n  name: 'DtDatepickerMonthYearPicker',\n\n  components: {\n    DtButton,\n    DtTooltip,\n    DtStack,\n    DtIconChevronLeft,\n    DtIconChevronsLeft,\n    DtIconChevronRight,\n    DtIconChevronsRight,\n  },\n\n  props: {\n    selectedDate: {\n      type: Date,\n      required: true,\n    },\n  },\n\n  emits: [\n    /**\n     * Will retrieve the calendar days of the given date\n     *\n     * @event calendar-days\n     * @type {Array}\n     */\n    'calendar-days',\n\n    /**\n     * Will focus first day in calendar\n     *\n     * @event focus-first-day\n     */\n    'focus-first-day',\n\n    /**\n     * Will focus last day in calendar\n     *\n     * @event focus-last-day\n     */\n    'focus-last-day',\n\n    /**\n     * Will close the datepicker\n     *\n     * @event close-datepicker\n     */\n    'close-datepicker',\n  ],\n\n  data () {\n    return {\n      selectMonth: getMonth(this.selectedDate),\n      selectYear: getYear(this.selectedDate),\n      highlightedDay: null,\n      focusPicker: 0,\n      focusRefs: [],\n      refNames: ['prevYearButtonRef', 'prevMonthButtonRef', 'nextMonthButtonRef', 'nextYearButtonRef'],\n      i18n: new DialtoneLocalization(),\n    };\n  },\n\n  computed: {\n    // Get days for the currently selected month and year and highlight the selected day\n    calendarDays () {\n      return getCalendarDays(this.selectMonth, this.selectYear, this.highlightedDay);\n    },\n\n    formattedMonth () {\n      return (month) => formatMonth(month, INTL_MONTH_FORMAT, this.i18n.currentLocale);\n    },\n\n    previousYearAriaLabel () {\n      return `${this.i18n.$t('DIALTONE_DATEPICKER_CHANGE_TO')} ${this.i18n.$t('DIALTONE_DATEPICKER_PREVIOUS_YEAR')} ${this.selectYear - 1}`;\n    },\n\n    previousMonthAriaLabel () {\n      return `${this.i18n.$t('DIALTONE_DATEPICKER_CHANGE_TO')} ${this.i18n.$t('DIALTONE_DATEPICKER_PREVIOUS_MONTH')} ${this.formattedMonth(this.selectMonth - 1)}`;\n    },\n\n    nextYearAriaLabel () {\n      return `${this.i18n.$t('DIALTONE_DATEPICKER_CHANGE_TO')} ${this.i18n.$t('DIALTONE_DATEPICKER_NEXT_YEAR')} ${this.selectYear + 1}`;\n    },\n\n    nextMonthAriaLabel () {\n      return `${this.i18n.$t('DIALTONE_DATEPICKER_CHANGE_TO')} ${this.i18n.$t('DIALTONE_DATEPICKER_NEXT_MONTH')} ${this.formattedMonth(this.selectMonth + 1)}`;\n    },\n  },\n\n  watch: {\n    selectMonth: {\n      handler () {\n        this.highlightDay();\n        this.$emit('calendar-days', this.calendarDays);\n      },\n\n      immediate: true,\n    },\n\n    selectYear: {\n      handler () {\n        this.highlightDay();\n        this.$emit('calendar-days', this.calendarDays);\n      },\n\n      immediate: true,\n    },\n\n  },\n\n  mounted () {\n    this.setButtonsRef();\n    this.focusMonthYearPicker();\n  },\n\n  methods: {\n    setButtonsRef () {\n      this.focusRefs = this.refNames.map(refName => this.$refs[refName]);\n    },\n\n    focusMonthYearPicker () {\n      this.focusPicker = 0;\n      this.focusRefs[0].$el.focus();\n    },\n\n    handleKeyDown (event) {\n      switch (event.key) {\n        case 'ArrowLeft':\n          event.preventDefault();\n          if (this.focusPicker === 0) {\n            this.focusPicker = 3;\n            this.focusRefs[this.focusPicker].$el.focus();\n          } else {\n            this.focusPicker--;\n            this.focusRefs[this.focusPicker].$el.focus();\n          }\n          break;\n\n        case 'ArrowRight':\n          event.preventDefault();\n          if (this.focusPicker === 3) {\n            this.focusPicker = 0;\n            this.focusRefs[this.focusPicker].$el.focus();\n          } else {\n            this.focusPicker++;\n            this.focusRefs[this.focusPicker].$el.focus();\n          }\n          break;\n\n        case 'ArrowDown':\n          event.preventDefault();\n          this.$emit('focus-first-day');\n          break;\n\n        case 'Tab':\n          event.preventDefault();\n          this.$emit('focus-first-day');\n          break;\n\n        case 'Escape':\n          this.$emit('close-datepicker');\n          break;\n      }\n    },\n\n    highlightDay () {\n      const year = getYear(this.selectedDate);\n      const month = getMonth(this.selectedDate);\n\n      if (year !== this.selectYear || month !== this.selectMonth) {\n        this.highlightedDay = null;\n      } else {\n        this.highlightedDay = getDate(this.selectedDate);\n      }\n    },\n\n    changeMonth (value) {\n      // Adjust year when changing from January to December or vice versa\n      if ((this.selectMonth === 0 && value === -1) || (this.selectMonth === 11 && value === 1)) {\n        this.selectYear += value;\n      }\n\n      // Calculate the new date by adding or subtracting months\n      const initialDate = set(this.selectedDate, { month: this.selectMonth, year: this.selectYear });\n      const newDate = value === 1 ? addMonths(initialDate, 1) : subMonths(initialDate, 1);\n\n      // Update the selected month\n      this.selectMonth = getMonth(newDate);\n    },\n\n    changeYear (value) {\n      this.selectYear = this.selectYear + value;\n    },\n\n    goToNextMonth () {\n      this.changeMonth(1);\n    },\n\n    goToPrevMonth () {\n      this.changeMonth(-1);\n    },\n  },\n};\n</script>\n","<template>\n  <table\n    class=\"d-datepicker__calendar\"\n    aria-labelledby=\"calendar-heading\"\n  >\n    <thead>\n      <tr>\n        <th\n          v-for=\"day in weekDays\"\n          :key=\"day\"\n          scope=\"col\"\n          class=\"d-datepicker__cell d-datepicker__cell--header\"\n        >\n          <span\n            class=\"d-datepicker__weekday\"\n            :title=\"day\"\n            :aria-label=\"day\"\n          > {{ day }}</span>\n        </th>\n      </tr>\n    </thead>\n    <tbody>\n      <tr\n        v-for=\"(week, indexWeek) in calendarDays\"\n        :key=\"indexWeek\"\n      >\n        <td\n          v-for=\"(day, indexDays) in week.days\"\n          :key=\"indexWeek + indexDays\"\n          class=\"d-datepicker__cell\"\n          role=\"listbox\"\n        >\n          <dt-button\n            :ref=\"`buttonRef_${indexWeek}_${indexDays}`\"\n            class=\"d-datepicker__day\"\n            :circle=\"true\"\n            size=\"sm\"\n            importance=\"clear\"\n            :disabled=\"!day.currentMonth\"\n            :class=\"{\n              'd-datepicker__day--disabled': !day.currentMonth,\n              'd-datepicker__day--selected': selectedDay\n                ? ((day.text === selectedDay) && day.currentMonth)\n                : day.selected,\n            }\"\n            type=\"button\"\n            :aria-selected=\"!!selectedDay ? ((day.text === selectedDay) && day.currentMonth) : day.selected\"\n            :aria-label=\"dayAriaLabel(day)\"\n            role=\"option\"\n            @click=\"selectDay(day)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            {{ day.text }}\n          </dt-button>\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</template>\n\n<script>\nimport { getWeekDayNames, calculateNextFocusDate, calculatePrevFocusDate, formatDate } from '../utils';\nimport { WEEK_START, INTL_MONTH_FORMAT } from '../datepicker_constants.js';\nimport { DtButton } from '@/components/button';\nimport { DialtoneLocalization } from '@/localization';\n\nexport default {\n  name: 'DtDatepickerCalendar',\n  components: { DtButton },\n\n  props: {\n    calendarDays: {\n      type: Array,\n      required: true,\n    },\n  },\n\n  emits: [\n    /**\n     * Event fired when a date is selected\n     *\n     * @event select-date\n     * @type {Date}\n     */\n    'select-date',\n\n    /**\n     * Will focus the month and year picker\n     *\n     * @event focus-month-year-picker\n     */\n    'focus-month-year-picker',\n\n    /**\n     * Will close the datepicker\n     *\n     * @event close-datepicker\n     */\n    'close-datepicker',\n  ],\n\n  data () {\n    return {\n      // local selectedDay to override the received by props calendarDays\n      selectedDay: null,\n      focusDay: 0,\n      daysRef: [],\n      i18n: new DialtoneLocalization(),\n    };\n  },\n\n  computed: {\n    weekDays () {\n      return getWeekDayNames(this.i18n.currentLocale, WEEK_START);\n    },\n  },\n\n  watch: {\n    calendarDays () {\n      // on calendarDays update, reset our local variables\n      this.focusDay = 0;\n      this.selectedDay = null;\n\n      this.daysRef = [];\n\n      this.$nextTick(() => {\n        this.daysRef = [];\n        this.setDayRef();\n      });\n    },\n  },\n\n  methods: {\n    dayAriaLabel (day) {\n      return this.i18n.$t('DIALTONE_DATEPICKER_SELECT_DAY') + ` ${formatDate(day.value, INTL_MONTH_FORMAT, this.i18n.currentLocale)}`;\n    },\n\n    setDayRef () {\n      this.calendarDays.forEach((week, weekIndex) => {\n        week.days.forEach((day, dayIndex) => {\n          const refKey = `buttonRef_${weekIndex}_${dayIndex}`;\n          const dayButton = this.$refs[refKey];\n          if (dayButton && day.currentMonth) {\n            this.daysRef.push({ el: dayButton[0], day });\n          }\n        });\n      });\n    },\n\n    handleKeyDown (event) {\n      switch (event.key) {\n        case 'ArrowUp':\n          event.preventDefault();\n          this.focusDay -= 7;\n          try {\n            this.daysRef[this.focusDay].el.$el.focus();\n          } catch {\n            const prevFocusDate = calculatePrevFocusDate(this.daysRef[this.focusDay + 7].day.value);\n            this.$emit('go-to-prev-month');\n            this.$nextTick(() => {\n              this.setDayRef();\n              this.daysRef[prevFocusDate - 1].el.$el.focus();\n              this.focusDay += prevFocusDate - 1;\n            });\n          }\n          break;\n\n        case 'ArrowDown':\n          event.preventDefault();\n          this.focusDay += 7;\n          try {\n            this.daysRef[this.focusDay].el.$el.focus();\n          } catch {\n            const nextFocusDate = calculateNextFocusDate(this.daysRef[this.focusDay - 7].day.value);\n            this.$emit('go-to-next-month');\n            this.$nextTick(() => {\n              this.setDayRef();\n              this.daysRef[nextFocusDate - 1].el.$el.focus();\n              this.focusDay += nextFocusDate - 1;\n            });\n          }\n          break;\n\n        case 'ArrowLeft':\n          event.preventDefault();\n          if (this.focusDay > 0) {\n            this.focusDay -= 1;\n            this.daysRef[this.focusDay].el.$el.focus();\n          } else {\n            // if we are on month first day, jump to last day of prev month\n            this.$emit('go-to-prev-month');\n            this.$nextTick(() => {\n              this.focusLastDay();\n            });\n          }\n          break;\n\n        case 'ArrowRight':\n          event.preventDefault();\n          if (this.focusDay < this.daysRef.length - 1) {\n            this.focusDay += 1;\n            this.daysRef[this.focusDay].el.$el.focus();\n          } else {\n            // if we are on month last day, jump to first day of next month\n            this.$emit('go-to-next-month');\n            this.$nextTick(() => {\n              this.focusFirstDay();\n            });\n          }\n          break;\n\n        case 'Tab':\n          event.preventDefault();\n          this.$emit('focus-month-year-picker');\n          break;\n\n        case 'Escape':\n          this.$emit('close-datepicker');\n          break;\n      }\n    },\n\n    focusFirstDay () {\n      this.focusDay = 0;\n      this.$nextTick(() => {\n        this.daysRef[this.focusDay].el.$el.focus();\n      });\n    },\n\n    focusLastDay () {\n      this.$nextTick(() => {\n        this.focusDay = this.daysRef.length - 1;\n        this.daysRef[this.focusDay].el.$el.focus();\n      });\n    },\n\n    selectDay (day) {\n      if (!day.currentMonth) { return; }\n\n      // local selectedDay is updated when a day is selected\n      this.selectedDay = day.text;\n      this.$emit('select-date', day.value);\n    },\n  },\n};\n</script>\n","<!-- eslint-disable vue/multi-word-component-names -->\n<template>\n  <dt-stack\n    class=\"d-datepicker\"\n    gap=\"400\"\n  >\n    <div class=\"d-datepicker__hd\">\n      <month-year-picker\n        ref=\"monthYearPicker\"\n        :selected-date=\"selectedDate\"\n        @calendar-days=\"updateCalendarDays\"\n        @focus-first-day=\"$refs.calendar.focusFirstDay()\"\n        @focus-last-day=\"$refs.calendar.focusLastDay()\"\n        @close-datepicker=\"$emit('close-datepicker')\"\n      />\n    </div>\n    <div class=\"d-datepicker__bd\">\n      <calendar\n        ref=\"calendar\"\n        :calendar-days=\"calendarDays\"\n        @select-date=\"$emit('selected-date', $event)\"\n        @focus-month-year-picker=\"$refs.monthYearPicker.focusMonthYearPicker()\"\n        @close-datepicker=\"$emit('close-datepicker')\"\n        @go-to-next-month=\"$refs.monthYearPicker.goToNextMonth()\"\n        @go-to-prev-month=\"$refs.monthYearPicker.goToPrevMonth()\"\n      />\n    </div>\n  </dt-stack>\n</template>\n\n<script>\nimport MonthYearPicker from './modules/month-year-picker.vue';\nimport Calendar from './modules/calendar.vue';\nimport { DtStack } from '@/components/stack';\nimport { warnIfUnmounted } from '@/common/utils';\n\nexport default {\n  name: 'DtDatepicker',\n\n  components: { DtStack, MonthYearPicker, Calendar },\n\n  props: {\n    /**\n     * Selected date\n     *\n     * @type {Date}\n     */\n    selectedDate: {\n      type: Date,\n      default: () => (new Date()),\n    },\n  },\n\n  emits: [\n    /**\n     * Event fired when a date is selected\n     *\n     * @event selected-date\n     * @type {Date}\n     */\n    'selected-date',\n\n    /**\n     * Event fired when user presses the esc key\n     *\n     * @event close-datepicker\n     */\n    'close-datepicker',\n  ],\n\n  data () {\n    return {\n      calendarDays: [],\n    };\n  },\n\n  mounted () {\n    warnIfUnmounted(this.$el, this.$options.name);\n  },\n\n  methods: {\n    updateCalendarDays (days) {\n      this.calendarDays = days;\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtButton","DtTooltip","DtStack","DtIconChevronLeft","DtIconChevronsLeft","DtIconChevronRight","DtIconChevronsRight","getMonth","getYear","DialtoneLocalization","getCalendarDays","month","formatMonth","INTL_MONTH_FORMAT","refName","event","year","getDate","value","initialDate","set","newDate","addMonths","subMonths","getWeekDayNames","WEEK_START","day","formatDate","week","weekIndex","dayIndex","refKey","dayButton","prevFocusDate","calculatePrevFocusDate","nextFocusDate","calculateNextFocusDate","MonthYearPicker","Calendar","warnIfUnmounted","days"],"mappings":"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"}
+{"version":3,"file":"datepicker.js","sources":["../../../components/datepicker/modules/month-year-picker.vue","../../../components/datepicker/modules/calendar.vue","../../../components/datepicker/datepicker.vue"],"sourcesContent":["<template>\n  <dt-stack\n    class=\"d-datepicker__month-year\"\n    direction=\"row\"\n    gap=\"300\"\n  >\n    <dt-stack\n      as=\"nav\"\n      class=\"d-datepicker__nav\"\n      direction=\"row\"\n      gap=\"200\"\n    >\n      <dt-tooltip\n        :fallback-placements=\"['top-start', 'auto']\"\n        :message=\"i18n.$t('DIALTONE_DATEPICKER_PREVIOUS_YEAR')\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-button\n            id=\"prevYearButton\"\n            :ref=\"refNames[0]\"\n            :aria-label=\"previousYearAriaLabel\"\n            :circle=\"true\"\n            class=\"d-datepicker__nav-btn\"\n            importance=\"clear\"\n            kind=\"muted\"\n            size=\"xs\"\n            type=\"button\"\n            @click=\"changeYear(-1)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            <dt-icon-chevrons-left\n              size=\"200\"\n            />\n          </dt-button>\n        </template>\n      </dt-tooltip>\n      <dt-tooltip\n        :fallback-placements=\"['top-start', 'auto']\"\n        :message=\"i18n.$t('DIALTONE_DATEPICKER_PREVIOUS_MONTH')\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-button\n            id=\"prevMonthButton\"\n            :ref=\"refNames[1]\"\n            :aria-label=\"previousMonthAriaLabel\"\n            :circle=\"true\"\n            class=\"d-datepicker__nav-btn\"\n            importance=\"clear\"\n            kind=\"muted\"\n            size=\"xs\"\n            type=\"button\"\n            @click=\"changeMonth(-1)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            <dt-icon-chevron-left\n              size=\"200\"\n            />\n          </dt-button>\n        </template>\n      </dt-tooltip>\n    </dt-stack>\n    <div\n      id=\"calendar-heading\"\n      class=\"d-datepicker__month-year-title\"\n    >\n      {{ formattedMonth(selectMonth) }}\n\n      {{ selectYear }}\n    </div>\n    <dt-stack\n      as=\"nav\"\n      class=\"d-datepicker__nav\"\n      direction=\"row\"\n      gap=\"200\"\n    >\n      <dt-tooltip\n        :fallback-placements=\"['top-end', 'auto']\"\n        :message=\"i18n.$t('DIALTONE_DATEPICKER_NEXT_MONTH')\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-button\n            id=\"nextMonthButton\"\n            :ref=\"refNames[2]\"\n            :aria-label=\"nextMonthAriaLabel\"\n            :circle=\"true\"\n            class=\"d-datepicker__nav-btn\"\n            importance=\"clear\"\n            kind=\"muted\"\n            size=\"xs\"\n            type=\"button\"\n            @click=\"changeMonth(1)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            <dt-icon-chevron-right\n              size=\"200\"\n            />\n          </dt-button>\n        </template>\n      </dt-tooltip>\n      <dt-tooltip\n        :fallback-placements=\"['top-end', 'auto']\"\n        :message=\"i18n.$t('DIALTONE_DATEPICKER_NEXT_YEAR')\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-button\n            id=\"nextYearButton\"\n            :ref=\"refNames[3]\"\n            :aria-label=\"nextYearAriaLabel\"\n            :circle=\"true\"\n            class=\"d-datepicker__nav-btn\"\n            importance=\"clear\"\n            kind=\"muted\"\n            size=\"xs\"\n            type=\"button\"\n            @click=\"changeYear(1)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            <dt-icon-chevrons-right\n              size=\"200\"\n            />\n          </dt-button>\n        </template>\n      </dt-tooltip>\n    </dt-stack>\n  </dt-stack>\n</template>\n\n<script>\nimport {\n  DtIconChevronLeft,\n  DtIconChevronsLeft,\n  DtIconChevronRight,\n  DtIconChevronsRight,\n} from '@dialpad/dialtone-icons/vue2';\nimport { getYear, addMonths, getMonth, set, subMonths, getDate } from 'date-fns';\nimport { getCalendarDays, formatMonth } from '../utils';\nimport { INTL_MONTH_FORMAT } from '../datepicker_constants';\nimport { DtStack } from '@/components/stack';\nimport { DtTooltip } from '@/components/tooltip';\nimport { DtButton } from '@/components/button';\nimport { DialtoneLocalization } from '@/localization';\n\nexport default {\n  name: 'DtDatepickerMonthYearPicker',\n\n  components: {\n    DtButton,\n    DtTooltip,\n    DtStack,\n    DtIconChevronLeft,\n    DtIconChevronsLeft,\n    DtIconChevronRight,\n    DtIconChevronsRight,\n  },\n\n  props: {\n    selectedDate: {\n      type: Date,\n      required: true,\n    },\n  },\n\n  emits: [\n    /**\n     * Will retrieve the calendar days of the given date\n     *\n     * @event calendar-days\n     * @type {Array}\n     */\n    'calendar-days',\n\n    /**\n     * Will focus first day in calendar\n     *\n     * @event focus-first-day\n     */\n    'focus-first-day',\n\n    /**\n     * Will focus last day in calendar\n     *\n     * @event focus-last-day\n     */\n    'focus-last-day',\n\n    /**\n     * Will close the datepicker\n     *\n     * @event close-datepicker\n     */\n    'close-datepicker',\n  ],\n\n  data () {\n    return {\n      selectMonth: getMonth(this.selectedDate),\n      selectYear: getYear(this.selectedDate),\n      highlightedDay: null,\n      focusPicker: 0,\n      focusRefs: [],\n      refNames: ['prevYearButtonRef', 'prevMonthButtonRef', 'nextMonthButtonRef', 'nextYearButtonRef'],\n      i18n: new DialtoneLocalization(),\n    };\n  },\n\n  computed: {\n    // Get days for the currently selected month and year and highlight the selected day\n    calendarDays () {\n      return getCalendarDays(this.selectMonth, this.selectYear, this.highlightedDay);\n    },\n\n    formattedMonth () {\n      return (month) => formatMonth(month, INTL_MONTH_FORMAT, this.i18n.currentLocale);\n    },\n\n    previousYearAriaLabel () {\n      return `${this.i18n.$t('DIALTONE_DATEPICKER_CHANGE_TO')} ${this.i18n.$t('DIALTONE_DATEPICKER_PREVIOUS_YEAR')} ${this.selectYear - 1}`;\n    },\n\n    previousMonthAriaLabel () {\n      return `${this.i18n.$t('DIALTONE_DATEPICKER_CHANGE_TO')} ${this.i18n.$t('DIALTONE_DATEPICKER_PREVIOUS_MONTH')} ${this.formattedMonth(this.selectMonth - 1)}`;\n    },\n\n    nextYearAriaLabel () {\n      return `${this.i18n.$t('DIALTONE_DATEPICKER_CHANGE_TO')} ${this.i18n.$t('DIALTONE_DATEPICKER_NEXT_YEAR')} ${this.selectYear + 1}`;\n    },\n\n    nextMonthAriaLabel () {\n      return `${this.i18n.$t('DIALTONE_DATEPICKER_CHANGE_TO')} ${this.i18n.$t('DIALTONE_DATEPICKER_NEXT_MONTH')} ${this.formattedMonth(this.selectMonth + 1)}`;\n    },\n  },\n\n  watch: {\n    selectMonth: {\n      handler () {\n        this.highlightDay();\n        this.$emit('calendar-days', this.calendarDays);\n      },\n\n      immediate: true,\n    },\n\n    selectYear: {\n      handler () {\n        this.highlightDay();\n        this.$emit('calendar-days', this.calendarDays);\n      },\n\n      immediate: true,\n    },\n\n  },\n\n  mounted () {\n    this.setButtonsRef();\n    this.focusMonthYearPicker();\n  },\n\n  methods: {\n    setButtonsRef () {\n      this.focusRefs = this.refNames.map(refName => this.$refs[refName]);\n    },\n\n    focusMonthYearPicker () {\n      this.focusPicker = 0;\n      this.focusRefs[0].$el.focus();\n    },\n\n    handleKeyDown (event) {\n      switch (event.key) {\n        case 'ArrowLeft':\n          event.preventDefault();\n          if (this.focusPicker === 0) {\n            this.focusPicker = 3;\n            this.focusRefs[this.focusPicker].$el.focus();\n          } else {\n            this.focusPicker--;\n            this.focusRefs[this.focusPicker].$el.focus();\n          }\n          break;\n\n        case 'ArrowRight':\n          event.preventDefault();\n          if (this.focusPicker === 3) {\n            this.focusPicker = 0;\n            this.focusRefs[this.focusPicker].$el.focus();\n          } else {\n            this.focusPicker++;\n            this.focusRefs[this.focusPicker].$el.focus();\n          }\n          break;\n\n        case 'ArrowDown':\n          event.preventDefault();\n          this.$emit('focus-first-day');\n          break;\n\n        case 'Tab':\n          event.preventDefault();\n          this.$emit('focus-first-day');\n          break;\n\n        case 'Escape':\n          this.$emit('close-datepicker');\n          break;\n      }\n    },\n\n    highlightDay () {\n      const year = getYear(this.selectedDate);\n      const month = getMonth(this.selectedDate);\n\n      if (year !== this.selectYear || month !== this.selectMonth) {\n        this.highlightedDay = null;\n      } else {\n        this.highlightedDay = getDate(this.selectedDate);\n      }\n    },\n\n    changeMonth (value) {\n      // Adjust year when changing from January to December or vice versa\n      if ((this.selectMonth === 0 && value === -1) || (this.selectMonth === 11 && value === 1)) {\n        this.selectYear += value;\n      }\n\n      // Calculate the new date by adding or subtracting months\n      const initialDate = set(this.selectedDate, { month: this.selectMonth, year: this.selectYear });\n      const newDate = value === 1 ? addMonths(initialDate, 1) : subMonths(initialDate, 1);\n\n      // Update the selected month\n      this.selectMonth = getMonth(newDate);\n    },\n\n    changeYear (value) {\n      this.selectYear = this.selectYear + value;\n    },\n\n    goToNextMonth () {\n      this.changeMonth(1);\n    },\n\n    goToPrevMonth () {\n      this.changeMonth(-1);\n    },\n  },\n};\n</script>\n","<template>\n  <table\n    class=\"d-datepicker__calendar\"\n    aria-labelledby=\"calendar-heading\"\n  >\n    <thead>\n      <tr>\n        <th\n          v-for=\"day in weekDays\"\n          :key=\"day\"\n          scope=\"col\"\n          class=\"d-datepicker__cell d-datepicker__cell--header\"\n        >\n          <span\n            class=\"d-datepicker__weekday\"\n            :title=\"day\"\n            :aria-label=\"day\"\n          > {{ day }}</span>\n        </th>\n      </tr>\n    </thead>\n    <tbody>\n      <tr\n        v-for=\"(week, indexWeek) in calendarDays\"\n        :key=\"indexWeek\"\n      >\n        <td\n          v-for=\"(day, indexDays) in week.days\"\n          :key=\"indexWeek + indexDays\"\n          class=\"d-datepicker__cell\"\n          role=\"listbox\"\n        >\n          <dt-button\n            :ref=\"`buttonRef_${indexWeek}_${indexDays}`\"\n            class=\"d-datepicker__day\"\n            :circle=\"true\"\n            size=\"sm\"\n            importance=\"clear\"\n            :disabled=\"!day.currentMonth\"\n            :class=\"{\n              'd-datepicker__day--disabled': !day.currentMonth,\n              'd-datepicker__day--selected': selectedDay\n                ? ((day.text === selectedDay) && day.currentMonth)\n                : day.selected,\n            }\"\n            type=\"button\"\n            :aria-selected=\"!!selectedDay ? ((day.text === selectedDay) && day.currentMonth) : day.selected\"\n            :aria-label=\"dayAriaLabel(day)\"\n            role=\"option\"\n            @click=\"selectDay(day)\"\n            @keydown=\"handleKeyDown($event)\"\n          >\n            {{ day.text }}\n          </dt-button>\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</template>\n\n<script>\nimport { getWeekDayNames, calculateNextFocusDate, calculatePrevFocusDate, formatDate } from '../utils';\nimport { WEEK_START, INTL_MONTH_FORMAT } from '../datepicker_constants.js';\nimport { DtButton } from '@/components/button';\nimport { DialtoneLocalization } from '@/localization';\n\nexport default {\n  name: 'DtDatepickerCalendar',\n  components: { DtButton },\n\n  props: {\n    calendarDays: {\n      type: Array,\n      required: true,\n    },\n  },\n\n  emits: [\n    /**\n     * Event fired when a date is selected\n     *\n     * @event select-date\n     * @type {Date}\n     */\n    'select-date',\n\n    /**\n     * Will focus the month and year picker\n     *\n     * @event focus-month-year-picker\n     */\n    'focus-month-year-picker',\n\n    /**\n     * Will close the datepicker\n     *\n     * @event close-datepicker\n     */\n    'close-datepicker',\n  ],\n\n  data () {\n    return {\n      // local selectedDay to override the received by props calendarDays\n      selectedDay: null,\n      focusDay: 0,\n      daysRef: [],\n      i18n: new DialtoneLocalization(),\n    };\n  },\n\n  computed: {\n    weekDays () {\n      return getWeekDayNames(this.i18n.currentLocale, WEEK_START);\n    },\n  },\n\n  watch: {\n    calendarDays () {\n      // on calendarDays update, reset our local variables\n      this.focusDay = 0;\n      this.selectedDay = null;\n\n      this.daysRef = [];\n\n      this.$nextTick(() => {\n        this.daysRef = [];\n        this.setDayRef();\n      });\n    },\n  },\n\n  methods: {\n    dayAriaLabel (day) {\n      return this.i18n.$t('DIALTONE_DATEPICKER_SELECT_DAY') + ` ${formatDate(day.value, INTL_MONTH_FORMAT, this.i18n.currentLocale)}`;\n    },\n\n    setDayRef () {\n      this.calendarDays.forEach((week, weekIndex) => {\n        week.days.forEach((day, dayIndex) => {\n          const refKey = `buttonRef_${weekIndex}_${dayIndex}`;\n          const dayButton = this.$refs[refKey];\n          if (dayButton && day.currentMonth) {\n            this.daysRef.push({ el: dayButton[0], day });\n          }\n        });\n      });\n    },\n\n    handleKeyDown (event) {\n      switch (event.key) {\n        case 'ArrowUp':\n          event.preventDefault();\n          this.focusDay -= 7;\n          try {\n            this.daysRef[this.focusDay].el.$el.focus();\n          } catch {\n            const prevFocusDate = calculatePrevFocusDate(this.daysRef[this.focusDay + 7].day.value);\n            this.$emit('go-to-prev-month');\n            this.$nextTick(() => {\n              this.setDayRef();\n              this.daysRef[prevFocusDate - 1].el.$el.focus();\n              this.focusDay += prevFocusDate - 1;\n            });\n          }\n          break;\n\n        case 'ArrowDown':\n          event.preventDefault();\n          this.focusDay += 7;\n          try {\n            this.daysRef[this.focusDay].el.$el.focus();\n          } catch {\n            const nextFocusDate = calculateNextFocusDate(this.daysRef[this.focusDay - 7].day.value);\n            this.$emit('go-to-next-month');\n            this.$nextTick(() => {\n              this.setDayRef();\n              this.daysRef[nextFocusDate - 1].el.$el.focus();\n              this.focusDay += nextFocusDate - 1;\n            });\n          }\n          break;\n\n        case 'ArrowLeft':\n          event.preventDefault();\n          if (this.focusDay > 0) {\n            this.focusDay -= 1;\n            this.daysRef[this.focusDay].el.$el.focus();\n          } else {\n            // if we are on month first day, jump to last day of prev month\n            this.$emit('go-to-prev-month');\n            this.$nextTick(() => {\n              this.focusLastDay();\n            });\n          }\n          break;\n\n        case 'ArrowRight':\n          event.preventDefault();\n          if (this.focusDay < this.daysRef.length - 1) {\n            this.focusDay += 1;\n            this.daysRef[this.focusDay].el.$el.focus();\n          } else {\n            // if we are on month last day, jump to first day of next month\n            this.$emit('go-to-next-month');\n            this.$nextTick(() => {\n              this.focusFirstDay();\n            });\n          }\n          break;\n\n        case 'Tab':\n          event.preventDefault();\n          this.$emit('focus-month-year-picker');\n          break;\n\n        case 'Escape':\n          this.$emit('close-datepicker');\n          break;\n      }\n    },\n\n    focusFirstDay () {\n      this.focusDay = 0;\n      this.$nextTick(() => {\n        this.daysRef[this.focusDay].el.$el.focus();\n      });\n    },\n\n    focusLastDay () {\n      this.$nextTick(() => {\n        this.focusDay = this.daysRef.length - 1;\n        this.daysRef[this.focusDay].el.$el.focus();\n      });\n    },\n\n    selectDay (day) {\n      if (!day.currentMonth) { return; }\n\n      // local selectedDay is updated when a day is selected\n      this.selectedDay = day.text;\n      this.$emit('select-date', day.value);\n    },\n  },\n};\n</script>\n","<!-- eslint-disable vue/multi-word-component-names -->\n<template>\n  <dt-stack\n    class=\"d-datepicker\"\n    gap=\"400\"\n  >\n    <div class=\"d-datepicker__hd\">\n      <month-year-picker\n        ref=\"monthYearPicker\"\n        :selected-date=\"selectedDate\"\n        @calendar-days=\"updateCalendarDays\"\n        @focus-first-day=\"$refs.calendar.focusFirstDay()\"\n        @focus-last-day=\"$refs.calendar.focusLastDay()\"\n        @close-datepicker=\"$emit('close-datepicker')\"\n      />\n    </div>\n    <div class=\"d-datepicker__bd\">\n      <calendar\n        ref=\"calendar\"\n        :calendar-days=\"calendarDays\"\n        @select-date=\"$emit('selected-date', $event)\"\n        @focus-month-year-picker=\"$refs.monthYearPicker.focusMonthYearPicker()\"\n        @close-datepicker=\"$emit('close-datepicker')\"\n        @go-to-next-month=\"$refs.monthYearPicker.goToNextMonth()\"\n        @go-to-prev-month=\"$refs.monthYearPicker.goToPrevMonth()\"\n      />\n    </div>\n  </dt-stack>\n</template>\n\n<script>\nimport MonthYearPicker from './modules/month-year-picker.vue';\nimport Calendar from './modules/calendar.vue';\nimport { DtStack } from '@/components/stack';\nimport { warnIfUnmounted } from '@/common/utils';\n\nexport default {\n  name: 'DtDatepicker',\n\n  components: { DtStack, MonthYearPicker, Calendar },\n\n  props: {\n    /**\n     * Selected date\n     *\n     * @type {Date}\n     */\n    selectedDate: {\n      type: Date,\n      default: () => (new Date()),\n    },\n  },\n\n  emits: [\n    /**\n     * Event fired when a date is selected\n     *\n     * @event selected-date\n     * @type {Date}\n     */\n    'selected-date',\n\n    /**\n     * Event fired when user presses the esc key\n     *\n     * @event close-datepicker\n     */\n    'close-datepicker',\n  ],\n\n  data () {\n    return {\n      calendarDays: [],\n    };\n  },\n\n  mounted () {\n    warnIfUnmounted(this.$el, this.$options.name);\n  },\n\n  methods: {\n    updateCalendarDays (days) {\n      this.calendarDays = days;\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtButton","DtTooltip","DtStack","DtIconChevronLeft","DtIconChevronsLeft","DtIconChevronRight","DtIconChevronsRight","getMonth","getYear","DialtoneLocalization","getCalendarDays","month","formatMonth","INTL_MONTH_FORMAT","refName","event","year","getDate","value","initialDate","set","newDate","addMonths","subMonths","getWeekDayNames","WEEK_START","day","formatDate","week","weekIndex","dayIndex","refKey","dayButton","prevFocusDate","calculatePrevFocusDate","nextFocusDate","calculateNextFocusDate","MonthYearPicker","Calendar","warnIfUnmounted","days"],"mappings":"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"}

package/dist/lib/datepicker/formatUtils.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"formatUtils.cjs","sources":["../../../components/datepicker/formatUtils.js"],"sourcesContent":["import { DialtoneLocalization } from '@/localization';\n\n/**\n * Formats a date into a long format using the specified locale.\n *\n * @param {Date} date - The date to format.\n * @param {string} [locale='default'] - The locale to use for formatting. Defaults to 'default'.\n * @returns {string} The formatted date string.\n */\nexport function formatLong (date, locale = null) {\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\n/**\n * Formats the given date in medium format.\n *\n * @param {Date} date - The date to be formatted.\n * @param {string} [locale='default'] - The locale to be used for formatting. Defaults to 'default'.\n * @returns {string} The formatted date string in medium format.\n */\nexport function formatMedium (date, locale = null) {\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), { year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\n/**\n * Formats a date into a short string representation.\n * @param {Date} date - The date to format.\n * @param {string} [locale='default'] - The locale to use for formatting. Defaults to 'default'.\n * @param {boolean} [showWeekday=true] - Whether to include the weekday in the formatted string. Defaults to true.\n * @returns {string} The formatted date string.\n */\nexport function formatShort (date, locale = null, showWeekday = true) {\n  const options = showWeekday ? { weekday: 'short', year: 'numeric', month: 'short', day: 'numeric' } : { year: 'numeric', month: 'short', day: 'numeric' };\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), options).format(date);\n}\n\n/**\n * Formats a date without the year.\n *\n * @param {Date} date - The date to format.\n * @param {string} [locale='default'] - The locale to use for formatting. Defaults to 'default'.\n * @param {boolean} [abbreviated=false] - Whether to use abbreviated month names. Defaults to false.\n * @returns {string} The formatted date without the year.\n */\nexport function formatNoYear (date, locale = null, abbreviated = false) {\n  const monthFormat = abbreviated ? 'short' : 'long';\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), { month: monthFormat, day: 'numeric' }).format(date);\n}\n\n/**\n * Formats a date into a numerical string representation.\n *\n * @param {Date} date - The date to format.\n * @param {string} [locale='default'] - The locale to use for formatting. Defaults to 'default'.\n * @returns {string} The formatted numerical date string.\n */\nexport function formatNumerical (date, locale = null) {\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), { year: '2-digit', month: '2-digit', day: '2-digit' }).format(date);\n}\n\nexport default {\n  formatLong,\n  formatMedium,\n  formatShort,\n  formatNoYear,\n  formatNumerical,\n};\n"],"names":["formatLong","date","locale","DialtoneLocalization","formatMedium","formatShort","showWeekday","options","formatNoYear","abbreviated","monthFormat","formatNumerical","formatUtils"],"mappings":"4JASO,SAASA,EAAYC,EAAMC,EAAS,KAAM,CAC/C,OAAO,IAAI,KAAK,eAAeA,GAAUC,EAAoB,qBAAC,mBAAoB,EAAE,CAAE,QAAS,OAAQ,KAAM,UAAW,MAAO,OAAQ,IAAK,SAAS,CAAE,EAAE,OAAOF,CAAI,CACtK,CASO,SAASG,EAAcH,EAAMC,EAAS,KAAM,CACjD,OAAO,IAAI,KAAK,eAAeA,GAAUC,EAAAA,qBAAqB,mBAAoB,EAAE,CAAE,KAAM,UAAW,MAAO,OAAQ,IAAK,SAAW,CAAA,EAAE,OAAOF,CAAI,CACrJ,CASO,SAASI,EAAaJ,EAAMC,EAAS,KAAMI,EAAc,GAAM,CACpE,MAAMC,EAAUD,EAAc,CAAE,QAAS,QAAS,KAAM,UAAW,MAAO,QAAS,IAAK,SAAW,EAAG,CAAE,KAAM,UAAW,MAAO,QAAS,IAAK,WAC9I,OAAO,IAAI,KAAK,eAAeJ,GAAUC,EAAoB,qBAAC,mBAAoB,EAAEI,CAAO,EAAE,OAAON,CAAI,CAC1G,CAUO,SAASO,EAAcP,EAAMC,EAAS,KAAMO,EAAc,GAAO,CACtE,MAAMC,EAAcD,EAAc,QAAU,OAC5C,OAAO,IAAI,KAAK,eAAeP,GAAUC,EAAoB,qBAAC,mBAAkB,EAAI,CAAE,MAAOO,EAAa,IAAK,SAAS,CAAE,EAAE,OAAOT,CAAI,CACzI,CASO,SAASU,EAAiBV,EAAMC,EAAS,KAAM,CACpD,OAAO,IAAI,KAAK,eAAeA,GAAUC,EAAAA,qBAAqB,mBAAoB,EAAE,CAAE,KAAM,UAAW,MAAO,UAAW,IAAK,SAAW,CAAA,EAAE,OAAOF,CAAI,CACxJ,CAEA,MAAeW,EAAA,CACb,WAAAZ,EACA,aAAAI,EACA,YAAAC,EACA,aAAAG,EACA,gBAAAG,CACF"}
+{"version":3,"file":"formatUtils.cjs","sources":["../../../components/datepicker/formatUtils.js"],"sourcesContent":["import { DialtoneLocalization } from '@/localization';\n\n/**\n * Formats a date into a long format using the specified locale.\n *\n * @param {Date} date - The date to format.\n * @param {string} [locale='default'] - The locale to use for formatting. Defaults to 'default'.\n * @returns {string} The formatted date string.\n */\nexport function formatLong (date, locale = null) {\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\n/**\n * Formats the given date in medium format.\n *\n * @param {Date} date - The date to be formatted.\n * @param {string} [locale='default'] - The locale to be used for formatting. Defaults to 'default'.\n * @returns {string} The formatted date string in medium format.\n */\nexport function formatMedium (date, locale = null) {\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), { year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\n/**\n * Formats a date into a short string representation.\n * @param {Date} date - The date to format.\n * @param {string} [locale='default'] - The locale to use for formatting. Defaults to 'default'.\n * @param {boolean} [showWeekday=true] - Whether to include the weekday in the formatted string. Defaults to true.\n * @returns {string} The formatted date string.\n */\nexport function formatShort (date, locale = null, showWeekday = true) {\n  const options = showWeekday ? { weekday: 'short', year: 'numeric', month: 'short', day: 'numeric' } : { year: 'numeric', month: 'short', day: 'numeric' };\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), options).format(date);\n}\n\n/**\n * Formats a date without the year.\n *\n * @param {Date} date - The date to format.\n * @param {string} [locale='default'] - The locale to use for formatting. Defaults to 'default'.\n * @param {boolean} [abbreviated=false] - Whether to use abbreviated month names. Defaults to false.\n * @returns {string} The formatted date without the year.\n */\nexport function formatNoYear (date, locale = null, abbreviated = false) {\n  const monthFormat = abbreviated ? 'short' : 'long';\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), { month: monthFormat, day: 'numeric' }).format(date);\n}\n\n/**\n * Formats a date into a numerical string representation.\n *\n * @param {Date} date - The date to format.\n * @param {string} [locale='default'] - The locale to use for formatting. Defaults to 'default'.\n * @returns {string} The formatted numerical date string.\n */\nexport function formatNumerical (date, locale = null) {\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), { year: '2-digit', month: '2-digit', day: '2-digit' }).format(date);\n}\n\nexport default {\n  formatLong,\n  formatMedium,\n  formatShort,\n  formatNoYear,\n  formatNumerical,\n};\n"],"names":["formatLong","date","locale","DialtoneLocalization","formatMedium","formatShort","showWeekday","options","formatNoYear","abbreviated","monthFormat","formatNumerical","formatUtils"],"mappings":"4JASO,SAASA,EAAYC,EAAMC,EAAS,KAAM,CAC/C,OAAO,IAAI,KAAK,eAAeA,GAAUC,EAAAA,qBAAqB,mBAAkB,EAAI,CAAE,QAAS,OAAQ,KAAM,UAAW,MAAO,OAAQ,IAAK,UAAW,EAAE,OAAOF,CAAI,CACtK,CASO,SAASG,EAAcH,EAAMC,EAAS,KAAM,CACjD,OAAO,IAAI,KAAK,eAAeA,GAAUC,EAAAA,qBAAqB,mBAAkB,EAAI,CAAE,KAAM,UAAW,MAAO,OAAQ,IAAK,SAAS,CAAE,EAAE,OAAOF,CAAI,CACrJ,CASO,SAASI,EAAaJ,EAAMC,EAAS,KAAMI,EAAc,GAAM,CACpE,MAAMC,EAAUD,EAAc,CAAE,QAAS,QAAS,KAAM,UAAW,MAAO,QAAS,IAAK,SAAS,EAAK,CAAE,KAAM,UAAW,MAAO,QAAS,IAAK,SAAS,EACvJ,OAAO,IAAI,KAAK,eAAeJ,GAAUC,EAAAA,qBAAqB,mBAAkB,EAAII,CAAO,EAAE,OAAON,CAAI,CAC1G,CAUO,SAASO,EAAcP,EAAMC,EAAS,KAAMO,EAAc,GAAO,CACtE,MAAMC,EAAcD,EAAc,QAAU,OAC5C,OAAO,IAAI,KAAK,eAAeP,GAAUC,EAAAA,qBAAqB,mBAAkB,EAAI,CAAE,MAAOO,EAAa,IAAK,SAAS,CAAE,EAAE,OAAOT,CAAI,CACzI,CASO,SAASU,EAAiBV,EAAMC,EAAS,KAAM,CACpD,OAAO,IAAI,KAAK,eAAeA,GAAUC,EAAAA,qBAAqB,mBAAkB,EAAI,CAAE,KAAM,UAAW,MAAO,UAAW,IAAK,SAAS,CAAE,EAAE,OAAOF,CAAI,CACxJ,CAEA,MAAAW,EAAe,CACb,WAAAZ,EACA,aAAAI,EACA,YAAAC,EACA,aAAAG,EACA,gBAAAG,CACF"}

package/dist/lib/datepicker/formatUtils.js.map

@@ -1 +1 @@
-{"version":3,"file":"formatUtils.js","sources":["../../../components/datepicker/formatUtils.js"],"sourcesContent":["import { DialtoneLocalization } from '@/localization';\n\n/**\n * Formats a date into a long format using the specified locale.\n *\n * @param {Date} date - The date to format.\n * @param {string} [locale='default'] - The locale to use for formatting. Defaults to 'default'.\n * @returns {string} The formatted date string.\n */\nexport function formatLong (date, locale = null) {\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\n/**\n * Formats the given date in medium format.\n *\n * @param {Date} date - The date to be formatted.\n * @param {string} [locale='default'] - The locale to be used for formatting. Defaults to 'default'.\n * @returns {string} The formatted date string in medium format.\n */\nexport function formatMedium (date, locale = null) {\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), { year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\n/**\n * Formats a date into a short string representation.\n * @param {Date} date - The date to format.\n * @param {string} [locale='default'] - The locale to use for formatting. Defaults to 'default'.\n * @param {boolean} [showWeekday=true] - Whether to include the weekday in the formatted string. Defaults to true.\n * @returns {string} The formatted date string.\n */\nexport function formatShort (date, locale = null, showWeekday = true) {\n  const options = showWeekday ? { weekday: 'short', year: 'numeric', month: 'short', day: 'numeric' } : { year: 'numeric', month: 'short', day: 'numeric' };\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), options).format(date);\n}\n\n/**\n * Formats a date without the year.\n *\n * @param {Date} date - The date to format.\n * @param {string} [locale='default'] - The locale to use for formatting. Defaults to 'default'.\n * @param {boolean} [abbreviated=false] - Whether to use abbreviated month names. Defaults to false.\n * @returns {string} The formatted date without the year.\n */\nexport function formatNoYear (date, locale = null, abbreviated = false) {\n  const monthFormat = abbreviated ? 'short' : 'long';\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), { month: monthFormat, day: 'numeric' }).format(date);\n}\n\n/**\n * Formats a date into a numerical string representation.\n *\n * @param {Date} date - The date to format.\n * @param {string} [locale='default'] - The locale to use for formatting. Defaults to 'default'.\n * @returns {string} The formatted numerical date string.\n */\nexport function formatNumerical (date, locale = null) {\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), { year: '2-digit', month: '2-digit', day: '2-digit' }).format(date);\n}\n\nexport default {\n  formatLong,\n  formatMedium,\n  formatShort,\n  formatNoYear,\n  formatNumerical,\n};\n"],"names":["formatLong","date","locale","DialtoneLocalization","formatMedium","formatShort","showWeekday","options","formatNoYear","abbreviated","monthFormat","formatNumerical","formatUtils"],"mappings":";AASO,SAASA,EAAYC,GAAMC,IAAS,MAAM;AAC/C,SAAO,IAAI,KAAK,eAAeA,KAAUC,EAAqB,mBAAoB,GAAE,EAAE,SAAS,QAAQ,MAAM,WAAW,OAAO,QAAQ,KAAK,UAAS,CAAE,EAAE,OAAOF,CAAI;AACtK;AASO,SAASG,EAAcH,GAAMC,IAAS,MAAM;AACjD,SAAO,IAAI,KAAK,eAAeA,KAAUC,EAAqB,mBAAoB,GAAE,EAAE,MAAM,WAAW,OAAO,QAAQ,KAAK,UAAW,CAAA,EAAE,OAAOF,CAAI;AACrJ;AASO,SAASI,EAAaJ,GAAMC,IAAS,MAAMI,IAAc,IAAM;AACpE,QAAMC,IAAUD,IAAc,EAAE,SAAS,SAAS,MAAM,WAAW,OAAO,SAAS,KAAK,UAAW,IAAG,EAAE,MAAM,WAAW,OAAO,SAAS,KAAK;AAC9I,SAAO,IAAI,KAAK,eAAeJ,KAAUC,EAAqB,mBAAoB,GAAEI,CAAO,EAAE,OAAON,CAAI;AAC1G;AAUO,SAASO,EAAcP,GAAMC,IAAS,MAAMO,IAAc,IAAO;AACtE,QAAMC,IAAcD,IAAc,UAAU;AAC5C,SAAO,IAAI,KAAK,eAAeP,KAAUC,EAAqB,mBAAkB,GAAI,EAAE,OAAOO,GAAa,KAAK,UAAS,CAAE,EAAE,OAAOT,CAAI;AACzI;AASO,SAASU,EAAiBV,GAAMC,IAAS,MAAM;AACpD,SAAO,IAAI,KAAK,eAAeA,KAAUC,EAAqB,mBAAoB,GAAE,EAAE,MAAM,WAAW,OAAO,WAAW,KAAK,UAAW,CAAA,EAAE,OAAOF,CAAI;AACxJ;AAEA,MAAeW,IAAA;AAAA,EACb,YAAAZ;AAAA,EACA,cAAAI;AAAA,EACA,aAAAC;AAAA,EACA,cAAAG;AAAA,EACA,iBAAAG;AACF;"}
+{"version":3,"file":"formatUtils.js","sources":["../../../components/datepicker/formatUtils.js"],"sourcesContent":["import { DialtoneLocalization } from '@/localization';\n\n/**\n * Formats a date into a long format using the specified locale.\n *\n * @param {Date} date - The date to format.\n * @param {string} [locale='default'] - The locale to use for formatting. Defaults to 'default'.\n * @returns {string} The formatted date string.\n */\nexport function formatLong (date, locale = null) {\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\n/**\n * Formats the given date in medium format.\n *\n * @param {Date} date - The date to be formatted.\n * @param {string} [locale='default'] - The locale to be used for formatting. Defaults to 'default'.\n * @returns {string} The formatted date string in medium format.\n */\nexport function formatMedium (date, locale = null) {\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), { year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\n/**\n * Formats a date into a short string representation.\n * @param {Date} date - The date to format.\n * @param {string} [locale='default'] - The locale to use for formatting. Defaults to 'default'.\n * @param {boolean} [showWeekday=true] - Whether to include the weekday in the formatted string. Defaults to true.\n * @returns {string} The formatted date string.\n */\nexport function formatShort (date, locale = null, showWeekday = true) {\n  const options = showWeekday ? { weekday: 'short', year: 'numeric', month: 'short', day: 'numeric' } : { year: 'numeric', month: 'short', day: 'numeric' };\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), options).format(date);\n}\n\n/**\n * Formats a date without the year.\n *\n * @param {Date} date - The date to format.\n * @param {string} [locale='default'] - The locale to use for formatting. Defaults to 'default'.\n * @param {boolean} [abbreviated=false] - Whether to use abbreviated month names. Defaults to false.\n * @returns {string} The formatted date without the year.\n */\nexport function formatNoYear (date, locale = null, abbreviated = false) {\n  const monthFormat = abbreviated ? 'short' : 'long';\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), { month: monthFormat, day: 'numeric' }).format(date);\n}\n\n/**\n * Formats a date into a numerical string representation.\n *\n * @param {Date} date - The date to format.\n * @param {string} [locale='default'] - The locale to use for formatting. Defaults to 'default'.\n * @returns {string} The formatted numerical date string.\n */\nexport function formatNumerical (date, locale = null) {\n  return new Intl.DateTimeFormat(locale || DialtoneLocalization.getPreferredLocale(), { year: '2-digit', month: '2-digit', day: '2-digit' }).format(date);\n}\n\nexport default {\n  formatLong,\n  formatMedium,\n  formatShort,\n  formatNoYear,\n  formatNumerical,\n};\n"],"names":["formatLong","date","locale","DialtoneLocalization","formatMedium","formatShort","showWeekday","options","formatNoYear","abbreviated","monthFormat","formatNumerical","formatUtils"],"mappings":";AASO,SAASA,EAAYC,GAAMC,IAAS,MAAM;AAC/C,SAAO,IAAI,KAAK,eAAeA,KAAUC,EAAqB,mBAAkB,GAAI,EAAE,SAAS,QAAQ,MAAM,WAAW,OAAO,QAAQ,KAAK,WAAW,EAAE,OAAOF,CAAI;AACtK;AASO,SAASG,EAAcH,GAAMC,IAAS,MAAM;AACjD,SAAO,IAAI,KAAK,eAAeA,KAAUC,EAAqB,mBAAkB,GAAI,EAAE,MAAM,WAAW,OAAO,QAAQ,KAAK,UAAS,CAAE,EAAE,OAAOF,CAAI;AACrJ;AASO,SAASI,EAAaJ,GAAMC,IAAS,MAAMI,IAAc,IAAM;AACpE,QAAMC,IAAUD,IAAc,EAAE,SAAS,SAAS,MAAM,WAAW,OAAO,SAAS,KAAK,UAAS,IAAK,EAAE,MAAM,WAAW,OAAO,SAAS,KAAK,UAAS;AACvJ,SAAO,IAAI,KAAK,eAAeJ,KAAUC,EAAqB,mBAAkB,GAAII,CAAO,EAAE,OAAON,CAAI;AAC1G;AAUO,SAASO,EAAcP,GAAMC,IAAS,MAAMO,IAAc,IAAO;AACtE,QAAMC,IAAcD,IAAc,UAAU;AAC5C,SAAO,IAAI,KAAK,eAAeP,KAAUC,EAAqB,mBAAkB,GAAI,EAAE,OAAOO,GAAa,KAAK,UAAS,CAAE,EAAE,OAAOT,CAAI;AACzI;AASO,SAASU,EAAiBV,GAAMC,IAAS,MAAM;AACpD,SAAO,IAAI,KAAK,eAAeA,KAAUC,EAAqB,mBAAkB,GAAI,EAAE,MAAM,WAAW,OAAO,WAAW,KAAK,UAAS,CAAE,EAAE,OAAOF,CAAI;AACxJ;AAEA,MAAAW,IAAe;AAAA,EACb,YAAAZ;AAAA,EACA,cAAAI;AAAA,EACA,aAAAC;AAAA,EACA,cAAAG;AAAA,EACA,iBAAAG;AACF;"}

package/dist/lib/datepicker/utils.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"utils.cjs","sources":["../../../components/datepicker/utils.js"],"sourcesContent":["import {\n  startOfWeek, addDays, getMonth, isEqual,\n  addMonths, startOfMonth, getDay, getDate,\n  subMonths, endOfMonth,\n} from 'date-fns';\nimport { WEEK_START } from '@/components/datepicker/datepicker_constants.js';\n\nconst _parsedGetDate = (value) => (value ? new Date(value) : new Date());\n\n/**\n * Get 7 days from the provided start date, month is used to check\n * whether the date is from the specified month or in the offset\n */\nconst getWeekDays = (startDay, month, selectedDay) => {\n  const startDate = _parsedGetDate(JSON.parse(JSON.stringify(startDay)));\n  const dates = [];\n  for (let i = 0; i < 7; i++) {\n    const next = addDays(startDate, i);\n    const isNext = getMonth(next) !== month;\n    dates.push({\n      text: next.getDate(),\n      value: next,\n      currentMonth: !isNext,\n      isFirstDayOfMonth: next.getDate() === 1 && !isNext,\n      // will be selected if the date is the same as the selected day and is from the current month\n      selected: selectedDay ? (next.getDate() === selectedDay && !isNext) : false,\n    });\n  }\n  return dates;\n};\n\nconst isDateEqual = (date, dateToCompare) => {\n  if (!date || !dateToCompare) {\n    return false;\n  }\n  return isEqual(date, dateToCompare);\n};\n\n/**\n * Get days for the calendar to be displayed in a table grouped by weeks\n */\nexport const getCalendarDays = (month, year, selectedDay) => {\n  const weeks = [];\n  const firstDate = _parsedGetDate(new Date(year, month));\n  const lastDate = _parsedGetDate(new Date(year, month + 1, 0));\n\n  const weekStartsOn = WEEK_START;\n\n  const firstDateInCalendar = startOfWeek(firstDate, { weekStartsOn });\n\n  const addDaysToWeek = (date) => {\n    const days = getWeekDays(date, month, selectedDay);\n\n    weeks.push({ days });\n\n    if (\n      !weeks[weeks.length - 1].days.some((day) =>\n        isDateEqual(day.value, lastDate),\n      )\n    ) {\n      const nextDate = addDays(date, 7);\n      addDaysToWeek(nextDate);\n    }\n  };\n\n  addDaysToWeek(firstDateInCalendar);\n\n  return weeks;\n};\n\n/**\n * Generate week day names based on locale and in order specified in week start\n */\nexport const getWeekDayNames = (locale, weekStart) => {\n  // Get list in order from sun ... sat\n  const days = [1, 2, 3, 4, 5, 6, 7].map((day) => {\n    return new Intl.DateTimeFormat(locale, { weekday: 'short', timeZone: 'UTC' })\n      .format(new Date(`2017-01-0${day}T00:00:00+00:00`))\n      .slice(0, 2);\n  });\n\n  // Get days that are in order before specified week start\n  const beforeWeekStart = days.slice(0, weekStart);\n  // Get days that are in order after specified week start\n  const afterWeekStart = days.slice(weekStart + 1, days.length);\n\n  // return them in correct order\n  return [days[weekStart]].concat(...afterWeekStart).concat(...beforeWeekStart);\n};\n\nexport const formatMonth = (month, monthFormat, locale) => {\n  return new Intl.DateTimeFormat(locale, { month: monthFormat }).format(new Date(2000, month, 1));\n};\n\nexport const formatDate = (date, dateFormat, locale) => {\n  return new Intl.DateTimeFormat(locale, { dateStyle: dateFormat }).format(new Date(date));\n};\n\nexport const calculateNextFocusDate = (currentDate) => {\n  const date = new Date(currentDate);\n  const currentWeekday = getDay(date);\n  const nextMonthDate = addMonths(date, 1);\n  const nextMonthStart = startOfMonth(nextMonthDate);\n  const nextMonthStartWeekday = getDay(nextMonthStart);\n\n  const dayDifference = (currentWeekday - nextMonthStartWeekday + 7) % 7;\n\n  // Add the difference in days to the first day of the next month\n  const focusDate = addDays(nextMonthStart, dayDifference);\n\n  // Returns only the day of the month\n  return getDate(focusDate);\n};\n\nexport const calculatePrevFocusDate = (currentDate) => {\n  const date = new Date(currentDate);\n  const currentWeekday = getDay(date);\n\n  // Move to the last day of the previous month\n  const lastDayOfPrevMonth = endOfMonth(subMonths(date, 1));\n  let focusDate = lastDayOfPrevMonth;\n\n  // Adjust to the same weekday in the last week of the previous month\n  while (getDay(focusDate) !== currentWeekday) {\n    focusDate = addDays(focusDate, -1);\n  }\n\n  // Returns only the day of the month\n  return getDate(focusDate);\n};\n"],"names":["_parsedGetDate","value","getWeekDays","startDay","month","selectedDay","startDate","dates","i","next","addDays","isNext","getMonth","isDateEqual","date","dateToCompare","isEqual","getCalendarDays","year","weeks","firstDate","lastDate","weekStartsOn","WEEK_START","firstDateInCalendar","startOfWeek","addDaysToWeek","days","day","nextDate","getWeekDayNames","locale","weekStart","beforeWeekStart","afterWeekStart","formatMonth","monthFormat","formatDate","dateFormat","calculateNextFocusDate","currentDate","currentWeekday","getDay","nextMonthDate","addMonths","nextMonthStart","startOfMonth","nextMonthStartWeekday","dayDifference","focusDate","getDate","calculatePrevFocusDate","endOfMonth","subMonths"],"mappings":"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"}
+{"version":3,"file":"utils.cjs","sources":["../../../components/datepicker/utils.js"],"sourcesContent":["import {\n  startOfWeek, addDays, getMonth, isEqual,\n  addMonths, startOfMonth, getDay, getDate,\n  subMonths, endOfMonth,\n} from 'date-fns';\nimport { WEEK_START } from '@/components/datepicker/datepicker_constants.js';\n\nconst _parsedGetDate = (value) => (value ? new Date(value) : new Date());\n\n/**\n * Get 7 days from the provided start date, month is used to check\n * whether the date is from the specified month or in the offset\n */\nconst getWeekDays = (startDay, month, selectedDay) => {\n  const startDate = _parsedGetDate(JSON.parse(JSON.stringify(startDay)));\n  const dates = [];\n  for (let i = 0; i < 7; i++) {\n    const next = addDays(startDate, i);\n    const isNext = getMonth(next) !== month;\n    dates.push({\n      text: next.getDate(),\n      value: next,\n      currentMonth: !isNext,\n      isFirstDayOfMonth: next.getDate() === 1 && !isNext,\n      // will be selected if the date is the same as the selected day and is from the current month\n      selected: selectedDay ? (next.getDate() === selectedDay && !isNext) : false,\n    });\n  }\n  return dates;\n};\n\nconst isDateEqual = (date, dateToCompare) => {\n  if (!date || !dateToCompare) {\n    return false;\n  }\n  return isEqual(date, dateToCompare);\n};\n\n/**\n * Get days for the calendar to be displayed in a table grouped by weeks\n */\nexport const getCalendarDays = (month, year, selectedDay) => {\n  const weeks = [];\n  const firstDate = _parsedGetDate(new Date(year, month));\n  const lastDate = _parsedGetDate(new Date(year, month + 1, 0));\n\n  const weekStartsOn = WEEK_START;\n\n  const firstDateInCalendar = startOfWeek(firstDate, { weekStartsOn });\n\n  const addDaysToWeek = (date) => {\n    const days = getWeekDays(date, month, selectedDay);\n\n    weeks.push({ days });\n\n    if (\n      !weeks[weeks.length - 1].days.some((day) =>\n        isDateEqual(day.value, lastDate),\n      )\n    ) {\n      const nextDate = addDays(date, 7);\n      addDaysToWeek(nextDate);\n    }\n  };\n\n  addDaysToWeek(firstDateInCalendar);\n\n  return weeks;\n};\n\n/**\n * Generate week day names based on locale and in order specified in week start\n */\nexport const getWeekDayNames = (locale, weekStart) => {\n  // Get list in order from sun ... sat\n  const days = [1, 2, 3, 4, 5, 6, 7].map((day) => {\n    return new Intl.DateTimeFormat(locale, { weekday: 'short', timeZone: 'UTC' })\n      .format(new Date(`2017-01-0${day}T00:00:00+00:00`))\n      .slice(0, 2);\n  });\n\n  // Get days that are in order before specified week start\n  const beforeWeekStart = days.slice(0, weekStart);\n  // Get days that are in order after specified week start\n  const afterWeekStart = days.slice(weekStart + 1, days.length);\n\n  // return them in correct order\n  return [days[weekStart]].concat(...afterWeekStart).concat(...beforeWeekStart);\n};\n\nexport const formatMonth = (month, monthFormat, locale) => {\n  return new Intl.DateTimeFormat(locale, { month: monthFormat }).format(new Date(2000, month, 1));\n};\n\nexport const formatDate = (date, dateFormat, locale) => {\n  return new Intl.DateTimeFormat(locale, { dateStyle: dateFormat }).format(new Date(date));\n};\n\nexport const calculateNextFocusDate = (currentDate) => {\n  const date = new Date(currentDate);\n  const currentWeekday = getDay(date);\n  const nextMonthDate = addMonths(date, 1);\n  const nextMonthStart = startOfMonth(nextMonthDate);\n  const nextMonthStartWeekday = getDay(nextMonthStart);\n\n  const dayDifference = (currentWeekday - nextMonthStartWeekday + 7) % 7;\n\n  // Add the difference in days to the first day of the next month\n  const focusDate = addDays(nextMonthStart, dayDifference);\n\n  // Returns only the day of the month\n  return getDate(focusDate);\n};\n\nexport const calculatePrevFocusDate = (currentDate) => {\n  const date = new Date(currentDate);\n  const currentWeekday = getDay(date);\n\n  // Move to the last day of the previous month\n  const lastDayOfPrevMonth = endOfMonth(subMonths(date, 1));\n  let focusDate = lastDayOfPrevMonth;\n\n  // Adjust to the same weekday in the last week of the previous month\n  while (getDay(focusDate) !== currentWeekday) {\n    focusDate = addDays(focusDate, -1);\n  }\n\n  // Returns only the day of the month\n  return getDate(focusDate);\n};\n"],"names":["_parsedGetDate","value","getWeekDays","startDay","month","selectedDay","startDate","dates","i","next","addDays","isNext","getMonth","isDateEqual","date","dateToCompare","isEqual","getCalendarDays","year","weeks","firstDate","lastDate","weekStartsOn","WEEK_START","firstDateInCalendar","startOfWeek","addDaysToWeek","days","day","nextDate","getWeekDayNames","locale","weekStart","beforeWeekStart","afterWeekStart","formatMonth","monthFormat","formatDate","dateFormat","calculateNextFocusDate","currentDate","currentWeekday","getDay","nextMonthDate","addMonths","nextMonthStart","startOfMonth","nextMonthStartWeekday","dayDifference","focusDate","getDate","calculatePrevFocusDate","endOfMonth","subMonths"],"mappings":"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"}

package/dist/lib/datepicker/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../../components/datepicker/utils.js"],"sourcesContent":["import {\n  startOfWeek, addDays, getMonth, isEqual,\n  addMonths, startOfMonth, getDay, getDate,\n  subMonths, endOfMonth,\n} from 'date-fns';\nimport { WEEK_START } from '@/components/datepicker/datepicker_constants.js';\n\nconst _parsedGetDate = (value) => (value ? new Date(value) : new Date());\n\n/**\n * Get 7 days from the provided start date, month is used to check\n * whether the date is from the specified month or in the offset\n */\nconst getWeekDays = (startDay, month, selectedDay) => {\n  const startDate = _parsedGetDate(JSON.parse(JSON.stringify(startDay)));\n  const dates = [];\n  for (let i = 0; i < 7; i++) {\n    const next = addDays(startDate, i);\n    const isNext = getMonth(next) !== month;\n    dates.push({\n      text: next.getDate(),\n      value: next,\n      currentMonth: !isNext,\n      isFirstDayOfMonth: next.getDate() === 1 && !isNext,\n      // will be selected if the date is the same as the selected day and is from the current month\n      selected: selectedDay ? (next.getDate() === selectedDay && !isNext) : false,\n    });\n  }\n  return dates;\n};\n\nconst isDateEqual = (date, dateToCompare) => {\n  if (!date || !dateToCompare) {\n    return false;\n  }\n  return isEqual(date, dateToCompare);\n};\n\n/**\n * Get days for the calendar to be displayed in a table grouped by weeks\n */\nexport const getCalendarDays = (month, year, selectedDay) => {\n  const weeks = [];\n  const firstDate = _parsedGetDate(new Date(year, month));\n  const lastDate = _parsedGetDate(new Date(year, month + 1, 0));\n\n  const weekStartsOn = WEEK_START;\n\n  const firstDateInCalendar = startOfWeek(firstDate, { weekStartsOn });\n\n  const addDaysToWeek = (date) => {\n    const days = getWeekDays(date, month, selectedDay);\n\n    weeks.push({ days });\n\n    if (\n      !weeks[weeks.length - 1].days.some((day) =>\n        isDateEqual(day.value, lastDate),\n      )\n    ) {\n      const nextDate = addDays(date, 7);\n      addDaysToWeek(nextDate);\n    }\n  };\n\n  addDaysToWeek(firstDateInCalendar);\n\n  return weeks;\n};\n\n/**\n * Generate week day names based on locale and in order specified in week start\n */\nexport const getWeekDayNames = (locale, weekStart) => {\n  // Get list in order from sun ... sat\n  const days = [1, 2, 3, 4, 5, 6, 7].map((day) => {\n    return new Intl.DateTimeFormat(locale, { weekday: 'short', timeZone: 'UTC' })\n      .format(new Date(`2017-01-0${day}T00:00:00+00:00`))\n      .slice(0, 2);\n  });\n\n  // Get days that are in order before specified week start\n  const beforeWeekStart = days.slice(0, weekStart);\n  // Get days that are in order after specified week start\n  const afterWeekStart = days.slice(weekStart + 1, days.length);\n\n  // return them in correct order\n  return [days[weekStart]].concat(...afterWeekStart).concat(...beforeWeekStart);\n};\n\nexport const formatMonth = (month, monthFormat, locale) => {\n  return new Intl.DateTimeFormat(locale, { month: monthFormat }).format(new Date(2000, month, 1));\n};\n\nexport const formatDate = (date, dateFormat, locale) => {\n  return new Intl.DateTimeFormat(locale, { dateStyle: dateFormat }).format(new Date(date));\n};\n\nexport const calculateNextFocusDate = (currentDate) => {\n  const date = new Date(currentDate);\n  const currentWeekday = getDay(date);\n  const nextMonthDate = addMonths(date, 1);\n  const nextMonthStart = startOfMonth(nextMonthDate);\n  const nextMonthStartWeekday = getDay(nextMonthStart);\n\n  const dayDifference = (currentWeekday - nextMonthStartWeekday + 7) % 7;\n\n  // Add the difference in days to the first day of the next month\n  const focusDate = addDays(nextMonthStart, dayDifference);\n\n  // Returns only the day of the month\n  return getDate(focusDate);\n};\n\nexport const calculatePrevFocusDate = (currentDate) => {\n  const date = new Date(currentDate);\n  const currentWeekday = getDay(date);\n\n  // Move to the last day of the previous month\n  const lastDayOfPrevMonth = endOfMonth(subMonths(date, 1));\n  let focusDate = lastDayOfPrevMonth;\n\n  // Adjust to the same weekday in the last week of the previous month\n  while (getDay(focusDate) !== currentWeekday) {\n    focusDate = addDays(focusDate, -1);\n  }\n\n  // Returns only the day of the month\n  return getDate(focusDate);\n};\n"],"names":["_parsedGetDate","value","getWeekDays","startDay","month","selectedDay","startDate","dates","i","next","addDays","isNext","getMonth","isDateEqual","date","dateToCompare","isEqual","getCalendarDays","year","weeks","firstDate","lastDate","firstDateInCalendar","startOfWeek","WEEK_START","addDaysToWeek","days","day","nextDate","getWeekDayNames","locale","weekStart","beforeWeekStart","afterWeekStart","formatMonth","monthFormat","formatDate","dateFormat","calculateNextFocusDate","currentDate","currentWeekday","getDay","nextMonthDate","addMonths","nextMonthStart","startOfMonth","nextMonthStartWeekday","dayDifference","focusDate","getDate","calculatePrevFocusDate","endOfMonth","subMonths"],"mappings":"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"}
+{"version":3,"file":"utils.js","sources":["../../../components/datepicker/utils.js"],"sourcesContent":["import {\n  startOfWeek, addDays, getMonth, isEqual,\n  addMonths, startOfMonth, getDay, getDate,\n  subMonths, endOfMonth,\n} from 'date-fns';\nimport { WEEK_START } from '@/components/datepicker/datepicker_constants.js';\n\nconst _parsedGetDate = (value) => (value ? new Date(value) : new Date());\n\n/**\n * Get 7 days from the provided start date, month is used to check\n * whether the date is from the specified month or in the offset\n */\nconst getWeekDays = (startDay, month, selectedDay) => {\n  const startDate = _parsedGetDate(JSON.parse(JSON.stringify(startDay)));\n  const dates = [];\n  for (let i = 0; i < 7; i++) {\n    const next = addDays(startDate, i);\n    const isNext = getMonth(next) !== month;\n    dates.push({\n      text: next.getDate(),\n      value: next,\n      currentMonth: !isNext,\n      isFirstDayOfMonth: next.getDate() === 1 && !isNext,\n      // will be selected if the date is the same as the selected day and is from the current month\n      selected: selectedDay ? (next.getDate() === selectedDay && !isNext) : false,\n    });\n  }\n  return dates;\n};\n\nconst isDateEqual = (date, dateToCompare) => {\n  if (!date || !dateToCompare) {\n    return false;\n  }\n  return isEqual(date, dateToCompare);\n};\n\n/**\n * Get days for the calendar to be displayed in a table grouped by weeks\n */\nexport const getCalendarDays = (month, year, selectedDay) => {\n  const weeks = [];\n  const firstDate = _parsedGetDate(new Date(year, month));\n  const lastDate = _parsedGetDate(new Date(year, month + 1, 0));\n\n  const weekStartsOn = WEEK_START;\n\n  const firstDateInCalendar = startOfWeek(firstDate, { weekStartsOn });\n\n  const addDaysToWeek = (date) => {\n    const days = getWeekDays(date, month, selectedDay);\n\n    weeks.push({ days });\n\n    if (\n      !weeks[weeks.length - 1].days.some((day) =>\n        isDateEqual(day.value, lastDate),\n      )\n    ) {\n      const nextDate = addDays(date, 7);\n      addDaysToWeek(nextDate);\n    }\n  };\n\n  addDaysToWeek(firstDateInCalendar);\n\n  return weeks;\n};\n\n/**\n * Generate week day names based on locale and in order specified in week start\n */\nexport const getWeekDayNames = (locale, weekStart) => {\n  // Get list in order from sun ... sat\n  const days = [1, 2, 3, 4, 5, 6, 7].map((day) => {\n    return new Intl.DateTimeFormat(locale, { weekday: 'short', timeZone: 'UTC' })\n      .format(new Date(`2017-01-0${day}T00:00:00+00:00`))\n      .slice(0, 2);\n  });\n\n  // Get days that are in order before specified week start\n  const beforeWeekStart = days.slice(0, weekStart);\n  // Get days that are in order after specified week start\n  const afterWeekStart = days.slice(weekStart + 1, days.length);\n\n  // return them in correct order\n  return [days[weekStart]].concat(...afterWeekStart).concat(...beforeWeekStart);\n};\n\nexport const formatMonth = (month, monthFormat, locale) => {\n  return new Intl.DateTimeFormat(locale, { month: monthFormat }).format(new Date(2000, month, 1));\n};\n\nexport const formatDate = (date, dateFormat, locale) => {\n  return new Intl.DateTimeFormat(locale, { dateStyle: dateFormat }).format(new Date(date));\n};\n\nexport const calculateNextFocusDate = (currentDate) => {\n  const date = new Date(currentDate);\n  const currentWeekday = getDay(date);\n  const nextMonthDate = addMonths(date, 1);\n  const nextMonthStart = startOfMonth(nextMonthDate);\n  const nextMonthStartWeekday = getDay(nextMonthStart);\n\n  const dayDifference = (currentWeekday - nextMonthStartWeekday + 7) % 7;\n\n  // Add the difference in days to the first day of the next month\n  const focusDate = addDays(nextMonthStart, dayDifference);\n\n  // Returns only the day of the month\n  return getDate(focusDate);\n};\n\nexport const calculatePrevFocusDate = (currentDate) => {\n  const date = new Date(currentDate);\n  const currentWeekday = getDay(date);\n\n  // Move to the last day of the previous month\n  const lastDayOfPrevMonth = endOfMonth(subMonths(date, 1));\n  let focusDate = lastDayOfPrevMonth;\n\n  // Adjust to the same weekday in the last week of the previous month\n  while (getDay(focusDate) !== currentWeekday) {\n    focusDate = addDays(focusDate, -1);\n  }\n\n  // Returns only the day of the month\n  return getDate(focusDate);\n};\n"],"names":["_parsedGetDate","value","getWeekDays","startDay","month","selectedDay","startDate","dates","i","next","addDays","isNext","getMonth","isDateEqual","date","dateToCompare","isEqual","getCalendarDays","year","weeks","firstDate","lastDate","firstDateInCalendar","startOfWeek","WEEK_START","addDaysToWeek","days","day","nextDate","getWeekDayNames","locale","weekStart","beforeWeekStart","afterWeekStart","formatMonth","monthFormat","formatDate","dateFormat","calculateNextFocusDate","currentDate","currentWeekday","getDay","nextMonthDate","addMonths","nextMonthStart","startOfMonth","nextMonthStartWeekday","dayDifference","focusDate","getDate","calculatePrevFocusDate","endOfMonth","subMonths"],"mappings":"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"}

package/dist/lib/description-list/description-list.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"description-list.cjs","sources":["../../../components/description_list/description_list.vue"],"sourcesContent":["<template>\n  <dl :class=\"['d-description-list', getDirectionClass, getGapClass]\">\n    <template\n      v-for=\"item in items\"\n    >\n      <dt\n        :key=\"`dt-${item.term}`\"\n        :class=\"dtClass\"\n      >\n        {{ item.term }}\n      </dt>\n      <dd\n        :key=\"`dd-${item.term}`\"\n        :class=\"ddClass\"\n      >\n        {{ item.description }}\n      </dd>\n    </template>\n  </dl>\n</template>\n\n<script>\nimport { DT_STACK_GAP } from '@/components/stack';\nimport { DT_DESCRIPTION_LIST_DIRECTION } from './description_list_constants';\nimport { itemsValidator } from './description_list_validators';\n\nexport default {\n  name: 'DtDescriptionList',\n\n  props: {\n    /**\n     * The direction for the list\n     * @values row, column\n     */\n    direction: {\n      type: String,\n      default: 'row',\n      validator: direction => DT_DESCRIPTION_LIST_DIRECTION.includes(direction),\n    },\n\n    /**\n     * A list of items that represent the term and the description\n     */\n    items: {\n      type: Array,\n      default: () => [],\n      validator: items => itemsValidator(items),\n      required: true,\n    },\n\n    /**\n     * Set the space between the elements\n     * @values 0, 100, 200, 300, 400, 500, 600\n     */\n    gap: {\n      type: String,\n      default: '400',\n      validator: (gap) => DT_STACK_GAP.includes(gap),\n    },\n\n    /**\n     * Used to customize the term element\n     */\n    termClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Used to customize the description element\n     */\n    descriptionClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n  },\n\n  computed: {\n    dtClass () {\n      return ['d-description-list__term', this.termClass];\n    },\n\n    ddClass () {\n      return ['d-description-list__description', this.descriptionClass];\n    },\n\n    getDirectionClass () {\n      return `d-description-list--${this.direction}`;\n    },\n\n    getGapClass () {\n      return `d-description-list--gap-${this.gap}`;\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","direction","DT_DESCRIPTION_LIST_DIRECTION","items","itemsValidator","gap","DT_STACK_GAP"],"mappings":"iTA0BAA,EAAA,CACA,KAAA,oBAEA,MAAA,CAKA,UAAA,CACA,KAAA,OACA,QAAA,MACA,UAAAC,GAAAC,gCAAA,SAAAD,CAAA,CACA,EAKA,MAAA,CACA,KAAA,MACA,QAAA,IAAA,CAAA,EACA,UAAAE,GAAAC,EAAA,eAAAD,CAAA,EACA,SAAA,EACA,EAMA,IAAA,CACA,KAAA,OACA,QAAA,MACA,UAAAE,GAAAC,eAAA,SAAAD,CAAA,CACA,EAKA,UAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,iBAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,CACA,EAEA,SAAA,CACA,SAAA,CACA,MAAA,CAAA,2BAAA,KAAA,SAAA,CACA,EAEA,SAAA,CACA,MAAA,CAAA,kCAAA,KAAA,gBAAA,CACA,EAEA,mBAAA,CACA,MAAA,uBAAA,KAAA,SAAA,EACA,EAEA,aAAA,CACA,MAAA,2BAAA,KAAA,GAAA,EACA,CACA,CACA"}
+{"version":3,"file":"description-list.cjs","sources":["../../../components/description_list/description_list.vue"],"sourcesContent":["<template>\n  <dl :class=\"['d-description-list', getDirectionClass, getGapClass]\">\n    <template\n      v-for=\"item in items\"\n    >\n      <dt\n        :key=\"`dt-${item.term}`\"\n        :class=\"dtClass\"\n      >\n        {{ item.term }}\n      </dt>\n      <dd\n        :key=\"`dd-${item.term}`\"\n        :class=\"ddClass\"\n      >\n        {{ item.description }}\n      </dd>\n    </template>\n  </dl>\n</template>\n\n<script>\nimport { DT_STACK_GAP } from '@/components/stack';\nimport { DT_DESCRIPTION_LIST_DIRECTION } from './description_list_constants';\nimport { itemsValidator } from './description_list_validators';\n\nexport default {\n  name: 'DtDescriptionList',\n\n  props: {\n    /**\n     * The direction for the list\n     * @values row, column\n     */\n    direction: {\n      type: String,\n      default: 'row',\n      validator: direction => DT_DESCRIPTION_LIST_DIRECTION.includes(direction),\n    },\n\n    /**\n     * A list of items that represent the term and the description\n     */\n    items: {\n      type: Array,\n      default: () => [],\n      validator: items => itemsValidator(items),\n      required: true,\n    },\n\n    /**\n     * Set the space between the elements\n     * @values 0, 100, 200, 300, 400, 500, 600\n     */\n    gap: {\n      type: String,\n      default: '400',\n      validator: (gap) => DT_STACK_GAP.includes(gap),\n    },\n\n    /**\n     * Used to customize the term element\n     */\n    termClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Used to customize the description element\n     */\n    descriptionClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n  },\n\n  computed: {\n    dtClass () {\n      return ['d-description-list__term', this.termClass];\n    },\n\n    ddClass () {\n      return ['d-description-list__description', this.descriptionClass];\n    },\n\n    getDirectionClass () {\n      return `d-description-list--${this.direction}`;\n    },\n\n    getGapClass () {\n      return `d-description-list--gap-${this.gap}`;\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","direction","DT_DESCRIPTION_LIST_DIRECTION","items","itemsValidator","gap","DT_STACK_GAP"],"mappings":"iTA0BAA,EAAA,CACA,KAAA,oBAEA,MAAA,CAKA,UAAA,CACA,KAAA,OACA,QAAA,MACA,UAAAC,GAAAC,gCAAA,SAAAD,CAAA,CACA,EAKA,MAAA,CACA,KAAA,MACA,QAAA,IAAA,CAAA,EACA,UAAAE,GAAAC,EAAAA,eAAAD,CAAA,EACA,SAAA,EACA,EAMA,IAAA,CACA,KAAA,OACA,QAAA,MACA,UAAAE,GAAAC,eAAA,SAAAD,CAAA,CACA,EAKA,UAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,iBAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,CACA,EAEA,SAAA,CACA,SAAA,CACA,MAAA,CAAA,2BAAA,KAAA,SAAA,CACA,EAEA,SAAA,CACA,MAAA,CAAA,kCAAA,KAAA,gBAAA,CACA,EAEA,mBAAA,CACA,MAAA,uBAAA,KAAA,SAAA,EACA,EAEA,aAAA,CACA,MAAA,2BAAA,KAAA,GAAA,EACA,CACA,CACA"}

package/dist/lib/dropdown/dropdown-constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-constants.cjs","sources":["../../../components/dropdown/dropdown_constants.js"],"sourcesContent":["export const DROPDOWN_PADDING_CLASSES = {\n  none: undefined,\n  small: 'd-py0',\n  large: 'd-py4',\n};\n\nexport default {\n  DROPDOWN_PADDING_CLASSES,\n};\n"],"names":["DROPDOWN_PADDING_CLASSES","dropdown_constants"],"mappings":"4GAAY,MAACA,EAA2B,CACtC,KAAM,OACN,MAAO,QACP,MAAO,OACT,EAEeC,EAAA,CACb,yBAAAD,CACF"}
+{"version":3,"file":"dropdown-constants.cjs","sources":["../../../components/dropdown/dropdown_constants.js"],"sourcesContent":["export const DROPDOWN_PADDING_CLASSES = {\n  none: undefined,\n  small: 'd-py0',\n  large: 'd-py4',\n};\n\nexport default {\n  DROPDOWN_PADDING_CLASSES,\n};\n"],"names":["DROPDOWN_PADDING_CLASSES","dropdown_constants"],"mappings":"4GAAY,MAACA,EAA2B,CACtC,KAAM,OACN,MAAO,QACP,MAAO,OACT,EAEAC,EAAe,CACb,yBAAAD,CACF"}

package/dist/lib/dropdown/dropdown-constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-constants.js","sources":["../../../components/dropdown/dropdown_constants.js"],"sourcesContent":["export const DROPDOWN_PADDING_CLASSES = {\n  none: undefined,\n  small: 'd-py0',\n  large: 'd-py4',\n};\n\nexport default {\n  DROPDOWN_PADDING_CLASSES,\n};\n"],"names":["DROPDOWN_PADDING_CLASSES","dropdown_constants"],"mappings":"AAAY,MAACA,IAA2B;AAAA,EACtC,MAAM;AAAA,EACN,OAAO;AAAA,EACP,OAAO;AACT,GAEeC,IAAA;AAAA,EACb,0BAAAD;AACF;"}
+{"version":3,"file":"dropdown-constants.js","sources":["../../../components/dropdown/dropdown_constants.js"],"sourcesContent":["export const DROPDOWN_PADDING_CLASSES = {\n  none: undefined,\n  small: 'd-py0',\n  large: 'd-py4',\n};\n\nexport default {\n  DROPDOWN_PADDING_CLASSES,\n};\n"],"names":["DROPDOWN_PADDING_CLASSES","dropdown_constants"],"mappings":"AAAY,MAACA,IAA2B;AAAA,EACtC,MAAM;AAAA,EACN,OAAO;AAAA,EACP,OAAO;AACT,GAEAC,IAAe;AAAA,EACb,0BAAAD;AACF;"}

package/dist/lib/dropdown/dropdown-story-constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-story-constants.cjs","sources":["../../../components/dropdown/dropdown_story_constants.js"],"sourcesContent":["export const DROPDOWN_STORY_ITEMS = [\n  { name: 'Menu item 1', id: 1 },\n  { name: 'Menu item 2', id: 2 },\n  { name: 'Another menu item 1', id: 3 },\n  { name: 'Menu item 3', id: 4 },\n  { name: 'Another menu item 2', id: 5 },\n];\n"],"names":["DROPDOWN_STORY_ITEMS"],"mappings":"gFAAY,MAACA,EAAuB,CAClC,CAAE,KAAM,cAAe,GAAI,CAAG,EAC9B,CAAE,KAAM,cAAe,GAAI,CAAG,EAC9B,CAAE,KAAM,sBAAuB,GAAI,CAAG,EACtC,CAAE,KAAM,cAAe,GAAI,CAAG,EAC9B,CAAE,KAAM,sBAAuB,GAAI,CAAG,CACxC"}
+{"version":3,"file":"dropdown-story-constants.cjs","sources":["../../../components/dropdown/dropdown_story_constants.js"],"sourcesContent":["export const DROPDOWN_STORY_ITEMS = [\n  { name: 'Menu item 1', id: 1 },\n  { name: 'Menu item 2', id: 2 },\n  { name: 'Another menu item 1', id: 3 },\n  { name: 'Menu item 3', id: 4 },\n  { name: 'Another menu item 2', id: 5 },\n];\n"],"names":["DROPDOWN_STORY_ITEMS"],"mappings":"gFAAY,MAACA,EAAuB,CAClC,CAAE,KAAM,cAAe,GAAI,CAAC,EAC5B,CAAE,KAAM,cAAe,GAAI,CAAC,EAC5B,CAAE,KAAM,sBAAuB,GAAI,CAAC,EACpC,CAAE,KAAM,cAAe,GAAI,CAAC,EAC5B,CAAE,KAAM,sBAAuB,GAAI,CAAC,CACtC"}

package/dist/lib/dropdown/dropdown-story-constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-story-constants.js","sources":["../../../components/dropdown/dropdown_story_constants.js"],"sourcesContent":["export const DROPDOWN_STORY_ITEMS = [\n  { name: 'Menu item 1', id: 1 },\n  { name: 'Menu item 2', id: 2 },\n  { name: 'Another menu item 1', id: 3 },\n  { name: 'Menu item 3', id: 4 },\n  { name: 'Another menu item 2', id: 5 },\n];\n"],"names":["DROPDOWN_STORY_ITEMS"],"mappings":"AAAY,MAACA,IAAuB;AAAA,EAClC,EAAE,MAAM,eAAe,IAAI,EAAG;AAAA,EAC9B,EAAE,MAAM,eAAe,IAAI,EAAG;AAAA,EAC9B,EAAE,MAAM,uBAAuB,IAAI,EAAG;AAAA,EACtC,EAAE,MAAM,eAAe,IAAI,EAAG;AAAA,EAC9B,EAAE,MAAM,uBAAuB,IAAI,EAAG;AACxC;"}
+{"version":3,"file":"dropdown-story-constants.js","sources":["../../../components/dropdown/dropdown_story_constants.js"],"sourcesContent":["export const DROPDOWN_STORY_ITEMS = [\n  { name: 'Menu item 1', id: 1 },\n  { name: 'Menu item 2', id: 2 },\n  { name: 'Another menu item 1', id: 3 },\n  { name: 'Menu item 3', id: 4 },\n  { name: 'Another menu item 2', id: 5 },\n];\n"],"names":["DROPDOWN_STORY_ITEMS"],"mappings":"AAAY,MAACA,IAAuB;AAAA,EAClC,EAAE,MAAM,eAAe,IAAI,EAAC;AAAA,EAC5B,EAAE,MAAM,eAAe,IAAI,EAAC;AAAA,EAC5B,EAAE,MAAM,uBAAuB,IAAI,EAAC;AAAA,EACpC,EAAE,MAAM,eAAe,IAAI,EAAC;AAAA,EAC5B,EAAE,MAAM,uBAAuB,IAAI,EAAC;AACtC;"}