Day - fix date prop's return type for custom datComponent to avoid breaking change

Author: Inbal-Tish

src/calendar/day/index.tsx

@@ -4,6 +4,7 @@ import React, {useMemo} from 'react';
 
 import {formatNumbers, isToday} from '../../dateutils';
 import {getDefaultLocale} from '../../services';
+import {xdateToData} from '../../interface';
 // @ts-expect-error
 import {SELECT_DATE_SLOT} from '../../testIDs';
 import {DateData} from '../../types';
@@ -13,7 +14,7 @@ import PeriodDay from './period';
 
 export interface DayProps extends BasicDayProps {
   /** Provide custom day rendering component */
-  dayComponent?: React.ComponentType<DayProps & {date?: DateData}>;
+  dayComponent?: React.ComponentType<DayProps & {date?: DateData}>; // TODO: change 'date' prop type to string by removing it from overriding BasicDay's 'date' prop (breaking change for V2)
 }
 
 const Day = React.memo((props: DayProps) => {
@@ -57,13 +58,16 @@ const Day = React.memo((props: DayProps) => {
     return `${_isToday ? today : ''} ${_date?.toString(formatAccessibilityLabel)} ${markingAccessibilityLabel}`;
   }, [_date, marking, _isToday]);
 
-  const Component = dayComponent || markingType === 'period' ? PeriodDay : BasicDay;
+  const Component = dayComponent || (markingType === 'period' ? PeriodDay : BasicDay);
+  const dayComponentProps = dayComponent ? {date: xdateToData(date ? new XDate(date) : new XDate())} : undefined;
 
   return (
+    //@ts-expect-error
     <Component
       {...props}
       accessibilityLabel={getAccessibilityLabel}
       testID={`${SELECT_DATE_SLOT}-${date}`}
+      {...dayComponentProps}
     >
       {formatNumbers(_date?.getDate())}
     </Component>