@vkontakte/vkui 8.0.2 → 8.1.0

package/src/components/AppRoot/AppRootContext.ts

@@ -5,14 +5,14 @@ import type { AppRootUserSelectMode, SafeAreaInsets } from './types';
 
 export interface AppRootContextInterface {
   appRoot: React.RefObject<HTMLElement | null>;
-  portalRoot?: HTMLElement | React.RefObject<HTMLElement | null> | null;
-  safeAreaInsets?: SafeAreaInsets;
+  portalRoot?: HTMLElement | React.RefObject<HTMLElement | null> | null | undefined;
+  safeAreaInsets?: SafeAreaInsets | undefined;
   embedded: boolean;
   mode: 'partial' | 'embedded' | 'full';
   keyboardInput: boolean;
   disablePortal: boolean;
-  layout?: 'card' | 'plain';
-  userSelectMode?: AppRootUserSelectMode;
+  layout?: 'card' | 'plain' | undefined;
+  userSelectMode?: AppRootUserSelectMode | undefined;
 }
 
 /**

package/src/components/AppRoot/AppRootPortal.tsx

@@ -22,11 +22,11 @@ export interface AppRootPortalProps extends HasChildren {
    *
    * @default true (использует `document.body` как портал по умолчанию)
    */
-  usePortal?: boolean | HTMLElement | React.RefObject<HTMLElement | null> | null;
+  usePortal?: boolean | HTMLElement | React.RefObject<HTMLElement | null> | null | undefined;
   /**
    * `className` для контейнера портала.
    */
-  className?: string;
+  className?: string | undefined;
 }
 
 export const AppRootPortal = ({

package/src/components/AppRoot/ScrollContext.tsx

@@ -29,12 +29,12 @@ const getPageYOffsetWithoutKeyboardHeight = (window: Window, scrollTop: number)
 };
 
 export type GetScrollOptions = {
-  compensateKeyboardHeight?: boolean;
+  compensateKeyboardHeight?: boolean | undefined;
 };
 
 export interface ScrollContextInterface {
-  getScroll: (this: void, options?: GetScrollOptions) => { x: number; y: number };
-  scrollTo: (this: void, x?: number, y?: number) => void;
+  getScroll: (this: void, options?: GetScrollOptions) => { x: number | undefined; y: number };
+  scrollTo: (this: void, x?: number | undefined, y?: number) => void;
   /**
    * Увеличивает счетчик блокировки прокрутки.
    */
@@ -43,7 +43,7 @@ export interface ScrollContextInterface {
    * Уменьшает счетчик блокировки прокрутки.
    */
   decrementScrollLockCounter: (this: void) => void;
-  beforeScrollLockFnSetRef?: React.RefObject<Set<() => void>>;
+  beforeScrollLockFnSetRef?: React.RefObject<Set<() => void>> | undefined;
 }
 
 export const ScrollContext: React.Context<ScrollContextInterface> =
@@ -148,7 +148,7 @@ const _getScroll = ({
   yOffset: number;
   element: HTMLElement;
   scrollLockEnabled: boolean;
-  customCalcY?: (scrollTop: number) => number;
+  customCalcY?: ((scrollTop: number) => number) | undefined;
 }) => {
   const elementStyles = element.style;
   const [scrollLeft, scrollTop] = scrollLockEnabled

package/src/components/AppRoot/types.ts

@@ -1,10 +1,10 @@
 /* eslint-disable jsdoc/require-jsdoc */
 
 export type SafeAreaInsets = {
-  top?: number;
-  right?: number;
-  bottom?: number;
-  left?: number;
+  top?: number | undefined;
+  right?: number | undefined;
+  bottom?: number | undefined;
+  left?: number | undefined;
 };
 
 export type AppRootMode = 'partial' | 'embedded' | 'full';

package/src/components/AspectRatio/AspectRatio.tsx

@@ -8,11 +8,11 @@ export interface AspectRatioProps extends Omit<RootComponentProps<HTMLElement>,
   /**
    * `className` для компонента.
    */
-  className?: string;
+  className?: string | undefined;
   /**
    * По умолчанию, вложенный контент будет растягиваться и заполнять весь блок.
    */
-  mode?: 'stretch' | 'none';
+  mode?: 'stretch' | 'none' | undefined;
   /**
    * Например:
    * - в виде числа: 16 / 9, 4 / 3, 1920 / 1080,

package/src/components/Avatar/Avatar.module.css

@@ -11,11 +11,6 @@
   background-image: linear-gradient(135deg, #ff7583, #e52e40);
 }
 
-.gradientPink {
-  background-color: #e62e6b;
-  background-image: linear-gradient(135deg, #ff8880, #e62e6b);
-}
-
 .gradientOrange {
   background-color: #e66b2e;
   background-image: linear-gradient(135deg, #ffbf80, #e66b2e);

package/src/components/Avatar/Avatar.module.css.d.ts.map

@@ -1 +1 @@
-{"version":3,"sources":["./Avatar.module.css"],"names":["host","hasGradient","gradientRed","gradientPink","gradientOrange","gradientYellow","gradientGreen","gradientLBlue","gradientBlue","gradientViolet","initials"],"mappings":"AAAA;AAAA,E,aAAAA,M,WAAA;AAAA,E,aAIAC,a,WAJA;AAAA,E,aAQAC,a,WARA;AAAA,E,aAaAC,c,WAbA;AAAA,E,aAkBAC,gB,WAlBA;AAAA,E,aAuBAC,gB,WAvBA;AAAA,E,aA4BAC,e,WA5BA;AAAA,E,aAiCAC,e,WAjCA;AAAA,E,aAsCAC,c,WAtCA;AAAA,E,aA2CAC,gB,WA3CA;AAAA,E,aAgDAC,U,WAhDA;AAAA;AAAA","file":"Avatar.module.css.d.ts","sourceRoot":""}
+{"version":3,"sources":["./Avatar.module.css"],"names":["host","hasGradient","gradientRed","gradientOrange","gradientYellow","gradientGreen","gradientLBlue","gradientBlue","gradientViolet","initials"],"mappings":"AAAA;AAAA,E,aAAAA,M,WAAA;AAAA,E,aAIAC,a,WAJA;AAAA,E,aAQAC,a,WARA;AAAA,E,aAaAC,gB,WAbA;AAAA,E,aAkBAC,gB,WAlBA;AAAA,E,aAuBAC,e,WAvBA;AAAA,E,aA4BAC,e,WA5BA;AAAA,E,aAiCAC,c,WAjCA;AAAA,E,aAsCAC,gB,WAtCA;AAAA,E,aA2CAC,U,WA3CA;AAAA;AAAA","file":"Avatar.module.css.d.ts","sourceRoot":""}

package/src/components/Avatar/Avatar.tsx

@@ -58,7 +58,7 @@ export interface AvatarProps extends Omit<ImageBaseProps, 'widthSize' | 'heightS
    *
    * > ⚠️ Перебивает `fallbackIcon`.
    */
-  initials?: string;
+  initials?: string | undefined;
   /**
    * Задаёт градиент для фона.
    *
@@ -74,7 +74,11 @@ export interface AvatarProps extends Omit<ImageBaseProps, 'widthSize' | 'heightS
    * > Если необходимо задать свой градиент, то используйте значение `"custom"` и определите цвет градиента либо через
    * > свой класс в `className`, либо через `style={{ backgroundImage: "..." }}`.
    */
-  gradientColor?: InitialsAvatarNumberGradients | InitialsAvatarTextGradients | 'custom';
+  gradientColor?:
+    | InitialsAvatarNumberGradients
+    | InitialsAvatarTextGradients
+    | 'custom'
+    | undefined;
 }
 
 /**

package/src/components/Avatar/AvatarBadge/AvatarBadgeWithPreset.tsx

@@ -19,7 +19,7 @@ export interface AvatarBadgeWithPresetProps
    *
    * За каждым пресетом закреплена своя иконка и стили.
    */
-  preset?: 'online' | 'online-mobile';
+  preset?: 'online' | 'online-mobile' | undefined;
 }
 
 export const AvatarBadgeWithPreset = ({

package/src/components/Badge/Badge.tsx

@@ -12,7 +12,7 @@ export interface BadgeProps extends RootComponentProps<HTMLSpanElement> {
   /**
    * Режим отображения компонента.
    */
-  mode?: 'new' | 'prominent';
+  mode?: 'new' | 'prominent' | undefined;
 }
 
 /**

package/src/components/Banner/Banner.tsx

@@ -17,42 +17,42 @@ export interface BannerProps extends Omit<TappableOmitProps, 'title' | 'size'> {
   /**
    * Тип баннера.
    */
-  mode?: 'tint' | 'image';
+  mode?: 'tint' | 'image' | undefined;
   /**
    * Размер баннера.
    */
-  size?: 's' | 'm';
+  size?: 's' | 'm' | undefined;
   /**
    * Тип действия в правой части баннера.
    *
    * - `dismiss` – отображается иконка крестика, при нажатии на неё сработает свойство `onDismiss`.
    * - `chevron` – отображается иконка шеврона, которая подразумевает, что при нажатии на баннер можно куда-то перейти.
    */
-  after?: 'dismiss' | 'chevron' | React.ReactNode;
+  after?: 'dismiss' | 'chevron' | React.ReactNode | undefined;
   /**
    * Срабатывает при нажатии на иконку крестика при `after="dismiss"`.
    */
-  onDismiss?: React.MouseEventHandler<HTMLButtonElement>;
+  onDismiss?: React.MouseEventHandler<HTMLButtonElement> | undefined;
   /**
    * Текст кнопки закрытия. Делает ее доступной для ассистивных технологий.
    */
-  dismissLabel?: string;
+  dismissLabel?: string | undefined;
   /**
    * Содержимое, отображаемое в левой части баннера.
    */
-  before?: React.ReactNode;
+  before?: React.ReactNode | undefined;
   /**
    * Заголовок.
    */
-  title?: React.ReactNode;
+  title?: React.ReactNode | undefined;
   /**
    * Подзаголовок.
    */
-  subtitle?: React.ReactNode;
+  subtitle?: React.ReactNode | undefined;
   /**
    * Дополнительный подзаголовок баннера.
    */
-  extraSubtitle?: React.ReactNode;
+  extraSubtitle?: React.ReactNode | undefined;
   /**
    * При использовании `mode="image"`.
    *
@@ -60,13 +60,13 @@ export interface BannerProps extends Omit<TappableOmitProps, 'title' | 'size'> {
    * - `dark` – в качестве фона используется тёмное изображение, цвет текста будет светлым.
    * - `auto` - цвет фона и текста будет зависеть от цветовой схемы приложения.
    */
-  imageTheme?: 'light' | 'dark' | 'auto';
+  imageTheme?: 'light' | 'dark' | 'auto' | undefined;
   /**
    * При использовании `mode="image"`.
    *
    * Элемент, который нужно стилизовать цветом и/или фоном. Этот элемент будет растянут на 100% ширины и высоты баннера.
    */
-  background?: React.ReactNode;
+  background?: React.ReactNode | undefined;
   /**
    * Кнопки-действия. Принимает [`Button`](https://vkui.io/components/button).
    *
@@ -81,7 +81,7 @@ export interface BannerProps extends Omit<TappableOmitProps, 'title' | 'size'> {
    * - `gap="m" mode="horizontal" stretched`
    * - `gap="m" mode="vertical" stretched`.
    */
-  actions?: React.ReactNode;
+  actions?: React.ReactNode | undefined;
 }
 
 /**

package/src/components/Box/Box.tsx

@@ -16,7 +16,7 @@ export interface BoxProps extends RootComponentProps<HTMLElement>, LayoutProps {
   /**
    * Возможность задать css-свойство `display`.
    */
-  display?: 'none' | 'inline' | 'inline-block' | 'block' | 'contents';
+  display?: 'none' | 'inline' | 'inline-block' | 'block' | 'contents' | undefined;
 }
 
 /**

package/src/components/Button/Button.tsx

@@ -55,27 +55,34 @@ export interface VKUIButtonProps extends HasAlign {
   /**
    * Режим отображения кнопки.
    */
-  mode?: 'primary' | 'secondary' | 'tertiary' | 'outline' | 'link';
+  mode?: 'primary' | 'secondary' | 'tertiary' | 'outline' | 'link' | undefined;
   /**
    * Цветовая схема кнопки.
    */
-  appearance?: 'accent' | 'positive' | 'negative' | 'neutral' | 'overlay' | 'accent-invariable';
+  appearance?:
+    | 'accent'
+    | 'positive'
+    | 'negative'
+    | 'neutral'
+    | 'overlay'
+    | 'accent-invariable'
+    | undefined;
   /**
    * Размер кнопки.
    */
-  size?: 's' | 'm' | 'l';
+  size?: 's' | 'm' | 'l' | undefined;
   /**
    * Растягивает кнопку на всю ширину контейнера.
    */
-  stretched?: boolean;
+  stretched?: boolean | undefined;
   /**
    * Контент, отображаемый перед основным содержимым кнопки.
    */
-  before?: React.ReactNode;
+  before?: React.ReactNode | undefined;
   /**
    * Контент, отображаемый после основного содержимого кнопки.
    */
-  after?: React.ReactNode;
+  after?: React.ReactNode | undefined;
   /**
    * Включает состояние загрузки (отображает спиннер).
    *
@@ -91,24 +98,24 @@ export interface VKUIButtonProps extends HasAlign {
    * @example
    * <Button loading loadingLabel="Сохранение данных...">Сохранить</Button>
    */
-  loading?: boolean;
+  loading?: boolean | undefined;
   /**
    * Текст для `aria-label` при состоянии загрузки.
    * Подменяет переданный в компонент `aria-label` только когда `loading={true}`.
    */
-  loadingLabel?: string;
+  loadingLabel?: string | undefined;
   /**
    * Отключает анимацию спиннера загрузки.
    */
-  disableSpinnerAnimation?: boolean;
+  disableSpinnerAnimation?: boolean | undefined;
   /**
    * Добавляет скругленные углы кнопке.
    */
-  rounded?: boolean;
+  rounded?: boolean | undefined;
   /**
    * Добавляет тень кнопке.
    */
-  elevation?: Elevation;
+  elevation?: Elevation | undefined;
 }
 
 export interface ButtonProps extends Omit<TappableOmitProps, 'size'>, VKUIButtonProps {}
@@ -199,7 +206,7 @@ export const Button = ({
     >
       {loading && (
         <Spinner
-          size="s"
+          size={size === 's' ? 's' : 'm'}
           className={styles.spinner}
           disableAnimation={disableSpinnerAnimation}
           noColor

package/src/components/ButtonGroup/ButtonGroup.tsx

@@ -24,21 +24,21 @@ export interface ButtonGroupProps extends HTMLAttributesWithRootRef<HTMLDivEleme
   /**
    * Задает расположение элементов внутри группы, вертикальное или горизонтальное.
    */
-  mode?: 'vertical' | 'horizontal';
+  mode?: 'vertical' | 'horizontal' | undefined;
   /**
    * Выставляет в зависимости от `mode` отступ по вертикали или горизонтали.
    */
-  gap?: 'none' | 'space' | 's' | 'm';
+  gap?: 'none' | 'space' | 's' | 'm' | undefined;
   /**
    * Растягивает компонент на всю ширину контейнера.
    *
    * Note: Для потомков соответствующее поведение нужно определять самостоятельно, где это необходимо.
    */
-  stretched?: boolean;
+  stretched?: boolean | undefined;
   /**
    * Горизонтальное выравнивание элементов внутри группы.
    */
-  align?: AlignType;
+  align?: AlignType | undefined;
 }
 
 /**

package/src/components/Calendar/Calendar.tsx

@@ -62,29 +62,29 @@ export interface CalendarProps
   /**
    * Текущая выбранная дата.
    */
-  value?: Date | null;
+  value?: Date | null | undefined;
   /**
    * Начальная дата при монтировании.
    */
-  defaultValue?: Date | null;
+  defaultValue?: Date | null | undefined;
   /**
    * Запрещает выбор даты в прошлом.
    * Применяется, если не заданы `shouldDisableDate` и `disableFuture`.
    */
-  disablePast?: boolean;
+  disablePast?: boolean | undefined;
   /**
    * Запрещает выбор даты в будущем.
    * Применяется, если не задано `shouldDisableDate`.
    */
-  disableFuture?: boolean;
+  disableFuture?: boolean | undefined;
   /**
    * Включает выбор времени.
    */
-  enableTime?: boolean;
+  enableTime?: boolean | undefined;
   /**
    * Отключает селекторы выбора месяца/года.
    */
-  disablePickers?: boolean;
+  disablePickers?: boolean | undefined;
   /**
    * `aria-label` для изменения дня.
    *
@@ -93,50 +93,50 @@ export interface CalendarProps
    * Теперь этот контейнер является таблицей (с помощью role="grid") и
    * в aria-label рендерится текущий открытый в календаре месяц и год.
    */
-  changeDayLabel?: string; // TODO [>=9]: удалить неиспользуемое свойство
+  changeDayLabel?: string | undefined; // TODO [>=9]: удалить неиспользуемое свойство
   /**
    * День недели, с которого начинается неделя.
    */
-  weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+  weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6 | undefined;
   /**
    * Показывать дни соседних месяцев.
    */
-  showNeighboringMonth?: boolean;
+  showNeighboringMonth?: boolean | undefined;
   /**
    * Размер календаря.
    */
-  size?: 's' | 'm';
+  size?: 's' | 'm' | undefined;
   /**
    * Обработчик изменения выбранной даты.
    */
-  onChange?: (value: Date) => void;
+  onChange?: ((value: Date) => void) | undefined;
   /**
    * Функция для проверки запрета выбора даты.
    */
-  shouldDisableDate?: (value: Date) => boolean;
+  shouldDisableDate?: ((value: Date) => boolean) | undefined;
   /**
    * Дата отображаемого месяца.
    * При использовании обновление даты должно происходить вне компонента.
    */
-  viewDate?: Date;
+  viewDate?: Date | undefined;
   /**
    * Обработчик изменения даты в шапке календаря.
    */
-  onHeaderChange?: (value: Date) => void;
+  onHeaderChange?: ((value: Date) => void) | undefined;
   /**
    * Минимальные дата и время, которые можно выбрать.
    * Применяется, если не заданы `shouldDisableDate` и `disablePast`/`disableFuture`.
    */
-  minDateTime?: Date;
+  minDateTime?: Date | undefined;
   /**
    * Максимальные дата и время, которые можно выбрать.
    * Применяется, если не заданы `shouldDisableDate` и `disablePast`/`disableFuture`.
    */
-  maxDateTime?: Date;
+  maxDateTime?: Date | undefined;
   /**
    * Часовой пояс для отображения даты.
    */
-  timezone?: string;
+  timezone?: string | undefined;
 }
 
 const warn = warnOnce('Calendar');

package/src/components/CalendarDay/CalendarDay.tsx

@@ -29,7 +29,7 @@ export type CalendarDayTestsProps = {
   /**
    * Передает атрибут `data-testid` для дня в календаре.
    */
-  testId?: string | ((day: Date) => string);
+  testId?: string | ((day: Date) => string) | undefined;
 };
 
 export interface CalendarDayProps extends CalendarDayElementProps, CalendarDayTestsProps {
@@ -40,55 +40,55 @@ export interface CalendarDayProps extends CalendarDayElementProps, CalendarDayTe
   /**
    * Является ли день сегодняшним.
    */
-  today?: boolean;
+  today?: boolean | undefined;
   /**
    * Выбран ли день (в режиме одиночного выбора или как часть диапазона).
    */
-  selected?: boolean;
+  selected?: boolean | undefined;
   /**
    * Является ли день началом выделенного диапазона.
    */
-  selectionStart?: boolean;
+  selectionStart?: boolean | undefined;
   /**
    * Является ли день концом выделенного диапазона.
    */
-  selectionEnd?: boolean;
+  selectionEnd?: boolean | undefined;
   /**
    * Подсветить день как начало предполагаемого диапазона (при наведении).
    */
-  hintedSelectionStart?: boolean;
+  hintedSelectionStart?: boolean | undefined;
   /**
    * Подсветить день как конец предполагаемого диапазона (при наведении).
    */
-  hintedSelectionEnd?: boolean;
+  hintedSelectionEnd?: boolean | undefined;
   /**
    * Активен ли день (текущая дата в календаре).
    */
-  active?: boolean;
+  active?: boolean | undefined;
   /**
    * Скрыть день (например, дни соседних месяцев).
    */
-  hidden?: boolean;
+  hidden?: boolean | undefined;
   /**
    * Блокировка взаимодействия с компонентом.
    */
-  disabled?: boolean;
+  disabled?: boolean | undefined;
   /**
    * Находится ли день в фокусе (клавиатурная навигация).
    */
-  focused?: boolean;
+  focused?: boolean | undefined;
   /**
    * Подсвечен ли день (ховер).
    */
-  hinted?: boolean;
+  hinted?: boolean | undefined;
   /**
    * Принадлежит ли день текущему отображаемому месяцу.
    */
-  sameMonth?: boolean;
+  sameMonth?: boolean | undefined;
   /**
    * Размер компонента.
    */
-  size?: 's' | 'm';
+  size?: 's' | 'm' | undefined;
   /**
    * Обработчик выбора/изменения дня.
    */
@@ -96,19 +96,19 @@ export interface CalendarDayProps extends CalendarDayElementProps, CalendarDayTe
   /**
    * Обработчик наведения на день.
    */
-  onEnter?: (value: Date) => void;
+  onEnter?: ((value: Date) => void) | undefined;
   /**
    * Обработчик снятия ховера с дня.
    */
-  onLeave?: (value: Date) => void;
+  onLeave?: ((value: Date) => void) | undefined;
   /**
    * Обработчик фокуса на дне.
    */
-  onFocus?: (value: Date) => void;
+  onFocus?: ((value: Date) => void) | undefined;
   /**
    * Кастомизация отображения содержимого дня.
    */
-  renderDayContent?: (day: Date) => React.ReactNode;
+  renderDayContent?: ((day: Date) => React.ReactNode) | undefined;
 }
 
 // eslint-disable-next-line react/display-name -- используется defineComponentDisplayNames

package/src/components/CalendarDays/CalendarDays.tsx

@@ -30,7 +30,7 @@ export type CalendarDaysTestsProps = {
   /**
    * Передает атрибут `data-testid` для дня в календаре.
    */
-  dayTestId?: CalendarDayTestsProps['testId'];
+  dayTestId?: CalendarDayTestsProps['testId'] | undefined;
 };
 
 export interface CalendarDaysProps
@@ -40,7 +40,7 @@ export interface CalendarDaysProps
   /**
    * Выбранная дата или диапазон дат.
    */
-  value?: Date | Array<Date | null> | null;
+  value?: Date | Array<Date | null> | null | undefined;
   /**
    * Дата, определяющая отображаемый месяц.
    */
@@ -52,19 +52,19 @@ export interface CalendarDaysProps
   /**
    * Показывать дни соседних месяцев.
    */
-  showNeighboringMonth?: boolean;
+  showNeighboringMonth?: boolean | undefined;
   /**
    * Размер календаря.
    */
-  size?: 's' | 'm';
+  size?: 's' | 'm' | undefined;
   /**
    * Дополнительные свойства для элементов дней.
    */
-  dayProps?: CalendarDayElementProps;
+  dayProps?: CalendarDayElementProps | undefined;
   /**
    * Следить за изменениями дней для обновления UI.
    */
-  listenDayChangesForUpdate?: boolean;
+  listenDayChangesForUpdate?: boolean | undefined;
   /**
    * Обработчик изменения выбранного дня.
    */
@@ -84,11 +84,11 @@ export interface CalendarDaysProps
   /**
    * Определяет начало диапазона при наведении (подсветка).
    */
-  isHintedDaySelectionStart?: (value: Date, dayOfWeek: number) => boolean;
+  isHintedDaySelectionStart?: ((value: Date, dayOfWeek: number) => boolean) | undefined;
   /**
    * Определяет конец диапазона при наведении (подсветка).
    */
-  isHintedDaySelectionEnd?: (value: Date, dayOfWeek: number) => boolean;
+  isHintedDaySelectionEnd?: ((value: Date, dayOfWeek: number) => boolean) | undefined;
   /**
    * Проверяет, является ли день активным (текущая дата).
    */
@@ -96,15 +96,15 @@ export interface CalendarDaysProps
   /**
    * Проверяет, подсвечен ли день (при наведении).
    */
-  isDayHinted?: (value: Date) => boolean;
+  isDayHinted?: ((value: Date) => boolean) | undefined;
   /**
    * Проверяет, возможно ли сфокусироваться на дне с клавиатуры.
    */
-  isDayFocusable?: (value: Date) => boolean;
+  isDayFocusable?: ((value: Date) => boolean) | undefined;
   /**
    * Проверяет, выбран ли день.
    */
-  isDaySelected?: (value: Date) => boolean;
+  isDaySelected?: ((value: Date) => boolean) | undefined;
   /**
    * Проверяет, находится ли день в фокусе.
    */
@@ -112,15 +112,15 @@ export interface CalendarDaysProps
   /**
    * Обработчик события 'pointerenter' на элементе дня.
    */
-  onDayEnter?: (value: Date) => void;
+  onDayEnter?: ((value: Date) => void) | undefined;
   /**
    * Обработчик события 'pointerleave' на элементе дня.
    */
-  onDayLeave?: (value: Date) => void;
+  onDayLeave?: ((value: Date) => void) | undefined;
   /**
    * Обработчик события `focus` на элементе дня.
    */
-  onDayFocus?: (value: Date) => void;
+  onDayFocus?: ((value: Date) => void) | undefined;
 }
 
 export const CalendarDays = ({