@vkontakte/vkui 7.2.1 → 7.3.0

package/src/components/Popover/Popover.tsx

@@ -80,10 +80,10 @@ export interface PopoverProps
    * У `content`:
    * - _background_
    * - _border-radius_
-   * - _box-shadow_
+   * - _box-shadow_.
    *
    * У `arrow`:
-   * - _color_
+   * - _color_.
    *
    * Используется в случае, если необходимо стилизовать по своему. Для `arrow` _color_ можно
    * определить через в `arrowProps.iconClassName` или `arrowProps.iconStyle`.
@@ -101,16 +101,19 @@ export interface PopoverProps
    * 1. Иконка по умолчанию должна быть направлена вверх (a.k.a `IconUp`).
    * 2. Чтобы избежать проблемы с пространством между стрелкой и контентом на некоторых экранах,
    *    растяните кривую по высоте на `1px` и увеличьте на этот размер `height` и `viewBox` SVG.
-   *    (см. https://github.com/VKCOM/VKUI/pull/4496).
+   *    (смотри https://github.com/VKCOM/VKUI/pull/4496).
    * 3. Передайте высоту иконки в параметр `arrowHeight`. В значении высоты можно исключить хак с `1px` из п.2.
    * 4. Убедитесь, что компонент принимает все валидные для SVG параметры.
    * 5. Убедитесь, что SVG и её элементы наследует цвет через `fill="currentColor"`.
    */
   ArrowIcon?: FloatingArrowPropsPrivate['Icon'];
   /**
-   * Используется для того, чтобы не удалять поповер из DOM дерева при скрытии.
+   * Используется для того, чтобы не удалять всплывающий элемент из DOM дерева при скрытии.
    */
   keepMounted?: boolean;
+  /**
+   * Управление автоматическим фокусом при открытии всплывающего элемента.
+   */
   autoFocus?: FocusTrapProps['autoFocus'];
 }
 

package/src/components/Popover/usePopover.tsx

@@ -21,8 +21,17 @@ export type UsePopoverProps = Omit<PopoverProps, 'children'> & {
 };
 
 export type UsePopoverResult<ElementType extends HTMLElement = HTMLElement> = {
+  /**
+   * Реф на якорный элемент.
+   */
   anchorRef: Ref<ElementType>;
+  /**
+   * Свойства для якорного элемента, содержит необходимые обработчики.
+   */
   anchorProps: ReferenceProps<ElementType>;
+  /**
+   * Отрендеренный компонент всплывающего элемента.
+   */
   popover: React.ReactNode | null;
 };
 

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

@@ -0,0 +1 @@
+{"version":3,"sources":["./Popper.module.css"],"names":["host"],"mappings":"AAAA;AAAA,E,aAaAA,M,WAbA;AAAA;AAAA","file":"Popper.module.css.d.ts","sourceRoot":""}

package/src/components/Popper/Popper.tsx

@@ -73,7 +73,7 @@ export interface PopperCommonProps
    * 1. Иконка по умолчанию должна быть направлена вверх (a.k.a `IconUp`).
    * 2. Чтобы избежать проблемы с пространством между стрелкой и контентом на некоторых экранах,
    *    растяните кривую по высоте на `1px` и увеличьте на этот размер `height` и `viewBox` SVG.
-   *    (см. https://github.com/VKCOM/VKUI/pull/4496).
+   *    (смотри https://github.com/VKCOM/VKUI/pull/4496).
    * 3. Передайте высоту иконки в параметр `arrowHeight`. В значении высоты можно исключить хак с `1px` из п.2.
    * 4. Убедитесь, что компонент принимает все валидные для SVG параметры.
    * 5. Убедитесь, что SVG и её элементы наследует цвет через `fill="currentColor"`.
@@ -86,6 +86,9 @@ export interface PopperCommonProps
 }
 
 export interface PopperProps extends PopperCommonProps {
+  /**
+   * Ref на якорный элемент.
+   */
   targetRef: React.RefObject<HTMLElement | null> | VirtualElement;
 }
 

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

@@ -0,0 +1 @@
+{"version":3,"sources":["./Progress.module.css"],"names":["host","trackDisable","appearanceAccent","appearancePositive","appearanceNegative"],"mappings":"AAAA;AAAA,E,aAAAA,M,WAAA;AAAA,E,aASAC,c,WATA;AAAA,E,aAaAD,M,WAbA;AAAA,E,aAuBAE,kB,WAvBA;AAAA,E,aA2BAC,oB,WA3BA;AAAA,E,aA+BAC,oB,WA/BA;AAAA;AAAA","file":"Progress.module.css.d.ts","sourceRoot":""}

package/src/components/Progress/Progress.tsx

@@ -22,16 +22,19 @@ function progressCustomHeightStyle(height: number | undefined): React.CSSPropert
 
 export interface ProgressProps extends HTMLAttributesWithRootRef<HTMLDivElement> {
   /**
-   * Стиль отображения прогрессбара
+   * Стиль отображения прогрессбара.
+   */
+  appearance?: 'accent' | 'positive' | 'negative' | `var(--${string})` | `#${string}`;
+  /**
+   * Значение прогресса.
    */
-  appearance?: 'accent' | 'positive' | 'negative' | `--${string}` | `#${string}`;
   value?: number;
   /**
    * Высота элемента.
    */
   height?: number;
   /**
-   * Сделать прогрессбар прозрачным
+   * Сделать прогрессбар прозрачным.
    */
   trackDisable?: boolean;
 }

package/src/components/PullToRefresh/PullToRefresh.module.css

@@ -29,7 +29,7 @@
   color: var(--vkui--color_icon_accent);
   background: var(--vkui--color_background_modal);
   border-radius: 50%;
-  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
+  box-shadow: 0 2px 6px rgb(0, 0, 0, 0.2);
   opacity: 0;
   transition:
     transform 300ms cubic-bezier(0.1, 0, 0.25, 1),

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

@@ -0,0 +1 @@
+{"version":3,"sources":["./PullToRefresh.module.css"],"names":["host","refreshing","controls","ios","spinner","watching","spinnerSelf","spinnerPath","spinnerOn","content"],"mappings":"AAAA;AAAA,E,aAAAA,M,WAAA;AAAA,E,aAMAC,Y,WANA;AAAA,E,aAWAC,U,WAXA;AAAA,E,aAgBAF,M,WAhBA;AAAA,E,aAgBUG,K,WAhBV;AAAA,E,aAgBgBD,U,WAhBhB;AAAA,E,aAoBAE,S,WApBA;AAAA,E,aAsCAD,K,WAtCA;AAAA,E,aAsCKC,S,WAtCL;AAAA,E,aA6CAC,U,WA7CA;AAAA,E,aA6CUD,S,WA7CV;AAAA,E,aAiDAE,a,WAjDA;AAAA,E,aAqDAH,K,WArDA;AAAA,E,aAqDIF,Y,WArDJ;AAAA,E,aAqDgBK,a,WArDhB;AAAA,E,aAyDAC,a,WAzDA;AAAA,E,aA+DAF,U,WA/DA;AAAA,E,aA+DUE,a,WA/DV;AAAA,E,aAgEAN,Y,WAhEA;AAAA,E,aAgEYM,a,WAhEZ;AAAA,E,aAoEAC,W,WApEA;AAAA,E,aAoEWD,a,WApEX;AAAA,E,aAwEAE,S,WAxEA;AAAA,E,aAgFAJ,U,WAhFA;AAAA,E,aAgFUI,S,WAhFV;AAAA;AAAA","file":"PullToRefresh.module.css.d.ts","sourceRoot":""}

package/src/components/PullToRefresh/PullToRefresh.tsx

@@ -33,11 +33,11 @@ function cancelEvent(event: CustomTouchEvent) {
 
 export interface PullToRefreshProps extends DOMProps, TouchProps, HasChildren {
   /**
-   * Будет вызвана для обновления контента (прим.: функция должна быть мемоизированным коллбэком)
+   * Будет вызвана для обновления контента (прим.: функция должна быть мемоизированным обработчиком).
    */
   onRefresh: AnyFunction;
   /**
-   * Определяет, выполняется ли обновление. Для скрытия спиннера после получения контента необходимо передать `false`
+   * Определяет, выполняется ли обновление. Для скрытия спиннера после получения контента необходимо передать `false`.
    */
   isFetching?: boolean;
   /** @ignore */

package/src/components/PullToRefresh/PullToRefreshSpinner.tsx

@@ -1,3 +1,5 @@
+/* eslint-disable jsdoc/require-jsdoc */
+
 import { classNames } from '@vkontakte/vkjs';
 import type { HTMLAttributesWithRootRef } from '../../types';
 import { RootComponent } from '../RootComponent/RootComponent';

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

@@ -0,0 +1 @@
+{"version":3,"sources":["./Radio.module.css"],"names":["host"],"mappings":"AAAA;AAAA,E,aAKiCA,M,WALjC;AAAA;AAAA","file":"Radio.module.css.d.ts","sourceRoot":""}

package/src/components/Radio/Radio.tsx

@@ -15,10 +15,16 @@ export interface RadioProps
       TappableProps,
       'hoverMode' | 'activeMode' | 'hasHover' | 'hasActive' | 'focusVisibleMode'
     > {
+  /**
+   * Дополнительное описание под основным текстом.
+   */
   description?: React.ReactNode;
+  /**
+   * Элемент после основного текста.
+   */
   titleAfter?: React.ReactNode;
   /**
-   * Позволяет передавать data-* аттрибуты элементу label
+   * Позволяет передавать data-* аттрибуты элементу label.
    **/
   labelProps?: HasDataAttribute;
 }

package/src/components/Radio/RadioInput/RadioInput.module.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"sources":["./RadioInput.module.css"],"names":["icon","input","pin"],"mappings":"AAAA;AAAA,E,aAAAA,M,WAAA;AAAA,E,aAOAC,O,WAPA;AAAA,E,aAOiBD,M,WAPjB;AAAA,E,aAWAA,M,WAXA;AAAA,E,aAWME,K,WAXN;AAAA,E,aAiBAD,O,WAjBA;AAAA,E,aAiBiBD,M,WAjBjB;AAAA,E,aAiBuBE,K,WAjBvB;AAAA;AAAA","file":"RadioInput.module.css.d.ts","sourceRoot":""}

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

@@ -0,0 +1 @@
+{"version":3,"sources":["./RadioGroup.module.css"],"names":["modeHorizontal","host"],"mappings":"AAAA;AAAA,E,aAAAA,gB,WAAA;AAAA,E,aAS+BC,M,WAT/B;AAAA;AAAA","file":"RadioGroup.module.css.d.ts","sourceRoot":""}

package/src/components/RadioGroup/RadioGroup.tsx

@@ -5,6 +5,9 @@ import { RootComponent } from '../RootComponent/RootComponent';
 import styles from './RadioGroup.module.css';
 
 export interface RadioGroupProps extends HTMLAttributesWithRootRef<HTMLDivElement> {
+  /**
+   * Режим расположения элементов.
+   */
   mode?: 'vertical' | 'horizontal';
 }
 

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

@@ -0,0 +1 @@
+{"version":3,"sources":["./Removable.module.css"],"names":["content","withPadding","rtl","action","alignStart","disabled","ios","remove","removeIn","toggle","toggleIn","indent","offset"],"mappings":"AAAA;AAAA,E,aAAAA,S,WAAA;AAAA,E,aAeAC,a,WAfA;AAAA,E,aAmBAC,K,WAnBA;AAAA,E,aAuBAC,Q,WAvBA;AAAA,E,aA+BAC,Y,WA/BA;AAAA,E,aA+BYD,Q,WA/BZ;AAAA,E,aAmCAE,U,WAnCA;AAAA,E,aA0CAC,K,WA1CA;AAAA,E,aA8CAC,Q,WA9CA;AAAA,E,aA6DAC,U,WA7DA;AAAA,E,aAqEAC,Q,WArEA;AAAA,E,aA8EAC,U,WA9EA;AAAA,E,aAyFAA,U,WAzFA;AAAA,E,aAiGAA,U,WAjGA;AAAA,E,aA0GAJ,K,WA1GA;AAAA,E,aA0GKN,S,WA1GL;AAAA,E,aA+GAW,Q,WA/GA;AAAA,E,aA+GQR,Q,WA/GR;AAAA,E,aA0H0CH,S,WA1H1C;AAAA,E,aA4HiDA,S,WA5HjD;AAAA,E,aAiIAY,Q,WAjIA;AAAA,E,aAsIoFA,Q,WAtIpF;AAAA,E,aAwI2FA,Q,WAxI3F;AAAA,E,aAkJIA,Q,WAlJJ;AAAA,E,aAqJIA,Q,WArJJ;AAAA,E,aA8JQA,Q,WA9JR;AAAA,E,aAiKQA,Q,WAjKR;AAAA;AAAA","file":"Removable.module.css.d.ts","sourceRoot":""}

package/src/components/Removable/Removable.tsx

@@ -21,27 +21,28 @@ export interface RemovableProps {
    */
   removePlaceholder?: React.ReactNode;
   /**
-   * Коллбэк срабатывает при клике на контрол удаления.
+   * Обработчик, срабатывающий при нажатии на контрол удаления.
    */
   onRemove?: (e: React.MouseEvent, rootEl?: HTMLElement | null) => void;
   /**
-   * Передает атрибут `data-testid` для кнопки, которая активирует кнопку удаления (iOS only)
+   * Передает атрибут `data-testid` для кнопки, которая активирует кнопку удаления (iOS only).
    */
   toggleButtonTestId?: string;
   /**
-   * Передает атрибут `data-testid` для кнопки удаления
+   * Передает атрибут `data-testid` для кнопки удаления.
    */
   removeButtonTestId?: string;
   /**
-   * Ячейка превращается в неактивную
+   * Блокировка взаимодействия с компонентом.
    */
   disabled?: boolean;
 }
-
+/* eslint-disable jsdoc/require-jsdoc */
 interface RemovableIosOwnProps extends RemovableProps {
   removePlaceholderString?: string;
   children?: React.ReactNode | ((renderProps: RemovableIosRenderProps) => React.ReactNode);
 }
+/* eslint-enable jsdoc/require-jsdoc */
 
 /**
  * @see https://vkcom.github.io/VKUI/#/RemovableIos
@@ -137,8 +138,8 @@ const RemovableIos = ({
 
 interface RemovableIosRenderProps {
   /**
-   * Показывает состояние Removable на платформе iOS при клике на иконку удаления.
-   * Для имитации поведения на iOS при клике на иконку удаления самого удаление не происходит,
+   * Показывает состояние Removable на платформе iOS при нажатии на иконку удаления.
+   * Для имитации поведения на iOS при нажатии на иконку удаления самого удаление не происходит,
    * контент сдвигается влево и справа выезжает настоящая кнопка "Удалить".
    * Когда контент сдвинут `isRemoving = true`.
    */
@@ -158,9 +159,12 @@ interface RemovableOwnProps
    */
   indent?: boolean;
   /**
-   * Убирает базовые отступы для базовой платформы
+   * Убирает базовые отступы для базовой платформы.
    */
   noPadding?: boolean;
+  /**
+   * Содержимое. Можно передать функцию для отрисовки.
+   */
   children?: React.ReactNode | ((renderProps: RemovableIosRenderProps) => React.ReactNode);
 }
 

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

@@ -0,0 +1 @@
+{"version":3,"sources":["./RichCell.module.css"],"names":["host","sizeYCompact","sizeYNone","before","in","withAfter","alignAfterStart","contentAlignStart","contentAlignEnd","content","contentBefore","contentAlignCenter","contentAfter","alignBeforeStart","alignBeforeCenter","alignAfterCenter","alignBeforeEnd","alignAfterEnd","afterChildren","afterCaption","overTitle","extraSubtitle","children","textEllipsis","subtitle","bottom","actions"],"mappings":"AAAA;AAAA,E,aAAAA,M,WAAA;AAAA,E,aAWAC,c,WAXA;AAAA,E,aAgBEC,W,WAhBF;AAAA,E,aAqBAC,Q,WArBA;AAAA,E,aAyBAC,I,WAzBA;AAAA,E,aAkCAJ,M,WAlCA;AAAA,E,aAkCKK,W,WAlCL;AAAA,E,aAkCoBC,iB,WAlCpB;AAAA,E,aAkCqCC,mB,WAlCrC;AAAA,E,aAkCwDH,I,WAlCxD;AAAA,E,aAsCAJ,M,WAtCA;AAAA,E,aAsCKK,W,WAtCL;AAAA,E,aAsCoBC,iB,WAtCpB;AAAA,E,aAsCqCE,iB,WAtCrC;AAAA,E,aAsCsDJ,I,WAtCtD;AAAA,E,aA0CAK,S,WA1CA;AAAA,E,aA+CAC,e,WA/CA;AAAA,E,aAsDAJ,iB,WAtDA;AAAA,E,aAsDgBC,mB,WAtDhB;AAAA,E,aAsDmCG,e,WAtDnC;AAAA,E,aA0DAJ,iB,WA1DA;AAAA,E,aA0DgBK,oB,WA1DhB;AAAA,E,aA0DoCD,e,WA1DpC;AAAA,E,aA8DAJ,iB,WA9DA;AAAA,E,aA8DgBE,iB,WA9DhB;AAAA,E,aA8DiCE,e,WA9DjC;AAAA,E,aAkEAE,c,WAlEA;AAAA,E,aA2EAC,kB,WA3EA;AAAA,E,aA2EkBV,Q,WA3ElB;AAAA,E,aA4EAG,iB,WA5EA;AAAA,E,aA4EiBM,c,WA5EjB;AAAA,E,aAgFAE,mB,WAhFA;AAAA,E,aAgFmBX,Q,WAhFnB;AAAA,E,aAiFAY,kB,WAjFA;AAAA,E,aAiFkBH,c,WAjFlB;AAAA,E,aAqFAI,gB,WArFA;AAAA,E,aAqFgBb,Q,WArFhB;AAAA,E,aAsFAc,e,WAtFA;AAAA,E,aAsFeL,c,WAtFf;AAAA,E,aA0FAM,e,WA1FA;AAAA,E,aA8FAC,c,WA9FA;AAAA,E,aAqGAlB,c,WArGA;AAAA,E,aAqGckB,c,WArGd;AAAA,E,aA2GEjB,W,WA3GF;AAAA,E,aA2GaiB,c,WA3Gb;AAAA,E,aAiHAC,W,WAjHA;AAAA,E,aAqHAC,e,WArHA;AAAA,E,aA0HAC,U,WA1HA;AAAA,E,aA8HAC,c,WA9HA;AAAA,E,aA8HcH,W,WA9Hd;AAAA,E,aA+HAG,c,WA/HA;AAAA,E,aA+HcD,U,WA/Hd;AAAA,E,aAgIAC,c,WAhIA;AAAA,E,aAgIcC,U,WAhId;AAAA,E,aAiIAD,c,WAjIA;AAAA,E,aAiIcF,e,WAjId;AAAA,E,aAwIAI,Q,WAxIA;AAAA,E,aA4IAC,S,WA5IA;AAAA,E,aAgJAJ,U,WAhJA;AAAA,E,aAiJAE,U,WAjJA;AAAA,E,aAkJAN,e,WAlJA;AAAA,E,aAuJAjB,c,WAvJA;AAAA,E,aAuJcqB,U,WAvJd;AAAA,E,aAwJArB,c,WAxJA;AAAA,E,aAwJcuB,U,WAxJd;AAAA,E,aAyJAvB,c,WAzJA;AAAA,E,aAyJciB,e,WAzJd;AAAA,E,aA+JEhB,W,WA/JF;AAAA,E,aA+JaoB,U,WA/Jb;AAAA,E,aAgKIpB,W,WAhKJ;AAAA,E,aAgKesB,U,WAhKf;AAAA,E,aAiKItB,W,WAjKJ;AAAA,E,aAiKegB,e,WAjKf;AAAA,E,aA4K+BlB,M,WA5K/B;AAAA,E,aAiLEE,W,WAjLF;AAAA;AAAA","file":"RichCell.module.css.d.ts","sourceRoot":""}

package/src/components/RichCell/RichCell.tsx

@@ -54,11 +54,11 @@ export interface RichCellProps extends TappableProps {
    * Кнопки-действия. Принимает [`Button`](https://vkcom.github.io/VKUI/#/Button) с параметрами:
    *
    * - `mode="primary" size="s"`
-   * - `mode="secondary" size="s"`
+   * - `mode="secondary" size="s"`.
    *
    * Для набора кнопок используйте [`ButtonGroup`](https://vkcom.github.io/VKUI/#/ButtonGroup) с параметрами:
    *
-   * - `mode="horizontal" gap="s" stretched`
+   * - `mode="horizontal" gap="s" stretched`.
    */
   actions?: React.ReactNode;
   /**
@@ -74,19 +74,19 @@ export interface RichCellProps extends TappableProps {
    */
   afterCaption?: React.ReactNode;
   /**
-   * Выравнивание before компонента по вертикали
+   * Выравнивание before компонента по вертикали.
    */
   beforeAlign?: Align;
   /**
-   * Выравнивание центрального контента по вертикали
+   * Выравнивание центрального контента по вертикали.
    */
   contentAlign?: Align;
   /**
-   * Выравнивание after компонента по вертикали
+   * Выравнивание after компонента по вертикали.
    */
   afterAlign?: Align;
   /**
-   * Убирает анимацию нажатия.
+   * Блокировка взаимодействия с компонентом. Убирает анимацию нажатия.
    */
   disabled?: boolean;
   /**

package/src/components/RichCell/RichCellIcon/RichCellIcon.module.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"sources":["./RichCellIcon.module.css"],"names":["host"],"mappings":"AAAA;AAAA,E,aAAAA,M,WAAA;AAAA;AAAA","file":"RichCellIcon.module.css.d.ts","sourceRoot":""}

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

@@ -0,0 +1 @@
+{"version":3,"sources":["./Root.module.css"],"names":["host","ios","transition","view","viewShowForward","viewHideBack","scrollCompensation","viewShowBack","viewHideForward"],"mappings":"AAAA;AAAA,E,aAAAA,M,WAAA;AAAA,E,aAUAC,K,WAVA;AAAA,E,aAgBAC,Y,WAhBA;AAAA,E,aAoBAC,M,WApBA;AAAA,E,aA0BAC,iB,WA1BA;AAAA,E,aA+BAC,c,WA/BA;AAAA,E,aAoCAH,Y,WApCA;AAAA,E,aAoCYC,M,WApCZ;AAAA,E,aA2CAG,oB,WA3CA;AAAA,E,aAoDAL,K,WApDA;AAAA,E,aAoDKM,c,WApDL;AAAA,E,aAqDAN,K,WArDA;AAAA,E,aAqDKO,iB,WArDL;AAAA,E,aAgEAP,K,WAhEA;AAAA,E,aAgEKM,c,WAhEL;AAAA,E,aAqEAN,K,WArEA;AAAA,E,aAqEKO,iB,WArEL;AAAA,E,aA2EER,M,WA3EF;AAAA,E,aA+EEC,K,WA/EF;AAAA;AAAA","file":"Root.module.css.d.ts","sourceRoot":""}

package/src/components/Root/Root.tsx

@@ -17,17 +17,28 @@ import { SplitColContext } from '../SplitCol/SplitColContext';
 import styles from './Root.module.css';
 
 export interface RootProps extends HTMLAttributesWithRootRef<HTMLDivElement>, NavIdProps {
+  /**
+   * `id` активной `View`.
+   */
   activeView: string;
+  /**
+   * Обработчик, который вызывается при завершении анимации смены активной `View`.
+   */
   onTransition?: (params: { isBack: boolean; from: string; to: string }) => void;
+  /**
+   * Коллекция `View`. У каждой `View` должен быть `id`.
+   */
   children: React.ReactElement | Iterable<React.ReactElement>;
 }
 
+/* eslint-disable jsdoc/require-jsdoc */
 export interface RootState {
   activeView: string;
   transition: boolean;
   isBack?: boolean;
   prevView?: string;
 }
+/* eslint-enable jsdoc/require-jsdoc */
 
 const warn = warnOnce('Root');
 

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

@@ -0,0 +1 @@
+{"version":3,"sources":["./RootComponent.module.css"],"names":["host","hidden"],"mappings":"AAAA;AAAA,E,aAAAA,M,WAAA;AAAA,E,aACAC,Q,WADA;AAAA,E,aAMAD,M,WANA;AAAA;AAAA","file":"RootComponent.module.css.d.ts","sourceRoot":""}

package/src/components/RootComponent/RootComponent.tsx

@@ -8,8 +8,18 @@ export interface RootComponentProps<T>
   extends React.AllHTMLAttributes<T>,
     HasRootRef<T>,
     HasComponent {
-  baseClassName?: string | false;
-  baseStyle?: React.CSSProperties;
+  /**
+   * @deprecated Since 7.3.0.
+   *
+   * Свойство устарело и будет удалено в `v8`, используйте свойство `className`.
+   */
+  baseClassName?: string | false; // TODO:  Перенести свойство в RootComponentInternalProps, в непубличное API
+  /**
+   * @deprecated Since 7.3.0.
+   *
+   * Свойство устарело и будет удалено в `v8`, используйте свойство `style`.
+   */
+  baseStyle?: React.CSSProperties; // TODO:  Перенести свойство в RootComponentInternalProps, в непубличное API
 }
 
 /**

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

@@ -0,0 +1 @@
+{"version":3,"sources":["./ScreenSpinner.module.css"],"names":["host","hasLabel","modeShadow","modeOverlay","label","spinner","spinnerTransition","stateDone","stateError","stateCustom","iconSlot","icon","stateCancelable"],"mappings":"AAAA;AAAA,E,aAAAA,M,WAAA;AAAA,E,aAWAC,U,WAXA;AAAA,E,aAqBAC,Y,WArBA;AAAA,E,aA2BAC,a,WA3BA;AAAA,E,aAgCAC,O,WAhCA;AAAA,E,aAsCAD,a,WAtCA;AAAA,E,aAsCaC,O,WAtCb;AAAA,E,aA0CAC,S,WA1CA;AAAA,E,aA8CAC,mB,WA9CA;AAAA,E,aAkDAC,W,WAlDA;AAAA,E,aAkDWF,S,WAlDX;AAAA,E,aAmDAG,Y,WAnDA;AAAA,E,aAmDYH,S,WAnDZ;AAAA,E,aAoDAI,a,WApDA;AAAA,E,aAoDaJ,S,WApDb;AAAA,E,aAwDAK,U,WAxDA;AAAA,E,aAiEAC,M,WAjEA;AAAA,E,aA2EAC,iB,WA3EA;AAAA,E,aA2EiBD,M,WA3EjB;AAAA,E,aAgFAA,M,WAhFA;AAAA,E,aAqFAJ,W,WArFA;AAAA;AAAA","file":"ScreenSpinner.module.css.d.ts","sourceRoot":""}

package/src/components/ScreenSpinner/ScreenSpinner.tsx

@@ -1,6 +1,7 @@
 'use client';
 
 import * as React from 'react';
+import { defineComponentDisplayNames } from '../../lib/react/defineComponentDisplayNames';
 import { AppRootPortal } from '../AppRoot/AppRootPortal';
 import { useScrollLock } from '../AppRoot/ScrollContext';
 import { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';
@@ -44,13 +45,12 @@ export const ScreenSpinner: React.FC<ScreenSpinnerProps> & {
   );
 };
 
-ScreenSpinner.displayName = 'ScreenSpinner';
-
 ScreenSpinner.Container = ScreenSpinnerContainer;
-ScreenSpinner.Container.displayName = 'ScreenSpinner.Container';
-
 ScreenSpinner.Loader = ScreenSpinnerLoader;
-ScreenSpinner.Loader.displayName = 'ScreenSpinner.Loader';
-
 ScreenSpinner.SwapIcon = ScreenSpinnerSwapIcon;
-ScreenSpinner.SwapIcon.displayName = 'ScreenSpinner.SwapIcon';
+
+if (process.env.NODE_ENV !== 'production') {
+  defineComponentDisplayNames(ScreenSpinner.Container, 'ScreenSpinner.Container');
+  defineComponentDisplayNames(ScreenSpinner.Loader, 'ScreenSpinner.Loader');
+  defineComponentDisplayNames(ScreenSpinner.SwapIcon, 'ScreenSpinner.SwapIcon');
+}

package/src/components/ScreenSpinner/ScreenSpinnerContainer.tsx

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { classNames, hasReactNode } from '@vkontakte/vkjs';
 import type { HTMLAttributesWithRootRef } from '../../types';
 import { RootComponent } from '../RootComponent/RootComponent';
@@ -22,7 +21,7 @@ const modeClassNames = {
 type ScreenSpinnerContainerProps = HTMLAttributesWithRootRef<HTMLSpanElement> &
   Pick<ScreenSpinnerProps, 'state' | 'mode' | 'label' | 'customIcon'>;
 
-export const ScreenSpinnerContainer: React.FC<ScreenSpinnerContainerProps> = ({
+export const ScreenSpinnerContainer = ({
   state = 'loading',
   mode = 'shadow',
   customIcon,
@@ -51,5 +50,3 @@ export const ScreenSpinnerContainer: React.FC<ScreenSpinnerContainerProps> = ({
     </ScreenSpinnerContext.Provider>
   );
 };
-
-ScreenSpinnerContainer.displayName = 'ScreenSpinnerContainer';

package/src/components/ScreenSpinner/ScreenSpinnerLoader.tsx

@@ -7,10 +7,9 @@ import type { SpinnerProps } from '../Spinner/Spinner';
 import { ScreenSpinnerContext } from './context';
 import styles from './ScreenSpinner.module.css';
 
-export const ScreenSpinnerLoader: React.FC<Omit<SpinnerProps, 'size'>> = ({
-  children,
-  ...restProps
-}) => {
+type ScreenSpinnerLoaderProps = Omit<SpinnerProps, 'size'>;
+
+export const ScreenSpinnerLoader = ({ children, ...restProps }: ScreenSpinnerLoaderProps) => {
   const { label } = React.useContext(ScreenSpinnerContext);
   const a11yText = children ?? label;
   return (
@@ -24,5 +23,3 @@ export const ScreenSpinnerLoader: React.FC<Omit<SpinnerProps, 'size'>> = ({
     </Spinner>
   );
 };
-
-ScreenSpinnerLoader.displayName = 'ScreenSpinnerLoader';

package/src/components/ScreenSpinner/ScreenSpinnerSwapIcon.tsx

@@ -1,4 +1,5 @@
 'use client';
+/* eslint-disable jsdoc/require-jsdoc */
 
 import * as React from 'react';
 import { Icon24Cancel } from '@vkontakte/icons';
@@ -16,7 +17,7 @@ type ScreenSpinnerSwapIconProps = HTMLAttributesWithRootRef<HTMLElement> & {
   cancelLabel?: ScreenSpinnerProps['cancelLabel'];
 };
 
-const ScreenSpinnerCancelIcon: React.FC<ScreenSpinnerSwapIconProps> = ({
+const ScreenSpinnerCancelIcon = ({
   onKeyDown,
   'aria-label': ariaLabel = 'Отменить',
   ...restProps
@@ -41,9 +42,7 @@ const ScreenSpinnerCancelIcon: React.FC<ScreenSpinnerSwapIconProps> = ({
   );
 };
 
-ScreenSpinnerCancelIcon.displayName = 'ScreenSpinnerCancelIcon';
-
-export const ScreenSpinnerSwapIcon: React.FC<ScreenSpinnerSwapIconProps> = ({
+export const ScreenSpinnerSwapIcon = ({
   cancelLabel,
   ...restProps
 }: ScreenSpinnerSwapIconProps) => {
@@ -73,5 +72,3 @@ export const ScreenSpinnerSwapIcon: React.FC<ScreenSpinnerSwapIconProps> = ({
     </RootComponent>
   );
 };
-
-ScreenSpinnerSwapIcon.displayName = 'ScreenSpinnerSwapIcon';

package/src/components/ScreenSpinner/context.ts

@@ -4,8 +4,17 @@ import * as React from 'react';
 import { type ScreenSpinnerProps } from './types';
 
 export interface ScreenSpinnerContextProps {
+  /**
+   * Тип отображения спиннера.
+   */
   state: NonNullable<ScreenSpinnerProps['state']>;
+  /**
+   * Текст под иконкой.
+   */
   label?: ScreenSpinnerProps['label'];
+  /**
+   * Кастомная иконка, работает совместно со `state="custom"`.
+   */
   customIcon?: ScreenSpinnerProps['customIcon'];
 }
 

package/src/components/ScreenSpinner/types.tsx

@@ -2,17 +2,26 @@ import type * as React from 'react';
 import type { AppRootPortalProps } from '../AppRoot/AppRootPortal';
 import type { SpinnerProps } from '../Spinner/Spinner';
 
-export type ScreenSpinnerProps = Omit<SpinnerProps, 'size'> & {
-  state?: 'loading' | 'cancelable' | 'done' | 'error' | 'custom';
-  /**
-   * Кастомная иконка, работает совместно со `state="custom"`
-   */
-  customIcon?: React.ReactNode;
-  mode?: 'shadow' | 'overlay';
-  /**
-   * Текст под иконкой
-   */
-  label?: React.ReactNode;
-  cancelLabel?: string;
-  usePortal?: AppRootPortalProps['usePortal'];
-};
+export type ScreenSpinnerProps = Omit<SpinnerProps, 'size'> &
+  Pick<AppRootPortalProps, 'usePortal'> & {
+    /**
+     * Тип отображения спиннера.
+     */
+    state?: 'loading' | 'cancelable' | 'done' | 'error' | 'custom';
+    /**
+     * Кастомная иконка, работает совместно со `state="custom"`.
+     */
+    customIcon?: React.ReactNode;
+    /**
+     * Внешний вид отображения спиннера.
+     */
+    mode?: 'shadow' | 'overlay';
+    /**
+     * Текст под иконкой.
+     */
+    label?: React.ReactNode;
+    /**
+     * Используется при `state='cancelable'`. Делает доступным для ассистивных технологий.
+     */
+    cancelLabel?: string;
+  };

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

@@ -0,0 +1 @@
+{"version":3,"sources":["./ScrollArrow.module.css"],"names":["host","directionLeft","directionRight","directionUp","directionDown","icon","sizeS","sizeM","rtl","defaultIcon"],"mappings":"AAAA;AAAA,E,aAAAA,M,WAAA;AAAA,E,aAYAC,e,WAZA;AAAA,E,aAaAC,gB,WAbA;AAAA,E,aAkBAC,a,WAlBA;AAAA,E,aAmBAC,e,WAnBA;AAAA,E,aAwBAC,M,WAxBA;AAAA,E,aAkCAC,O,WAlCA;AAAA,E,aAkCOD,M,WAlCP;AAAA,E,aAwCAE,O,WAxCA;AAAA,E,aAwCOF,M,WAxCP;AAAA,E,aA8CAJ,e,WA9CA;AAAA,E,aAmDAC,gB,WAnDA;AAAA,E,aAwDAC,a,WAxDA;AAAA,E,aA6DAC,e,WA7DA;AAAA,E,aAkEAH,e,WAlEA;AAAA,E,aAkEmBO,K,WAlEnB;AAAA,E,aAkEyBC,a,WAlEzB;AAAA,E,aAmEAP,gB,WAnEA;AAAA,E,aAmEeM,K,WAnEf;AAAA,E,aAmEoBC,a,WAnEpB;AAAA,E,aAuEAN,a,WAvEA;AAAA,E,aAuEaM,a,WAvEb;AAAA,E,aA2EAL,e,WA3EA;AAAA,E,aA2EeK,a,WA3Ef;AAAA;AAAA","file":"ScrollArrow.module.css.d.ts","sourceRoot":""}

package/src/components/ScrollArrow/ScrollArrow.tsx

@@ -41,17 +41,20 @@ export interface ScrollArrowProps
   extends React.ButtonHTMLAttributes<HTMLButtonElement>,
     HasRootRef<HTMLButtonElement> {
   /**
-   * Направление стрелки
+   * Направление стрелки.
    */
   direction: 'up' | 'right' | 'down' | 'left';
   /**
-   * Размер стрелки
+   * Размер стрелки.
    */
   size?: 's' | 'm';
   /**
    * Смещает иконку кнопки навигации по вертикали.
    */
   offsetY?: number | string;
+  /**
+   * [a11y]: Используется для ассистивных технологий.
+   */
   label?: string;
 }
 

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

@@ -0,0 +1 @@
+{"version":3,"sources":["./Search.module.css"],"names":["host","rtl","withPadding","sizeYCompact","sizeYNone","field","label","input","nativeInput","hasAfter","disabled","controls","hasIcon","hasValue","icon","after","focused","afterTextClip","findButton"],"mappings":"AAAA;AAAA,E,aAAAA,M,WAAA;AAAA,E,aAUAC,K,WAVA;AAAA,E,aAcAC,a,WAdA;AAAA,E,aAuBAC,c,WAvBA;AAAA,E,aA4BEC,W,WA5BF;AAAA,E,aAiCAC,O,WAjCA;AAAA,E,aAgDAA,O,WAhDA;AAAA,E,aAoDAA,O,WApDA;AAAA,E,aAwDAC,O,WAxDA;AAAA,E,aA+DAC,O,WA/DA;AAAA,E,aA2EAC,a,WA3EA;AAAA,E,aA8FAA,a,WA9FA;AAAA,E,aA+FAA,a,WA/FA;AAAA,E,aAgGAA,a,WAhGA;AAAA,E,aAiGAA,a,WAjGA;AAAA,E,aAqGAA,a,WArGA;AAAA,E,aAyGAC,U,WAzGA;AAAA,E,aAyGUD,a,WAzGV;AAAA,E,aA8GAE,U,WA9GA;AAAA,E,aAoHAF,a,WApHA;AAAA,E,aAwHAA,a,WAxHA;AAAA,E,aA8HAA,a,WA9HA;AAAA,E,aAkIAG,U,WAlIA;AAAA,E,aA+IAC,S,WA/IA;AAAA,E,aA+ISD,U,WA/IT;AAAA,E,aA2JAE,U,WA3JA;AAAA,E,aA2JUF,U,WA3JV;AAAA,E,aA+JAG,M,WA/JA;AAAA,E,aAyKAA,M,WAzKA;AAAA,E,aA6KAC,O,WA7KA;AAAA,E,aAwLAC,S,WAxLA;AAAA,E,aAwLSD,O,WAxLT;AAAA,E,aAyLAF,U,WAzLA;AAAA,E,aAyLUE,O,WAzLV;AAAA,E,aA8LAA,O,WA9LA;AAAA,E,aA+LAA,O,WA/LA;AAAA,E,aAuMAb,a,WAvMA;AAAA,E,aAuMaa,O,WAvMb;AAAA,E,aA2MAE,e,WA3MA;AAAA,E,aAkNAC,Y,WAlNA;AAAA,E,aAyNwClB,M,WAzNxC;AAAA;AAAA","file":"Search.module.css.d.ts","sourceRoot":""}

package/src/components/Search/Search.tsx

@@ -30,33 +30,51 @@ export interface SearchProps
     HasRootRef<HTMLDivElement>,
     HasRef<HTMLInputElement> {
   /**
-   * iOS only. Текст кнопки "отмена", которая чистит текстовое поле и убирает фокус.
+   * Only iOS. Текст кнопки "отмена", которая чистит текстовое поле и убирает фокус.
    */
   after?: React.ReactNode;
+  /**
+   * Контент, отображаемый перед полем ввода.
+   */
   before?: React.ReactNode;
+  /**
+   * Иконка поиска. Может быть React-элементом или функцией, возвращающей элемент.
+   */
   icon?: React.ReactNode | ((renderFn: RenderIconButtonFn) => React.ReactNode);
+  /**
+   * Обработчик нажатия на иконку поиска.
+   */
   onIconClick?: React.PointerEventHandler<HTMLElement>;
+  /**
+   * Значение поля ввода по умолчанию.
+   */
   defaultValue?: string;
+  /**
+   * Текст для скринридеров, описывающий иконку поиска.
+   */
   iconLabel?: string;
+  /**
+   * Текст для скринридеров, описывающий кнопку очистки.
+   */
   clearLabel?: string;
   /**
-   * Передает атрибут `data-testid` для кнопки очистки
+   * Передает атрибут `data-testid` для кнопки очистки.
    */
   clearButtonTestId?: string;
   /**
-   * Удаляет отступы у компонента
+   * Удаляет отступы у компонента.
    */
   noPadding?: boolean;
   /**
-   * Текст для кнопки Найти
+   * Текст для кнопки Найти.
    */
   findButtonText?: string;
   /**
-   * Коллбэк для кнопки Найти
+   * Обработчик, при нажатии на кнопку "Найти".
    */
   onFindButtonClick?: React.MouseEventHandler<HTMLElement>;
   /**
-   * Передает атрибут `data-testid` для кнопки поиска
+   * Передает атрибут `data-testid` для кнопки поиска.
    */
   findButtonTestId?: string;
 }

package/src/components/SegmentedControl/SegmentedControl.module.css

@@ -29,8 +29,8 @@
   border-radius: inherit;
   box-shadow:
     inset 0 0 0 0.5px var(--vkui--color_image_border_alpha),
-    0 3px 8px rgba(0, 0, 0, 0.12),
-    0 3px 1px rgba(0, 0, 0, 0.04);
+    0 3px 8px rgb(0, 0, 0, 0.12),
+    0 3px 1px rgb(0, 0, 0, 0.04);
   transform: translateX(calc(var(--vkui_internal--SegmentedControl_actual_index) * 100%));
   transform-origin: 0 0;
   transition: transform 150ms;