@vkontakte/vkui 8.0.1 → 8.1.0

package/src/components/Tooltip/Tooltip.tsx

@@ -53,29 +53,29 @@ export interface TooltipProps extends AllowedFloatingComponentProps, AllowedTool
    *
    * > Если нужно разово инициировать показ тултипа при первом рендере, то используйте `defaultShown`.
    */
-  shown?: boolean;
+  shown?: boolean | undefined;
   /**
    * Добавляет возможность наводить на тултип.
    */
-  enableInteractive?: boolean;
+  enableInteractive?: boolean | undefined;
   /**
    * Добавляет возможность закрыть тултип через иконку-крестик.
    *
    * > Работает в сочетании с `enableInteractive` или при использовании `shown` и `onShownChange`.
    */
-  closable?: boolean;
+  closable?: boolean | undefined;
   /**
    * Скрывает стрелку, указывающую на якорный элемент.
    */
-  disableArrow?: boolean;
+  disableArrow?: boolean | undefined;
   /**
    * Отключает закрытие по нажатию.
    */
-  disableCloseAfterClick?: boolean;
+  disableCloseAfterClick?: boolean | undefined;
   /**
    * Отключает появление при фокусе.
    */
-  disableTriggerOnFocus?: boolean;
+  disableTriggerOnFocus?: boolean | undefined;
 }
 
 /**

package/src/components/TooltipBase/TooltipBase.tsx

@@ -26,24 +26,24 @@ export interface TooltipBaseProps
   /**
    * Стиль отображения подсказки.
    */
-  appearance?: 'accent' | 'neutral' | 'white' | 'black' | 'inversion';
+  appearance?: 'accent' | 'neutral' | 'white' | 'black' | 'inversion' | undefined;
   /**
    * Текст тултипа.
    */
-  description?: React.ReactNode;
+  description?: React.ReactNode | undefined;
   /**
    * Заголовок тултипа.
    */
-  title?: React.ReactNode;
+  title?: React.ReactNode | undefined;
   /**
    * [a11y] Id для заголовка тултипа.
    * Можно использовать для связи элемента с `role="dialog"` и заголовка через `aria-labelledby`.
    */
-  titleId?: string;
+  titleId?: string | undefined;
   /**
    * Для показа указателя, требуется передать хотя бы `coords` и `placement`.
    */
-  arrowProps?: Omit<FloatingArrowProps, 'Icon'>;
+  arrowProps?: Omit<FloatingArrowProps, 'Icon'> | undefined;
   /**
    * Пользовательская SVG иконка.
    *
@@ -57,25 +57,25 @@ export interface TooltipBaseProps
    * 4. Убедитесь, что SVG и её элементы наследует цвет через `fill="currentColor"`.
    * 5. Если стрелка наезжает на якорный элемент, то увеличьте смещение между целевым и всплывающим элементами.
    */
-  ArrowIcon?: FloatingArrowProps['Icon'];
+  ArrowIcon?: FloatingArrowProps['Icon'] | undefined;
   /**
    * Пользовательские css-классы, будут добавлены на root-элемент.
    */
-  className?: string;
+  className?: string | undefined;
   /**
    * Перебивает максимальную ширину заданную по умолчанию.
    *
    * Передача `null` полностью сбрасывает установку `max-width` на элемент.
    */
-  maxWidth?: number | string | null;
+  maxWidth?: number | string | null | undefined;
   /**
    * Скрытый текст для кнопки закрытия.
    */
-  closeIconLabel?: string;
+  closeIconLabel?: string | undefined;
   /**
    * Обработчик нажатия на кнопку закрытия. При передаче, показывается иконка.
    */
-  onCloseIconClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+  onCloseIconClick?: ((event: React.MouseEvent<HTMLButtonElement>) => void) | undefined;
 }
 
 /**

package/src/components/Touch/Touch.tsx

@@ -106,68 +106,68 @@ export interface TouchProps
    * Использовать pointer-events для hover-состояний.
    * Работает на отключенных элементах (disabled inputs).
    */
-  usePointerHover?: boolean;
+  usePointerHover?: boolean | undefined;
   /**
    * Использовать фазу capture для событий.
    */
-  useCapture?: boolean;
+  useCapture?: boolean | undefined;
   /**
    * Порог расстояния в пикселях для активации свайпа.
    * @default 5
    */
-  slideThreshold?: number;
+  slideThreshold?: number | undefined;
   /**
    * Блокировать click-события после распознавания свайпа.
    */
-  noSlideClick?: boolean;
+  noSlideClick?: boolean | undefined;
   /**
    * Останавливать всплытие событий.
    */
-  stopPropagation?: boolean;
+  stopPropagation?: boolean | undefined;
   /**
    * Обработчик входа курсора в область.
    */
-  onEnter?: HoverHandler;
+  onEnter?: HoverHandler | undefined;
   /**
    * Обработчик выхода курсора из области.
    */
-  onLeave?: HoverHandler;
+  onLeave?: HoverHandler | undefined;
   /**
    * Общий обработчик начала взаимодействия.
    */
-  onStart?: CustomTouchEventHandler;
+  onStart?: CustomTouchEventHandler | undefined;
   /**
    * Обработчик начала горизонтального перемещения.
    */
-  onStartX?: CustomTouchEventHandler;
+  onStartX?: CustomTouchEventHandler | undefined;
   /**
    * Обработчик начала вертикального перемещения.
    */
-  onStartY?: CustomTouchEventHandler;
+  onStartY?: CustomTouchEventHandler | undefined;
   /**
    * Общий обработчик перемещения.
    */
-  onMove?: CustomTouchEventHandler;
+  onMove?: CustomTouchEventHandler | undefined;
   /**
    * Обработчик горизонтального перемещения.
    */
-  onMoveX?: CustomTouchEventHandler;
+  onMoveX?: CustomTouchEventHandler | undefined;
   /**
    * Обработчик вертикального перемещения.
    */
-  onMoveY?: CustomTouchEventHandler;
+  onMoveY?: CustomTouchEventHandler | undefined;
   /**
    * Общий обработчик завершения взаимодействия.
    */
-  onEnd?: CustomTouchEventHandler;
+  onEnd?: CustomTouchEventHandler | undefined;
   /**
    * Обработчик завершения горизонтального свайпа.
    */
-  onEndX?: CustomTouchEventHandler;
+  onEndX?: CustomTouchEventHandler | undefined;
   /**
    * Обработчик завершения вертикального свайпа.
    */
-  onEndY?: CustomTouchEventHandler;
+  onEndY?: CustomTouchEventHandler | undefined;
 }
 
 export interface Gesture {

package/src/components/Typography/Caption/Caption.tsx

@@ -33,7 +33,7 @@ export interface CaptionProps extends TypographyProps, HasCaps {
   /**
    * Уровень заголовка (от 1 до 3).
    */
-  level?: '1' | '2' | '3';
+  level?: '1' | '2' | '3' | undefined;
 }
 
 /**

package/src/components/Typography/DisplayTitle/DisplayTitle.tsx

@@ -21,7 +21,7 @@ export interface DisplayTitleProps extends TypographyProps {
   /**
    * Уровень заголовка (от 1 до 4).
    */
-  level?: '1' | '2' | '3' | '4';
+  level?: '1' | '2' | '3' | '4' | undefined;
 }
 
 /**

package/src/components/Typography/EllipsisText/EllipsisText.tsx

@@ -17,18 +17,18 @@ export interface EllipsisTextProps
    * Используйте в случаях, когда у контейнера ширина зависит от размера контента,
    * другими словами, когда ширина не ограничена.
    */
-  maxWidth?: number;
+  maxWidth?: number | undefined;
   /**
    * Максимальное количество видимых строк.
    *
    * > При `maxLines > 1` используется свойство line-clamp, которое поддерживается не всеми версиями браузеров. Используйте с осторожностью
    * > @see [line-clamp](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).
    */
-  maxLines?: number;
+  maxLines?: number | undefined;
   /**
    * Отключает отображение нативного тултипа с полным текстом.
    */
-  disableNativeTitle?: boolean;
+  disableNativeTitle?: boolean | undefined;
 }
 
 /** Компонент ограничивает текстовый контент, убирая его в многоточие.

package/src/components/Typography/Headline/Headline.tsx

@@ -19,7 +19,7 @@ export interface HeadlineProps extends TypographyProps {
   /**
    * Уровень заголовка (от 1 до 2).
    */
-  level?: '1' | '2';
+  level?: '1' | '2' | undefined;
 }
 
 /**

package/src/components/Typography/Title/Title.tsx

@@ -20,7 +20,7 @@ export interface TitleProps extends TypographyProps {
   /**
    * Уровень заголовка (от 1 до 3).
    */
-  level?: '1' | '2' | '3';
+  level?: '1' | '2' | '3' | undefined;
 }
 
 /**

package/src/components/Typography/Typography.tsx

@@ -28,7 +28,7 @@ export interface HasCaps {
   /**
    * Отображение текста в верхнем регистре.
    */
-  caps?: boolean;
+  caps?: boolean | undefined;
 }
 
 export interface TypographyProps
@@ -38,25 +38,25 @@ export interface TypographyProps
   /**
    * Задаёт начертание шрифта, отличное от стандартного.
    */
-  weight?: '1' | '2' | '3';
+  weight?: '1' | '2' | '3' | undefined;
   /**
    * Включает акцентный тип начертания шрифта.
    * Используются токены fontWeightAccent[1, 2, 3]
    * Используется только вместе с `weight`.
    */
-  useAccentWeight?: boolean;
+  useAccentWeight?: boolean | undefined;
   /**
    * Убирает внешние отступы.
    */
-  normalize?: boolean;
+  normalize?: boolean | undefined;
   /**
    * Делает блок инлайновым.
    */
-  inline?: boolean;
+  inline?: boolean | undefined;
   /**
    * Выравнивание текста. Не имеет эффекта при inline={true}.
    */
-  align?: 'start' | 'center' | 'end';
+  align?: 'start' | 'center' | 'end' | undefined;
 }
 
 export const Typography = ({

package/src/components/UnstyledTextField/UnstyledTextField.tsx

@@ -12,7 +12,7 @@ export interface UnstyledTextFieldBaseProps {
   /**
    * По умолчанию отключено во избежание проблем из-за очередности загрузки стилей.
    */
-  noPadding?: boolean;
+  noPadding?: boolean | undefined;
 }
 
 export interface UnstyledTextFieldAsInputProps

package/src/components/UsersStack/UsersStack.tsx

@@ -40,34 +40,34 @@ export type UsersStackPhoto = {
   /**
    * Функция для рендера обертки над фотографией.
    */
-  renderWrapper?: (props: UsersStackRenderWrapperProps) => React.ReactElement;
+  renderWrapper?: ((props: UsersStackRenderWrapperProps) => React.ReactElement) | undefined;
 };
 
 export interface UsersStackProps extends HTMLAttributesWithRootRef<HTMLDivElement> {
   /**
    * Массив ссылок на фотографии либо массив структур типа `UsersStackPhoto`.
    */
-  photos?: string[] | UsersStackPhoto[];
+  photos?: string[] | UsersStackPhoto[] | undefined;
   /**
    * Размер аватарок.
    */
-  size?: 's' | 'm' | 'l';
+  size?: 's' | 'm' | 'l' | undefined;
   /**
    * Количество аватарок, которые будут показаны.
    * Если в массиве `photos` больше элементов и не используется размер `s`, то будет показано количество остальных элементов.
    */
-  visibleCount?: number;
+  visibleCount?: number | undefined;
   /**
    * Число, которое будет указано в счетчике.
    * По умолчанию высчитывается по формуле `photos.length - visibleCount`.
    * Если число больше 99, то счетчик скроется.
    */
-  count?: number;
+  count?: number | undefined;
   /**
    * Определяет положение аватаров
    * Режим `block-start` рекомендуется использовать с размером `m`.
    */
-  avatarsPosition?: 'inline-start' | 'block-start' | 'inline-end';
+  avatarsPosition?: 'inline-start' | 'block-start' | 'inline-end' | undefined;
 }
 
 interface PathElementProps extends React.SVGAttributes<SVGElement> {

package/src/components/View/View.module.css

@@ -81,9 +81,7 @@
 }
 
 .animated .panel,
-.animated .header,
-.swipingBack .panel,
-.swipingBack .header {
+.swipingBack .panel {
   pointer-events: none;
 }
 

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

@@ -1 +1 @@
-{"version":3,"sources":["./View.module.css"],"names":["host","animated","swipingBack","panelOverlay","panelPrev","panelNext","panelActive","panelSwipeBackNext","panelSwipeBackSuccess","panelSwipeBackFailed","panels","panelIn","panel","header","ios","panelSwipeBackPrev","noMotion"],"mappings":"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","file":"View.module.css.d.ts","sourceRoot":""}
+{"version":3,"sources":["./View.module.css"],"names":["host","animated","swipingBack","panelOverlay","panelPrev","panelNext","panelActive","panelSwipeBackNext","panelSwipeBackSuccess","panelSwipeBackFailed","panels","panelIn","panel","ios","panelSwipeBackPrev","noMotion"],"mappings":"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","file":"View.module.css.d.ts","sourceRoot":""}

package/src/components/View/View.tsx

@@ -38,21 +38,21 @@ export interface ViewProps extends HTMLAttributesWithRootRef<HTMLElement>, NavId
   /**
    * Обработчик свайпа назад.
    */
-  onSwipeBack?: () => void;
+  onSwipeBack?: (() => void) | undefined;
   /**
    * Обработчик начала анимации свайпа назад.
    *
    * Чтобы остановить свайп назад, возвращайте `"prevent"`.
    */
-  onSwipeBackStart?: (activePanel: string | null) => void | 'prevent';
+  onSwipeBackStart?: ((activePanel: string | null) => void | 'prevent') | undefined;
   /**
    * Обработчик завершения анимации отмененного пользователем свайпа.
    */
-  onSwipeBackCancel?: () => void;
+  onSwipeBackCancel?: (() => void) | undefined;
   /**
    * Массив из id панелей в порядке открытия.
    */
-  history?: string[];
+  history?: string[] | undefined;
   /**
    * Коллекция Panel. У каждой Panel должен быть уникальный `id`.
    */

package/src/components/View/ViewInfinite.tsx

@@ -47,39 +47,39 @@ export interface ViewInfiniteProps
   /**
    * Обработчик, который вызывается при завершении анимации смены активной панели.
    */
-  onTransition?: (params: TransitionParams & { isBack: boolean }) => void;
+  onTransition?: ((params: TransitionParams & { isBack: boolean }) => void) | undefined;
   /**
    * Обработчик свайпа назад.
    */
-  onSwipeBack?: () => void;
+  onSwipeBack?: (() => void) | undefined;
   /**
    * Обработчик начала анимации свайпа назад.
    */
-  onSwipeBackStart?: (activePanel: string | null) => void | 'prevent';
+  onSwipeBackStart?: ((activePanel: string | null) => void | 'prevent') | undefined;
   /**
    * Обработчик завершения анимации отмененного пользователем свайпа.
    */
-  onSwipeBackCancel?: () => void;
+  onSwipeBackCancel?: (() => void) | undefined;
   /**
    * Массив из id панелей в порядке открытия.
    */
-  history?: string[];
+  history?: string[] | undefined;
   /**
    * Функция проверки перехода назад.
    */
-  isBackCheck?: (params: TransitionParams) => boolean;
+  isBackCheck?: ((params: TransitionParams) => boolean) | undefined;
   /**
    * @ignore
    */
-  splitCol?: SplitColContextProps;
+  splitCol?: SplitColContextProps | undefined;
   /**
    * @ignore
    */
-  configProvider?: ConfigProviderContextInterface;
+  configProvider?: ConfigProviderContextInterface | undefined;
   /**
    * @ignore
    */
-  scroll?: ScrollContextInterface;
+  scroll?: ScrollContextInterface | undefined;
 }
 
 /* eslint-disable jsdoc/require-jsdoc */
@@ -88,11 +88,11 @@ export interface ViewInfiniteState {
 
   visiblePanels: Array<string | null>;
   activePanel: string | null;
-  isBack?: boolean;
+  isBack?: boolean | undefined;
   prevPanel: string | null;
   nextPanel: string | null;
 
-  swipingBack?: boolean;
+  swipingBack?: boolean | undefined;
   swipeBackStartX: number;
   swipeBackShift: number;
   swipeBackNextPanel: string | null;

package/src/components/WriteBar/WriteBar.tsx

@@ -45,44 +45,50 @@ export interface WriteBarProps
   /**
    * @deprecated Since 7.9.0. Вместо этого используйте `slotProps={ textArea: { getRootRef: ... } }`.
    */
-  getRef?: React.Ref<HTMLTextAreaElement>;
+  getRef?: React.Ref<HTMLTextAreaElement> | undefined;
   /**
    * Свойства, которые можно прокинуть внутрь компонента:
    * - `root`: свойства для прокидывания в корень компонента;
    * - `textArea`: свойства для прокидывания в поле ввода.
    */
-  slotProps?: {
-    root?: Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> &
-      HasRootRef<HTMLDivElement> &
-      HasDataAttribute;
-    textArea?: React.TextareaHTMLAttributes<HTMLTextAreaElement> &
-      HasRootRef<HTMLTextAreaElement> &
-      HasDataAttribute;
-  };
+  slotProps?:
+    | {
+        root?:
+          | (Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> &
+              HasRootRef<HTMLDivElement> &
+              HasDataAttribute)
+          | undefined;
+        textArea?:
+          | (React.TextareaHTMLAttributes<HTMLTextAreaElement> &
+              HasRootRef<HTMLTextAreaElement> &
+              HasDataAttribute)
+          | undefined;
+      }
+    | undefined;
   /**
    * Содержимое, отображаемое слева от поля ввода.
    */
-  before?: React.ReactNode;
+  before?: React.ReactNode | undefined;
   /**
    * Содержимое, отображаемое поверх поля ввода (актуально для iOS).
    */
-  inlineAfter?: React.ReactNode;
+  inlineAfter?: React.ReactNode | undefined;
   /**
    * Содержимое, отображаемое справа от поля ввода.
    */
-  after?: React.ReactNode;
+  after?: React.ReactNode | undefined;
   /**
    * Вызывается при смене высоты поля ввода.
    */
-  onHeightChange?: VoidFunction;
+  onHeightChange?: VoidFunction | undefined;
   /**
    * Добавляет тень вокруг поля ввода.
    */
-  shadow?: boolean;
+  shadow?: boolean | undefined;
   /**
    * @deprecated Неиспользуемое свойство.
    */
-  children?: never;
+  children?: never | undefined;
 }
 
 const WriteBarTypography = (props: TypographyProps) => {

package/src/components/WriteBarIcon/WriteBarIcon.tsx

@@ -38,15 +38,15 @@ export interface WriteBarIconProps extends React.ButtonHTMLAttributes<HTMLButton
    * - `send` – иконка отправки, текст по умолчанию — "Отправить";
    * - `done` – иконка отправки в режиме редактирования, текст по умолчанию — "Готово".
    */
-  mode?: 'attach' | 'send' | 'done';
+  mode?: 'attach' | 'send' | 'done' | undefined;
   /**
    * Значение счётчика для кнопки. Например, для количества прикреплённых файлов.
    */
-  count?: number;
+  count?: number | undefined;
   /**
    * Текст кнопки. Необходим для ассистивных технологий.
    */
-  label?: string;
+  label?: string | undefined;
 }
 
 const warn = warnOnce('WriteBarIcon');

package/src/helpers/math.ts

@@ -40,7 +40,7 @@ export function rescale(
   value: number,
   from: [number, number],
   to: [number, number],
-  options: { step?: number } = {},
+  options: { step?: number | undefined } = {},
 ): number {
   const scaled = ((value - from[0]) / (from[1] - from[0])) * (to[1] - to[0]) + to[0];
   return decimatedClamp(scaled, to[0], to[1], options.step);

package/src/hooks/useAdaptivityWithJSMediaQueries.ts

@@ -53,7 +53,9 @@ export const isSizeXRegularFallback = (
     ? viewWidth >= ViewWidth.SMALL_TABLET
     : legacySizeX === 'regular';
 
-export interface UseAdaptivityWithJSMediaQueries extends Required<BaseAdaptivityProps> {
+type RequiredNonNullable<T> = { [P in keyof T]-?: NonNullable<T[P]> };
+
+export interface UseAdaptivityWithJSMediaQueries extends RequiredNonNullable<BaseAdaptivityProps> {
   isDesktop: boolean;
 }
 

package/src/hooks/useAutoDetectColorScheme.ts

@@ -1,39 +1,17 @@
-import * as React from 'react';
-import { noop } from '@vkontakte/vkjs';
 import { ColorScheme, type ColorSchemeType } from '../lib/colorScheme';
-import { useDOM } from '../lib/dom';
-import { useIsomorphicLayoutEffect } from '../lib/useIsomorphicLayoutEffect';
+import { useMediaQueryMatches } from './useMediaQueryMatch';
 
 /**
  * @private
  */
 export const useAutoDetectColorScheme = (colorSchemeProp?: ColorSchemeType): ColorSchemeType => {
-  const { window } = useDOM();
+  const isDark = useMediaQueryMatches('(prefers-color-scheme: dark)', {
+    disable: colorSchemeProp !== undefined,
+  });
 
-  const [colorScheme, setColorScheme] = React.useState<ColorSchemeType>(
-    colorSchemeProp || ColorScheme.LIGHT,
-  );
+  if (colorSchemeProp) {
+    return colorSchemeProp;
+  }
 
-  useIsomorphicLayoutEffect(() => {
-    if (colorSchemeProp) {
-      setColorScheme(colorSchemeProp);
-      return noop;
-    }
-
-    const mediaQuery = window ? window.matchMedia('(prefers-color-scheme: dark)') : undefined;
-
-    if (!mediaQuery) {
-      return noop;
-    }
-
-    const check = (event: MediaQueryList | MediaQueryListEvent) => {
-      // eslint-disable-next-line no-restricted-properties
-      setColorScheme(event.matches ? ColorScheme.DARK : ColorScheme.LIGHT);
-    };
-    check(mediaQuery);
-    mediaQuery.addEventListener('change', check);
-    return () => mediaQuery.removeEventListener('change', check);
-  }, [window, colorSchemeProp]);
-
-  return colorScheme;
+  return isDark ? ColorScheme.DARK : ColorScheme.LIGHT;
 };

package/src/hooks/useCalendar.ts

@@ -16,7 +16,7 @@ export interface UseCalendarDependencies
     | 'disableFuture'
     | 'disablePast'
   > {
-  value?: Array<Date | null> | Date | null;
+  value?: Array<Date | null> | Date | null | undefined;
 }
 
 export function useCalendar({
@@ -71,7 +71,7 @@ export function useCalendar({
   );
 
   const isDayDisabled = React.useCallback(
-    (day: Date, withTime?: boolean) => {
+    (day: Date, withTime?: boolean): boolean => {
       const now = new Date();
       if (shouldDisableDate) {
         return shouldDisableDate(day);