@vkontakte/vkui 8.0.2 → 8.1.0

package/dist/components/CarouselBase/types.d.ts

@@ -12,7 +12,7 @@ export interface LayoutState {
     containerWidth: number;
     viewportOffsetWidth: number;
     layerWidth: number;
-    min?: number;
+    min?: number | undefined;
     max: number;
     slides: GallerySlidesState[];
     isFullyVisible: boolean;
@@ -81,72 +81,72 @@ export interface BaseGalleryProps extends Omit<HTMLAttributesWithRootRef<HTMLDiv
      *
      * Значение `"custom"` используется, если ширина у слайдов разная.
      */
-    slideWidth?: LiteralUnion<'custom', string> | number;
-    slideIndex?: number;
-    onDragStart?: CustomTouchEventHandler;
-    onDragEnd?: (e: CustomTouchEvent, targetIndex: number) => void;
-    onChange?: (current: number) => void;
+    slideWidth?: LiteralUnion<'custom' | undefined, string> | number | undefined;
+    slideIndex?: number | undefined;
+    onDragStart?: CustomTouchEventHandler | undefined;
+    onDragEnd?: ((e: CustomTouchEvent | undefined, targetIndex: number) => void) | undefined;
+    onChange?: ((current: number) => void) | undefined;
     /**
      * Будет вызвано при нажатии на кнопку-стрелку влево.
      */
-    onPrevClick?: (event: React.MouseEvent) => void;
+    onPrevClick?: ((event: React.MouseEvent) => void) | undefined;
     /**
      * Будет вызвано при нажатии на кнопку-стрелку вправо.
      */
-    onNextClick?: (event: React.MouseEvent) => void;
-    bullets?: 'dark' | 'light' | false;
+    onNextClick?: ((event: React.MouseEvent) => void) | undefined;
+    bullets?: 'dark' | 'light' | false | undefined;
     /**
      * Позволяет отключить реагирование на тач-события.
      */
-    dragDisabled?: boolean;
-    showArrows?: boolean;
+    dragDisabled?: boolean | undefined;
+    showArrows?: boolean | undefined;
     /**
      * Размер активной зоны стрелок (в пикселях).
      * Определяет область вокруг стрелок, реагирующую на взаимодействие пользователя. В дизайне свойство называется `arrowArea`.
      */
-    arrowAreaHeight?: 'stretch' | 'fit';
-    hasPointer?: boolean;
-    arrowSize?: ScrollArrowProps['size'];
+    arrowAreaHeight?: 'stretch' | 'fit' | undefined;
+    hasPointer?: boolean | undefined;
+    arrowSize?: ScrollArrowProps['size'] | undefined;
     /**
      * Текст для кнопки-стрелки влево (назад). Делает ее доступной для ассистивных технологий.
      */
-    arrowPrevLabel?: string;
+    arrowPrevLabel?: string | undefined;
     /**
      * Текст для кнопки-стрелки вправо (вперед). Делает ее доступной для ассистивных технологий.
      */
-    arrowNextLabel?: string;
+    arrowNextLabel?: string | undefined;
     /**
      * Текст для слайда. Делает его доступным для ассистивных технологий. Может быть функцией.
      * По умолчанию устанавливает `aria-label` вида `${Номер слайда} из ${Количества слайдов}`.
      */
-    slideLabel?: string | ((index: number, slidesCount: number) => string);
+    slideLabel?: string | ((index: number, slidesCount: number) => string) | undefined;
     /**
      * Описание роли для слайда, для лучше понимания пользователей скринридеров. По умолчанию - `Слайд`.
      */
-    slideRoleDescription?: string;
+    slideRoleDescription?: string | undefined;
     /**
      * Передает атрибут `data-testid` для слайда.
      */
-    slideTestId?: (index: number) => string;
+    slideTestId?: ((index: number) => string) | undefined;
     /**
      * Включает зацикленность слайдов.
      */
-    looped?: boolean;
+    looped?: boolean | undefined;
     /**
      * Тип источника для отслеживания размера:
      * - `window`: пересчет позиции слайдов будет происходить при изменении размеров `window`
      * - `element`: пересчет позиции слайдов будет происходить при изменении размеров компонента.
      */
-    resizeSource?: 'window' | 'element';
+    resizeSource?: 'window' | 'element' | undefined;
     /**
      * Длительность анимации смены слайда в миллисекундах.
      */
-    animationDuration?: number;
+    animationDuration?: number | undefined;
     /**
      * Функция для анимации.
      *
      * Принимает одно из предопределённых значений или параметры функции [cubic-bezier](https://developer.mozilla.org/en-US/docs/Web/CSS/easing-function/cubic-bezier).
      */
-    animationEasing?: PredefinedEasingType | CubicBezierEasingType;
+    animationEasing?: PredefinedEasingType | CubicBezierEasingType | undefined;
 }
 //# sourceMappingURL=types.d.ts.map

package/dist/components/CarouselBase/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/CarouselBase/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/CarouselBase/types.ts"],"names":[],"mappings":"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"}

package/dist/components/CarouselBase/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CarouselBase/types.ts"],"sourcesContent":["/* eslint-disable jsdoc/require-jsdoc */\nimport type * as React from 'react';\nimport type { HasAlign, HasRef, HTMLAttributesWithRootRef, LiteralUnion } from '../../types';\nimport type { ScrollArrowProps } from '../ScrollArrow/ScrollArrow';\nimport type { CustomTouchEvent, CustomTouchEventHandler } from '../Touch/Touch';\nimport type { BulletsTestIds } from './Bullets';\nimport type { ScrollArrowsTestIds } from './ScrollArrows';\n\nexport interface GallerySlidesState {\n  coordX: number;\n  width: number;\n}\n\nexport interface LayoutState {\n  containerWidth: number;\n  viewportOffsetWidth: number;\n  layerWidth: number;\n  min?: number;\n  max: number;\n  slides: GallerySlidesState[];\n  isFullyVisible: boolean;\n}\n\nexport interface LoopPoint {\n  /**\n   * Индекс слайда.\n   */\n  index: number;\n  /**\n   * Функция, которая по текущему сдвигу галереи определяет нужный сдвиг слайда.\n   */\n  target: (this: void, location: number) => void;\n}\n\nexport interface ControlElementsState {\n  /**\n   * Отвечает за отображение стрелки влево.\n   */\n  canSlideLeft: boolean;\n  /**\n   * Отвечает за отображение стрелки вправо.\n   */\n  canSlideRight: boolean;\n  /**\n   * Возможность листать слайды drag'ом.\n   */\n  isDraggable: boolean;\n}\n\nexport interface SlidesManagerState {\n  /**\n   * Общая ширина всех слайдов.\n   */\n  contentSize: number;\n  /**\n   * Массив с пограничными точками слайдов, которые необходимо смещать, чтобы они всегда были в области видимости\n   * (пример: для последнего слайда это n-первых слайдов, необходимых для заполнения оставшейся ширины,\n   * или для первого слайда это n-последних слайдов при выравнивании по центру).\n   */\n  loopPoints: LoopPoint[];\n  /**\n   * Массив с правыми границами слайдов.\n   */\n  snaps: number[];\n  /**\n   * Ширина видимой области слайдов.\n   */\n  viewportOffsetWidth: number;\n  /**\n   * Массив слайдов с координатой начала слайда и шириной.\n   */\n  slides: GallerySlidesState[];\n  /**\n   * Все слайды видимы без скрола.\n   */\n  isFullyVisible: boolean;\n  min: number | null;\n  max: number | null;\n  containerWidth: number;\n  layerWidth: number;\n}\n\nexport type PredefinedEasingType = 'linear' | 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out';\nexport type CubicBezierEasingType = [number, number, number, number];\n\nexport interface BaseGalleryProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange' | 'onDragStart' | 'onDragEnd'>,\n    HasAlign,\n    HasRef<HTMLElement>,\n    BulletsTestIds,\n    ScrollArrowsTestIds {\n  /**\n   * Размер слайда.\n   *\n   * Значение `\"custom\"` используется, если ширина у слайдов разная.\n   */\n  slideWidth?: LiteralUnion<'custom', string> | number;\n  slideIndex?: number;\n  onDragStart?: CustomTouchEventHandler;\n  onDragEnd?: (e: CustomTouchEvent, targetIndex: number) => void;\n  onChange?: (current: number) => void;\n  /**\n   * Будет вызвано при нажатии на кнопку-стрелку влево.\n   */\n  onPrevClick?: (event: React.MouseEvent) => void;\n  /**\n   * Будет вызвано при нажатии на кнопку-стрелку вправо.\n   */\n  onNextClick?: (event: React.MouseEvent) => void;\n  bullets?: 'dark' | 'light' | false;\n  /**\n   * Позволяет отключить реагирование на тач-события.\n   */\n  dragDisabled?: boolean;\n  showArrows?: boolean;\n  /**\n   * Размер активной зоны стрелок (в пикселях).\n   * Определяет область вокруг стрелок, реагирующую на взаимодействие пользователя. В дизайне свойство называется `arrowArea`.\n   */\n  arrowAreaHeight?: 'stretch' | 'fit';\n  hasPointer?: boolean;\n  arrowSize?: ScrollArrowProps['size'];\n  /**\n   * Текст для кнопки-стрелки влево (назад). Делает ее доступной для ассистивных технологий.\n   */\n  arrowPrevLabel?: string;\n  /**\n   * Текст для кнопки-стрелки вправо (вперед). Делает ее доступной для ассистивных технологий.\n   */\n  arrowNextLabel?: string;\n  /**\n   * Текст для слайда. Делает его доступным для ассистивных технологий. Может быть функцией.\n   * По умолчанию устанавливает `aria-label` вида `${Номер слайда} из ${Количества слайдов}`.\n   */\n  slideLabel?: string | ((index: number, slidesCount: number) => string);\n  /**\n   * Описание роли для слайда, для лучше понимания пользователей скринридеров. По умолчанию - `Слайд`.\n   */\n  slideRoleDescription?: string;\n  /**\n   * Передает атрибут `data-testid` для слайда.\n   */\n  slideTestId?: (index: number) => string;\n  /**\n   * Включает зацикленность слайдов.\n   */\n  looped?: boolean;\n  /**\n   * Тип источника для отслеживания размера:\n   * - `window`: пересчет позиции слайдов будет происходить при изменении размеров `window`\n   * - `element`: пересчет позиции слайдов будет происходить при изменении размеров компонента.\n   */\n  resizeSource?: 'window' | 'element';\n  /**\n   * Длительность анимации смены слайда в миллисекундах.\n   */\n  animationDuration?: number;\n  /**\n   * Функция для анимации.\n   *\n   * Принимает одно из предопределённых значений или параметры функции [cubic-bezier](https://developer.mozilla.org/en-US/docs/Web/CSS/easing-function/cubic-bezier).\n   */\n  animationEasing?: PredefinedEasingType | CubicBezierEasingType;\n}\n"],"names":[],"mappings":"AAAA,sCAAsC,GAqFtC,WA8EC"}
+{"version":3,"sources":["../../../src/components/CarouselBase/types.ts"],"sourcesContent":["/* eslint-disable jsdoc/require-jsdoc */\nimport type * as React from 'react';\nimport type { HasAlign, HasRef, HTMLAttributesWithRootRef, LiteralUnion } from '../../types';\nimport type { ScrollArrowProps } from '../ScrollArrow/ScrollArrow';\nimport type { CustomTouchEvent, CustomTouchEventHandler } from '../Touch/Touch';\nimport type { BulletsTestIds } from './Bullets';\nimport type { ScrollArrowsTestIds } from './ScrollArrows';\n\nexport interface GallerySlidesState {\n  coordX: number;\n  width: number;\n}\n\nexport interface LayoutState {\n  containerWidth: number;\n  viewportOffsetWidth: number;\n  layerWidth: number;\n  min?: number | undefined;\n  max: number;\n  slides: GallerySlidesState[];\n  isFullyVisible: boolean;\n}\n\nexport interface LoopPoint {\n  /**\n   * Индекс слайда.\n   */\n  index: number;\n  /**\n   * Функция, которая по текущему сдвигу галереи определяет нужный сдвиг слайда.\n   */\n  target: (this: void, location: number) => void;\n}\n\nexport interface ControlElementsState {\n  /**\n   * Отвечает за отображение стрелки влево.\n   */\n  canSlideLeft: boolean;\n  /**\n   * Отвечает за отображение стрелки вправо.\n   */\n  canSlideRight: boolean;\n  /**\n   * Возможность листать слайды drag'ом.\n   */\n  isDraggable: boolean;\n}\n\nexport interface SlidesManagerState {\n  /**\n   * Общая ширина всех слайдов.\n   */\n  contentSize: number;\n  /**\n   * Массив с пограничными точками слайдов, которые необходимо смещать, чтобы они всегда были в области видимости\n   * (пример: для последнего слайда это n-первых слайдов, необходимых для заполнения оставшейся ширины,\n   * или для первого слайда это n-последних слайдов при выравнивании по центру).\n   */\n  loopPoints: LoopPoint[];\n  /**\n   * Массив с правыми границами слайдов.\n   */\n  snaps: number[];\n  /**\n   * Ширина видимой области слайдов.\n   */\n  viewportOffsetWidth: number;\n  /**\n   * Массив слайдов с координатой начала слайда и шириной.\n   */\n  slides: GallerySlidesState[];\n  /**\n   * Все слайды видимы без скрола.\n   */\n  isFullyVisible: boolean;\n  min: number | null;\n  max: number | null;\n  containerWidth: number;\n  layerWidth: number;\n}\n\nexport type PredefinedEasingType = 'linear' | 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out';\nexport type CubicBezierEasingType = [number, number, number, number];\n\nexport interface BaseGalleryProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange' | 'onDragStart' | 'onDragEnd'>,\n    HasAlign,\n    HasRef<HTMLElement>,\n    BulletsTestIds,\n    ScrollArrowsTestIds {\n  /**\n   * Размер слайда.\n   *\n   * Значение `\"custom\"` используется, если ширина у слайдов разная.\n   */\n  slideWidth?: LiteralUnion<'custom' | undefined, string> | number | undefined;\n  slideIndex?: number | undefined;\n  onDragStart?: CustomTouchEventHandler | undefined;\n  onDragEnd?: ((e: CustomTouchEvent | undefined, targetIndex: number) => void) | undefined;\n  onChange?: ((current: number) => void) | undefined;\n  /**\n   * Будет вызвано при нажатии на кнопку-стрелку влево.\n   */\n  onPrevClick?: ((event: React.MouseEvent) => void) | undefined;\n  /**\n   * Будет вызвано при нажатии на кнопку-стрелку вправо.\n   */\n  onNextClick?: ((event: React.MouseEvent) => void) | undefined;\n  bullets?: 'dark' | 'light' | false | undefined;\n  /**\n   * Позволяет отключить реагирование на тач-события.\n   */\n  dragDisabled?: boolean | undefined;\n  showArrows?: boolean | undefined;\n  /**\n   * Размер активной зоны стрелок (в пикселях).\n   * Определяет область вокруг стрелок, реагирующую на взаимодействие пользователя. В дизайне свойство называется `arrowArea`.\n   */\n  arrowAreaHeight?: 'stretch' | 'fit' | undefined;\n  hasPointer?: boolean | undefined;\n  arrowSize?: ScrollArrowProps['size'] | undefined;\n  /**\n   * Текст для кнопки-стрелки влево (назад). Делает ее доступной для ассистивных технологий.\n   */\n  arrowPrevLabel?: string | undefined;\n  /**\n   * Текст для кнопки-стрелки вправо (вперед). Делает ее доступной для ассистивных технологий.\n   */\n  arrowNextLabel?: string | undefined;\n  /**\n   * Текст для слайда. Делает его доступным для ассистивных технологий. Может быть функцией.\n   * По умолчанию устанавливает `aria-label` вида `${Номер слайда} из ${Количества слайдов}`.\n   */\n  slideLabel?: string | ((index: number, slidesCount: number) => string) | undefined;\n  /**\n   * Описание роли для слайда, для лучше понимания пользователей скринридеров. По умолчанию - `Слайд`.\n   */\n  slideRoleDescription?: string | undefined;\n  /**\n   * Передает атрибут `data-testid` для слайда.\n   */\n  slideTestId?: ((index: number) => string) | undefined;\n  /**\n   * Включает зацикленность слайдов.\n   */\n  looped?: boolean | undefined;\n  /**\n   * Тип источника для отслеживания размера:\n   * - `window`: пересчет позиции слайдов будет происходить при изменении размеров `window`\n   * - `element`: пересчет позиции слайдов будет происходить при изменении размеров компонента.\n   */\n  resizeSource?: 'window' | 'element' | undefined;\n  /**\n   * Длительность анимации смены слайда в миллисекундах.\n   */\n  animationDuration?: number | undefined;\n  /**\n   * Функция для анимации.\n   *\n   * Принимает одно из предопределённых значений или параметры функции [cubic-bezier](https://developer.mozilla.org/en-US/docs/Web/CSS/easing-function/cubic-bezier).\n   */\n  animationEasing?: PredefinedEasingType | CubicBezierEasingType | undefined;\n}\n"],"names":[],"mappings":"AAAA,sCAAsC,GAqFtC,WA8EC"}

package/dist/components/Cell/Cell.d.ts

@@ -11,38 +11,38 @@ export interface CellProps extends Omit<SimpleCellProps, 'getRootRef'>, Removabl
      * - "removable": добавляется кнопка для удаления
      * - "selectable": добавляется чекбокс для выбора.
      */
-    mode?: 'removable' | 'selectable';
+    mode?: 'removable' | 'selectable' | undefined;
     /**
      * В режиме перетаскивания ячейка перестает реагировать на нажатие, то есть при нажатии переданный `onClick` вызываться не будет.
      */
-    draggable?: boolean;
+    draggable?: boolean | undefined;
     /**
      * Имя для `input` в режиме `selectable`.
      */
-    name?: string;
+    name?: string | undefined;
     /**
      * В режиме `selectable` реагирует на входящие значения пропса `cheсked`, как зависящий напрямую от входящего значения.
      */
-    checked?: boolean;
+    checked?: boolean | undefined;
     /**
      * В режиме `selectable` реагирует на входящие значения пропса `defaultChecked` как неконтролируемый компонент.
      */
-    defaultChecked?: boolean;
+    defaultChecked?: boolean | undefined;
     /**
      * Обработчик, срабатывающий при завершении перетаскивания.
      * **Важно:** режим перетаскивания не меняет порядок ячеек в DOM. В обработчике есть объект с полями `from` и `to`.
      * Эти числа нужны для того, чтобы разработчик понимал, с какого индекса на какой произошел переход. В песочнице
      * есть рабочий пример с обработкой этих чисел и перерисовкой списка.
      */
-    onDragFinish?: (swappedItemRange: SwappedItemRange) => void;
+    onDragFinish?: ((swappedItemRange: SwappedItemRange) => void) | undefined;
     /**
      * Текст для кнопки перетаскивания ячейки.
      */
-    draggerLabel?: string;
+    draggerLabel?: string | undefined;
     /**
      * Передает атрибут `data-testid` для кнопки перетаскивания ячейки.
      */
-    draggerTestId?: string;
+    draggerTestId?: string | undefined;
 }
 /**
  * @see https://vkui.io/components/cell

package/dist/components/Cell/Cell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Cell.d.ts","sourceRoot":"","sources":["../../../src/components/Cell/Cell.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oCAAoC,CAAC;AAG3E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxE,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC5E,OAAO,EAAE,YAAY,EAA0B,MAAM,6BAA6B,CAAC;AAKnF,MAAM,WAAW,SACf,SAAQ,IAAI,CAAC,eAAe,EAAE,YAAY,CAAC,EACzC,cAAc,EACd,UAAU,CAAC,cAAc,CAAC;IAC5B;;;;;OAKG;IACH,IAAI,CAAC,EAAE,WAAW,GAAG,YAAY,CAAC;IAClC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,CAAC,gBAAgB,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC5D;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;GAEG;AACH,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAAC,GAAG;IACvC,QAAQ,EAAE,OAAO,YAAY,CAAC;CAoI/B,CAAC"}
+{"version":3,"file":"Cell.d.ts","sourceRoot":"","sources":["../../../src/components/Cell/Cell.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oCAAoC,CAAC;AAG3E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxE,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC5E,OAAO,EAAE,YAAY,EAA0B,MAAM,6BAA6B,CAAC;AAKnF,MAAM,WAAW,SACf,SAAQ,IAAI,CAAC,eAAe,EAAE,YAAY,CAAC,EACzC,cAAc,EACd,UAAU,CAAC,cAAc,CAAC;IAC5B;;;;;OAKG;IACH,IAAI,CAAC,EAAE,WAAW,GAAG,YAAY,GAAG,SAAS,CAAC;IAC9C;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAChC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACrC;;;;;OAKG;IACH,YAAY,CAAC,EAAE,CAAC,CAAC,gBAAgB,EAAE,gBAAgB,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IAC1E;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CACpC;AAED;;GAEG;AACH,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAAC,GAAG;IACvC,QAAQ,EAAE,OAAO,YAAY,CAAC;CAoI/B,CAAC"}

package/dist/components/Cell/Cell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Cell/Cell.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { SwappedItemRange } from '../../hooks/useDraggableWithDomApi';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport type { HasRootRef } from '../../types';\nimport { Removable, type RemovableProps } from '../Removable/Removable';\nimport { SimpleCell, type SimpleCellProps } from '../SimpleCell/SimpleCell';\nimport { CellCheckbox, type CellCheckboxProps } from './CellCheckbox/CellCheckbox';\nimport { CellDragger } from './CellDragger/CellDragger';\nimport { DEFAULT_DRAGGABLE_LABEL } from './constants';\nimport styles from './Cell.module.css';\n\nexport interface CellProps\n  extends Omit<SimpleCellProps, 'getRootRef'>,\n    RemovableProps,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Режим отображения ячейки:\n   *\n   * - \"removable\": добавляется кнопка для удаления\n   * - \"selectable\": добавляется чекбокс для выбора.\n   */\n  mode?: 'removable' | 'selectable';\n  /**\n   * В режиме перетаскивания ячейка перестает реагировать на нажатие, то есть при нажатии переданный `onClick` вызываться не будет.\n   */\n  draggable?: boolean;\n  /**\n   * Имя для `input` в режиме `selectable`.\n   */\n  name?: string;\n  /**\n   * В режиме `selectable` реагирует на входящие значения пропса `cheсked`, как зависящий напрямую от входящего значения.\n   */\n  checked?: boolean;\n  /**\n   * В режиме `selectable` реагирует на входящие значения пропса `defaultChecked` как неконтролируемый компонент.\n   */\n  defaultChecked?: boolean;\n  /**\n   * Обработчик, срабатывающий при завершении перетаскивания.\n   * **Важно:** режим перетаскивания не меняет порядок ячеек в DOM. В обработчике есть объект с полями `from` и `to`.\n   * Эти числа нужны для того, чтобы разработчик понимал, с какого индекса на какой произошел переход. В песочнице\n   * есть рабочий пример с обработкой этих чисел и перерисовкой списка.\n   */\n  onDragFinish?: (swappedItemRange: SwappedItemRange) => void;\n  /**\n   * Текст для кнопки перетаскивания ячейки.\n   */\n  draggerLabel?: string;\n  /**\n   * Передает атрибут `data-testid` для кнопки перетаскивания ячейки.\n   */\n  draggerTestId?: string;\n}\n\n/**\n * @see https://vkui.io/components/cell\n */\nexport const Cell: React.FC<CellProps> & {\n  Checkbox: typeof CellCheckbox;\n} = ({\n  mode,\n  onRemove,\n  removePlaceholder = 'Удалить',\n  onDragFinish,\n  before,\n  after,\n  disabled,\n  draggable,\n  Component: ComponentProps,\n  onChange,\n  name,\n  value,\n  checked,\n  defaultChecked,\n  getRootRef,\n  draggerLabel = DEFAULT_DRAGGABLE_LABEL,\n  className,\n  style,\n  toggleButtonTestId,\n  removeButtonTestId,\n  draggerTestId,\n  href: hrefProp,\n  ...restProps\n}: CellProps) => {\n  const [dragging, setDragging] = React.useState(false);\n  const selectable = mode === 'selectable';\n  const removable = mode === 'removable';\n  const Component = selectable ? 'label' : ComponentProps;\n  const href = selectable ? undefined : hrefProp;\n\n  const platform = usePlatform();\n\n  const rootElRef = useExternRef(getRootRef);\n\n  const dragger = draggable ? (\n    <CellDragger\n      elRef={rootElRef}\n      className={classNames(styles.dragger, !before && !selectable && styles.controlNoBefore)}\n      onDragStateChange={setDragging}\n      onDragFinish={onDragFinish}\n      data-testid={draggerTestId}\n    >\n      {draggerLabel}\n    </CellDragger>\n  ) : null;\n\n  let checkbox;\n  if (selectable) {\n    const checkboxProps: CellCheckboxProps = {\n      name,\n      value,\n      defaultChecked,\n      checked,\n      disabled,\n      onChange,\n    };\n    checkbox = (\n      <CellCheckbox\n        className={classNames(styles.checkbox, !before && styles.controlNoBefore)}\n        {...checkboxProps}\n      />\n    );\n  }\n\n  const hasActive = !disabled && !dragging;\n\n  const cellClasses = classNames(\n    styles.host,\n    dragging && styles.dragging,\n    platform === 'ios' && styles.ios,\n    removable && styles.removable,\n  );\n\n  const simpleCellProps: SimpleCellProps = {\n    hasActive: hasActive,\n    hasHover: hasActive && !removable,\n    disabled,\n    href,\n    ...restProps,\n    className: styles.content,\n    // чтобы свойство, если не определено, не присутствовало в\n    // restProps явно как {'Component': undefined} и ниже не переопределяло\n    // возможное значение commonProps.Component = 'a' при слиянии двух объектов, как\n    // {...commonProps, ...restProps}\n    ...(Component && { Component }),\n    before: (\n      <React.Fragment>\n        {draggable && platform !== 'ios' && dragger}\n        {selectable && checkbox}\n        {before}\n      </React.Fragment>\n    ),\n    after: (\n      <React.Fragment>\n        {draggable && platform === 'ios' && dragger}\n        {after}\n      </React.Fragment>\n    ),\n  };\n\n  if (removable) {\n    return (\n      <Removable\n        className={classNames(cellClasses, className)}\n        style={style}\n        getRootRef={rootElRef}\n        removePlaceholder={removePlaceholder}\n        onRemove={(e) => onRemove?.(e, rootElRef.current)}\n        toggleButtonTestId={toggleButtonTestId}\n        removeButtonTestId={removeButtonTestId}\n        disabled={disabled}\n      >\n        {platform === 'ios' ? (\n          ({ isRemoving }) => {\n            return (\n              <SimpleCell {...simpleCellProps} {...(isRemoving ? { onClick: undefined } : {})} />\n            );\n          }\n        ) : (\n          <SimpleCell {...simpleCellProps} />\n        )}\n      </Removable>\n    );\n  }\n\n  return (\n    <div className={classNames(cellClasses, className)} style={style} ref={rootElRef}>\n      <SimpleCell {...simpleCellProps} />\n    </div>\n  );\n};\n\nCell.Checkbox = CellCheckbox;\n"],"names":["React","classNames","useExternRef","usePlatform","Removable","SimpleCell","CellCheckbox","CellDragger","DEFAULT_DRAGGABLE_LABEL","Cell","mode","onRemove","removePlaceholder","onDragFinish","before","after","disabled","draggable","Component","ComponentProps","onChange","name","value","checked","defaultChecked","getRootRef","draggerLabel","className","style","toggleButtonTestId","removeButtonTestId","draggerTestId","href","hrefProp","restProps","dragging","setDragging","useState","selectable","removable","undefined","platform","rootElRef","dragger","elRef","onDragStateChange","data-testid","checkbox","checkboxProps","hasActive","cellClasses","simpleCellProps","hasHover","Fragment","e","current","isRemoving","onClick","div","ref","Checkbox"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/Cell/Cell.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { SwappedItemRange } from '../../hooks/useDraggableWithDomApi';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport type { HasRootRef } from '../../types';\nimport { Removable, type RemovableProps } from '../Removable/Removable';\nimport { SimpleCell, type SimpleCellProps } from '../SimpleCell/SimpleCell';\nimport { CellCheckbox, type CellCheckboxProps } from './CellCheckbox/CellCheckbox';\nimport { CellDragger } from './CellDragger/CellDragger';\nimport { DEFAULT_DRAGGABLE_LABEL } from './constants';\nimport styles from './Cell.module.css';\n\nexport interface CellProps\n  extends Omit<SimpleCellProps, 'getRootRef'>,\n    RemovableProps,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Режим отображения ячейки:\n   *\n   * - \"removable\": добавляется кнопка для удаления\n   * - \"selectable\": добавляется чекбокс для выбора.\n   */\n  mode?: 'removable' | 'selectable' | undefined;\n  /**\n   * В режиме перетаскивания ячейка перестает реагировать на нажатие, то есть при нажатии переданный `onClick` вызываться не будет.\n   */\n  draggable?: boolean | undefined;\n  /**\n   * Имя для `input` в режиме `selectable`.\n   */\n  name?: string | undefined;\n  /**\n   * В режиме `selectable` реагирует на входящие значения пропса `cheсked`, как зависящий напрямую от входящего значения.\n   */\n  checked?: boolean | undefined;\n  /**\n   * В режиме `selectable` реагирует на входящие значения пропса `defaultChecked` как неконтролируемый компонент.\n   */\n  defaultChecked?: boolean | undefined;\n  /**\n   * Обработчик, срабатывающий при завершении перетаскивания.\n   * **Важно:** режим перетаскивания не меняет порядок ячеек в DOM. В обработчике есть объект с полями `from` и `to`.\n   * Эти числа нужны для того, чтобы разработчик понимал, с какого индекса на какой произошел переход. В песочнице\n   * есть рабочий пример с обработкой этих чисел и перерисовкой списка.\n   */\n  onDragFinish?: ((swappedItemRange: SwappedItemRange) => void) | undefined;\n  /**\n   * Текст для кнопки перетаскивания ячейки.\n   */\n  draggerLabel?: string | undefined;\n  /**\n   * Передает атрибут `data-testid` для кнопки перетаскивания ячейки.\n   */\n  draggerTestId?: string | undefined;\n}\n\n/**\n * @see https://vkui.io/components/cell\n */\nexport const Cell: React.FC<CellProps> & {\n  Checkbox: typeof CellCheckbox;\n} = ({\n  mode,\n  onRemove,\n  removePlaceholder = 'Удалить',\n  onDragFinish,\n  before,\n  after,\n  disabled,\n  draggable,\n  Component: ComponentProps,\n  onChange,\n  name,\n  value,\n  checked,\n  defaultChecked,\n  getRootRef,\n  draggerLabel = DEFAULT_DRAGGABLE_LABEL,\n  className,\n  style,\n  toggleButtonTestId,\n  removeButtonTestId,\n  draggerTestId,\n  href: hrefProp,\n  ...restProps\n}: CellProps) => {\n  const [dragging, setDragging] = React.useState(false);\n  const selectable = mode === 'selectable';\n  const removable = mode === 'removable';\n  const Component = selectable ? 'label' : ComponentProps;\n  const href = selectable ? undefined : hrefProp;\n\n  const platform = usePlatform();\n\n  const rootElRef = useExternRef(getRootRef);\n\n  const dragger = draggable ? (\n    <CellDragger\n      elRef={rootElRef}\n      className={classNames(styles.dragger, !before && !selectable && styles.controlNoBefore)}\n      onDragStateChange={setDragging}\n      onDragFinish={onDragFinish}\n      data-testid={draggerTestId}\n    >\n      {draggerLabel}\n    </CellDragger>\n  ) : null;\n\n  let checkbox;\n  if (selectable) {\n    const checkboxProps: CellCheckboxProps = {\n      name,\n      value,\n      defaultChecked,\n      checked,\n      disabled,\n      onChange,\n    };\n    checkbox = (\n      <CellCheckbox\n        className={classNames(styles.checkbox, !before && styles.controlNoBefore)}\n        {...checkboxProps}\n      />\n    );\n  }\n\n  const hasActive = !disabled && !dragging;\n\n  const cellClasses = classNames(\n    styles.host,\n    dragging && styles.dragging,\n    platform === 'ios' && styles.ios,\n    removable && styles.removable,\n  );\n\n  const simpleCellProps: SimpleCellProps = {\n    hasActive: hasActive,\n    hasHover: hasActive && !removable,\n    disabled,\n    href,\n    ...restProps,\n    className: styles.content,\n    // чтобы свойство, если не определено, не присутствовало в\n    // restProps явно как {'Component': undefined} и ниже не переопределяло\n    // возможное значение commonProps.Component = 'a' при слиянии двух объектов, как\n    // {...commonProps, ...restProps}\n    ...(Component && { Component }),\n    before: (\n      <React.Fragment>\n        {draggable && platform !== 'ios' && dragger}\n        {selectable && checkbox}\n        {before}\n      </React.Fragment>\n    ),\n    after: (\n      <React.Fragment>\n        {draggable && platform === 'ios' && dragger}\n        {after}\n      </React.Fragment>\n    ),\n  };\n\n  if (removable) {\n    return (\n      <Removable\n        className={classNames(cellClasses, className)}\n        style={style}\n        getRootRef={rootElRef}\n        removePlaceholder={removePlaceholder}\n        onRemove={(e) => onRemove?.(e, rootElRef.current)}\n        toggleButtonTestId={toggleButtonTestId}\n        removeButtonTestId={removeButtonTestId}\n        disabled={disabled}\n      >\n        {platform === 'ios' ? (\n          ({ isRemoving }) => {\n            return (\n              <SimpleCell {...simpleCellProps} {...(isRemoving ? { onClick: undefined } : {})} />\n            );\n          }\n        ) : (\n          <SimpleCell {...simpleCellProps} />\n        )}\n      </Removable>\n    );\n  }\n\n  return (\n    <div className={classNames(cellClasses, className)} style={style} ref={rootElRef}>\n      <SimpleCell {...simpleCellProps} />\n    </div>\n  );\n};\n\nCell.Checkbox = CellCheckbox;\n"],"names":["React","classNames","useExternRef","usePlatform","Removable","SimpleCell","CellCheckbox","CellDragger","DEFAULT_DRAGGABLE_LABEL","Cell","mode","onRemove","removePlaceholder","onDragFinish","before","after","disabled","draggable","Component","ComponentProps","onChange","name","value","checked","defaultChecked","getRootRef","draggerLabel","className","style","toggleButtonTestId","removeButtonTestId","draggerTestId","href","hrefProp","restProps","dragging","setDragging","useState","selectable","removable","undefined","platform","rootElRef","dragger","elRef","onDragStateChange","data-testid","checkbox","checkboxProps","hasActive","cellClasses","simpleCellProps","hasHover","Fragment","e","current","isRemoving","onClick","div","ref","Checkbox"],"mappings":"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"}

package/dist/components/Cell/CellCheckbox/CellCheckbox.d.ts

@@ -5,7 +5,7 @@ export interface CellCheckboxProps extends Pick<CellProps, 'defaultChecked' | 'c
     /**
      * Вид чекбокса. Если auto, то зависит от платформы.
      */
-    type?: 'auto' | 'circle' | 'square';
+    type?: 'auto' | 'circle' | 'square' | undefined;
 }
 export declare const CellCheckbox: ({ getRootRef, getRef, className, style, type, ...restProps }: CellCheckboxProps) => React.ReactNode;
 //# sourceMappingURL=CellCheckbox.d.ts.map

package/dist/components/Cell/CellCheckbox/CellCheckbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CellCheckbox.d.ts","sourceRoot":"","sources":["../../../../src/components/Cell/CellCheckbox/CellCheckbox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAapC,OAAO,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAGzD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAiCzC,MAAM,WAAW,iBACf,SAAQ,IAAI,CAAC,SAAS,EAAE,gBAAgB,GAAG,SAAS,CAAC,EACnD,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAC3C,UAAU,CAAC,eAAe,CAAC,EAC3B,MAAM,CAAC,gBAAgB,CAAC;IAC1B;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,QAAQ,CAAC;CACrC;AAED,eAAO,MAAM,YAAY,GAAI,8DAO1B,iBAAiB,KAAG,KAAK,CAAC,SAuB5B,CAAC"}
+{"version":3,"file":"CellCheckbox.d.ts","sourceRoot":"","sources":["../../../../src/components/Cell/CellCheckbox/CellCheckbox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAapC,OAAO,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAGzD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAiCzC,MAAM,WAAW,iBACf,SAAQ,IAAI,CAAC,SAAS,EAAE,gBAAgB,GAAG,SAAS,CAAC,EACnD,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAC3C,UAAU,CAAC,eAAe,CAAC,EAC3B,MAAM,CAAC,gBAAgB,CAAC;IAC1B;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,CAAC;CACjD;AAED,eAAO,MAAM,YAAY,GAAI,8DAO1B,iBAAiB,KAAG,KAAK,CAAC,SAuB5B,CAAC"}

package/dist/components/Cell/CellCheckbox/CellCheckbox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Cell/CellCheckbox/CellCheckbox.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport {\n  Icon20CheckBoxOff,\n  Icon20CheckBoxOn,\n  Icon20CheckCircleOff,\n  Icon20CheckCircleOn,\n  Icon24CheckBoxOff,\n  Icon24CheckBoxOn,\n  Icon24CheckCircleOff,\n  Icon24CheckCircleOn,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../../hooks/usePlatform';\nimport type { HasRef, HasRootRef } from '../../../types';\nimport { AdaptiveIconRenderer } from '../../AdaptiveIconRenderer/AdaptiveIconRenderer';\nimport { VisuallyHidden } from '../../VisuallyHidden/VisuallyHidden';\nimport type { CellProps } from '../Cell';\nimport styles from './CellCheckbox.module.css';\n\nconst CheckBoxOn = () => (\n  <AdaptiveIconRenderer IconCompact={Icon20CheckBoxOn} IconRegular={Icon24CheckBoxOn} />\n);\n\nconst CheckBoxOff = () => (\n  <AdaptiveIconRenderer IconCompact={Icon20CheckBoxOff} IconRegular={Icon24CheckBoxOff} />\n);\n\nconst CheckCircleOn = () => (\n  <AdaptiveIconRenderer IconCompact={Icon20CheckCircleOn} IconRegular={Icon24CheckCircleOn} />\n);\n\nconst CheckCircleOff = () => (\n  <AdaptiveIconRenderer IconCompact={Icon20CheckCircleOff} IconRegular={Icon24CheckCircleOff} />\n);\n\nfunction useTypeIcon(type: NonNullable<CellCheckboxProps['type']>) {\n  const platform = usePlatform();\n\n  if (type !== 'auto') {\n    return type;\n  }\n\n  if (platform === 'ios' || platform === 'vkcom') {\n    return 'circle';\n  }\n\n  return 'square';\n}\n\nexport interface CellCheckboxProps\n  extends Pick<CellProps, 'defaultChecked' | 'checked'>,\n    React.InputHTMLAttributes<HTMLInputElement>,\n    HasRootRef<HTMLSpanElement>,\n    HasRef<HTMLInputElement> {\n  /**\n   * Вид чекбокса. Если auto, то зависит от платформы.\n   */\n  type?: 'auto' | 'circle' | 'square';\n}\n\nexport const CellCheckbox = ({\n  getRootRef,\n  getRef,\n  className,\n  style,\n  type = 'auto',\n  ...restProps\n}: CellCheckboxProps): React.ReactNode => {\n  const typeIcon = useTypeIcon(type);\n\n  const IconOff = typeIcon === 'circle' ? CheckCircleOff : CheckBoxOff;\n  const IconOn = typeIcon === 'circle' ? CheckCircleOn : CheckBoxOn;\n\n  return (\n    <span className={classNames(styles.host, className)} style={style} ref={getRootRef}>\n      <VisuallyHidden\n        {...restProps}\n        Component=\"input\"\n        type=\"checkbox\"\n        className={styles.input}\n        getRootRef={getRef}\n      />\n      <span className={classNames(styles.icon, styles.iconOff)} aria-hidden>\n        <IconOff />\n      </span>\n      <span className={classNames(styles.icon, styles.iconOn)} aria-hidden>\n        <IconOn />\n      </span>\n    </span>\n  );\n};\n"],"names":["Icon20CheckBoxOff","Icon20CheckBoxOn","Icon20CheckCircleOff","Icon20CheckCircleOn","Icon24CheckBoxOff","Icon24CheckBoxOn","Icon24CheckCircleOff","Icon24CheckCircleOn","classNames","usePlatform","AdaptiveIconRenderer","VisuallyHidden","CheckBoxOn","IconCompact","IconRegular","CheckBoxOff","CheckCircleOn","CheckCircleOff","useTypeIcon","type","platform","CellCheckbox","getRootRef","getRef","className","style","restProps","typeIcon","IconOff","IconOn","span","ref","Component","aria-hidden"],"mappings":"AAAA;;AAGA,SACEA,iBAAiB,EACjBC,gBAAgB,EAChBC,oBAAoB,EACpBC,mBAAmB,EACnBC,iBAAiB,EACjBC,gBAAgB,EAChBC,oBAAoB,EACpBC,mBAAmB,QACd,mBAAmB;AAC1B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,gCAA6B;AAEzD,SAASC,oBAAoB,QAAQ,qDAAkD;AACvF,SAASC,cAAc,QAAQ,yCAAsC;AAIrE,MAAMC,aAAa,kBACjB,KAACF;QAAqBG,aAAaZ;QAAkBa,aAAaT;;AAGpE,MAAMU,cAAc,kBAClB,KAACL;QAAqBG,aAAab;QAAmBc,aAAaV;;AAGrE,MAAMY,gBAAgB,kBACpB,KAACN;QAAqBG,aAAaV;QAAqBW,aAAaP;;AAGvE,MAAMU,iBAAiB,kBACrB,KAACP;QAAqBG,aAAaX;QAAsBY,aAAaR;;AAGxE,SAASY,YAAYC,IAA4C;IAC/D,MAAMC,WAAWX;IAEjB,IAAIU,SAAS,QAAQ;QACnB,OAAOA;IACT;IAEA,IAAIC,aAAa,SAASA,aAAa,SAAS;QAC9C,OAAO;IACT;IAEA,OAAO;AACT;AAaA,OAAO,MAAMC,eAAe,CAAC,EAC3BC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,KAAK,EACLN,OAAO,MAAM,EACb,GAAGO,WACe;IAClB,MAAMC,WAAWT,YAAYC;IAE7B,MAAMS,UAAUD,aAAa,WAAWV,iBAAiBF;IACzD,MAAMc,SAASF,aAAa,WAAWX,gBAAgBJ;IAEvD,qBACE,MAACkB;QAAKN,WAAWhB,qCAAwBgB;QAAYC,OAAOA;QAAOM,KAAKT;;0BACtE,KAACX;gBACE,GAAGe,SAAS;gBACbM,WAAU;gBACVb,MAAK;gBACLK,SAAS;gBACTF,YAAYC;;0BAEd,KAACO;gBAAKN,WAAWhB;gBAAyCyB,aAAW;0BACnE,cAAA,KAACL;;0BAEH,KAACE;gBAAKN,WAAWhB;gBAAwCyB,aAAW;0BAClE,cAAA,KAACJ;;;;AAIT,EAAE"}
+{"version":3,"sources":["../../../../src/components/Cell/CellCheckbox/CellCheckbox.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport {\n  Icon20CheckBoxOff,\n  Icon20CheckBoxOn,\n  Icon20CheckCircleOff,\n  Icon20CheckCircleOn,\n  Icon24CheckBoxOff,\n  Icon24CheckBoxOn,\n  Icon24CheckCircleOff,\n  Icon24CheckCircleOn,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../../hooks/usePlatform';\nimport type { HasRef, HasRootRef } from '../../../types';\nimport { AdaptiveIconRenderer } from '../../AdaptiveIconRenderer/AdaptiveIconRenderer';\nimport { VisuallyHidden } from '../../VisuallyHidden/VisuallyHidden';\nimport type { CellProps } from '../Cell';\nimport styles from './CellCheckbox.module.css';\n\nconst CheckBoxOn = () => (\n  <AdaptiveIconRenderer IconCompact={Icon20CheckBoxOn} IconRegular={Icon24CheckBoxOn} />\n);\n\nconst CheckBoxOff = () => (\n  <AdaptiveIconRenderer IconCompact={Icon20CheckBoxOff} IconRegular={Icon24CheckBoxOff} />\n);\n\nconst CheckCircleOn = () => (\n  <AdaptiveIconRenderer IconCompact={Icon20CheckCircleOn} IconRegular={Icon24CheckCircleOn} />\n);\n\nconst CheckCircleOff = () => (\n  <AdaptiveIconRenderer IconCompact={Icon20CheckCircleOff} IconRegular={Icon24CheckCircleOff} />\n);\n\nfunction useTypeIcon(type: NonNullable<CellCheckboxProps['type']>) {\n  const platform = usePlatform();\n\n  if (type !== 'auto') {\n    return type;\n  }\n\n  if (platform === 'ios' || platform === 'vkcom') {\n    return 'circle';\n  }\n\n  return 'square';\n}\n\nexport interface CellCheckboxProps\n  extends Pick<CellProps, 'defaultChecked' | 'checked'>,\n    React.InputHTMLAttributes<HTMLInputElement>,\n    HasRootRef<HTMLSpanElement>,\n    HasRef<HTMLInputElement> {\n  /**\n   * Вид чекбокса. Если auto, то зависит от платформы.\n   */\n  type?: 'auto' | 'circle' | 'square' | undefined;\n}\n\nexport const CellCheckbox = ({\n  getRootRef,\n  getRef,\n  className,\n  style,\n  type = 'auto',\n  ...restProps\n}: CellCheckboxProps): React.ReactNode => {\n  const typeIcon = useTypeIcon(type);\n\n  const IconOff = typeIcon === 'circle' ? CheckCircleOff : CheckBoxOff;\n  const IconOn = typeIcon === 'circle' ? CheckCircleOn : CheckBoxOn;\n\n  return (\n    <span className={classNames(styles.host, className)} style={style} ref={getRootRef}>\n      <VisuallyHidden\n        {...restProps}\n        Component=\"input\"\n        type=\"checkbox\"\n        className={styles.input}\n        getRootRef={getRef}\n      />\n      <span className={classNames(styles.icon, styles.iconOff)} aria-hidden>\n        <IconOff />\n      </span>\n      <span className={classNames(styles.icon, styles.iconOn)} aria-hidden>\n        <IconOn />\n      </span>\n    </span>\n  );\n};\n"],"names":["Icon20CheckBoxOff","Icon20CheckBoxOn","Icon20CheckCircleOff","Icon20CheckCircleOn","Icon24CheckBoxOff","Icon24CheckBoxOn","Icon24CheckCircleOff","Icon24CheckCircleOn","classNames","usePlatform","AdaptiveIconRenderer","VisuallyHidden","CheckBoxOn","IconCompact","IconRegular","CheckBoxOff","CheckCircleOn","CheckCircleOff","useTypeIcon","type","platform","CellCheckbox","getRootRef","getRef","className","style","restProps","typeIcon","IconOff","IconOn","span","ref","Component","aria-hidden"],"mappings":"AAAA;;AAGA,SACEA,iBAAiB,EACjBC,gBAAgB,EAChBC,oBAAoB,EACpBC,mBAAmB,EACnBC,iBAAiB,EACjBC,gBAAgB,EAChBC,oBAAoB,EACpBC,mBAAmB,QACd,mBAAmB;AAC1B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,gCAA6B;AAEzD,SAASC,oBAAoB,QAAQ,qDAAkD;AACvF,SAASC,cAAc,QAAQ,yCAAsC;AAIrE,MAAMC,aAAa,kBACjB,KAACF;QAAqBG,aAAaZ;QAAkBa,aAAaT;;AAGpE,MAAMU,cAAc,kBAClB,KAACL;QAAqBG,aAAab;QAAmBc,aAAaV;;AAGrE,MAAMY,gBAAgB,kBACpB,KAACN;QAAqBG,aAAaV;QAAqBW,aAAaP;;AAGvE,MAAMU,iBAAiB,kBACrB,KAACP;QAAqBG,aAAaX;QAAsBY,aAAaR;;AAGxE,SAASY,YAAYC,IAA4C;IAC/D,MAAMC,WAAWX;IAEjB,IAAIU,SAAS,QAAQ;QACnB,OAAOA;IACT;IAEA,IAAIC,aAAa,SAASA,aAAa,SAAS;QAC9C,OAAO;IACT;IAEA,OAAO;AACT;AAaA,OAAO,MAAMC,eAAe,CAAC,EAC3BC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,KAAK,EACLN,OAAO,MAAM,EACb,GAAGO,WACe;IAClB,MAAMC,WAAWT,YAAYC;IAE7B,MAAMS,UAAUD,aAAa,WAAWV,iBAAiBF;IACzD,MAAMc,SAASF,aAAa,WAAWX,gBAAgBJ;IAEvD,qBACE,MAACkB;QAAKN,WAAWhB,qCAAwBgB;QAAYC,OAAOA;QAAOM,KAAKT;;0BACtE,KAACX;gBACE,GAAGe,SAAS;gBACbM,WAAU;gBACVb,MAAK;gBACLK,SAAS;gBACTF,YAAYC;;0BAEd,KAACO;gBAAKN,WAAWhB;gBAAyCyB,aAAW;0BACnE,cAAA,KAACL;;0BAEH,KAACE;gBAAKN,WAAWhB;gBAAwCyB,aAAW;0BAClE,cAAA,KAACJ;;;;AAIT,EAAE"}

package/dist/components/Cell/CellDragger/CellDragger.d.ts

@@ -1,8 +1,8 @@
 import { type DraggableProps, type UseDraggableProps } from '../../../hooks/useDraggableWithDomApi';
 import type { HTMLAttributesWithRootRef } from '../../../types';
 interface CellDraggerProps extends UseDraggableProps, Omit<HTMLAttributesWithRootRef<HTMLElement>, keyof DraggableProps> {
-    disabled?: boolean;
-    onDragStateChange?: (dragging: boolean) => void;
+    disabled?: boolean | undefined;
+    onDragStateChange?: ((dragging: boolean) => void) | undefined;
 }
 export declare const CellDragger: ({ elRef, disabled, className, onDragStateChange, onDragFinish, children, ...restProps }: CellDraggerProps) => React.ReactNode;
 export {};

package/dist/components/Cell/CellDragger/CellDragger.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CellDragger.d.ts","sourceRoot":"","sources":["../../../../src/components/Cell/CellDragger/CellDragger.tsx"],"names":[],"mappings":"AAKA,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,iBAAiB,EAEvB,MAAM,uCAAuC,CAAC;AAG/C,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAC;AAKhE,UAAU,gBACR,SAAQ,iBAAiB,EACvB,IAAI,CAAC,yBAAyB,CAAC,WAAW,CAAC,EAAE,MAAM,cAAc,CAAC;IACpE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iBAAiB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;CACjD;AAED,eAAO,MAAM,WAAW,GAAI,yFAQzB,gBAAgB,KAAG,KAAK,CAAC,SA2B3B,CAAC"}
+{"version":3,"file":"CellDragger.d.ts","sourceRoot":"","sources":["../../../../src/components/Cell/CellDragger/CellDragger.tsx"],"names":[],"mappings":"AAKA,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,iBAAiB,EAEvB,MAAM,uCAAuC,CAAC;AAG/C,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAC;AAKhE,UAAU,gBACR,SAAQ,iBAAiB,EACvB,IAAI,CAAC,yBAAyB,CAAC,WAAW,CAAC,EAAE,MAAM,cAAc,CAAC;IACpE,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,iBAAiB,CAAC,EAAE,CAAC,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;CAC/D;AAED,eAAO,MAAM,WAAW,GAAI,yFAQzB,gBAAgB,KAAG,KAAK,CAAC,SA2B3B,CAAC"}

package/dist/components/Cell/CellDragger/CellDragger.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Cell/CellDragger/CellDragger.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport { Icon24Reorder, Icon24ReorderIos } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport {\n  type DraggableProps,\n  type UseDraggableProps,\n  useDraggableWithDomApi,\n} from '../../../hooks/useDraggableWithDomApi';\nimport { usePlatform } from '../../../hooks/usePlatform';\nimport { useIsomorphicLayoutEffect } from '../../../lib/useIsomorphicLayoutEffect';\nimport type { HTMLAttributesWithRootRef } from '../../../types';\nimport { Touch } from '../../Touch/Touch';\nimport { VisuallyHidden } from '../../VisuallyHidden/VisuallyHidden';\nimport styles from './CellDragger.module.css';\n\ninterface CellDraggerProps\n  extends UseDraggableProps,\n    Omit<HTMLAttributesWithRootRef<HTMLElement>, keyof DraggableProps> {\n  disabled?: boolean;\n  onDragStateChange?: (dragging: boolean) => void;\n}\n\nexport const CellDragger = ({\n  elRef,\n  disabled,\n  className,\n  onDragStateChange,\n  onDragFinish,\n  children,\n  ...restProps\n}: CellDraggerProps): React.ReactNode => {\n  const platform = usePlatform();\n  const Icon = platform === 'ios' ? Icon24ReorderIos : Icon24Reorder;\n\n  const { dragging, onDragStart, onDragMove, onDragEnd } = useDraggableWithDomApi({\n    elRef,\n    onDragFinish,\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    if (onDragStateChange) {\n      onDragStateChange(dragging);\n    }\n  }, [dragging, onDragStateChange]);\n\n  return (\n    <Touch\n      className={classNames(styles.host, className)}\n      onStart={disabled ? undefined : onDragStart}\n      onMoveY={disabled ? undefined : onDragMove}\n      onEnd={disabled ? undefined : onDragEnd}\n      {...restProps}\n    >\n      {children && <VisuallyHidden>{children}</VisuallyHidden>}\n      <Icon className={styles.icon} />\n    </Touch>\n  );\n};\n"],"names":["Icon24Reorder","Icon24ReorderIos","classNames","useDraggableWithDomApi","usePlatform","useIsomorphicLayoutEffect","Touch","VisuallyHidden","CellDragger","elRef","disabled","className","onDragStateChange","onDragFinish","children","restProps","platform","Icon","dragging","onDragStart","onDragMove","onDragEnd","onStart","undefined","onMoveY","onEnd"],"mappings":"AAAA;;AACA,sCAAsC,GAEtC,SAASA,aAAa,EAAEC,gBAAgB,QAAQ,mBAAmB;AACnE,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAGEC,sBAAsB,QACjB,iDAAwC;AAC/C,SAASC,WAAW,QAAQ,gCAA6B;AACzD,SAASC,yBAAyB,QAAQ,4CAAyC;AAEnF,SAASC,KAAK,QAAQ,uBAAoB;AAC1C,SAASC,cAAc,QAAQ,yCAAsC;AAUrE,OAAO,MAAMC,cAAc,CAAC,EAC1BC,KAAK,EACLC,QAAQ,EACRC,SAAS,EACTC,iBAAiB,EACjBC,YAAY,EACZC,QAAQ,EACR,GAAGC,WACc;IACjB,MAAMC,WAAWZ;IACjB,MAAMa,OAAOD,aAAa,QAAQf,mBAAmBD;IAErD,MAAM,EAAEkB,QAAQ,EAAEC,WAAW,EAAEC,UAAU,EAAEC,SAAS,EAAE,GAAGlB,uBAAuB;QAC9EM;QACAI;IACF;IAEAR,0BAA0B;QACxB,IAAIO,mBAAmB;YACrBA,kBAAkBM;QACpB;IACF,GAAG;QAACA;QAAUN;KAAkB;IAEhC,qBACE,MAACN;QACCK,WAAWT,oCAAwBS;QACnCW,SAASZ,WAAWa,YAAYJ;QAChCK,SAASd,WAAWa,YAAYH;QAChCK,OAAOf,WAAWa,YAAYF;QAC7B,GAAGN,SAAS;;YAEZD,0BAAY,KAACP;0BAAgBO;;0BAC9B,KAACG;gBAAKN,SAAS;;;;AAGrB,EAAE"}
+{"version":3,"sources":["../../../../src/components/Cell/CellDragger/CellDragger.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport { Icon24Reorder, Icon24ReorderIos } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport {\n  type DraggableProps,\n  type UseDraggableProps,\n  useDraggableWithDomApi,\n} from '../../../hooks/useDraggableWithDomApi';\nimport { usePlatform } from '../../../hooks/usePlatform';\nimport { useIsomorphicLayoutEffect } from '../../../lib/useIsomorphicLayoutEffect';\nimport type { HTMLAttributesWithRootRef } from '../../../types';\nimport { Touch } from '../../Touch/Touch';\nimport { VisuallyHidden } from '../../VisuallyHidden/VisuallyHidden';\nimport styles from './CellDragger.module.css';\n\ninterface CellDraggerProps\n  extends UseDraggableProps,\n    Omit<HTMLAttributesWithRootRef<HTMLElement>, keyof DraggableProps> {\n  disabled?: boolean | undefined;\n  onDragStateChange?: ((dragging: boolean) => void) | undefined;\n}\n\nexport const CellDragger = ({\n  elRef,\n  disabled,\n  className,\n  onDragStateChange,\n  onDragFinish,\n  children,\n  ...restProps\n}: CellDraggerProps): React.ReactNode => {\n  const platform = usePlatform();\n  const Icon = platform === 'ios' ? Icon24ReorderIos : Icon24Reorder;\n\n  const { dragging, onDragStart, onDragMove, onDragEnd } = useDraggableWithDomApi({\n    elRef,\n    onDragFinish,\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    if (onDragStateChange) {\n      onDragStateChange(dragging);\n    }\n  }, [dragging, onDragStateChange]);\n\n  return (\n    <Touch\n      className={classNames(styles.host, className)}\n      onStart={disabled ? undefined : onDragStart}\n      onMoveY={disabled ? undefined : onDragMove}\n      onEnd={disabled ? undefined : onDragEnd}\n      {...restProps}\n    >\n      {children && <VisuallyHidden>{children}</VisuallyHidden>}\n      <Icon className={styles.icon} />\n    </Touch>\n  );\n};\n"],"names":["Icon24Reorder","Icon24ReorderIos","classNames","useDraggableWithDomApi","usePlatform","useIsomorphicLayoutEffect","Touch","VisuallyHidden","CellDragger","elRef","disabled","className","onDragStateChange","onDragFinish","children","restProps","platform","Icon","dragging","onDragStart","onDragMove","onDragEnd","onStart","undefined","onMoveY","onEnd"],"mappings":"AAAA;;AACA,sCAAsC,GAEtC,SAASA,aAAa,EAAEC,gBAAgB,QAAQ,mBAAmB;AACnE,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAGEC,sBAAsB,QACjB,iDAAwC;AAC/C,SAASC,WAAW,QAAQ,gCAA6B;AACzD,SAASC,yBAAyB,QAAQ,4CAAyC;AAEnF,SAASC,KAAK,QAAQ,uBAAoB;AAC1C,SAASC,cAAc,QAAQ,yCAAsC;AAUrE,OAAO,MAAMC,cAAc,CAAC,EAC1BC,KAAK,EACLC,QAAQ,EACRC,SAAS,EACTC,iBAAiB,EACjBC,YAAY,EACZC,QAAQ,EACR,GAAGC,WACc;IACjB,MAAMC,WAAWZ;IACjB,MAAMa,OAAOD,aAAa,QAAQf,mBAAmBD;IAErD,MAAM,EAAEkB,QAAQ,EAAEC,WAAW,EAAEC,UAAU,EAAEC,SAAS,EAAE,GAAGlB,uBAAuB;QAC9EM;QACAI;IACF;IAEAR,0BAA0B;QACxB,IAAIO,mBAAmB;YACrBA,kBAAkBM;QACpB;IACF,GAAG;QAACA;QAAUN;KAAkB;IAEhC,qBACE,MAACN;QACCK,WAAWT,oCAAwBS;QACnCW,SAASZ,WAAWa,YAAYJ;QAChCK,SAASd,WAAWa,YAAYH;QAChCK,OAAOf,WAAWa,YAAYF;QAC7B,GAAGN,SAAS;;YAEZD,0BAAY,KAACP;0BAAgBO;;0BAC9B,KAACG;gBAAKN,SAAS;;;;AAGrB,EAAE"}

package/dist/components/CellButton/CellButton.d.ts

@@ -1,22 +1,85 @@
-import { type SimpleCellProps } from '../SimpleCell/SimpleCell';
-import '../SimpleCell/SimpleCell.module.css';
+import * as React from 'react';
+import type { HasComponent } from '../../types';
+import { type TappableOmitProps } from '../Tappable/Tappable';
 export declare const appearanceClassNames: {
     accent: string;
     neutral: string;
     negative: string;
 };
-export interface CellButtonProps extends SimpleCellProps {
+interface CellButtonOwnProps extends HasComponent {
+    /**
+     * Иконка 28 или `<Avatar size={28|32|40|48|72} />`.
+     */
+    before?: React.ReactNode | undefined;
+    /**
+     * Иконка 12 или `<Badge />`. Добавится слева от текста `children`.
+     */
+    badgeBeforeTitle?: React.ReactNode | undefined;
+    /**
+     * Иконка 12 или `<Badge />`. Добавится справа от текста `children`.
+     */
+    badgeAfterTitle?: React.ReactNode | undefined;
+    /**
+     * Иконка 12. Добавится слева от текста `subtitle`.
+     */
+    badgeBeforeSubtitle?: React.ReactNode | undefined;
+    /**
+     * Иконка 12. Добавится справа от текста `subtitle`.
+     */
+    badgeAfterSubtitle?: React.ReactNode | undefined;
+    /**
+     * Контейнер для текста справа от `children`.
+     */
+    indicator?: React.ReactNode | undefined;
+    /**
+     * Дополнительная строка текста над `children`.
+     */
+    overTitle?: React.ReactNode | undefined;
+    /**
+     * Дополнительная строка текста под `children`.
+     */
+    subtitle?: React.ReactNode | undefined;
+    /**
+     * Дополнительная строка текста под `children` и `subtitle`.
+     */
+    extraSubtitle?: React.ReactNode | undefined;
+    /**
+     * Иконка 24|28 или `<Switch />`. Располагается справа от `indicator`.
+     */
+    after?: React.ReactNode | undefined;
+    /**
+     * Блокировка взаимодействия с компонентом.
+     */
+    disabled?: boolean | undefined;
+    /**
+     * Управляет видимостью иконки шеврона `›`.
+     *
+     * - `auto` - добавляет шеврон справа только для платформы `ios`;
+     * - `always` - всегда показывает шеврон.
+     */
+    chevron?: 'auto' | 'always' | undefined;
+    /**
+     * Размер chevron.
+     */
+    chevronSize?: 's' | 'm' | undefined;
+    /**
+     * Включает многострочный режим для отображения текста.
+     */
+    multiline?: boolean | undefined;
     /**
      * > Режим `centered` переопределяет токен для темы `"accent"`.
      */
-    appearance?: 'accent' | 'neutral' | 'negative';
+    appearance?: 'accent' | 'neutral' | 'negative' | undefined;
     /**
      * Возможность центрирования содержимого компонента.
      */
-    centered?: boolean;
+    centered?: boolean | undefined;
+}
+export interface CellButtonProps extends CellButtonOwnProps, TappableOmitProps {
 }
 /**
  * @see https://vkui.io/components/cell-button
  */
-export declare const CellButton: ({ centered, appearance, className, ...restProps }: CellButtonProps) => React.ReactNode;
+export declare const CellButton: ({ badgeBeforeTitle, badgeAfterTitle, badgeBeforeSubtitle, badgeAfterSubtitle, before, indicator, children, after, chevron, multiline, overTitle, subtitle, extraSubtitle, chevronSize, centered, appearance, ...restProps }: CellButtonProps) => React.ReactNode;
+export {};
 //# sourceMappingURL=CellButton.d.ts.map

package/dist/components/CellButton/CellButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CellButton.d.ts","sourceRoot":"","sources":["../../../src/components/CellButton/CellButton.tsx"],"names":[],"mappings":"AACA,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC5E,OAAO,qCAAqC,CAAC;AAG7C,eAAO,MAAM,oBAAoB;;;;CAIhC,CAAC;AAEF,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD;;OAEG;IACH,UAAU,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,UAAU,CAAC;IAC/C;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;GAEG;AACH,eAAO,MAAM,UAAU,GAAI,mDAKxB,eAAe,KAAG,KAAK,CAAC,SAY1B,CAAC"}
+{"version":3,"file":"CellButton.d.ts","sourceRoot":"","sources":["../../../src/components/CellButton/CellButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD,OAAO,EAAY,KAAK,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAYxE,eAAO,MAAM,oBAAoB;;;;CAIhC,CAAC;AAEF,UAAU,kBAAmB,SAAQ,YAAY;IAC/C;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IACrC;;OAEG;IACH,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IAC/C;;OAEG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IAC9C;;OAEG;IACH,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IAClD;;OAEG;IACH,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IACjD;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IACxC;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IACxC;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IACvC;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IAC5C;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IACpC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B;;;;;OAKG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,SAAS,CAAC;IACxC;;OAEG;IACH,WAAW,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,SAAS,CAAC;IACpC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAChC;;OAEG;IACH,UAAU,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,UAAU,GAAG,SAAS,CAAC;IAC3D;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CAChC;AAED,MAAM,WAAW,eAAgB,SAAQ,kBAAkB,EAAE,iBAAiB;CAAG;AAEjF;;GAEG;AACH,eAAO,MAAM,UAAU,GAAI,6NAkBxB,eAAe,KAAG,KAAK,CAAC,SAkE1B,CAAC"}

package/dist/components/CellButton/CellButton.js

@@ -1,6 +1,19 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { classNames } from "@vkontakte/vkjs";
-import { SimpleCell } from "../SimpleCell/SimpleCell.js";
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { classNames, hasReactNode } from "@vkontakte/vkjs";
+import { useAdaptivity } from "../../hooks/useAdaptivity.js";
+import { usePlatform } from "../../hooks/usePlatform.js";
+import { Chevron } from "../SimpleCell/Chevron/Chevron.js";
+import { Tappable } from "../Tappable/Tappable.js";
+import { Footnote } from "../Typography/Footnote/Footnote.js";
+import { Headline } from "../Typography/Headline/Headline.js";
+import { Subhead } from "../Typography/Subhead/Subhead.js";
+import { VisuallyHidden } from "../VisuallyHidden/VisuallyHidden.js";
+const densityClassNames = {
+    none: "vkuiCellButton__densityNone",
+    compact: "vkuiCellButton__densityCompact"
+};
 export const appearanceClassNames = {
     accent: "vkuiCellButton__appearanceAccent",
     neutral: "vkuiCellButton__appearanceNeutral",
@@ -8,10 +21,106 @@ export const appearanceClassNames = {
 };
 /**
  * @see https://vkui.io/components/cell-button
- */ export const CellButton = ({ centered = false, appearance = 'accent', className, ...restProps })=>{
-    return /*#__PURE__*/ _jsx(SimpleCell, {
+ */ export const CellButton = ({ badgeBeforeTitle, badgeAfterTitle, badgeBeforeSubtitle, badgeAfterSubtitle, before, indicator, children, after, chevron, multiline, overTitle, subtitle, extraSubtitle, chevronSize = 'm', centered = false, appearance = 'accent', ...restProps })=>{
+    const platform = usePlatform();
+    const hasChevron = chevron === 'always' || chevron === 'auto' && platform === 'ios';
+    const hasAfter = hasReactNode(after) || hasChevron;
+    const { density = 'none' } = useAdaptivity();
+    return /*#__PURE__*/ _jsxs(Tappable, {
         ...restProps,
-        className: classNames("vkuiCellButton__host", appearanceClassNames[appearance], centered && "vkuiCellButton__centered", className)
+        baseClassName: classNames("vkuiCellButton__host", restProps.disabled && "vkuiCellButton__disabled", density !== 'regular' && densityClassNames[density], multiline && "vkuiCellButton__mult", appearanceClassNames[appearance], centered && "vkuiCellButton__centered"),
+        children: [
+            /*#__PURE__*/ _jsx("div", {
+                className: "vkuiCellButton__before",
+                children: before
+            }),
+            /*#__PURE__*/ _jsxs("div", {
+                className: "vkuiCellButton__middle",
+                children: [
+                    overTitle && /*#__PURE__*/ _jsxs(Subhead, {
+                        Component: "span",
+                        className: classNames("vkuiCellButton__text", "vkuiCellButton__overTitle"),
+                        children: [
+                            overTitle,
+                            /*#__PURE__*/ _jsx(VisuallyHidden, {
+                                children: " "
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs("div", {
+                        className: "vkuiCellButton__content",
+                        children: [
+                            badgeBeforeTitle && /*#__PURE__*/ _jsx("span", {
+                                className: "vkuiCellButton__badge",
+                                children: badgeBeforeTitle
+                            }),
+                            /*#__PURE__*/ _jsxs(Headline, {
+                                Component: "span",
+                                className: "vkuiCellButton__children",
+                                weight: "3",
+                                children: [
+                                    children,
+                                    /*#__PURE__*/ _jsx(VisuallyHidden, {
+                                        children: " "
+                                    })
+                                ]
+                            }),
+                            hasReactNode(badgeAfterTitle) && /*#__PURE__*/ _jsx("span", {
+                                className: "vkuiCellButton__badge",
+                                children: badgeAfterTitle
+                            })
+                        ]
+                    }),
+                    subtitle && /*#__PURE__*/ _jsxs("div", {
+                        className: "vkuiCellButton__content",
+                        children: [
+                            badgeBeforeSubtitle && /*#__PURE__*/ _jsx("span", {
+                                className: "vkuiCellButton__badge",
+                                children: badgeBeforeSubtitle
+                            }),
+                            /*#__PURE__*/ _jsxs(Footnote, {
+                                normalize: false,
+                                className: classNames("vkuiCellButton__text", "vkuiCellButton__subtitle"),
+                                children: [
+                                    subtitle,
+                                    /*#__PURE__*/ _jsx(VisuallyHidden, {
+                                        children: " "
+                                    })
+                                ]
+                            }),
+                            badgeAfterSubtitle && /*#__PURE__*/ _jsx("span", {
+                                className: "vkuiCellButton__badge",
+                                children: badgeAfterSubtitle
+                            })
+                        ]
+                    }),
+                    extraSubtitle && /*#__PURE__*/ _jsxs(Footnote, {
+                        className: classNames("vkuiCellButton__text", "vkuiCellButton__extraSubtitle"),
+                        children: [
+                            extraSubtitle,
+                            /*#__PURE__*/ _jsx(VisuallyHidden, {
+                                children: " "
+                            })
+                        ]
+                    })
+                ]
+            }),
+            hasReactNode(indicator) && /*#__PURE__*/ _jsx(Headline, {
+                Component: "span",
+                weight: "3",
+                className: "vkuiCellButton__indicator",
+                children: indicator
+            }),
+            hasAfter && /*#__PURE__*/ _jsxs("div", {
+                className: "vkuiCellButton__after",
+                children: [
+                    after,
+                    hasChevron && /*#__PURE__*/ _jsx(Chevron, {
+                        size: chevronSize
+                    })
+                ]
+            })
+        ]
     });
 };