@@ -53,19 +53,20 @@ export function DateField({
5353  variant =  "small" , 
5454} : DateFieldProps )  { 
5555  const  [ value ,  setValue ]  =  useState < undefined  |  CalendarDateTime > ( 
56-     utcDateToCalendarDate ( defaultValue ) 
56+     dateToCalendarDate ( defaultValue ) 
5757  ) ; 
5858
5959  const  state  =  useDateFieldState ( { 
6060    value : value , 
6161    onChange : ( value )  =>  { 
6262      if  ( value )  { 
6363        setValue ( value ) ; 
64-         onValueChange ?.( value . toDate ( "utc" ) ) ; 
64+         const  timeZone  =  Intl . DateTimeFormat ( ) . resolvedOptions ( ) . timeZone ; 
65+         onValueChange ?.( value . toDate ( timeZone ) ) ; 
6566      } 
6667    } , 
67-     minValue : utcDateToCalendarDate ( minValue ) , 
68-     maxValue : utcDateToCalendarDate ( maxValue ) , 
68+     minValue : dateToCalendarDate ( minValue ) , 
69+     maxValue : dateToCalendarDate ( maxValue ) , 
6970    shouldForceLeadingZeros : true , 
7071    granularity, 
7172    locale : "en-US" , 
@@ -78,7 +79,7 @@ export function DateField({
7879  useEffect ( ( )  =>  { 
7980    if  ( state . value  ===  undefined  &&  defaultValue  ===  undefined )  return ; 
8081
81-     const  calendarDate  =  utcDateToCalendarDate ( defaultValue ) ; 
82+     const  calendarDate  =  dateToCalendarDate ( defaultValue ) ; 
8283    //unchanged 
8384    if  ( state . value ?. toDate ( "utc" ) . getTime ( )  ===  defaultValue ?. getTime ( ) )  { 
8485      return ; 
@@ -136,7 +137,7 @@ export function DateField({
136137            variant = { variants [ variant ] . nowButtonVariant } 
137138            onClick = { ( )  =>  { 
138139              const  now  =  new  Date ( ) ; 
139-               setValue ( utcDateToCalendarDate ( new  Date ( ) ) ) ; 
140+               setValue ( dateToCalendarDate ( new  Date ( ) ) ) ; 
140141              onValueChange ?.( now ) ; 
141142            } } 
142143          > 
@@ -186,6 +187,19 @@ function utcDateToCalendarDate(date?: Date) {
186187    : undefined ; 
187188} 
188189
190+ function  dateToCalendarDate ( date ?: Date )  { 
191+   return  date 
192+     ? new  CalendarDateTime ( 
193+         date . getFullYear ( ) , 
194+         date . getMonth ( )  +  1 , 
195+         date . getDate ( ) , 
196+         date . getHours ( ) , 
197+         date . getMinutes ( ) , 
198+         date . getSeconds ( ) 
199+       ) 
200+     : undefined ; 
201+ } 
202+ 
189203type  DateSegmentProps  =  { 
190204  segment : DateSegment ; 
191205  state : DateFieldState ; 
0 commit comments