fix: Enabled month can't be selected (fixes #865)

Author: Jasenkoo

src/VueDatePicker/composables/defaults.ts

@@ -90,6 +90,7 @@ export const useDefaults = (props: AllPropsType | PickerBasePropsType) => {
             defaultedHighlight.value,
             props.markers,
             defaultedTz.value,
+            props.monthPicker || props.yearPicker || props.quarterPicker,
         ),
     );
 

src/VueDatePicker/utils/date-utils.ts

@@ -23,6 +23,7 @@ import {
     setYear,
     subMonths,
     format,
+    startOfMonth,
 } from 'date-fns';
 import { errors } from '@/utils/util';
 
@@ -119,14 +120,15 @@ export const dateToUtc = (date: Date, preserve: boolean, enableSeconds: boolean)
 };
 
 // Reset date time
-export const resetDateTime = (value: Date | string): Date => {
-    let dateParse = getDate(JSON.parse(JSON.stringify(value)));
-    dateParse = setHours(dateParse, 0);
-    dateParse = setMinutes(dateParse, 0);
-    dateParse = setSeconds(dateParse, 0);
-    dateParse = setMilliseconds(dateParse, 0);
-
-    return dateParse;
+export const resetDateTime = (value: Date | string, beginning?: boolean): Date => {
+    const dateParse = getDate(JSON.parse(JSON.stringify(value)));
+    const timeReset = set(dateParse, { hours: 0, minutes: 0, seconds: 0, milliseconds: 0 });
+    if (beginning) {
+        return startOfMonth(timeReset);
+    }
+    return timeReset;
+
+    // return set(dateParse, { hours: 0, minutes: 0, seconds: 0, milliseconds: 0 });
 };
 
 export const setDateTime = (

src/VueDatePicker/utils/defaults.ts

@@ -250,10 +250,11 @@ export const getDefaultTimeZone = (timeZone: TimeZoneProp, emitTimezone?: string
 const datesArrToMap = (
     datesArr: (Date | string | number)[],
     timezone: TimeZoneConfig | undefined,
+    reset?: boolean,
 ): Map<string, Date | null> => {
     return new Map(
         datesArr.map((date) => {
-            const d = dateToTimezoneSafe(date, timezone);
+            const d = dateToTimezoneSafe(date, timezone, reset);
             return [getMapKey(d), d];
         }),
     );
@@ -283,12 +284,13 @@ export const mapPropDates = (
     highlight: HighlightFn | Highlight,
     markers: IMarker[],
     timezone: TimeZoneConfig | undefined,
+    isSpecific: boolean,
 ): PropDates => {
     return {
-        minDate: sanitizeDateToLocal(minDate, timezone),
-        maxDate: sanitizeDateToLocal(maxDate, timezone),
-        disabledDates: shouldMap(disabledDates) ? datesArrToMap(disabledDates, timezone) : disabledDates,
-        allowedDates: shouldMap(allowedDates) ? datesArrToMap(allowedDates, timezone) : null,
+        minDate: sanitizeDateToLocal(minDate, timezone, isSpecific),
+        maxDate: sanitizeDateToLocal(maxDate, timezone, isSpecific),
+        disabledDates: shouldMap(disabledDates) ? datesArrToMap(disabledDates, timezone, isSpecific) : disabledDates,
+        allowedDates: shouldMap(allowedDates) ? datesArrToMap(allowedDates, timezone, isSpecific) : null,
         highlight:
             typeof highlight === 'object' && shouldMap(highlight?.dates)
                 ? datesArrToMap(highlight.dates, timezone)

src/VueDatePicker/utils/timezone.ts

@@ -1,4 +1,4 @@
-import { getDate } from '@/utils/date-utils';
+import { getDate, resetDateTime } from '@/utils/date-utils';
 import type { MaybeDate, TimeZoneConfig } from '@/interfaces';
 
 /**
@@ -9,22 +9,23 @@ export const localToTz = (date: Date, timeZone?: string) => {
     return new Date(date.toLocaleString('en-US', { timeZone }));
 };
 
-export const dateToTimezoneSafe = (date: Date | string | number, tz?: TimeZoneConfig) => {
-    const d = sanitizeDateToLocal(date, tz);
+export const dateToTimezoneSafe = (date: Date | string | number, tz?: TimeZoneConfig, reset?: boolean) => {
+    const d = sanitizeDateToLocal(date, tz, reset);
     if (!d) return getDate();
     return d;
 };
 
-const getDateInTz = (date: Date | number | string, tz: TimeZoneConfig) => {
-    return tz.dateInTz ? localToTz(new Date(date), tz.dateInTz) : getDate(date);
+const getDateInTz = (date: Date | number | string, tz: TimeZoneConfig, reset?: boolean) => {
+    const newDate = tz.dateInTz ? localToTz(new Date(date), tz.dateInTz) : getDate(date);
+    return reset ? resetDateTime(newDate, true) : newDate;
 };
 
 // Converts specific date to a Date object based on a provided timezone
-export const sanitizeDateToLocal = (date: MaybeDate, tz?: TimeZoneConfig) => {
+export const sanitizeDateToLocal = (date: MaybeDate, tz?: TimeZoneConfig, reset?: boolean) => {
     if (!date) return null;
-    if (!tz) return getDate(date);
-    const local = getDate(date);
-    return tz.exactMatch ? getDateInTz(date, tz) : localToTz(local, tz.timezone);
+    const newDate = reset ? resetDateTime(getDate(date), true) : getDate(date);
+    if (!tz) return newDate;
+    return tz.exactMatch ? getDateInTz(date, tz, reset) : localToTz(newDate, tz.timezone);
 };
 
 export const getTimezoneOffset = (timezone?: string) => {