feat(CalendarWidget): add custom DateCell prop

src/widgets/CalendarWidget/ui/CalendarWidget.ui.tsx

@@ -6,6 +6,7 @@ import { DateWrapper } from './components/DateWrapper';
 import { DayOfWeekRow } from './components/DayOfWeekRow';
 import { HeaderRow } from './components/HeaderRow';
 
+import type { DateCellProps } from './components/DateCell';
 import type { FC, HTMLAttributes } from 'react';
 
 type DateCellPropsType = HTMLAttributes<HTMLDivElement>;
@@ -20,6 +21,7 @@ export type CalendarWidgetProps = {
   highlightValue?: boolean;
 
   DateCellProps?: DateCellPropsFuncType | DateCellPropsType;
+  DateCellComponent?: FC<DateCellProps>;
 };
 const CalendarWidget: FC<CalendarWidgetProps> = (props) => (
   <CalendarWidgetProvider {...props}>

src/widgets/CalendarWidget/ui/components/DateCell/index.ts

@@ -1 +1,2 @@
 export { default as DateCell } from './ui/DateCell.ui';
+export type { DateCellProps } from './ui/DateCell.ui';

src/widgets/CalendarWidget/ui/components/DateCell/ui/DateCell.ui.tsx

@@ -9,7 +9,7 @@ import classes from './DateCell.style.module.css';
 
 import type { FC, MouseEventHandler, KeyboardEventHandler } from 'react';
 
-type DateCellProps = React.HTMLAttributes<HTMLDivElement> & {
+export type DateCellProps = React.HTMLAttributes<HTMLDivElement> & {
   date: Date;
 };
 const DateCell: FC<DateCellProps> = (props) => {
@@ -23,6 +23,7 @@ const DateCell: FC<DateCellProps> = (props) => {
     highlightToday,
     highlightValue,
     DateCellProps = {},
+    DateCellComponent,
   } = useContext(CalendarWidgetContext);
 
   const todayDate = new Date();
@@ -53,6 +54,18 @@ const DateCell: FC<DateCellProps> = (props) => {
     onKeyPress?.(event);
   };
 
+  if (DateCellComponent) {
+    return (
+      <DateCellComponent
+        {...props}
+        className={className}
+        onClick={onClick}
+        onKeyPress={onKeyPress}
+        {...restProps}
+      />
+    );
+  }
+
   return (
     <div
       key={dataDate}