npm - @dialpad/dialtone-vue - Versions diffs - 3.159.0 → 3.159.1 - Mend

@dialpad/dialtone-vue 3.159.0 → 3.159.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1539) hide show

package/dist/packages/dialtone-vue3/components/datepicker/composables/useCalendar.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"useCalendar.cjs","sources":["../../../../../../components/datepicker/composables/useCalendar.js"],"sourcesContent":["import { computed, ref, watch, nextTick } from 'vue';\nimport { getWeekDayNames, calculateNextFocusDate, calculatePrevFocusDate } from '@/components/datepicker/utils.js';\nimport { MONTH_FORMAT, WEEK_START } from '@/components/datepicker/datepicker_constants.js';\nimport { format, getYear } from 'date-fns';\n\nexport function useCalendar (props, emits) {\n const selectedDay = ref(null);\n const focusDay = ref(0);\n const daysRef = ref([]);\n\n const weekDays = computed(() => {\n return getWeekDayNames(props.locale, WEEK_START);\n });\n\n watch(() => props.calendarDays, () => {\n focusDay.value = 0;\n daysRef.value = [];\n selectedDay.value = null;\n });\n\n function dayAriaLabel (day) {\n return `${props.selectDayLabel} ${day.text} ${format(day.value, MONTH_FORMAT)} ${getYear(day.value)}`;\n }\n\n function setDayRef (el, day) {\n if (!daysRef.value.some(day => day.el === el) && day.currentMonth) {\n daysRef.value.push({ el, day });\n }\n }\n\n function handleKeyDown (event) {\n switch (event.key) {\n case 'ArrowUp':\n event.preventDefault();\n focusDay.value -= 7;\n try {\n daysRef.value[focusDay.value].el.$el.focus();\n } catch (error) {\n const prevFocusDate = calculatePrevFocusDate(daysRef.value[focusDay.value + 7].day.value);\n emits('go-to-prev-month');\n\n nextTick(() => {\n daysRef.value[prevFocusDate - 1].el.$el.focus();\n focusDay.value += prevFocusDate - 1;\n });\n }\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n focusDay.value += 7;\n try {\n daysRef.value[focusDay.value].el.$el.focus();\n } catch (error) {\n const nextFocusDate = calculateNextFocusDate(daysRef.value[focusDay.value - 7].day.value);\n emits('go-to-next-month');\n\n nextTick(() => {\n daysRef.value[nextFocusDate - 1].el.$el.focus();\n focusDay.value += nextFocusDate - 1;\n });\n }\n break;\n\n case 'ArrowLeft':\n event.preventDefault();\n if (focusDay.value > 0) {\n focusDay.value -= 1;\n daysRef.value[focusDay.value].el.$el.focus();\n } else {\n // if we are on month first day, jump to last day of prev month\n emits('go-to-prev-month');\n focusLastDay();\n }\n break;\n\n case 'ArrowRight':\n event.preventDefault();\n if (focusDay.value < daysRef.value.length - 1) {\n focusDay.value += 1;\n daysRef.value[focusDay.value].el.$el.focus();\n } else {\n // if we are on month last day, jump to first day of next month\n emits('go-to-next-month');\n\n focusFirstDay();\n }\n break;\n\n case 'Tab':\n event.preventDefault();\n emits('focus-month-year-picker');\n break;\n\n case 'Escape':\n emits('close-datepicker');\n break;\n }\n }\n\n function focusFirstDay () {\n focusDay.value = 0;\n\n nextTick(() => {\n daysRef.value[focusDay.value].el.$el.focus();\n });\n }\n\n function focusLastDay () {\n nextTick(() => {\n focusDay.value = daysRef.value.length - 1;\n daysRef.value[focusDay.value].el.$el.focus();\n });\n }\n\n function selectDay (day) {\n if (!day.currentMonth) { return; }\n\n // local selectedDay is updated when a day is selected\n selectedDay.value = day.text;\n emits('select-date', day.value);\n }\n\n return {\n selectedDay,\n weekDays,\n dayAriaLabel,\n setDayRef,\n handleKeyDown,\n focusFirstDay,\n selectDay,\n };\n}\n"],"names":["ref","computed","getWeekDayNames","WEEK_START","watch","format","MONTH_FORMAT","getYear","day","calculatePrevFocusDate","nextTick","calculateNextFocusDate"],"mappings":"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"}

package/dist/packages/dialtone-vue3/components/datepicker/composables/useCalendar.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"useCalendar.js","sources":["../../../../../../components/datepicker/composables/useCalendar.js"],"sourcesContent":["import { computed, ref, watch, nextTick } from 'vue';\nimport { getWeekDayNames, calculateNextFocusDate, calculatePrevFocusDate } from '@/components/datepicker/utils.js';\nimport { MONTH_FORMAT, WEEK_START } from '@/components/datepicker/datepicker_constants.js';\nimport { format, getYear } from 'date-fns';\n\nexport function useCalendar (props, emits) {\n const selectedDay = ref(null);\n const focusDay = ref(0);\n const daysRef = ref([]);\n\n const weekDays = computed(() => {\n return getWeekDayNames(props.locale, WEEK_START);\n });\n\n watch(() => props.calendarDays, () => {\n focusDay.value = 0;\n daysRef.value = [];\n selectedDay.value = null;\n });\n\n function dayAriaLabel (day) {\n return `${props.selectDayLabel} ${day.text} ${format(day.value, MONTH_FORMAT)} ${getYear(day.value)}`;\n }\n\n function setDayRef (el, day) {\n if (!daysRef.value.some(day => day.el === el) && day.currentMonth) {\n daysRef.value.push({ el, day });\n }\n }\n\n function handleKeyDown (event) {\n switch (event.key) {\n case 'ArrowUp':\n event.preventDefault();\n focusDay.value -= 7;\n try {\n daysRef.value[focusDay.value].el.$el.focus();\n } catch (error) {\n const prevFocusDate = calculatePrevFocusDate(daysRef.value[focusDay.value + 7].day.value);\n emits('go-to-prev-month');\n\n nextTick(() => {\n daysRef.value[prevFocusDate - 1].el.$el.focus();\n focusDay.value += prevFocusDate - 1;\n });\n }\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n focusDay.value += 7;\n try {\n daysRef.value[focusDay.value].el.$el.focus();\n } catch (error) {\n const nextFocusDate = calculateNextFocusDate(daysRef.value[focusDay.value - 7].day.value);\n emits('go-to-next-month');\n\n nextTick(() => {\n daysRef.value[nextFocusDate - 1].el.$el.focus();\n focusDay.value += nextFocusDate - 1;\n });\n }\n break;\n\n case 'ArrowLeft':\n event.preventDefault();\n if (focusDay.value > 0) {\n focusDay.value -= 1;\n daysRef.value[focusDay.value].el.$el.focus();\n } else {\n // if we are on month first day, jump to last day of prev month\n emits('go-to-prev-month');\n focusLastDay();\n }\n break;\n\n case 'ArrowRight':\n event.preventDefault();\n if (focusDay.value < daysRef.value.length - 1) {\n focusDay.value += 1;\n daysRef.value[focusDay.value].el.$el.focus();\n } else {\n // if we are on month last day, jump to first day of next month\n emits('go-to-next-month');\n\n focusFirstDay();\n }\n break;\n\n case 'Tab':\n event.preventDefault();\n emits('focus-month-year-picker');\n break;\n\n case 'Escape':\n emits('close-datepicker');\n break;\n }\n }\n\n function focusFirstDay () {\n focusDay.value = 0;\n\n nextTick(() => {\n daysRef.value[focusDay.value].el.$el.focus();\n });\n }\n\n function focusLastDay () {\n nextTick(() => {\n focusDay.value = daysRef.value.length - 1;\n daysRef.value[focusDay.value].el.$el.focus();\n });\n }\n\n function selectDay (day) {\n if (!day.currentMonth) { return; }\n\n // local selectedDay is updated when a day is selected\n selectedDay.value = day.text;\n emits('select-date', day.value);\n }\n\n return {\n selectedDay,\n weekDays,\n dayAriaLabel,\n setDayRef,\n handleKeyDown,\n focusFirstDay,\n selectDay,\n };\n}\n"],"names":["day"],"mappings":"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"}

package/dist/packages/dialtone-vue3/components/datepicker/composables/useMonthYearPicker.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"useMonthYearPicker.cjs","sources":["../../../../../../components/datepicker/composables/useMonthYearPicker.js"],"sourcesContent":["import { computed, ref, watch } from 'vue';\nimport { addMonths, getDate, getMonth, getYear, set, subMonths } from 'date-fns';\nimport { formatMonth, getCalendarDays } from '@/components/datepicker/utils.js';\n\nexport function useMonthYearPicker (props, emits) {\n const selectMonth = ref(getMonth(props.selectedDate));\n const selectYear = ref(getYear(props.selectedDate));\n const highlightedDay = ref(null);\n const focusPicker = ref(0);\n const focusRefs = ref([]);\n\n const calendarDays = computed(() => {\n return getCalendarDays(selectMonth.value, selectYear.value, highlightedDay.value);\n });\n\n const formattedMonth = computed(() => {\n return (month, format, locale) => formatMonth(month, format, locale);\n });\n\n watch(selectMonth, () => {\n highlightDay();\n emits('calendar-days', calendarDays.value);\n }, { immediate: true });\n\n watch(selectYear, () => {\n highlightDay();\n emits('calendar-days', calendarDays.value);\n }, { immediate: true });\n\n function setDayRef (el) {\n if (!focusRefs.value.includes(el)) {\n focusRefs.value.push(el);\n }\n }\n\n function focusMonthYearPicker () {\n focusRefs.value[0].$el.focus();\n }\n\n function handleKeyDown (event) {\n switch (event.key) {\n case 'ArrowLeft':\n event.preventDefault();\n if (focusPicker.value === 0) {\n focusPicker.value = 3;\n focusRefs.value[focusPicker.value].$el.focus();\n } else {\n focusPicker.value--;\n focusRefs.value[focusPicker.value].$el.focus();\n }\n break;\n\n case 'ArrowRight':\n event.preventDefault();\n if (focusPicker.value === 3) {\n focusPicker.value = 0;\n focusRefs.value[focusPicker.value].$el.focus();\n } else {\n focusPicker.value++;\n focusRefs.value[focusPicker.value].$el.focus();\n }\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n emits('focus-first-day');\n break;\n\n case 'Tab':\n event.preventDefault();\n emits('focus-first-day');\n break;\n\n case 'Escape':\n emits('close-datepicker');\n break;\n }\n }\n\n function highlightDay () {\n const year = getYear(props.selectedDate);\n const month = getMonth(props.selectedDate);\n\n if (year !== selectYear.value || month !== selectMonth.value) {\n highlightedDay.value = null;\n } else {\n highlightedDay.value = getDate(props.selectedDate);\n }\n }\n\n function changeMonth (value) {\n // Adjust year when changing from January to December or vice versa\n if ((selectMonth.value === 0 && value === -1) || (selectMonth.value === 11 && value === 1)) {\n selectYear.value += value;\n }\n\n // Calculate the new date by adding or subtracting months\n const initialDate = set(props.selectedDate, { month: selectMonth.value, year: selectYear.value });\n const newDate = value === 1 ? addMonths(initialDate, 1) : subMonths(initialDate, 1);\n\n // Update the selected month\n selectMonth.value = getMonth(newDate);\n }\n\n function changeYear (value) {\n selectYear.value = selectYear.value + value;\n }\n\n function goToNextMonth () {\n changeMonth(1);\n }\n\n function goToPrevMonth () {\n changeMonth(-1);\n }\n\n return {\n selectMonth,\n selectYear,\n formattedMonth,\n setDayRef,\n focusMonthYearPicker,\n handleKeyDown,\n changeMonth,\n changeYear,\n goToNextMonth,\n goToPrevMonth,\n };\n}\n"],"names":["ref","getMonth","getYear","computed","getCalendarDays","formatMonth","watch","getDate","set","addMonths","subMonths"],"mappings":"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"}

package/dist/packages/dialtone-vue3/components/datepicker/composables/useMonthYearPicker.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"useMonthYearPicker.js","sources":["../../../../../../components/datepicker/composables/useMonthYearPicker.js"],"sourcesContent":["import { computed, ref, watch } from 'vue';\nimport { addMonths, getDate, getMonth, getYear, set, subMonths } from 'date-fns';\nimport { formatMonth, getCalendarDays } from '@/components/datepicker/utils.js';\n\nexport function useMonthYearPicker (props, emits) {\n const selectMonth = ref(getMonth(props.selectedDate));\n const selectYear = ref(getYear(props.selectedDate));\n const highlightedDay = ref(null);\n const focusPicker = ref(0);\n const focusRefs = ref([]);\n\n const calendarDays = computed(() => {\n return getCalendarDays(selectMonth.value, selectYear.value, highlightedDay.value);\n });\n\n const formattedMonth = computed(() => {\n return (month, format, locale) => formatMonth(month, format, locale);\n });\n\n watch(selectMonth, () => {\n highlightDay();\n emits('calendar-days', calendarDays.value);\n }, { immediate: true });\n\n watch(selectYear, () => {\n highlightDay();\n emits('calendar-days', calendarDays.value);\n }, { immediate: true });\n\n function setDayRef (el) {\n if (!focusRefs.value.includes(el)) {\n focusRefs.value.push(el);\n }\n }\n\n function focusMonthYearPicker () {\n focusRefs.value[0].$el.focus();\n }\n\n function handleKeyDown (event) {\n switch (event.key) {\n case 'ArrowLeft':\n event.preventDefault();\n if (focusPicker.value === 0) {\n focusPicker.value = 3;\n focusRefs.value[focusPicker.value].$el.focus();\n } else {\n focusPicker.value--;\n focusRefs.value[focusPicker.value].$el.focus();\n }\n break;\n\n case 'ArrowRight':\n event.preventDefault();\n if (focusPicker.value === 3) {\n focusPicker.value = 0;\n focusRefs.value[focusPicker.value].$el.focus();\n } else {\n focusPicker.value++;\n focusRefs.value[focusPicker.value].$el.focus();\n }\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n emits('focus-first-day');\n break;\n\n case 'Tab':\n event.preventDefault();\n emits('focus-first-day');\n break;\n\n case 'Escape':\n emits('close-datepicker');\n break;\n }\n }\n\n function highlightDay () {\n const year = getYear(props.selectedDate);\n const month = getMonth(props.selectedDate);\n\n if (year !== selectYear.value || month !== selectMonth.value) {\n highlightedDay.value = null;\n } else {\n highlightedDay.value = getDate(props.selectedDate);\n }\n }\n\n function changeMonth (value) {\n // Adjust year when changing from January to December or vice versa\n if ((selectMonth.value === 0 && value === -1) || (selectMonth.value === 11 && value === 1)) {\n selectYear.value += value;\n }\n\n // Calculate the new date by adding or subtracting months\n const initialDate = set(props.selectedDate, { month: selectMonth.value, year: selectYear.value });\n const newDate = value === 1 ? addMonths(initialDate, 1) : subMonths(initialDate, 1);\n\n // Update the selected month\n selectMonth.value = getMonth(newDate);\n }\n\n function changeYear (value) {\n selectYear.value = selectYear.value + value;\n }\n\n function goToNextMonth () {\n changeMonth(1);\n }\n\n function goToPrevMonth () {\n changeMonth(-1);\n }\n\n return {\n selectMonth,\n selectYear,\n formattedMonth,\n setDayRef,\n focusMonthYearPicker,\n handleKeyDown,\n changeMonth,\n changeYear,\n goToNextMonth,\n goToPrevMonth,\n };\n}\n"],"names":[],"mappings":"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"}

package/dist/packages/dialtone-vue3/components/datepicker/datepicker.vue.cjs ADDED Viewed

@@ -0,0 +1,159 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const monthYearPicker = require("./modules/month-year-picker.vue.cjs");
+const calendar = require("./modules/calendar.vue.cjs");
+const common_utils = require("../../../../common/utils.cjs");
+const stack = require("../stack/stack.vue.cjs");
+const _hoisted_1 = { class: "d-datepicker__hd" };
+const _hoisted_2 = { class: "d-datepicker__bd" };
+const _sfc_main = {
+  __name: "datepicker",
+  props: {
+    /**
+       * Label for the previous month button
+       *
+       * @type {String}
+       * @example 'Previous month'
+       */
+    prevMonthLabel: {
+      type: String,
+      required: true
+    },
+    /**
+       * Label for the next month button
+       *
+       * @type {String}
+       * @example 'Next month'
+       */
+    nextMonthLabel: {
+      type: String,
+      required: true
+    },
+    /**
+       * Label for the previous year button
+       *
+       * @type {String}
+       * @example 'Previous year'
+       */
+    prevYearLabel: {
+      type: String,
+      required: true
+    },
+    /**
+       * Label for the next year button
+       *
+       * @type {String}
+       * @example 'Next year'
+       */
+    nextYearLabel: {
+      type: String,
+      required: true
+    },
+    /**
+       * Label for the select day button
+       *
+       * @type {String}
+       * @example 'Select day'
+       */
+    selectDayLabel: {
+      type: String,
+      required: true
+    },
+    /**
+       * Label for the change to button
+       *
+       * @type {String}
+       * @example 'Change to'
+       */
+    changeToLabel: {
+      type: String,
+      required: true
+    },
+    /**
+       * Locale for the calendar
+       *
+       * @type {String}
+       */
+    locale: {
+      type: String,
+      default: "en-US"
+    },
+    /**
+       * Selected date
+       *
+       * @type {Date}
+       */
+    selectedDate: {
+      type: Date,
+      default: () => /* @__PURE__ */ new Date()
+    }
+  },
+  emits: [
+    /**
+       * Event fired when a date is selected
+       *
+       * @event selected-date
+       * @type {Date}
+       */
+    "selected-date",
+    /**
+       * Event fired when user presses the esc key
+       *
+       * @event close-datepicker
+       */
+    "close-datepicker"
+  ],
+  setup(__props) {
+    const calendarDays = vue.ref([]);
+    function updateCalendarDays(days) {
+      calendarDays.value = days;
+    }
+    vue.onMounted(() => {
+      const instance = vue.getCurrentInstance();
+      common_utils.warnIfUnmounted(instance.proxy.$el, "datepicker");
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(vue.unref(stack.default), {
+        class: "d-datepicker",
+        gap: "400"
+      }, {
+        default: vue.withCtx(() => [
+          vue.createElementVNode("div", _hoisted_1, [
+            vue.createVNode(monthYearPicker.default, {
+              ref: "monthYearPicker",
+              locale: __props.locale,
+              "prev-month-label": __props.prevMonthLabel,
+              "next-month-label": __props.nextMonthLabel,
+              "prev-year-label": __props.prevYearLabel,
+              "next-year-label": __props.nextYearLabel,
+              "change-to-label": __props.changeToLabel,
+              "selected-date": __props.selectedDate,
+              onCalendarDays: updateCalendarDays,
+              onFocusFirstDay: _cache[0] || (_cache[0] = ($event) => _ctx.$refs.calendar.focusFirstDay()),
+              onFocusLastDay: _cache[1] || (_cache[1] = ($event) => _ctx.$refs.calendar.focusLastDay()),
+              onCloseDatepicker: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("close-datepicker"))
+            }, null, 8, ["locale", "prev-month-label", "next-month-label", "prev-year-label", "next-year-label", "change-to-label", "selected-date"])
+          ]),
+          vue.createElementVNode("div", _hoisted_2, [
+            vue.createVNode(calendar.default, {
+              ref: "calendar",
+              locale: __props.locale,
+              "calendar-days": calendarDays.value,
+              "select-day-label": __props.selectDayLabel,
+              onSelectDate: _cache[3] || (_cache[3] = ($event) => _ctx.$emit("selected-date", $event)),
+              onFocusMonthYearPicker: _cache[4] || (_cache[4] = ($event) => _ctx.$refs.monthYearPicker.focusMonthYearPicker()),
+              onCloseDatepicker: _cache[5] || (_cache[5] = ($event) => _ctx.$emit("close-datepicker")),
+              onGoToNextMonth: _cache[6] || (_cache[6] = ($event) => _ctx.$refs.monthYearPicker.goToNextMonth()),
+              onGoToPrevMonth: _cache[7] || (_cache[7] = ($event) => _ctx.$refs.monthYearPicker.goToPrevMonth())
+            }, null, 8, ["locale", "calendar-days", "select-day-label"])
+          ])
+        ]),
+        _: 1
+      });
+    };
+  }
+};
+const _sfc_main$1 = _sfc_main;
+exports.default = _sfc_main$1;
+//# sourceMappingURL=datepicker.vue.cjs.map

package/dist/packages/dialtone-vue3/components/datepicker/datepicker.vue.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"datepicker.vue.cjs","sources":["../../../../../components/datepicker/datepicker.vue"],"sourcesContent":["\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 :locale=\"locale\"\n :prev-month-label=\"prevMonthLabel\"\n :next-month-label=\"nextMonthLabel\"\n :prev-year-label=\"prevYearLabel\"\n :next-year-label=\"nextYearLabel\"\n :change-to-label=\"changeToLabel\"\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 :locale=\"locale\"\n :calendar-days=\"calendarDays\"\n :select-day-label=\"selectDayLabel\"\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 setup>\nimport MonthYearPicker from './modules/month-year-picker.vue';\nimport Calendar from './modules/calendar.vue';\nimport { DtStack } from '@/components/stack';\n\nimport { onMounted, ref, getCurrentInstance } from 'vue';\nimport { warnIfUnmounted } from '@/common/utils';\n\ndefineProps({\n /**\n * Label for the previous month button\n *\n * @type {String}\n * @example 'Previous month'\n */\n prevMonthLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the next month button\n *\n * @type {String}\n * @example 'Next month'\n */\n nextMonthLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the previous year button\n *\n * @type {String}\n * @example 'Previous year'\n */\n prevYearLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the next year button\n *\n * @type {String}\n * @example 'Next year'\n */\n nextYearLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the select day button\n *\n * @type {String}\n * @example 'Select day'\n */\n selectDayLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the change to button\n *\n * @type {String}\n * @example 'Change to'\n */\n changeToLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Locale for the calendar\n *\n * @type {String}\n */\n locale: {\n type: String,\n default: 'en-US',\n },\n\n /**\n * Selected date\n *\n * @type {Date}\n */\n selectedDate: {\n type: Date,\n default: () => (new Date()),\n },\n});\n\ndefineEmits([\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\nconst calendarDays = ref([]);\n\nfunction updateCalendarDays (days) {\n calendarDays.value = days;\n}\n\nonMounted(() => {\n const instance = getCurrentInstance();\n warnIfUnmounted(instance.proxy.$el, 'datepicker');\n});\n</script>\n"],"names":["ref","onMounted","getCurrentInstance","warnIfUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuJA,UAAM,eAAeA,IAAAA,IAAI,CAAA,CAAE;AAE3B,aAAS,mBAAoB,MAAM;AACjC,mBAAa,QAAQ;AAAA,IACvB;AAEAC,QAAAA,UAAU,MAAM;AACd,YAAM,WAAWC,IAAAA;AACjBC,mBAAAA,gBAAgB,SAAS,MAAM,KAAK,YAAY;AAAA,IAClD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/packages/dialtone-vue3/components/datepicker/datepicker.vue.js ADDED Viewed

@@ -0,0 +1,159 @@
+import { ref, onMounted, getCurrentInstance, openBlock, createBlock, unref, withCtx, createElementVNode, createVNode } from "vue";
+import _sfc_main$2 from "./modules/month-year-picker.vue.js";
+import _sfc_main$3 from "./modules/calendar.vue.js";
+import { warnIfUnmounted } from "../../../../common/utils.js";
+import DtStack from "../stack/stack.vue.js";
+const _hoisted_1 = { class: "d-datepicker__hd" };
+const _hoisted_2 = { class: "d-datepicker__bd" };
+const _sfc_main = {
+  __name: "datepicker",
+  props: {
+    /**
+       * Label for the previous month button
+       *
+       * @type {String}
+       * @example 'Previous month'
+       */
+    prevMonthLabel: {
+      type: String,
+      required: true
+    },
+    /**
+       * Label for the next month button
+       *
+       * @type {String}
+       * @example 'Next month'
+       */
+    nextMonthLabel: {
+      type: String,
+      required: true
+    },
+    /**
+       * Label for the previous year button
+       *
+       * @type {String}
+       * @example 'Previous year'
+       */
+    prevYearLabel: {
+      type: String,
+      required: true
+    },
+    /**
+       * Label for the next year button
+       *
+       * @type {String}
+       * @example 'Next year'
+       */
+    nextYearLabel: {
+      type: String,
+      required: true
+    },
+    /**
+       * Label for the select day button
+       *
+       * @type {String}
+       * @example 'Select day'
+       */
+    selectDayLabel: {
+      type: String,
+      required: true
+    },
+    /**
+       * Label for the change to button
+       *
+       * @type {String}
+       * @example 'Change to'
+       */
+    changeToLabel: {
+      type: String,
+      required: true
+    },
+    /**
+       * Locale for the calendar
+       *
+       * @type {String}
+       */
+    locale: {
+      type: String,
+      default: "en-US"
+    },
+    /**
+       * Selected date
+       *
+       * @type {Date}
+       */
+    selectedDate: {
+      type: Date,
+      default: () => /* @__PURE__ */ new Date()
+    }
+  },
+  emits: [
+    /**
+       * Event fired when a date is selected
+       *
+       * @event selected-date
+       * @type {Date}
+       */
+    "selected-date",
+    /**
+       * Event fired when user presses the esc key
+       *
+       * @event close-datepicker
+       */
+    "close-datepicker"
+  ],
+  setup(__props) {
+    const calendarDays = ref([]);
+    function updateCalendarDays(days) {
+      calendarDays.value = days;
+    }
+    onMounted(() => {
+      const instance = getCurrentInstance();
+      warnIfUnmounted(instance.proxy.$el, "datepicker");
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(DtStack), {
+        class: "d-datepicker",
+        gap: "400"
+      }, {
+        default: withCtx(() => [
+          createElementVNode("div", _hoisted_1, [
+            createVNode(_sfc_main$2, {
+              ref: "monthYearPicker",
+              locale: __props.locale,
+              "prev-month-label": __props.prevMonthLabel,
+              "next-month-label": __props.nextMonthLabel,
+              "prev-year-label": __props.prevYearLabel,
+              "next-year-label": __props.nextYearLabel,
+              "change-to-label": __props.changeToLabel,
+              "selected-date": __props.selectedDate,
+              onCalendarDays: updateCalendarDays,
+              onFocusFirstDay: _cache[0] || (_cache[0] = ($event) => _ctx.$refs.calendar.focusFirstDay()),
+              onFocusLastDay: _cache[1] || (_cache[1] = ($event) => _ctx.$refs.calendar.focusLastDay()),
+              onCloseDatepicker: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("close-datepicker"))
+            }, null, 8, ["locale", "prev-month-label", "next-month-label", "prev-year-label", "next-year-label", "change-to-label", "selected-date"])
+          ]),
+          createElementVNode("div", _hoisted_2, [
+            createVNode(_sfc_main$3, {
+              ref: "calendar",
+              locale: __props.locale,
+              "calendar-days": calendarDays.value,
+              "select-day-label": __props.selectDayLabel,
+              onSelectDate: _cache[3] || (_cache[3] = ($event) => _ctx.$emit("selected-date", $event)),
+              onFocusMonthYearPicker: _cache[4] || (_cache[4] = ($event) => _ctx.$refs.monthYearPicker.focusMonthYearPicker()),
+              onCloseDatepicker: _cache[5] || (_cache[5] = ($event) => _ctx.$emit("close-datepicker")),
+              onGoToNextMonth: _cache[6] || (_cache[6] = ($event) => _ctx.$refs.monthYearPicker.goToNextMonth()),
+              onGoToPrevMonth: _cache[7] || (_cache[7] = ($event) => _ctx.$refs.monthYearPicker.goToPrevMonth())
+            }, null, 8, ["locale", "calendar-days", "select-day-label"])
+          ])
+        ]),
+        _: 1
+      });
+    };
+  }
+};
+const _sfc_main$1 = _sfc_main;
+export {
+  _sfc_main$1 as default
+};
+//# sourceMappingURL=datepicker.vue.js.map

package/dist/packages/dialtone-vue3/components/datepicker/datepicker.vue.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"datepicker.vue.js","sources":["../../../../../components/datepicker/datepicker.vue"],"sourcesContent":["\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 :locale=\"locale\"\n :prev-month-label=\"prevMonthLabel\"\n :next-month-label=\"nextMonthLabel\"\n :prev-year-label=\"prevYearLabel\"\n :next-year-label=\"nextYearLabel\"\n :change-to-label=\"changeToLabel\"\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 :locale=\"locale\"\n :calendar-days=\"calendarDays\"\n :select-day-label=\"selectDayLabel\"\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 setup>\nimport MonthYearPicker from './modules/month-year-picker.vue';\nimport Calendar from './modules/calendar.vue';\nimport { DtStack } from '@/components/stack';\n\nimport { onMounted, ref, getCurrentInstance } from 'vue';\nimport { warnIfUnmounted } from '@/common/utils';\n\ndefineProps({\n /**\n * Label for the previous month button\n *\n * @type {String}\n * @example 'Previous month'\n */\n prevMonthLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the next month button\n *\n * @type {String}\n * @example 'Next month'\n */\n nextMonthLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the previous year button\n *\n * @type {String}\n * @example 'Previous year'\n */\n prevYearLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the next year button\n *\n * @type {String}\n * @example 'Next year'\n */\n nextYearLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the select day button\n *\n * @type {String}\n * @example 'Select day'\n */\n selectDayLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the change to button\n *\n * @type {String}\n * @example 'Change to'\n */\n changeToLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Locale for the calendar\n *\n * @type {String}\n */\n locale: {\n type: String,\n default: 'en-US',\n },\n\n /**\n * Selected date\n *\n * @type {Date}\n */\n selectedDate: {\n type: Date,\n default: () => (new Date()),\n },\n});\n\ndefineEmits([\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\nconst calendarDays = ref([]);\n\nfunction updateCalendarDays (days) {\n calendarDays.value = days;\n}\n\nonMounted(() => {\n const instance = getCurrentInstance();\n warnIfUnmounted(instance.proxy.$el, 'datepicker');\n});\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuJA,UAAM,eAAe,IAAI,CAAA,CAAE;AAE3B,aAAS,mBAAoB,MAAM;AACjC,mBAAa,QAAQ;AAAA,IACvB;AAEA,cAAU,MAAM;AACd,YAAM,WAAW;AACjB,sBAAgB,SAAS,MAAM,KAAK,YAAY;AAAA,IAClD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/packages/dialtone-vue3/components/datepicker/datepicker_constants.cjs.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"datepicker_constants.cjs","sources":["../../../../../components/datepicker/datepicker_constants.js"],"sourcesContent":["/*\n Week start day\n * 0 - Sunday\n * 1 - Monday\n */\nexport const WEEK_START = 0;\n\nexport const MONTH_FORMAT = 'MMMM';\n\nexport const INTL_MONTH_FORMAT = 'long';\n"],"names":[],"mappings":";;AAKY,MAAC,aAAa;AAEd,MAAC,eAAe;AAEhB,MAAC,oBAAoB;;;;"}

package/dist/packages/dialtone-vue3/components/datepicker/datepicker_constants.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"datepicker_constants.js","sources":["../../../../../components/datepicker/datepicker_constants.js"],"sourcesContent":["/*\n Week start day\n * 0 - Sunday\n * 1 - Monday\n */\nexport const WEEK_START = 0;\n\nexport const MONTH_FORMAT = 'MMMM';\n\nexport const INTL_MONTH_FORMAT = 'long';\n"],"names":[],"mappings":"AAKY,MAAC,aAAa;AAEd,MAAC,eAAe;AAEhB,MAAC,oBAAoB;"}

package/dist/packages/dialtone-vue3/components/datepicker/formatUtils.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"formatUtils.cjs","sources":["../../../../../components/datepicker/formatUtils.js"],"sourcesContent":["export function formatLong (date, locale = 'default') {\n return new Intl.DateTimeFormat(locale, { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\nexport function formatMedium (date, locale = 'default') {\n return new Intl.DateTimeFormat(locale, { year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\nexport function formatShort (date, locale = 'default', 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, options).format(date);\n}\n\nexport function formatNoYear (date, locale = 'default', abbreviated = false) {\n const monthFormat = abbreviated ? 'short' : 'long';\n return new Intl.DateTimeFormat(locale, { month: monthFormat, day: 'numeric' }).format(date);\n}\n\nexport function formatNumerical (date, locale = 'default') {\n return new Intl.DateTimeFormat(locale, { 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":[],"mappings":";;AAAO,SAAS,WAAY,MAAM,SAAS,WAAW;AACpD,SAAO,IAAI,KAAK,eAAe,QAAQ,EAAE,SAAS,QAAQ,MAAM,WAAW,OAAO,QAAQ,KAAK,UAAW,CAAA,EAAE,OAAO,IAAI;AACzH;AAEO,SAAS,aAAc,MAAM,SAAS,WAAW;AACtD,SAAO,IAAI,KAAK,eAAe,QAAQ,EAAE,MAAM,WAAW,OAAO,QAAQ,KAAK,UAAS,CAAE,EAAE,OAAO,IAAI;AACxG;AAEO,SAAS,YAAa,MAAM,SAAS,WAAW,cAAc,MAAM;AACzE,QAAM,UAAU,cAAc,EAAE,SAAS,SAAS,MAAM,WAAW,OAAO,SAAS,KAAK,UAAW,IAAG,EAAE,MAAM,WAAW,OAAO,SAAS,KAAK;AAC9I,SAAO,IAAI,KAAK,eAAe,QAAQ,OAAO,EAAE,OAAO,IAAI;AAC7D;AAEO,SAAS,aAAc,MAAM,SAAS,WAAW,cAAc,OAAO;AAC3E,QAAM,cAAc,cAAc,UAAU;AAC5C,SAAO,IAAI,KAAK,eAAe,QAAQ,EAAE,OAAO,aAAa,KAAK,UAAW,CAAA,EAAE,OAAO,IAAI;AAC5F;AAEO,SAAS,gBAAiB,MAAM,SAAS,WAAW;AACzD,SAAO,IAAI,KAAK,eAAe,QAAQ,EAAE,MAAM,WAAW,OAAO,WAAW,KAAK,UAAS,CAAE,EAAE,OAAO,IAAI;AAC3G;;;;;;"}

package/dist/packages/dialtone-vue3/components/datepicker/formatUtils.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"formatUtils.js","sources":["../../../../../components/datepicker/formatUtils.js"],"sourcesContent":["export function formatLong (date, locale = 'default') {\n return new Intl.DateTimeFormat(locale, { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\nexport function formatMedium (date, locale = 'default') {\n return new Intl.DateTimeFormat(locale, { year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\nexport function formatShort (date, locale = 'default', 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, options).format(date);\n}\n\nexport function formatNoYear (date, locale = 'default', abbreviated = false) {\n const monthFormat = abbreviated ? 'short' : 'long';\n return new Intl.DateTimeFormat(locale, { month: monthFormat, day: 'numeric' }).format(date);\n}\n\nexport function formatNumerical (date, locale = 'default') {\n return new Intl.DateTimeFormat(locale, { 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":[],"mappings":"AAAO,SAAS,WAAY,MAAM,SAAS,WAAW;AACpD,SAAO,IAAI,KAAK,eAAe,QAAQ,EAAE,SAAS,QAAQ,MAAM,WAAW,OAAO,QAAQ,KAAK,UAAW,CAAA,EAAE,OAAO,IAAI;AACzH;AAEO,SAAS,aAAc,MAAM,SAAS,WAAW;AACtD,SAAO,IAAI,KAAK,eAAe,QAAQ,EAAE,MAAM,WAAW,OAAO,QAAQ,KAAK,UAAS,CAAE,EAAE,OAAO,IAAI;AACxG;AAEO,SAAS,YAAa,MAAM,SAAS,WAAW,cAAc,MAAM;AACzE,QAAM,UAAU,cAAc,EAAE,SAAS,SAAS,MAAM,WAAW,OAAO,SAAS,KAAK,UAAW,IAAG,EAAE,MAAM,WAAW,OAAO,SAAS,KAAK;AAC9I,SAAO,IAAI,KAAK,eAAe,QAAQ,OAAO,EAAE,OAAO,IAAI;AAC7D;AAEO,SAAS,aAAc,MAAM,SAAS,WAAW,cAAc,OAAO;AAC3E,QAAM,cAAc,cAAc,UAAU;AAC5C,SAAO,IAAI,KAAK,eAAe,QAAQ,EAAE,OAAO,aAAa,KAAK,UAAW,CAAA,EAAE,OAAO,IAAI;AAC5F;AAEO,SAAS,gBAAiB,MAAM,SAAS,WAAW;AACzD,SAAO,IAAI,KAAK,eAAe,QAAQ,EAAE,MAAM,WAAW,OAAO,WAAW,KAAK,UAAS,CAAE,EAAE,OAAO,IAAI;AAC3G;"}

package/dist/packages/dialtone-vue3/components/datepicker/modules/calendar.vue.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"calendar.vue.cjs","sources":["../../../../../../components/datepicker/modules/calendar.vue"],"sourcesContent":["\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=\"el => { if (el) setDayRef(el, day) }\"\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 setup>\nimport { useCalendar } from '@/components/datepicker/composables/useCalendar.js';\nimport { DtButton } from '@/components/button';\n\nconst props = defineProps({\n calendarDays: {\n type: Array,\n required: true,\n },\n\n locale: {\n type: String,\n required: true,\n },\n\n selectDayLabel: {\n type: String,\n required: true,\n },\n});\n\nconst emits = defineEmits([\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 * Will go to the next month\n *\n * @event go-to-next-month\n */\n 'go-to-next-month',\n\n /**\n * Will go to the previous month\n *\n * @event go-to-prev-month\n */\n 'go-to-prev-month',\n]);\n\nconst {\n selectedDay,\n weekDays,\n dayAriaLabel,\n setDayRef,\n handleKeyDown,\n focusFirstDay,\n selectDay,\n} = useCalendar(props, emits);\n\ndefineExpose({\n focusFirstDay,\n});\n</script>\n"],"names":["useCalendar"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiEA,UAAM,QAAQ;AAiBd,UAAM,QAAQ;AAsCd,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,IAAIA,YAAW,YAAC,OAAO,KAAK;AAE5B,aAAa;AAAA,MACX;AAAA,IACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/packages/dialtone-vue3/components/datepicker/modules/calendar.vue.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"calendar.vue.js","sources":["../../../../../../components/datepicker/modules/calendar.vue"],"sourcesContent":["\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=\"el => { if (el) setDayRef(el, day) }\"\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 setup>\nimport { useCalendar } from '@/components/datepicker/composables/useCalendar.js';\nimport { DtButton } from '@/components/button';\n\nconst props = defineProps({\n calendarDays: {\n type: Array,\n required: true,\n },\n\n locale: {\n type: String,\n required: true,\n },\n\n selectDayLabel: {\n type: String,\n required: true,\n },\n});\n\nconst emits = defineEmits([\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 * Will go to the next month\n *\n * @event go-to-next-month\n */\n 'go-to-next-month',\n\n /**\n * Will go to the previous month\n *\n * @event go-to-prev-month\n */\n 'go-to-prev-month',\n]);\n\nconst {\n selectedDay,\n weekDays,\n dayAriaLabel,\n setDayRef,\n handleKeyDown,\n focusFirstDay,\n selectDay,\n} = useCalendar(props, emits);\n\ndefineExpose({\n focusFirstDay,\n});\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiEA,UAAM,QAAQ;AAiBd,UAAM,QAAQ;AAsCd,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,IAAI,YAAY,OAAO,KAAK;AAE5B,aAAa;AAAA,MACX;AAAA,IACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/packages/dialtone-vue3/components/datepicker/modules/month-year-picker.vue.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"month-year-picker.vue.cjs","sources":["../../../../../../components/datepicker/modules/month-year-picker.vue"],"sourcesContent":["<template>\n <dt-stack\n direction=\"row\"\n class=\"d-datepicker__month-year\"\n gap=\"300\"\n >\n <dt-stack\n as=\"nav\"\n direction=\"row\"\n gap=\"200\"\n class=\"d-datepicker__nav\"\n >\n <dt-tooltip\n :message=\"prevYearLabel\"\n placement=\"top\"\n :fallback-placements=\"['top-start', 'auto']\"\n >\n <template #anchor>\n <dt-button\n id=\"prevYearButton\"\n :ref=\"el => { if (el) setDayRef(el) }\"\n size=\"xs\"\n importance=\"clear\"\n kind=\"muted\"\n :circle=\"true\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"`${changeToLabel} ${prevYearLabel} ${selectYear - 1}`\"\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 :message=\"prevMonthLabel\"\n placement=\"top\"\n :fallback-placements=\"['top-end', 'auto']\"\n >\n <template #anchor>\n <dt-button\n id=\"prevMonthButton\"\n :ref=\"el => { if (el) setDayRef(el) }\"\n size=\"xs\"\n importance=\"clear\"\n kind=\"muted\"\n :circle=\"true\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"\n `${changeToLabel} ${prevMonthLabel} ${formattedMonth(selectMonth - 1, INTL_MONTH_FORMAT, locale)}`\n \"\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, INTL_MONTH_FORMAT, locale) }}\n\n {{ selectYear }}\n </div>\n <dt-stack\n as=\"nav\"\n direction=\"row\"\n gap=\"200\"\n class=\"d-datepicker__nav\"\n >\n <dt-tooltip\n :message=\"nextMonthLabel\"\n placement=\"top\"\n :fallback-placements=\"['top-start', 'auto']\"\n >\n <template #anchor>\n <dt-button\n id=\"nextMonthButton\"\n :ref=\"el => { if (el) setDayRef(el) }\"\n size=\"xs\"\n importance=\"clear\"\n kind=\"muted\"\n :circle=\"true\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"\n `${changeToLabel} ${nextMonthLabel} ${formattedMonth(selectMonth + 1, INTL_MONTH_FORMAT, locale)}`\n \"\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 :message=\"nextYearLabel\"\n placement=\"top\"\n :fallback-placements=\"['top-end', 'auto']\"\n >\n <template #anchor>\n <dt-button\n id=\"nextYearButton\"\n :ref=\"el => { if (el) setDayRef(el) }\"\n size=\"xs\"\n importance=\"clear\"\n kind=\"muted\"\n :circle=\"true\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"`${changeToLabel} ${nextYearLabel} ${selectYear + 1}`\"\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 setup>\nimport { DtIconChevronLeft, DtIconChevronsLeft, DtIconChevronRight, DtIconChevronsRight } from '@dialpad/dialtone-icons/vue3';\nimport { DtStack } from '@/components/stack';\nimport { DtButton } from '@/components/button';\nimport { DtTooltip } from '@/components/tooltip';\nimport { INTL_MONTH_FORMAT } from '../datepicker_constants';\nimport { onMounted } from 'vue';\nimport { useMonthYearPicker } from '@/components/datepicker/composables/useMonthYearPicker.js';\n\nconst props = defineProps({\n locale: {\n type: String,\n required: true,\n },\n\n prevMonthLabel: {\n type: String,\n required: true,\n },\n\n nextMonthLabel: {\n type: String,\n required: true,\n },\n\n prevYearLabel: {\n type: String,\n required: true,\n },\n\n nextYearLabel: {\n type: String,\n required: true,\n },\n\n changeToLabel: {\n type: String,\n required: true,\n },\n\n selectedDate: {\n type: Date,\n required: true,\n },\n});\nconst emits = defineEmits([\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\nconst {\n selectMonth,\n selectYear,\n formattedMonth,\n setDayRef,\n focusMonthYearPicker,\n handleKeyDown,\n changeMonth,\n changeYear,\n goToNextMonth,\n goToPrevMonth,\n} = useMonthYearPicker(props, emits);\n\nonMounted(() => {\n focusMonthYearPicker();\n});\n\ndefineExpose({\n focusMonthYearPicker,\n goToNextMonth,\n goToPrevMonth,\n});\n</script>\n"],"names":["useMonthYearPicker","onMounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgJA,UAAM,QAAQ;AAoCd,UAAM,QAAQ;AA+Bd,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,IAAIA,mBAAkB,mBAAC,OAAO,KAAK;AAEnCC,QAAAA,UAAU,MAAM;AACd;IACF,CAAC;AAED,aAAa;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/packages/dialtone-vue3/components/datepicker/modules/month-year-picker.vue.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"month-year-picker.vue.js","sources":["../../../../../../components/datepicker/modules/month-year-picker.vue"],"sourcesContent":["<template>\n <dt-stack\n direction=\"row\"\n class=\"d-datepicker__month-year\"\n gap=\"300\"\n >\n <dt-stack\n as=\"nav\"\n direction=\"row\"\n gap=\"200\"\n class=\"d-datepicker__nav\"\n >\n <dt-tooltip\n :message=\"prevYearLabel\"\n placement=\"top\"\n :fallback-placements=\"['top-start', 'auto']\"\n >\n <template #anchor>\n <dt-button\n id=\"prevYearButton\"\n :ref=\"el => { if (el) setDayRef(el) }\"\n size=\"xs\"\n importance=\"clear\"\n kind=\"muted\"\n :circle=\"true\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"`${changeToLabel} ${prevYearLabel} ${selectYear - 1}`\"\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 :message=\"prevMonthLabel\"\n placement=\"top\"\n :fallback-placements=\"['top-end', 'auto']\"\n >\n <template #anchor>\n <dt-button\n id=\"prevMonthButton\"\n :ref=\"el => { if (el) setDayRef(el) }\"\n size=\"xs\"\n importance=\"clear\"\n kind=\"muted\"\n :circle=\"true\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"\n `${changeToLabel} ${prevMonthLabel} ${formattedMonth(selectMonth - 1, INTL_MONTH_FORMAT, locale)}`\n \"\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, INTL_MONTH_FORMAT, locale) }}\n\n {{ selectYear }}\n </div>\n <dt-stack\n as=\"nav\"\n direction=\"row\"\n gap=\"200\"\n class=\"d-datepicker__nav\"\n >\n <dt-tooltip\n :message=\"nextMonthLabel\"\n placement=\"top\"\n :fallback-placements=\"['top-start', 'auto']\"\n >\n <template #anchor>\n <dt-button\n id=\"nextMonthButton\"\n :ref=\"el => { if (el) setDayRef(el) }\"\n size=\"xs\"\n importance=\"clear\"\n kind=\"muted\"\n :circle=\"true\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"\n `${changeToLabel} ${nextMonthLabel} ${formattedMonth(selectMonth + 1, INTL_MONTH_FORMAT, locale)}`\n \"\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 :message=\"nextYearLabel\"\n placement=\"top\"\n :fallback-placements=\"['top-end', 'auto']\"\n >\n <template #anchor>\n <dt-button\n id=\"nextYearButton\"\n :ref=\"el => { if (el) setDayRef(el) }\"\n size=\"xs\"\n importance=\"clear\"\n kind=\"muted\"\n :circle=\"true\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"`${changeToLabel} ${nextYearLabel} ${selectYear + 1}`\"\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 setup>\nimport { DtIconChevronLeft, DtIconChevronsLeft, DtIconChevronRight, DtIconChevronsRight } from '@dialpad/dialtone-icons/vue3';\nimport { DtStack } from '@/components/stack';\nimport { DtButton } from '@/components/button';\nimport { DtTooltip } from '@/components/tooltip';\nimport { INTL_MONTH_FORMAT } from '../datepicker_constants';\nimport { onMounted } from 'vue';\nimport { useMonthYearPicker } from '@/components/datepicker/composables/useMonthYearPicker.js';\n\nconst props = defineProps({\n locale: {\n type: String,\n required: true,\n },\n\n prevMonthLabel: {\n type: String,\n required: true,\n },\n\n nextMonthLabel: {\n type: String,\n required: true,\n },\n\n prevYearLabel: {\n type: String,\n required: true,\n },\n\n nextYearLabel: {\n type: String,\n required: true,\n },\n\n changeToLabel: {\n type: String,\n required: true,\n },\n\n selectedDate: {\n type: Date,\n required: true,\n },\n});\nconst emits = defineEmits([\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\nconst {\n selectMonth,\n selectYear,\n formattedMonth,\n setDayRef,\n focusMonthYearPicker,\n handleKeyDown,\n changeMonth,\n changeYear,\n goToNextMonth,\n goToPrevMonth,\n} = useMonthYearPicker(props, emits);\n\nonMounted(() => {\n focusMonthYearPicker();\n});\n\ndefineExpose({\n focusMonthYearPicker,\n goToNextMonth,\n goToPrevMonth,\n});\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgJA,UAAM,QAAQ;AAoCd,UAAM,QAAQ;AA+Bd,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,IAAI,mBAAmB,OAAO,KAAK;AAEnC,cAAU,MAAM;AACd;IACF,CAAC;AAED,aAAa;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/packages/dialtone-vue3/components/datepicker/utils.cjs.map ADDED Viewed

@@ -0,0 +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 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":["addDays","getMonth","isEqual","WEEK_START","startOfWeek","getDay","addMonths","startOfMonth","getDate","endOfMonth","subMonths"],"mappings":"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"}

package/dist/packages/dialtone-vue3/components/datepicker/utils.js.map ADDED Viewed

@@ -0,0 +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 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":[],"mappings":"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"}

package/dist/packages/dialtone-vue3/components/description_list/description_list.vue.cjs ADDED Viewed

@@ -0,0 +1,89 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const stack_constants = require("../stack/stack_constants.cjs");
+const description_list_constants = require("./description_list_constants.cjs");
+const description_list_validators = require("./description_list_validators.cjs");
+const vue = require("vue");
+;/* empty css                        */
+const _pluginVue_exportHelper = require("../../../../_virtual/_plugin-vue_export-helper.cjs");
+const _sfc_main = {
+  name: "DtDescriptionList",
+  props: {
+    /**
+     * The direction for the list
+     * @values row, column
+     */
+    direction: {
+      type: String,
+      default: "row",
+      validator: (direction) => description_list_constants.DT_DESCRIPTION_LIST_DIRECTION.includes(direction)
+    },
+    /**
+     * A list of items that represent the term and the description
+     */
+    items: {
+      type: Array,
+      default: () => [],
+      validator: (items) => description_list_validators.itemsValidator(items),
+      required: true
+    },
+    /**
+     * Set the space between the elements
+     * @values 0, 100, 200, 300, 400, 500, 600
+     */
+    gap: {
+      type: String,
+      default: "400",
+      validator: (gap) => stack_constants.DT_STACK_GAP.includes(gap)
+    },
+    /**
+     * Used to customize the term element
+     */
+    termClass: {
+      type: [String, Array, Object],
+      default: ""
+    },
+    /**
+     * Used to customize the description element
+     */
+    descriptionClass: {
+      type: [String, Array, Object],
+      default: ""
+    }
+  },
+  computed: {
+    dtClass() {
+      return ["dt-description-list__term", this.termClass];
+    },
+    ddClass() {
+      return ["dt-description-list__description", this.descriptionClass];
+    },
+    getDirectionClass() {
+      return `dt-description-list--${this.direction}`;
+    },
+    getGapClass() {
+      return `dt-description-list--gap-${this.gap}`;
+    }
+  }
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return vue.openBlock(), vue.createElementBlock("dl", {
+    class: vue.normalizeClass(["dt-description-list", $options.getDirectionClass, $options.getGapClass])
+  }, [
+    (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.items, (item) => {
+      return vue.openBlock(), vue.createElementBlock(vue.Fragment, {
+        key: item.term
+      }, [
+        vue.createElementVNode("dt", {
+          class: vue.normalizeClass($options.dtClass)
+        }, vue.toDisplayString(item.term), 3),
+        vue.createElementVNode("dd", {
+          class: vue.normalizeClass($options.ddClass)
+        }, vue.toDisplayString(item.description), 3)
+      ], 64);
+    }), 128))
+  ], 2);
+}
+const description_list = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["render", _sfc_render]]);
+exports.default = description_list;
+//# sourceMappingURL=description_list.vue.cjs.map