@idealyst/datepicker 1.2.42 → 1.2.44

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@idealyst/datepicker",
-  "version": "1.2.42",
+  "version": "1.2.44",
   "description": "Cross-platform date and time picker components for React and React Native",
   "documentation": "https://github.com/IdealystIO/idealyst-framework/tree/main/packages/datepicker#readme",
   "readme": "README.md",
@@ -36,7 +36,7 @@
     "publish:npm": "npm publish"
   },
   "peerDependencies": {
-    "@idealyst/theme": "^1.2.42",
+    "@idealyst/theme": "^1.2.44",
     "@mdi/js": ">=7.0.0",
     "@mdi/react": ">=1.6.0",
     "react": ">=16.8.0",
@@ -69,7 +69,7 @@
     }
   },
   "devDependencies": {
-    "@idealyst/theme": "^1.2.42",
+    "@idealyst/theme": "^1.2.44",
     "@mdi/js": "^7.4.47",
     "@mdi/react": "^1.6.1",
     "@types/react": "^19.1.0",

package/src/DateInput.native.tsx

@@ -41,12 +41,12 @@ export const DateInput: React.FC<DateInputProps> = ({
     return `${month}/${day}/${year}`;
   };
 
-  // Parse string to date
+  // Parse string to date (use noon to avoid timezone issues)
   const parseDate = (str: string): Date | null => {
     const match = str.match(/^(\d{1,2})\/(\d{1,2})\/(\d{4})$/);
     if (!match) return null;
     const [, month, day, year] = match;
-    const date = new Date(parseInt(year), parseInt(month) - 1, parseInt(day));
+    const date = new Date(parseInt(year), parseInt(month) - 1, parseInt(day), 12, 0, 0, 0);
     if (isNaN(date.getTime())) return null;
     return date;
   };

package/src/DateInput.web.tsx

@@ -56,12 +56,12 @@ export const DateInput: React.FC<DateInputProps> = ({
     return `${month}/${day}/${year}`;
   };
 
-  // Parse string to date
+  // Parse string to date (use noon to avoid timezone issues)
   const parseDate = (str: string): Date | null => {
     const match = str.match(/^(\d{1,2})\/(\d{1,2})\/(\d{4})$/);
     if (!match) return null;
     const [, month, day, year] = match;
-    const date = new Date(parseInt(year), parseInt(month) - 1, parseInt(day));
+    const date = new Date(parseInt(year), parseInt(month) - 1, parseInt(day), 12, 0, 0, 0);
     if (isNaN(date.getTime())) return null;
     return date;
   };
@@ -94,8 +94,6 @@ export const DateInput: React.FC<DateInputProps> = ({
   };
 
   const handleDateSelect = (date: Date) => {
-    console.log('[DateInput] handleDateSelect received:', date.toISOString());
-    console.log('[DateInput] Calling onChange with:', date.toISOString());
     onChange(date);
     setOpen(false);
   };

package/src/DatePicker.native.tsx

@@ -56,24 +56,27 @@ export const DatePicker: React.FC<DatePickerProps> = ({
     const days: Array<{ date: Date; isCurrentMonth: boolean }> = [];
 
     // Previous month padding
+    // Use noon (12:00) to avoid timezone issues when date crosses day boundaries
     const prevMonthEnd = new Date(year, month, 0);
     for (let i = startPadding - 1; i >= 0; i--) {
       days.push({
-        date: new Date(year, month - 1, prevMonthEnd.getDate() - i),
+        date: new Date(year, month - 1, prevMonthEnd.getDate() - i, 12, 0, 0, 0),
         isCurrentMonth: false,
       });
     }
 
     // Current month
+    // Use noon (12:00) to avoid timezone issues when date crosses day boundaries
     for (let day = 1; day <= daysInMonth; day++) {
-      days.push({ date: new Date(year, month, day), isCurrentMonth: true });
+      days.push({ date: new Date(year, month, day, 12, 0, 0, 0), isCurrentMonth: true });
     }
 
     // Next month padding (fill to complete last week)
+    // Use noon (12:00) to avoid timezone issues when date crosses day boundaries
     const remaining = 7 - (days.length % 7);
     if (remaining < 7) {
       for (let day = 1; day <= remaining; day++) {
-        days.push({ date: new Date(year, month + 1, day), isCurrentMonth: false });
+        days.push({ date: new Date(year, month + 1, day, 12, 0, 0, 0), isCurrentMonth: false });
       }
     }
 
@@ -100,8 +103,16 @@ export const DatePicker: React.FC<DatePickerProps> = ({
 
   const isDisabled = (date: Date): boolean => {
     if (disabled) return true;
-    if (minDate && date < new Date(minDate.setHours(0, 0, 0, 0))) return true;
-    if (maxDate && date > new Date(maxDate.setHours(23, 59, 59, 999))) return true;
+    // Normalize dates for comparison without mutating the original props
+    const normalizedDate = new Date(date.getFullYear(), date.getMonth(), date.getDate());
+    if (minDate) {
+      const min = new Date(minDate.getFullYear(), minDate.getMonth(), minDate.getDate());
+      if (normalizedDate < min) return true;
+    }
+    if (maxDate) {
+      const max = new Date(maxDate.getFullYear(), maxDate.getMonth(), maxDate.getDate());
+      if (normalizedDate > max) return true;
+    }
     return false;
   };
 
@@ -115,7 +126,9 @@ export const DatePicker: React.FC<DatePickerProps> = ({
 
   const handleDayPress = (date: Date) => {
     if (!isDisabled(date)) {
-      onChange(date);
+      // Create a new date with noon time to avoid timezone issues
+      const newDate = new Date(date.getFullYear(), date.getMonth(), date.getDate(), 12, 0, 0, 0);
+      onChange(newDate);
     }
   };
 

package/src/DatePicker.web.tsx

@@ -39,24 +39,27 @@ export const DatePicker: React.FC<DatePickerProps> = ({
     const days: Array<{ date: Date; isCurrentMonth: boolean }> = [];
 
     // Previous month padding
+    // Use noon (12:00) to avoid timezone issues when date crosses day boundaries
     const prevMonthEnd = new Date(year, month, 0);
     for (let i = startPadding - 1; i >= 0; i--) {
       days.push({
-        date: new Date(year, month - 1, prevMonthEnd.getDate() - i),
+        date: new Date(year, month - 1, prevMonthEnd.getDate() - i, 12, 0, 0, 0),
         isCurrentMonth: false,
       });
     }
 
     // Current month
+    // Use noon (12:00) to avoid timezone issues when date crosses day boundaries
     for (let day = 1; day <= daysInMonth; day++) {
-      days.push({ date: new Date(year, month, day), isCurrentMonth: true });
+      days.push({ date: new Date(year, month, day, 12, 0, 0, 0), isCurrentMonth: true });
     }
 
     // Next month padding (fill to complete last week)
+    // Use noon (12:00) to avoid timezone issues when date crosses day boundaries
     const remaining = 7 - (days.length % 7);
     if (remaining < 7) {
       for (let day = 1; day <= remaining; day++) {
-        days.push({ date: new Date(year, month + 1, day), isCurrentMonth: false });
+        days.push({ date: new Date(year, month + 1, day, 12, 0, 0, 0), isCurrentMonth: false });
       }
     }
 
@@ -105,12 +108,9 @@ export const DatePicker: React.FC<DatePickerProps> = ({
   };
 
   const handleDayPress = (date: Date) => {
-    console.log('[DatePicker] handleDayPress called with:', date.toISOString());
-    console.log('[DatePicker] isDisabled:', isDisabled(date));
     if (!isDisabled(date)) {
-      // Create a new date to avoid mutating the calendar's date objects
-      const newDate = new Date(date.getFullYear(), date.getMonth(), date.getDate());
-      console.log('[DatePicker] Calling onChange with:', newDate.toISOString());
+      // Create a new date with noon time to avoid timezone issues
+      const newDate = new Date(date.getFullYear(), date.getMonth(), date.getDate(), 12, 0, 0, 0);
       onChange(newDate);
     }
   };

package/src/DateTimePicker.native.tsx

@@ -31,8 +31,15 @@ export const DateTimePicker: React.FC<DateTimePickerProps> = ({
     // Preserve time from current value, or use noon as default
     const hours = value?.getHours() ?? 12;
     const minutes = value?.getMinutes() ?? 0;
-    const updated = new Date(date);
-    updated.setHours(hours, minutes, 0, 0);
+    const updated = new Date(
+      date.getFullYear(),
+      date.getMonth(),
+      date.getDate(),
+      hours,
+      minutes,
+      0,
+      0
+    );
     onChange(updated);
   };
 
@@ -40,8 +47,15 @@ export const DateTimePicker: React.FC<DateTimePickerProps> = ({
     if (!time) {
       // Only clear time component, keep date if it exists
       if (value) {
-        const updated = new Date(value);
-        updated.setHours(12, 0, 0, 0);
+        const updated = new Date(
+          value.getFullYear(),
+          value.getMonth(),
+          value.getDate(),
+          12,
+          0,
+          0,
+          0
+        );
         onChange(updated);
       }
       return;

package/src/DateTimePicker.web.tsx

@@ -26,8 +26,6 @@ export const DateTimePicker: React.FC<DateTimePickerProps> = ({
   const inputColumnStyle = (styles.inputColumn as any)({});
 
   const handleDateChange = (date: Date | null) => {
-    console.log('[DateTimePicker] handleDateChange received:', date?.toISOString());
-    console.log('[DateTimePicker] Current value:', value?.toISOString());
     if (!date) {
       onChange(null);
       return;
@@ -35,23 +33,31 @@ export const DateTimePicker: React.FC<DateTimePickerProps> = ({
     // Preserve time from current value, or use noon as default
     const hours = value?.getHours() ?? 12;
     const minutes = value?.getMinutes() ?? 0;
-    console.log('[DateTimePicker] Preserving hours:', hours, 'minutes:', minutes);
-    const updated = new Date(date);
-    console.log('[DateTimePicker] After new Date(date):', updated.toISOString());
-    updated.setHours(hours, minutes, 0, 0);
-    console.log('[DateTimePicker] After setHours:', updated.toISOString());
-    console.log('[DateTimePicker] Calling onChange with:', updated.toISOString());
+    const updated = new Date(
+      date.getFullYear(),
+      date.getMonth(),
+      date.getDate(),
+      hours,
+      minutes,
+      0,
+      0
+    );
     onChange(updated);
   };
 
   const handleTimeChange = (time: Date | null) => {
-    console.log('[DateTimePicker] handleTimeChange received:', time?.toISOString());
-    console.log('[DateTimePicker] Current value:', value?.toISOString());
     if (!time) {
       // Only clear time component, keep date if it exists
       if (value) {
-        const updated = new Date(value);
-        updated.setHours(12, 0, 0, 0);
+        const updated = new Date(
+          value.getFullYear(),
+          value.getMonth(),
+          value.getDate(),
+          12,
+          0,
+          0,
+          0
+        );
         onChange(updated);
       }
       return;
@@ -67,7 +73,6 @@ export const DateTimePicker: React.FC<DateTimePickerProps> = ({
       0,
       0
     );
-    console.log('[DateTimePicker] Time change - calling onChange with:', updated.toISOString());
     onChange(updated);
   };