@vkontakte/vkui 6.2.2 → 6.3.1

package/dist/cssm/components/SimpleGrid/SimpleGrid.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { classNames } from '@vkontakte/vkjs';
+import { calculateGap, columnGapClassNames, rowGapClassNames } from '../../lib/layouts';
+import { RootComponent } from '../RootComponent/RootComponent';
+import styles from './SimpleGrid.module.css';
+const marginClassNames = {
+    'auto': styles['SimpleGrid--margin-auto'],
+    'auto-inline': styles['SimpleGrid--margin-auto-inline'],
+    'auto-block': styles['SimpleGrid--margin-auto-block']
+};
+const alignClassNames = {
+    start: styles['SimpleGrid--align-start'],
+    end: styles['SimpleGrid--align-end'],
+    center: styles['SimpleGrid--align-center'],
+    stretch: styles['SimpleGrid--align-stretch'],
+    baseline: styles['SimpleGrid--align-baseline']
+};
+export const SimpleGrid = ({ columns = 1, gap, style: styleProp, margin = 'none', minColWidth, align = 'stretch', ...props })=>{
+    const style = {};
+    const [columnGap, rowGap] = calculateGap(gap);
+    if (typeof rowGap === 'number') {
+        style['--vkui_internal--row_gap'] = `${rowGap}px`;
+    }
+    if (typeof columnGap === 'number') {
+        style['--vkui_internal--column_gap'] = `${columnGap}px`;
+    }
+    style['--vkui_internal--grid_columns'] = `${columns}`;
+    if (minColWidth) {
+        style['--vkui_internal--min_col_width'] = `${minColWidth}px`;
+    }
+    return /*#__PURE__*/ _jsx(RootComponent, {
+        ...props,
+        baseClassName: classNames(styles.SimpleGrid, margin !== 'none' && marginClassNames[margin], alignClassNames[align], minColWidth && styles['SimpleGrid--with-min-width'], typeof columnGap === 'string' && columnGapClassNames[columnGap], typeof rowGap === 'string' && rowGapClassNames[rowGap]),
+        style: {
+            ...style,
+            ...styleProp
+        }
+    });
+};
+
+//# sourceMappingURL=SimpleGrid.js.map

package/dist/cssm/components/SimpleGrid/SimpleGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/SimpleGrid/SimpleGrid.tsx"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport {\n  calculateGap,\n  columnGapClassNames,\n  type GapsProp,\n  rowGapClassNames,\n} from '../../lib/layouts';\nimport { CSSCustomProperties, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './SimpleGrid.module.css';\n\nconst marginClassNames = {\n  'auto': styles['SimpleGrid--margin-auto'],\n  'auto-inline': styles['SimpleGrid--margin-auto-inline'],\n  'auto-block': styles['SimpleGrid--margin-auto-block'],\n};\n\nconst alignClassNames = {\n  start: styles['SimpleGrid--align-start'],\n  end: styles['SimpleGrid--align-end'],\n  center: styles['SimpleGrid--align-center'],\n  stretch: styles['SimpleGrid--align-stretch'],\n  baseline: styles['SimpleGrid--align-baseline'],\n};\n\nexport interface SimpleGridProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Количество колонок\n   */\n  columns?: number;\n  /**\n   * Отступы между элементами.\n   * Значение из списка предопределённых пресетов или число, которое будет приведено к пикселям.\n   * Через массив можно задать отступ между столбцами и строками [column, row], если они отличаются.\n   *\n   * TODO [>=7]: порядок следования будет [row, column]\n   */\n  gap?: GapsProp;\n  /**\n   * Управляет отступами вокруг контейнера\n   * Значение `none` позволяет отключить отступы\n   * Значение `auto` позволяет задать платформенные отступы\n   * Значение `auto-inline` позволяет задать платформенные inline-отступы\n   * Значение `auto-block` позволяет задать платформенные block-отступы\n   */\n  margin?: 'none' | 'auto' | 'auto-inline' | 'auto-block';\n  /**\n   * Вместо задания количества колонок, можно указать минимальную ширину элементов\n   */\n  minColWidth?: number;\n  /**\n   * Выравнивание элементов по вспомогательной оси, эквивалентно `align-items`\n   */\n  align?: 'start' | 'end' | 'center' | 'stretch' | 'baseline';\n}\n\nexport const SimpleGrid = ({\n  columns = 1,\n  gap,\n  style: styleProp,\n  margin = 'none',\n  minColWidth,\n  align = 'stretch',\n  ...props\n}: SimpleGridProps) => {\n  const style: CSSCustomProperties = {};\n  const [columnGap, rowGap] = calculateGap(gap);\n  if (typeof rowGap === 'number') {\n    style['--vkui_internal--row_gap'] = `${rowGap}px`;\n  }\n  if (typeof columnGap === 'number') {\n    style['--vkui_internal--column_gap'] = `${columnGap}px`;\n  }\n  style['--vkui_internal--grid_columns'] = `${columns}`;\n  if (minColWidth) {\n    style['--vkui_internal--min_col_width'] = `${minColWidth}px`;\n  }\n\n  return (\n    <RootComponent\n      {...props}\n      baseClassName={classNames(\n        styles.SimpleGrid,\n        margin !== 'none' && marginClassNames[margin],\n        alignClassNames[align],\n        minColWidth && styles['SimpleGrid--with-min-width'],\n        typeof columnGap === 'string' && columnGapClassNames[columnGap],\n        typeof rowGap === 'string' && rowGapClassNames[rowGap],\n      )}\n      style={{ ...style, ...styleProp }}\n    />\n  );\n};\n"],"names":["classNames","calculateGap","columnGapClassNames","rowGapClassNames","RootComponent","styles","marginClassNames","alignClassNames","start","end","center","stretch","baseline","SimpleGrid","columns","gap","style","styleProp","margin","minColWidth","align","props","columnGap","rowGap","baseClassName"],"mappings":";AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SACEC,YAAY,EACZC,mBAAmB,EAEnBC,gBAAgB,QACX,oBAAoB;AAE3B,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,OAAOC,YAAY,0BAA0B;AAE7C,MAAMC,mBAAmB;IACvB,QAAQD,MAAM,CAAC,0BAA0B;IACzC,eAAeA,MAAM,CAAC,iCAAiC;IACvD,cAAcA,MAAM,CAAC,gCAAgC;AACvD;AAEA,MAAME,kBAAkB;IACtBC,OAAOH,MAAM,CAAC,0BAA0B;IACxCI,KAAKJ,MAAM,CAAC,wBAAwB;IACpCK,QAAQL,MAAM,CAAC,2BAA2B;IAC1CM,SAASN,MAAM,CAAC,4BAA4B;IAC5CO,UAAUP,MAAM,CAAC,6BAA6B;AAChD;AAiCA,OAAO,MAAMQ,aAAa,CAAC,EACzBC,UAAU,CAAC,EACXC,GAAG,EACHC,OAAOC,SAAS,EAChBC,SAAS,MAAM,EACfC,WAAW,EACXC,QAAQ,SAAS,EACjB,GAAGC,OACa;IAChB,MAAML,QAA6B,CAAC;IACpC,MAAM,CAACM,WAAWC,OAAO,GAAGtB,aAAac;IACzC,IAAI,OAAOQ,WAAW,UAAU;QAC9BP,KAAK,CAAC,2BAA2B,GAAG,CAAC,EAAEO,OAAO,EAAE,CAAC;IACnD;IACA,IAAI,OAAOD,cAAc,UAAU;QACjCN,KAAK,CAAC,8BAA8B,GAAG,CAAC,EAAEM,UAAU,EAAE,CAAC;IACzD;IACAN,KAAK,CAAC,gCAAgC,GAAG,CAAC,EAAEF,QAAQ,CAAC;IACrD,IAAIK,aAAa;QACfH,KAAK,CAAC,iCAAiC,GAAG,CAAC,EAAEG,YAAY,EAAE,CAAC;IAC9D;IAEA,qBACE,KAACf;QACE,GAAGiB,KAAK;QACTG,eAAexB,WACbK,OAAOQ,UAAU,EACjBK,WAAW,UAAUZ,gBAAgB,CAACY,OAAO,EAC7CX,eAAe,CAACa,MAAM,EACtBD,eAAed,MAAM,CAAC,6BAA6B,EACnD,OAAOiB,cAAc,YAAYpB,mBAAmB,CAACoB,UAAU,EAC/D,OAAOC,WAAW,YAAYpB,gBAAgB,CAACoB,OAAO;QAExDP,OAAO;YAAE,GAAGA,KAAK;YAAE,GAAGC,SAAS;QAAC;;AAGtC,EAAE"}

package/dist/cssm/components/SimpleGrid/SimpleGrid.module.css

@@ -0,0 +1,45 @@
+.SimpleGrid {
+  --vkui_internal--grid_columns: 1;
+  --vkui_internal--min_col_width: 0;
+
+  display: grid;
+  gap: var(--vkui_internal--row_gap) var(--vkui_internal--column_gap);
+  grid-template-columns: repeat(var(--vkui_internal--grid_columns), minmax(0, 1fr));
+}
+
+.SimpleGrid--margin-auto {
+  margin-inline: var(--vkui--size_base_padding_horizontal--regular);
+  margin-block: var(--vkui--size_base_padding_vertical--regular);
+}
+
+.SimpleGrid--margin-auto-inline {
+  margin-inline: var(--vkui--size_base_padding_horizontal--regular);
+}
+
+.SimpleGrid--margin-auto-block {
+  margin-block: var(--vkui--size_base_padding_vertical--regular);
+}
+
+.SimpleGrid--with-min-width {
+  grid-template-columns: repeat(auto-fit, minmax(var(--vkui_internal--min_col_width), 1fr));
+}
+
+.SimpleGrid--align-start {
+  align-items: flex-start;
+}
+
+.SimpleGrid--align-end {
+  align-items: flex-end;
+}
+
+.SimpleGrid--align-center {
+  align-items: center;
+}
+
+.SimpleGrid--align-stretch {
+  align-items: stretch;
+}
+
+.SimpleGrid--align-baseline {
+  align-items: baseline;
+}

package/dist/cssm/components/Skeleton/Skeleton.d.ts

@@ -29,5 +29,5 @@ export interface SkeletonProps extends HTMLAttributesWithRootRef<HTMLDivElement
  *
  * @since 6.1.0
  */
-export declare const Skeleton: ({ width, height, inlineSize, blockSize, maxWidth, maxInlineSize, borderRadius, style, children, colorFrom, colorTo, noAnimation, duration, margin, ...restProps }: SkeletonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Skeleton: ({ width, height, inlineSize, blockSize, maxWidth, maxInlineSize, borderRadius, style, children, colorFrom, colorTo, noAnimation, duration, margin, ...restProps }: SkeletonProps) => React.ReactNode;
 //# sourceMappingURL=Skeleton.d.ts.map

package/dist/cssm/components/Skeleton/Skeleton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../../src/components/Skeleton/Skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAuB,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAI7E,MAAM,WAAW,aACf,SAAQ,yBAAyB,CAAC,cAAc,GAAG,eAAe,CAAC,EACjE,IAAI,CACF,KAAK,CAAC,aAAa,EACjB,OAAO,GACP,QAAQ,GACR,YAAY,GACZ,WAAW,GACX,UAAU,GACV,eAAe,GACf,cAAc,GACd,QAAQ,CACX;IACH;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,QAAQ,sKAgBlB,aAAa,4CAqCf,CAAC"}
+{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../../src/components/Skeleton/Skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAuB,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAI7E,MAAM,WAAW,aACf,SAAQ,yBAAyB,CAAC,cAAc,GAAG,eAAe,CAAC,EACjE,IAAI,CACF,KAAK,CAAC,aAAa,EACjB,OAAO,GACP,QAAQ,GACR,YAAY,GACZ,WAAW,GACX,UAAU,GACV,eAAe,GACf,cAAc,GACd,QAAQ,CACX;IACH;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,QAAQ,sKAgBlB,aAAa,KAAG,KAAK,CAAC,SAqCxB,CAAC"}

package/dist/cssm/components/Skeleton/Skeleton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { CSSCustomProperties, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './Skeleton.module.css';\n\nexport interface SkeletonProps\n  extends HTMLAttributesWithRootRef<HTMLDivElement | HTMLSpanElement>,\n    Pick<\n      React.CSSProperties,\n      | 'width'\n      | 'height'\n      | 'inlineSize'\n      | 'blockSize'\n      | 'maxWidth'\n      | 'maxInlineSize'\n      | 'borderRadius'\n      | 'margin'\n    > {\n  /**\n   * Начальный цвет анимации\n   */\n  colorFrom?: string;\n\n  /**\n   * Финальный цвет анимации\n   */\n  colorTo?: string;\n\n  /**\n   * Выключает анимацию, в результате чего показывается только один цвет\n   */\n  noAnimation?: boolean;\n\n  /**\n   * Длительность анимации в секундах\n   */\n  duration?: number;\n}\n\n/**\n * > Старайтесь минимизировать количество заглушек на экране. Не каждый элемент\n * > на экране должен заменяться заглушкой.\n * >\n * > Текстовые блоки лучше сокращать до трёх строк. Ширина последней строки\n * > скелета вычисляется, как 75% от ширины текстового блока. Высота скелетона\n * > автоматически подстраивается под размер шрифта, поэтому идеально\n * > вписывается в слоты компонентов, которые обычно ожидают текст.\n *\n * @since 6.1.0\n */\nexport const Skeleton = ({\n  width,\n  height,\n  inlineSize,\n  blockSize,\n  maxWidth,\n  maxInlineSize,\n  borderRadius,\n  style,\n  children,\n  colorFrom,\n  colorTo,\n  noAnimation,\n  duration,\n  margin,\n  ...restProps\n}: SkeletonProps) => {\n  const skeletonStyle: React.CSSProperties & CSSCustomProperties = {\n    width,\n    height,\n    inlineSize,\n    blockSize,\n    maxWidth,\n    maxInlineSize,\n    borderRadius,\n    margin,\n  };\n\n  if (colorFrom) {\n    skeletonStyle['--vkui_internal--skeleton_color_from'] = colorFrom;\n  }\n\n  if (colorTo) {\n    skeletonStyle['--vkui_internal--skeleton_color_to'] = colorTo;\n  }\n\n  if (Number.isFinite(duration)) {\n    skeletonStyle['--vkui_internal--skeleton_animation_duration'] = `${duration}s`;\n  }\n\n  return (\n    <RootComponent\n      Component=\"span\"\n      baseClassName={classNames(\n        styles['Skeleton'],\n        noAnimation && styles['Skeleton--disableAnimation'],\n      )}\n      style={{ ...skeletonStyle, ...style }}\n      {...restProps}\n    >\n      {children || <>&zwnj;</>}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","RootComponent","styles","Skeleton","width","height","inlineSize","blockSize","maxWidth","maxInlineSize","borderRadius","style","children","colorFrom","colorTo","noAnimation","duration","margin","restProps","skeletonStyle","Number","isFinite","Component","baseClassName"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,OAAOC,YAAY,wBAAwB;AAoC3C;;;;;;;;;;CAUC,GACD,OAAO,MAAMC,WAAW,CAAC,EACvBC,KAAK,EACLC,MAAM,EACNC,UAAU,EACVC,SAAS,EACTC,QAAQ,EACRC,aAAa,EACbC,YAAY,EACZC,KAAK,EACLC,QAAQ,EACRC,SAAS,EACTC,OAAO,EACPC,WAAW,EACXC,QAAQ,EACRC,MAAM,EACN,GAAGC,WACW;IACd,MAAMC,gBAA2D;QAC/Df;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAO;IACF;IAEA,IAAIJ,WAAW;QACbM,aAAa,CAAC,uCAAuC,GAAGN;IAC1D;IAEA,IAAIC,SAAS;QACXK,aAAa,CAAC,qCAAqC,GAAGL;IACxD;IAEA,IAAIM,OAAOC,QAAQ,CAACL,WAAW;QAC7BG,aAAa,CAAC,+CAA+C,GAAG,CAAC,EAAEH,SAAS,CAAC,CAAC;IAChF;IAEA,qBACE,KAACf;QACCqB,WAAU;QACVC,eAAevB,WACbE,MAAM,CAAC,WAAW,EAClBa,eAAeb,MAAM,CAAC,6BAA6B;QAErDS,OAAO;YAAE,GAAGQ,aAAa;YAAE,GAAGR,KAAK;QAAC;QACnC,GAAGO,SAAS;kBAEZN,0BAAY;sBAAE;;;AAGrB,EAAE"}
+{"version":3,"sources":["../../../../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { CSSCustomProperties, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './Skeleton.module.css';\n\nexport interface SkeletonProps\n  extends HTMLAttributesWithRootRef<HTMLDivElement | HTMLSpanElement>,\n    Pick<\n      React.CSSProperties,\n      | 'width'\n      | 'height'\n      | 'inlineSize'\n      | 'blockSize'\n      | 'maxWidth'\n      | 'maxInlineSize'\n      | 'borderRadius'\n      | 'margin'\n    > {\n  /**\n   * Начальный цвет анимации\n   */\n  colorFrom?: string;\n\n  /**\n   * Финальный цвет анимации\n   */\n  colorTo?: string;\n\n  /**\n   * Выключает анимацию, в результате чего показывается только один цвет\n   */\n  noAnimation?: boolean;\n\n  /**\n   * Длительность анимации в секундах\n   */\n  duration?: number;\n}\n\n/**\n * > Старайтесь минимизировать количество заглушек на экране. Не каждый элемент\n * > на экране должен заменяться заглушкой.\n * >\n * > Текстовые блоки лучше сокращать до трёх строк. Ширина последней строки\n * > скелета вычисляется, как 75% от ширины текстового блока. Высота скелетона\n * > автоматически подстраивается под размер шрифта, поэтому идеально\n * > вписывается в слоты компонентов, которые обычно ожидают текст.\n *\n * @since 6.1.0\n */\nexport const Skeleton = ({\n  width,\n  height,\n  inlineSize,\n  blockSize,\n  maxWidth,\n  maxInlineSize,\n  borderRadius,\n  style,\n  children,\n  colorFrom,\n  colorTo,\n  noAnimation,\n  duration,\n  margin,\n  ...restProps\n}: SkeletonProps): React.ReactNode => {\n  const skeletonStyle: React.CSSProperties & CSSCustomProperties = {\n    width,\n    height,\n    inlineSize,\n    blockSize,\n    maxWidth,\n    maxInlineSize,\n    borderRadius,\n    margin,\n  };\n\n  if (colorFrom) {\n    skeletonStyle['--vkui_internal--skeleton_color_from'] = colorFrom;\n  }\n\n  if (colorTo) {\n    skeletonStyle['--vkui_internal--skeleton_color_to'] = colorTo;\n  }\n\n  if (Number.isFinite(duration)) {\n    skeletonStyle['--vkui_internal--skeleton_animation_duration'] = `${duration}s`;\n  }\n\n  return (\n    <RootComponent\n      Component=\"span\"\n      baseClassName={classNames(\n        styles['Skeleton'],\n        noAnimation && styles['Skeleton--disableAnimation'],\n      )}\n      style={{ ...skeletonStyle, ...style }}\n      {...restProps}\n    >\n      {children || <>&zwnj;</>}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","RootComponent","styles","Skeleton","width","height","inlineSize","blockSize","maxWidth","maxInlineSize","borderRadius","style","children","colorFrom","colorTo","noAnimation","duration","margin","restProps","skeletonStyle","Number","isFinite","Component","baseClassName"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,OAAOC,YAAY,wBAAwB;AAoC3C;;;;;;;;;;CAUC,GACD,OAAO,MAAMC,WAAW,CAAC,EACvBC,KAAK,EACLC,MAAM,EACNC,UAAU,EACVC,SAAS,EACTC,QAAQ,EACRC,aAAa,EACbC,YAAY,EACZC,KAAK,EACLC,QAAQ,EACRC,SAAS,EACTC,OAAO,EACPC,WAAW,EACXC,QAAQ,EACRC,MAAM,EACN,GAAGC,WACW;IACd,MAAMC,gBAA2D;QAC/Df;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAO;IACF;IAEA,IAAIJ,WAAW;QACbM,aAAa,CAAC,uCAAuC,GAAGN;IAC1D;IAEA,IAAIC,SAAS;QACXK,aAAa,CAAC,qCAAqC,GAAGL;IACxD;IAEA,IAAIM,OAAOC,QAAQ,CAACL,WAAW;QAC7BG,aAAa,CAAC,+CAA+C,GAAG,CAAC,EAAEH,SAAS,CAAC,CAAC;IAChF;IAEA,qBACE,KAACf;QACCqB,WAAU;QACVC,eAAevB,WACbE,MAAM,CAAC,WAAW,EAClBa,eAAeb,MAAM,CAAC,6BAA6B;QAErDS,OAAO;YAAE,GAAGQ,aAAa;YAAE,GAAGR,KAAK;QAAC;QACnC,GAAGO,SAAS;kBAEZN,0BAAY;sBAAE;;;AAGrB,EAAE"}

package/dist/cssm/components/Slider/Slider.d.ts

@@ -41,5 +41,5 @@ export interface SliderMultipleProps extends SliderBaseProps {
 /**
  * @see https://vkcom.github.io/VKUI/#/Slider
  */
-export declare const Slider: ({ step, min, max, value: valueProp, multiple: multipleProp, defaultValue, disabled, className, getRootRef, getAriaLabel, getAriaValueText, onChange, withTooltip, size, ...restProps }: SliderProps | SliderMultipleProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Slider: ({ step, min, max, value: valueProp, multiple: multipleProp, defaultValue, disabled, className, getRootRef, getAriaLabel, getAriaValueText, onChange, withTooltip, size, ...restProps }: SliderProps | SliderMultipleProps) => React.ReactNode;
 //# sourceMappingURL=Slider.d.ts.map

package/dist/cssm/components/Slider/Slider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,EAAS,KAAK,UAAU,EAA0B,MAAM,gBAAgB,CAAC;AA0BhF,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,cAAc,GAAG,UAAU,CAAC;IAC9F,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACzC;;;;;;OAMG;IACH,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC5D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;CACxB;AAED,MAAM,WAAW,WAAY,SAAQ,eAAe;IAClD,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,GAAG,KAAK,CAAC,WAAW,KAAK,IAAI,CAAC;CAC3E;AAED,MAAM,WAAW,mBAAoB,SAAQ,eAAe;IAC1D,QAAQ,EAAE,IAAI,CAAC;IACf,KAAK,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACzB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,KAAK,EAAE,UAAU,GAAG,KAAK,CAAC,WAAW,KAAK,IAAI,CAAC;CACrF;AAED;;GAEG;AACH,eAAO,MAAM,MAAM,2LAgBhB,WAAW,GAAG,mBAAmB,4CAwMnC,CAAC"}
+{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,EAAS,KAAK,UAAU,EAA0B,MAAM,gBAAgB,CAAC;AA0BhF,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,cAAc,GAAG,UAAU,CAAC;IAC9F,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACzC;;;;;;OAMG;IACH,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC5D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;CACxB;AAED,MAAM,WAAW,WAAY,SAAQ,eAAe;IAClD,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,GAAG,KAAK,CAAC,WAAW,KAAK,IAAI,CAAC;CAC3E;AAED,MAAM,WAAW,mBAAoB,SAAQ,eAAe;IAC1D,QAAQ,EAAE,IAAI,CAAC;IACf,KAAK,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACzB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,KAAK,EAAE,UAAU,GAAG,KAAK,CAAC,WAAW,KAAK,IAAI,CAAC;CACrF;AAED;;GAEG;AACH,eAAO,MAAM,MAAM,2LAgBhB,WAAW,GAAG,mBAAmB,KAAG,KAAK,CAAC,SAwM5C,CAAC"}

package/dist/cssm/components/Slider/Slider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Slider/Slider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { clamp } from '../../helpers/math';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { Touch, type TouchEvent, type TouchEventHandler } from '../Touch/Touch';\nimport { SliderThumb } from './SliderThumb/SliderThumb';\nimport {\n  extractSliderAriaAttributesFromRestProps,\n  getDraggingTypeByTargetDataset,\n  isMultipleValues,\n  offsetToValue,\n  snapDirection,\n  toPercent,\n  updateInternalStateValue,\n  updateInternalStateValueByNativeChange,\n} from './helpers';\nimport type { InternalDraggingType, InternalGestureRef, InternalValueState } from './types';\nimport styles from './Slider.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Slider--sizeY-none'],\n  ['compact']: styles['Slider--sizeY-compact'],\n};\n\nconst sizeClassNames = {\n  l: styles['Slider--size-l'],\n  m: styles['Slider--size-m'],\n  s: styles['Slider--size-s'],\n};\n\nexport interface SliderBaseProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'value' | 'defaultValue' | 'onChange'> {\n  min?: number;\n  max?: number;\n  step?: number;\n  disabled?: boolean;\n  /**\n   * Тоже самое, что и `aria-label`, но на вход можно получать индекс текущего ползунка и в зависимости от этого выдавать разный текст.\n   *\n   * > Перебивает `aria-label`.\n   */\n  getAriaLabel?: (index: number) => string;\n  /**\n   * В отличие от `aria-valuetext`, позволяет более гибко форматировать текст в зависимости от значения ползунка.\n   *\n   * Полезно при использовании компонента как неконтролируемого.\n   *\n   * > Перебивает `aria-valuetext`.\n   */\n  getAriaValueText?: (value: number, index: number) => string;\n  withTooltip?: boolean;\n  /**\n   * Размер ползунка.\n   */\n  size?: 's' | 'm' | 'l';\n}\n\nexport interface SliderProps extends SliderBaseProps {\n  multiple?: false;\n  value?: number;\n  defaultValue?: number;\n  onChange?: (value: number, event: TouchEvent | React.ChangeEvent) => void;\n}\n\nexport interface SliderMultipleProps extends SliderBaseProps {\n  multiple: true;\n  value?: [number, number];\n  defaultValue?: [number, number];\n  onChange?: (value: [number, number], event: TouchEvent | React.ChangeEvent) => void;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Slider\n */\nexport const Slider = ({\n  step = 1,\n  min = 0,\n  max = 100,\n  value: valueProp,\n  multiple: multipleProp,\n  defaultValue = multipleProp ? [min, max] : min,\n  disabled,\n  className,\n  getRootRef,\n  getAriaLabel,\n  getAriaValueText,\n  onChange,\n  withTooltip,\n  size = 'l',\n  ...restProps\n}: SliderProps | SliderMultipleProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const isControlled = valueProp !== undefined;\n  const [localValue, setValue] = React.useState(defaultValue);\n\n  const value = React.useMemo<InternalValueState>(() => {\n    const resolvedValue = isControlled ? valueProp : localValue;\n    return Array.isArray(resolvedValue)\n      ? [clamp(resolvedValue[0], min, max), clamp(resolvedValue[1], min, max)]\n      : [clamp(resolvedValue, min, max), null];\n  }, [isControlled, valueProp, localValue, min, max]);\n\n  const [startValue, endValue] = value;\n  const multiple = multipleProp && endValue !== null;\n  const startValueInPercent = toPercent(startValue, min, max);\n  const endReversedValueInPercent = multiple ? toPercent(endValue, min, max) : 0;\n  const [activeThumb, setActiveThumb] = React.useState<InternalDraggingType | null>(null);\n\n  const gesture = React.useRef<InternalGestureRef>({\n    dragging: null,\n    startX: 0,\n    containerWidth: 0,\n  }).current;\n  const thumbsContainerRef = useExternRef(getRootRef);\n  const thumbStartInputRef = React.useRef<HTMLInputElement>(null);\n  const thumbEndInputRef = React.useRef<HTMLInputElement>(null);\n\n  const { ariaLabel, ariaValueText, ariaLabelledBy, ...restPropsWithoutAriaAttributes } =\n    extractSliderAriaAttributesFromRestProps(restProps);\n\n  const changeValue = (nextValue: InternalValueState, event: TouchEvent | React.ChangeEvent) => {\n    if (disabled || (value[0] === nextValue[0] && value[1] === nextValue[1])) {\n      return;\n    }\n\n    if (multipleProp) {\n      if (isMultipleValues(nextValue)) {\n        !isControlled && setValue(nextValue);\n        onChange && onChange(nextValue, event);\n      }\n    } else {\n      !isControlled && setValue(nextValue[0]);\n      onChange && onChange(nextValue[0], event);\n    }\n  };\n\n  const handlePointerStart: TouchEventHandler = (event: TouchEvent) => {\n    if (!thumbsContainerRef.current) {\n      return;\n    }\n\n    const { left: nextContainerX, width: nextContainerWidth } =\n      thumbsContainerRef.current.getBoundingClientRect();\n\n    // @ts-expect-error: TS2345 в VKUITouchEvent плохо описаны типы. `target` это просто `EventTarget`.\n    const foundDraggingType = getDraggingTypeByTargetDataset(event.originalEvent.target);\n\n    const nextStartX = event.startX - nextContainerX;\n    const nextValue = offsetToValue(nextStartX, nextContainerWidth, min, max, step);\n    const nextDragging = snapDirection(value, nextValue, foundDraggingType);\n\n    gesture.dragging = nextDragging;\n    gesture.containerWidth = nextContainerWidth;\n    gesture.startX = nextStartX;\n\n    const updatedInternalStateValue = updateInternalStateValue(\n      value,\n      nextValue,\n      min,\n      max,\n      nextDragging,\n    );\n\n    const [nextStartValue, nextEndValue] = updatedInternalStateValue;\n    if (\n      thumbStartInputRef.current &&\n      (foundDraggingType === 'start' ||\n        (nextStartValue !== startValue && nextEndValue === endValue))\n    ) {\n      thumbStartInputRef.current.focus();\n      event.originalEvent.preventDefault();\n    } else if (\n      thumbEndInputRef.current &&\n      (foundDraggingType === 'end' || (nextEndValue !== endValue && nextStartValue === startValue))\n    ) {\n      thumbEndInputRef.current.focus();\n      event.originalEvent.preventDefault();\n    }\n\n    changeValue(updatedInternalStateValue, event);\n\n    event.originalEvent.stopPropagation();\n    setActiveThumb(gesture.dragging);\n  };\n\n  const handlePointerMove: TouchEventHandler = (event: TouchEvent) => {\n    const { startX, containerWidth, dragging } = gesture;\n\n    const { shiftX = 0 } = event;\n    const nextStartX = startX + shiftX;\n    const nextValue = offsetToValue(nextStartX, containerWidth, min, max, step);\n\n    changeValue(updateInternalStateValue(value, nextValue, min, max, dragging), event);\n\n    event.originalEvent.stopPropagation();\n    event.originalEvent.preventDefault();\n  };\n\n  const handlePointerEnd: TouchEventHandler = (event) => {\n    gesture.dragging = null;\n    event.originalEvent.stopPropagation();\n    setActiveThumb(null);\n  };\n\n  const handleChangeByNativeInput = (event: React.ChangeEvent<HTMLInputElement>) => {\n    changeValue(\n      updateInternalStateValueByNativeChange(\n        value,\n        Number(event.target.value),\n        getDraggingTypeByTargetDataset(event.target),\n      ),\n      event,\n    );\n  };\n\n  return (\n    <Touch\n      data-value={multiple ? `${startValue},${endValue}` : startValue}\n      {...restPropsWithoutAriaAttributes}\n      className={classNames(\n        styles['Slider'],\n        disabled && styles['Slider--disabled'],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        sizeClassNames[size],\n        className,\n      )}\n      onStart={disabled ? undefined : handlePointerStart}\n      onMove={disabled ? undefined : handlePointerMove}\n      onEnd={disabled ? undefined : handlePointerEnd}\n    >\n      <div className={styles['Slider__track']} />\n      <div\n        className={styles['Slider__track-fill']}\n        style={\n          multiple\n            ? { left: `${startValueInPercent}%`, right: `${100 - endReversedValueInPercent}%` }\n            : { width: `${startValueInPercent}%` }\n        }\n      />\n      <div ref={thumbsContainerRef} className={styles['Slider__thumbs']}>\n        <SliderThumb\n          data-type=\"start\"\n          className={styles['Slider__thumb']}\n          style={{\n            left: `${startValueInPercent}%`,\n            // Меняем местами порядок слоёв, иначе, при достижении `start` и `end` 100%, `end` будет перекрывать `start`.\n            zIndex: multiple && startValueInPercent >= 50 ? 2 : undefined,\n          }}\n          withTooltip={withTooltip}\n          inputProps={{\n            'data-type': 'start',\n            'ref': thumbStartInputRef,\n            'step': step,\n            'min': min,\n            'value': startValue,\n            'max': multiple ? endValue : max,\n            'disabled': disabled,\n            'aria-label': getAriaLabel ? getAriaLabel(0) : ariaLabel,\n            'aria-valuetext': getAriaValueText ? getAriaValueText(startValue, 0) : ariaValueText,\n            'aria-labelledby': ariaLabelledBy,\n            'onChange': handleChangeByNativeInput,\n          }}\n          isActive={activeThumb === 'start'}\n        />\n        {multiple && (\n          <SliderThumb\n            data-type=\"end\"\n            className={styles['Slider__thumb']}\n            style={{ left: `${endReversedValueInPercent}%` }}\n            withTooltip={withTooltip}\n            inputProps={{\n              'data-type': 'end',\n              'ref': thumbEndInputRef,\n              'step': step,\n              'min': startValue,\n              'value': endValue,\n              'max': max,\n              'disabled': disabled,\n              'aria-label': getAriaLabel ? getAriaLabel(1) : ariaLabel,\n              'aria-valuetext': getAriaValueText ? getAriaValueText(endValue, 1) : ariaValueText,\n              'aria-labelledby': ariaLabelledBy,\n              'onChange': handleChangeByNativeInput,\n            }}\n            isActive={activeThumb === 'end'}\n          />\n        )}\n      </div>\n    </Touch>\n  );\n};\n"],"names":["React","classNames","clamp","useAdaptivity","useExternRef","Touch","SliderThumb","extractSliderAriaAttributesFromRestProps","getDraggingTypeByTargetDataset","isMultipleValues","offsetToValue","snapDirection","toPercent","updateInternalStateValue","updateInternalStateValueByNativeChange","styles","sizeYClassNames","none","sizeClassNames","l","m","s","Slider","step","min","max","value","valueProp","multiple","multipleProp","defaultValue","disabled","className","getRootRef","getAriaLabel","getAriaValueText","onChange","withTooltip","size","restProps","sizeY","isControlled","undefined","localValue","setValue","useState","useMemo","resolvedValue","Array","isArray","startValue","endValue","startValueInPercent","endReversedValueInPercent","activeThumb","setActiveThumb","gesture","useRef","dragging","startX","containerWidth","current","thumbsContainerRef","thumbStartInputRef","thumbEndInputRef","ariaLabel","ariaValueText","ariaLabelledBy","restPropsWithoutAriaAttributes","changeValue","nextValue","event","handlePointerStart","left","nextContainerX","width","nextContainerWidth","getBoundingClientRect","foundDraggingType","originalEvent","target","nextStartX","nextDragging","updatedInternalStateValue","nextStartValue","nextEndValue","focus","preventDefault","stopPropagation","handlePointerMove","shiftX","handlePointerEnd","handleChangeByNativeInput","Number","data-value","onStart","onMove","onEnd","div","style","right","ref","data-type","zIndex","inputProps","isActive"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/Slider/Slider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { clamp } from '../../helpers/math';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { Touch, type TouchEvent, type TouchEventHandler } from '../Touch/Touch';\nimport { SliderThumb } from './SliderThumb/SliderThumb';\nimport {\n  extractSliderAriaAttributesFromRestProps,\n  getDraggingTypeByTargetDataset,\n  isMultipleValues,\n  offsetToValue,\n  snapDirection,\n  toPercent,\n  updateInternalStateValue,\n  updateInternalStateValueByNativeChange,\n} from './helpers';\nimport type { InternalDraggingType, InternalGestureRef, InternalValueState } from './types';\nimport styles from './Slider.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Slider--sizeY-none'],\n  ['compact']: styles['Slider--sizeY-compact'],\n};\n\nconst sizeClassNames = {\n  l: styles['Slider--size-l'],\n  m: styles['Slider--size-m'],\n  s: styles['Slider--size-s'],\n};\n\nexport interface SliderBaseProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'value' | 'defaultValue' | 'onChange'> {\n  min?: number;\n  max?: number;\n  step?: number;\n  disabled?: boolean;\n  /**\n   * Тоже самое, что и `aria-label`, но на вход можно получать индекс текущего ползунка и в зависимости от этого выдавать разный текст.\n   *\n   * > Перебивает `aria-label`.\n   */\n  getAriaLabel?: (index: number) => string;\n  /**\n   * В отличие от `aria-valuetext`, позволяет более гибко форматировать текст в зависимости от значения ползунка.\n   *\n   * Полезно при использовании компонента как неконтролируемого.\n   *\n   * > Перебивает `aria-valuetext`.\n   */\n  getAriaValueText?: (value: number, index: number) => string;\n  withTooltip?: boolean;\n  /**\n   * Размер ползунка.\n   */\n  size?: 's' | 'm' | 'l';\n}\n\nexport interface SliderProps extends SliderBaseProps {\n  multiple?: false;\n  value?: number;\n  defaultValue?: number;\n  onChange?: (value: number, event: TouchEvent | React.ChangeEvent) => void;\n}\n\nexport interface SliderMultipleProps extends SliderBaseProps {\n  multiple: true;\n  value?: [number, number];\n  defaultValue?: [number, number];\n  onChange?: (value: [number, number], event: TouchEvent | React.ChangeEvent) => void;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Slider\n */\nexport const Slider = ({\n  step = 1,\n  min = 0,\n  max = 100,\n  value: valueProp,\n  multiple: multipleProp,\n  defaultValue = multipleProp ? [min, max] : min,\n  disabled,\n  className,\n  getRootRef,\n  getAriaLabel,\n  getAriaValueText,\n  onChange,\n  withTooltip,\n  size = 'l',\n  ...restProps\n}: SliderProps | SliderMultipleProps): React.ReactNode => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const isControlled = valueProp !== undefined;\n  const [localValue, setValue] = React.useState(defaultValue);\n\n  const value = React.useMemo<InternalValueState>(() => {\n    const resolvedValue = isControlled ? valueProp : localValue;\n    return Array.isArray(resolvedValue)\n      ? [clamp(resolvedValue[0], min, max), clamp(resolvedValue[1], min, max)]\n      : [clamp(resolvedValue, min, max), null];\n  }, [isControlled, valueProp, localValue, min, max]);\n\n  const [startValue, endValue] = value;\n  const multiple = multipleProp && endValue !== null;\n  const startValueInPercent = toPercent(startValue, min, max);\n  const endReversedValueInPercent = multiple ? toPercent(endValue, min, max) : 0;\n  const [activeThumb, setActiveThumb] = React.useState<InternalDraggingType | null>(null);\n\n  const gesture = React.useRef<InternalGestureRef>({\n    dragging: null,\n    startX: 0,\n    containerWidth: 0,\n  }).current;\n  const thumbsContainerRef = useExternRef(getRootRef);\n  const thumbStartInputRef = React.useRef<HTMLInputElement>(null);\n  const thumbEndInputRef = React.useRef<HTMLInputElement>(null);\n\n  const { ariaLabel, ariaValueText, ariaLabelledBy, ...restPropsWithoutAriaAttributes } =\n    extractSliderAriaAttributesFromRestProps(restProps);\n\n  const changeValue = (nextValue: InternalValueState, event: TouchEvent | React.ChangeEvent) => {\n    if (disabled || (value[0] === nextValue[0] && value[1] === nextValue[1])) {\n      return;\n    }\n\n    if (multipleProp) {\n      if (isMultipleValues(nextValue)) {\n        !isControlled && setValue(nextValue);\n        onChange && onChange(nextValue, event);\n      }\n    } else {\n      !isControlled && setValue(nextValue[0]);\n      onChange && onChange(nextValue[0], event);\n    }\n  };\n\n  const handlePointerStart: TouchEventHandler = (event: TouchEvent) => {\n    if (!thumbsContainerRef.current) {\n      return;\n    }\n\n    const { left: nextContainerX, width: nextContainerWidth } =\n      thumbsContainerRef.current.getBoundingClientRect();\n\n    // @ts-expect-error: TS2345 в VKUITouchEvent плохо описаны типы. `target` это просто `EventTarget`.\n    const foundDraggingType = getDraggingTypeByTargetDataset(event.originalEvent.target);\n\n    const nextStartX = event.startX - nextContainerX;\n    const nextValue = offsetToValue(nextStartX, nextContainerWidth, min, max, step);\n    const nextDragging = snapDirection(value, nextValue, foundDraggingType);\n\n    gesture.dragging = nextDragging;\n    gesture.containerWidth = nextContainerWidth;\n    gesture.startX = nextStartX;\n\n    const updatedInternalStateValue = updateInternalStateValue(\n      value,\n      nextValue,\n      min,\n      max,\n      nextDragging,\n    );\n\n    const [nextStartValue, nextEndValue] = updatedInternalStateValue;\n    if (\n      thumbStartInputRef.current &&\n      (foundDraggingType === 'start' ||\n        (nextStartValue !== startValue && nextEndValue === endValue))\n    ) {\n      thumbStartInputRef.current.focus();\n      event.originalEvent.preventDefault();\n    } else if (\n      thumbEndInputRef.current &&\n      (foundDraggingType === 'end' || (nextEndValue !== endValue && nextStartValue === startValue))\n    ) {\n      thumbEndInputRef.current.focus();\n      event.originalEvent.preventDefault();\n    }\n\n    changeValue(updatedInternalStateValue, event);\n\n    event.originalEvent.stopPropagation();\n    setActiveThumb(gesture.dragging);\n  };\n\n  const handlePointerMove: TouchEventHandler = (event: TouchEvent) => {\n    const { startX, containerWidth, dragging } = gesture;\n\n    const { shiftX = 0 } = event;\n    const nextStartX = startX + shiftX;\n    const nextValue = offsetToValue(nextStartX, containerWidth, min, max, step);\n\n    changeValue(updateInternalStateValue(value, nextValue, min, max, dragging), event);\n\n    event.originalEvent.stopPropagation();\n    event.originalEvent.preventDefault();\n  };\n\n  const handlePointerEnd: TouchEventHandler = (event) => {\n    gesture.dragging = null;\n    event.originalEvent.stopPropagation();\n    setActiveThumb(null);\n  };\n\n  const handleChangeByNativeInput = (event: React.ChangeEvent<HTMLInputElement>) => {\n    changeValue(\n      updateInternalStateValueByNativeChange(\n        value,\n        Number(event.target.value),\n        getDraggingTypeByTargetDataset(event.target),\n      ),\n      event,\n    );\n  };\n\n  return (\n    <Touch\n      data-value={multiple ? `${startValue},${endValue}` : startValue}\n      {...restPropsWithoutAriaAttributes}\n      className={classNames(\n        styles['Slider'],\n        disabled && styles['Slider--disabled'],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        sizeClassNames[size],\n        className,\n      )}\n      onStart={disabled ? undefined : handlePointerStart}\n      onMove={disabled ? undefined : handlePointerMove}\n      onEnd={disabled ? undefined : handlePointerEnd}\n    >\n      <div className={styles['Slider__track']} />\n      <div\n        className={styles['Slider__track-fill']}\n        style={\n          multiple\n            ? { left: `${startValueInPercent}%`, right: `${100 - endReversedValueInPercent}%` }\n            : { width: `${startValueInPercent}%` }\n        }\n      />\n      <div ref={thumbsContainerRef} className={styles['Slider__thumbs']}>\n        <SliderThumb\n          data-type=\"start\"\n          className={styles['Slider__thumb']}\n          style={{\n            left: `${startValueInPercent}%`,\n            // Меняем местами порядок слоёв, иначе, при достижении `start` и `end` 100%, `end` будет перекрывать `start`.\n            zIndex: multiple && startValueInPercent >= 50 ? 2 : undefined,\n          }}\n          withTooltip={withTooltip}\n          inputProps={{\n            'data-type': 'start',\n            'ref': thumbStartInputRef,\n            'step': step,\n            'min': min,\n            'value': startValue,\n            'max': multiple ? endValue : max,\n            'disabled': disabled,\n            'aria-label': getAriaLabel ? getAriaLabel(0) : ariaLabel,\n            'aria-valuetext': getAriaValueText ? getAriaValueText(startValue, 0) : ariaValueText,\n            'aria-labelledby': ariaLabelledBy,\n            'onChange': handleChangeByNativeInput,\n          }}\n          isActive={activeThumb === 'start'}\n        />\n        {multiple && (\n          <SliderThumb\n            data-type=\"end\"\n            className={styles['Slider__thumb']}\n            style={{ left: `${endReversedValueInPercent}%` }}\n            withTooltip={withTooltip}\n            inputProps={{\n              'data-type': 'end',\n              'ref': thumbEndInputRef,\n              'step': step,\n              'min': startValue,\n              'value': endValue,\n              'max': max,\n              'disabled': disabled,\n              'aria-label': getAriaLabel ? getAriaLabel(1) : ariaLabel,\n              'aria-valuetext': getAriaValueText ? getAriaValueText(endValue, 1) : ariaValueText,\n              'aria-labelledby': ariaLabelledBy,\n              'onChange': handleChangeByNativeInput,\n            }}\n            isActive={activeThumb === 'end'}\n          />\n        )}\n      </div>\n    </Touch>\n  );\n};\n"],"names":["React","classNames","clamp","useAdaptivity","useExternRef","Touch","SliderThumb","extractSliderAriaAttributesFromRestProps","getDraggingTypeByTargetDataset","isMultipleValues","offsetToValue","snapDirection","toPercent","updateInternalStateValue","updateInternalStateValueByNativeChange","styles","sizeYClassNames","none","sizeClassNames","l","m","s","Slider","step","min","max","value","valueProp","multiple","multipleProp","defaultValue","disabled","className","getRootRef","getAriaLabel","getAriaValueText","onChange","withTooltip","size","restProps","sizeY","isControlled","undefined","localValue","setValue","useState","useMemo","resolvedValue","Array","isArray","startValue","endValue","startValueInPercent","endReversedValueInPercent","activeThumb","setActiveThumb","gesture","useRef","dragging","startX","containerWidth","current","thumbsContainerRef","thumbStartInputRef","thumbEndInputRef","ariaLabel","ariaValueText","ariaLabelledBy","restPropsWithoutAriaAttributes","changeValue","nextValue","event","handlePointerStart","left","nextContainerX","width","nextContainerWidth","getBoundingClientRect","foundDraggingType","originalEvent","target","nextStartX","nextDragging","updatedInternalStateValue","nextStartValue","nextEndValue","focus","preventDefault","stopPropagation","handlePointerMove","shiftX","handlePointerEnd","handleChangeByNativeInput","Number","data-value","onStart","onMove","onEnd","div","style","right","ref","data-type","zIndex","inputProps","isActive"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,KAAK,QAAQ,qBAAqB;AAC3C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,YAAY,QAAQ,2BAA2B;AAExD,SAASC,KAAK,QAAiD,iBAAiB;AAChF,SAASC,WAAW,QAAQ,4BAA4B;AACxD,SACEC,wCAAwC,EACxCC,8BAA8B,EAC9BC,gBAAgB,EAChBC,aAAa,EACbC,aAAa,EACbC,SAAS,EACTC,wBAAwB,EACxBC,sCAAsC,QACjC,YAAY;AAEnB,OAAOC,YAAY,sBAAsB;AAEzC,MAAMC,kBAAkB;IACtBC,MAAMF,MAAM,CAAC,qBAAqB;IAClC,CAAC,UAAU,EAAEA,MAAM,CAAC,wBAAwB;AAC9C;AAEA,MAAMG,iBAAiB;IACrBC,GAAGJ,MAAM,CAAC,iBAAiB;IAC3BK,GAAGL,MAAM,CAAC,iBAAiB;IAC3BM,GAAGN,MAAM,CAAC,iBAAiB;AAC7B;AA2CA;;CAEC,GACD,OAAO,MAAMO,SAAS,CAAC,EACrBC,OAAO,CAAC,EACRC,MAAM,CAAC,EACPC,MAAM,GAAG,EACTC,OAAOC,SAAS,EAChBC,UAAUC,YAAY,EACtBC,eAAeD,eAAe;IAACL;IAAKC;CAAI,GAAGD,GAAG,EAC9CO,QAAQ,EACRC,SAAS,EACTC,UAAU,EACVC,YAAY,EACZC,gBAAgB,EAChBC,QAAQ,EACRC,WAAW,EACXC,OAAO,GAAG,EACV,GAAGC,WAC+B;IAClC,MAAM,EAAEC,QAAQ,MAAM,EAAE,GAAGrC;IAE3B,MAAMsC,eAAed,cAAce;IACnC,MAAM,CAACC,YAAYC,SAAS,GAAG5C,MAAM6C,QAAQ,CAACf;IAE9C,MAAMJ,QAAQ1B,MAAM8C,OAAO,CAAqB;QAC9C,MAAMC,gBAAgBN,eAAed,YAAYgB;QACjD,OAAOK,MAAMC,OAAO,CAACF,iBACjB;YAAC7C,MAAM6C,aAAa,CAAC,EAAE,EAAEvB,KAAKC;YAAMvB,MAAM6C,aAAa,CAAC,EAAE,EAAEvB,KAAKC;SAAK,GACtE;YAACvB,MAAM6C,eAAevB,KAAKC;YAAM;SAAK;IAC5C,GAAG;QAACgB;QAAcd;QAAWgB;QAAYnB;QAAKC;KAAI;IAElD,MAAM,CAACyB,YAAYC,SAAS,GAAGzB;IAC/B,MAAME,WAAWC,gBAAgBsB,aAAa;IAC9C,MAAMC,sBAAsBxC,UAAUsC,YAAY1B,KAAKC;IACvD,MAAM4B,4BAA4BzB,WAAWhB,UAAUuC,UAAU3B,KAAKC,OAAO;IAC7E,MAAM,CAAC6B,aAAaC,eAAe,GAAGvD,MAAM6C,QAAQ,CAA8B;IAElF,MAAMW,UAAUxD,MAAMyD,MAAM,CAAqB;QAC/CC,UAAU;QACVC,QAAQ;QACRC,gBAAgB;IAClB,GAAGC,OAAO;IACV,MAAMC,qBAAqB1D,aAAa6B;IACxC,MAAM8B,qBAAqB/D,MAAMyD,MAAM,CAAmB;IAC1D,MAAMO,mBAAmBhE,MAAMyD,MAAM,CAAmB;IAExD,MAAM,EAAEQ,SAAS,EAAEC,aAAa,EAAEC,cAAc,EAAE,GAAGC,gCAAgC,GACnF7D,yCAAyCgC;IAE3C,MAAM8B,cAAc,CAACC,WAA+BC;QAClD,IAAIxC,YAAaL,KAAK,CAAC,EAAE,KAAK4C,SAAS,CAAC,EAAE,IAAI5C,KAAK,CAAC,EAAE,KAAK4C,SAAS,CAAC,EAAE,EAAG;YACxE;QACF;QAEA,IAAIzC,cAAc;YAChB,IAAIpB,iBAAiB6D,YAAY;gBAC/B,CAAC7B,gBAAgBG,SAAS0B;gBAC1BlC,YAAYA,SAASkC,WAAWC;YAClC;QACF,OAAO;YACL,CAAC9B,gBAAgBG,SAAS0B,SAAS,CAAC,EAAE;YACtClC,YAAYA,SAASkC,SAAS,CAAC,EAAE,EAAEC;QACrC;IACF;IAEA,MAAMC,qBAAwC,CAACD;QAC7C,IAAI,CAACT,mBAAmBD,OAAO,EAAE;YAC/B;QACF;QAEA,MAAM,EAAEY,MAAMC,cAAc,EAAEC,OAAOC,kBAAkB,EAAE,GACvDd,mBAAmBD,OAAO,CAACgB,qBAAqB;QAElD,mGAAmG;QACnG,MAAMC,oBAAoBtE,+BAA+B+D,MAAMQ,aAAa,CAACC,MAAM;QAEnF,MAAMC,aAAaV,MAAMZ,MAAM,GAAGe;QAClC,MAAMJ,YAAY5D,cAAcuE,YAAYL,oBAAoBpD,KAAKC,KAAKF;QAC1E,MAAM2D,eAAevE,cAAce,OAAO4C,WAAWQ;QAErDtB,QAAQE,QAAQ,GAAGwB;QACnB1B,QAAQI,cAAc,GAAGgB;QACzBpB,QAAQG,MAAM,GAAGsB;QAEjB,MAAME,4BAA4BtE,yBAChCa,OACA4C,WACA9C,KACAC,KACAyD;QAGF,MAAM,CAACE,gBAAgBC,aAAa,GAAGF;QACvC,IACEpB,mBAAmBF,OAAO,IACzBiB,CAAAA,sBAAsB,WACpBM,mBAAmBlC,cAAcmC,iBAAiBlC,QAAQ,GAC7D;YACAY,mBAAmBF,OAAO,CAACyB,KAAK;YAChCf,MAAMQ,aAAa,CAACQ,cAAc;QACpC,OAAO,IACLvB,iBAAiBH,OAAO,IACvBiB,CAAAA,sBAAsB,SAAUO,iBAAiBlC,YAAYiC,mBAAmBlC,UAAU,GAC3F;YACAc,iBAAiBH,OAAO,CAACyB,KAAK;YAC9Bf,MAAMQ,aAAa,CAACQ,cAAc;QACpC;QAEAlB,YAAYc,2BAA2BZ;QAEvCA,MAAMQ,aAAa,CAACS,eAAe;QACnCjC,eAAeC,QAAQE,QAAQ;IACjC;IAEA,MAAM+B,oBAAuC,CAAClB;QAC5C,MAAM,EAAEZ,MAAM,EAAEC,cAAc,EAAEF,QAAQ,EAAE,GAAGF;QAE7C,MAAM,EAAEkC,SAAS,CAAC,EAAE,GAAGnB;QACvB,MAAMU,aAAatB,SAAS+B;QAC5B,MAAMpB,YAAY5D,cAAcuE,YAAYrB,gBAAgBpC,KAAKC,KAAKF;QAEtE8C,YAAYxD,yBAAyBa,OAAO4C,WAAW9C,KAAKC,KAAKiC,WAAWa;QAE5EA,MAAMQ,aAAa,CAACS,eAAe;QACnCjB,MAAMQ,aAAa,CAACQ,cAAc;IACpC;IAEA,MAAMI,mBAAsC,CAACpB;QAC3Cf,QAAQE,QAAQ,GAAG;QACnBa,MAAMQ,aAAa,CAACS,eAAe;QACnCjC,eAAe;IACjB;IAEA,MAAMqC,4BAA4B,CAACrB;QACjCF,YACEvD,uCACEY,OACAmE,OAAOtB,MAAMS,MAAM,CAACtD,KAAK,GACzBlB,+BAA+B+D,MAAMS,MAAM,IAE7CT;IAEJ;IAEA,qBACE,MAAClE;QACCyF,cAAYlE,WAAW,CAAC,EAAEsB,WAAW,CAAC,EAAEC,SAAS,CAAC,GAAGD;QACpD,GAAGkB,8BAA8B;QAClCpC,WAAW/B,WACTc,MAAM,CAAC,SAAS,EAChBgB,YAAYhB,MAAM,CAAC,mBAAmB,EACtCyB,UAAU,aAAaxB,eAAe,CAACwB,MAAM,EAC7CtB,cAAc,CAACoB,KAAK,EACpBN;QAEF+D,SAAShE,WAAWW,YAAY8B;QAChCwB,QAAQjE,WAAWW,YAAY+C;QAC/BQ,OAAOlE,WAAWW,YAAYiD;;0BAE9B,KAACO;gBAAIlE,WAAWjB,MAAM,CAAC,gBAAgB;;0BACvC,KAACmF;gBACClE,WAAWjB,MAAM,CAAC,qBAAqB;gBACvCoF,OACEvE,WACI;oBAAE6C,MAAM,CAAC,EAAErB,oBAAoB,CAAC,CAAC;oBAAEgD,OAAO,CAAC,EAAE,MAAM/C,0BAA0B,CAAC,CAAC;gBAAC,IAChF;oBAAEsB,OAAO,CAAC,EAAEvB,oBAAoB,CAAC,CAAC;gBAAC;;0BAG3C,MAAC8C;gBAAIG,KAAKvC;gBAAoB9B,WAAWjB,MAAM,CAAC,iBAAiB;;kCAC/D,KAACT;wBACCgG,aAAU;wBACVtE,WAAWjB,MAAM,CAAC,gBAAgB;wBAClCoF,OAAO;4BACL1B,MAAM,CAAC,EAAErB,oBAAoB,CAAC,CAAC;4BAC/B,6GAA6G;4BAC7GmD,QAAQ3E,YAAYwB,uBAAuB,KAAK,IAAIV;wBACtD;wBACAL,aAAaA;wBACbmE,YAAY;4BACV,aAAa;4BACb,OAAOzC;4BACP,QAAQxC;4BACR,OAAOC;4BACP,SAAS0B;4BACT,OAAOtB,WAAWuB,WAAW1B;4BAC7B,YAAYM;4BACZ,cAAcG,eAAeA,aAAa,KAAK+B;4BAC/C,kBAAkB9B,mBAAmBA,iBAAiBe,YAAY,KAAKgB;4BACvE,mBAAmBC;4BACnB,YAAYyB;wBACd;wBACAa,UAAUnD,gBAAgB;;oBAE3B1B,0BACC,KAACtB;wBACCgG,aAAU;wBACVtE,WAAWjB,MAAM,CAAC,gBAAgB;wBAClCoF,OAAO;4BAAE1B,MAAM,CAAC,EAAEpB,0BAA0B,CAAC,CAAC;wBAAC;wBAC/ChB,aAAaA;wBACbmE,YAAY;4BACV,aAAa;4BACb,OAAOxC;4BACP,QAAQzC;4BACR,OAAO2B;4BACP,SAASC;4BACT,OAAO1B;4BACP,YAAYM;4BACZ,cAAcG,eAAeA,aAAa,KAAK+B;4BAC/C,kBAAkB9B,mBAAmBA,iBAAiBgB,UAAU,KAAKe;4BACrE,mBAAmBC;4BACnB,YAAYyB;wBACd;wBACAa,UAAUnD,gBAAgB;;;;;;AAMtC,EAAE"}

package/dist/cssm/components/Slider/SliderThumb/SliderThumb.d.ts

@@ -7,6 +7,6 @@ interface SliderThumbProps extends HasRootRef<HTMLSpanElement>, HasDataAttribute
     withTooltip?: boolean;
     isActive?: boolean;
 }
-export declare const SliderThumb: ({ className, getRootRef, inputProps, withTooltip, isActive, ...restProps }: SliderThumbProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SliderThumb: ({ className, getRootRef, inputProps, withTooltip, isActive, ...restProps }: SliderThumbProps) => React.ReactNode;
 export {};
 //# sourceMappingURL=SliderThumb.d.ts.map

package/dist/cssm/components/Slider/SliderThumb/SliderThumb.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SliderThumb.d.ts","sourceRoot":"","sources":["../../../../../src/components/Slider/SliderThumb/SliderThumb.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAc/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAInE,UAAU,gBAAiB,SAAQ,UAAU,CAAC,eAAe,CAAC,EAAE,gBAAgB;IAC9E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,UAAU,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,GACtD,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,GACrC,gBAAgB,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,WAAW,+EAOrB,gBAAgB,4CAkGlB,CAAC"}
+{"version":3,"file":"SliderThumb.d.ts","sourceRoot":"","sources":["../../../../../src/components/Slider/SliderThumb/SliderThumb.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAc/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAInE,UAAU,gBAAiB,SAAQ,UAAU,CAAC,eAAe,CAAC,EAAE,gBAAgB;IAC9E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,UAAU,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,GACtD,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,GACrC,gBAAgB,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,WAAW,+EAOrB,gBAAgB,KAAG,KAAK,CAAC,SAkG3B,CAAC"}

package/dist/cssm/components/Slider/SliderThumb/SliderThumb.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/Slider/SliderThumb/SliderThumb.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useBooleanState } from '../../../hooks/useBooleanState';\nimport { useExternRef } from '../../../hooks/useExternRef';\nimport { useFocusVisible } from '../../../hooks/useFocusVisible';\nimport { useFocusVisibleClassName } from '../../../hooks/useFocusVisibleClassName';\nimport {\n  arrowMiddleware,\n  convertFloatingDataToReactCSSProperties,\n  flipMiddleware,\n  offsetMiddleware,\n  shiftMiddleware,\n  useFloating,\n} from '../../../lib/floating';\nimport type { HasDataAttribute, HasRootRef } from '../../../types';\nimport { TooltipBase } from '../../TooltipBase/TooltipBase';\nimport styles from './SliderThumb.module.css';\n\ninterface SliderThumbProps extends HasRootRef<HTMLSpanElement>, HasDataAttribute {\n  className?: string;\n  style?: React.CSSProperties;\n  inputProps?: React.InputHTMLAttributes<HTMLInputElement> &\n    React.RefAttributes<HTMLInputElement> &\n    HasDataAttribute;\n  withTooltip?: boolean;\n  isActive?: boolean;\n}\n\nexport const SliderThumb = ({\n  className,\n  getRootRef,\n  inputProps,\n  withTooltip,\n  isActive,\n  ...restProps\n}: SliderThumbProps) => {\n  const { focusVisible, onBlur, onFocus } = useFocusVisible();\n  const focusVisibleClassNames = useFocusVisibleClassName({\n    focusVisible,\n    mode: styles['SliderThumb--focus-visible'],\n  });\n  const [arrowRef, setArrowRef] = React.useState<HTMLDivElement | null>(null);\n\n  const memoizedMiddlewares = React.useMemo(() => {\n    return [\n      offsetMiddleware({\n        crossAxis: 0,\n        mainAxis: 15,\n      }),\n      flipMiddleware(),\n      shiftMiddleware({ padding: 8 }),\n      arrowMiddleware({\n        element: arrowRef,\n      }),\n    ];\n  }, [arrowRef]);\n\n  const {\n    x: floatingDataX,\n    y: floatingDataY,\n    placement: resolvedPlacement,\n    refs,\n    strategy: floatingPositionStrategy,\n    middlewareData: { arrow: arrowCoords },\n    update: updateTooltipPosition,\n  } = useFloating({\n    placement: 'top',\n    middleware: memoizedMiddlewares,\n  });\n\n  const {\n    value: isHovered,\n    setTrue: setHoveredTrue,\n    setFalse: setHoveredFalse,\n  } = useBooleanState(false);\n\n  const handleRootRef = useExternRef<HTMLSpanElement>(getRootRef, refs.setReference);\n\n  const shouldShowTooltip = withTooltip && (focusVisible || isHovered || isActive);\n\n  const inputValue = inputProps && inputProps.value;\n  React.useEffect(\n    function udpateTooltipPositionOnValueChange() {\n      if (shouldShowTooltip && inputValue !== 'undefined') {\n        updateTooltipPosition();\n      }\n    },\n    [inputValue, updateTooltipPosition, shouldShowTooltip],\n  );\n\n  return (\n    <React.Fragment>\n      <span\n        {...restProps}\n        ref={handleRootRef}\n        onMouseEnter={setHoveredTrue}\n        onMouseLeave={setHoveredFalse}\n        className={classNames(\n          styles['SliderThumb'],\n          focusVisibleClassNames,\n          isActive && styles['SliderThumb--active'],\n          isHovered && styles['SliderThumb--hover'],\n          className,\n        )}\n      >\n        <input\n          {...inputProps}\n          type=\"range\"\n          className={styles['SliderThumb__nativeInput']}\n          aria-orientation=\"horizontal\"\n          onBlur={onBlur}\n          onFocus={onFocus}\n        />\n      </span>\n      {shouldShowTooltip && (\n        <TooltipBase\n          appearance=\"neutral\"\n          getRootRef={refs.setFloating}\n          style={convertFloatingDataToReactCSSProperties(\n            floatingPositionStrategy,\n            floatingDataX,\n            floatingDataY,\n          )}\n          arrowProps={{\n            coords: arrowCoords,\n            placement: resolvedPlacement,\n            getRootRef: setArrowRef,\n          }}\n          text={inputValue}\n        />\n      )}\n    </React.Fragment>\n  );\n};\n"],"names":["React","classNames","useBooleanState","useExternRef","useFocusVisible","useFocusVisibleClassName","arrowMiddleware","convertFloatingDataToReactCSSProperties","flipMiddleware","offsetMiddleware","shiftMiddleware","useFloating","TooltipBase","styles","SliderThumb","className","getRootRef","inputProps","withTooltip","isActive","restProps","focusVisible","onBlur","onFocus","focusVisibleClassNames","mode","arrowRef","setArrowRef","useState","memoizedMiddlewares","useMemo","crossAxis","mainAxis","padding","element","x","floatingDataX","y","floatingDataY","placement","resolvedPlacement","refs","strategy","floatingPositionStrategy","middlewareData","arrow","arrowCoords","update","updateTooltipPosition","middleware","value","isHovered","setTrue","setHoveredTrue","setFalse","setHoveredFalse","handleRootRef","setReference","shouldShowTooltip","inputValue","useEffect","udpateTooltipPositionOnValueChange","Fragment","span","ref","onMouseEnter","onMouseLeave","input","type","aria-orientation","appearance","setFloating","style","arrowProps","coords","text"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,eAAe,QAAQ,iCAAiC;AACjE,SAASC,YAAY,QAAQ,8BAA8B;AAC3D,SAASC,eAAe,QAAQ,iCAAiC;AACjE,SAASC,wBAAwB,QAAQ,0CAA0C;AACnF,SACEC,eAAe,EACfC,uCAAuC,EACvCC,cAAc,EACdC,gBAAgB,EAChBC,eAAe,EACfC,WAAW,QACN,wBAAwB;AAE/B,SAASC,WAAW,QAAQ,gCAAgC;AAC5D,OAAOC,YAAY,2BAA2B;AAY9C,OAAO,MAAMC,cAAc,CAAC,EAC1BC,SAAS,EACTC,UAAU,EACVC,UAAU,EACVC,WAAW,EACXC,QAAQ,EACR,GAAGC,WACc;IACjB,MAAM,EAAEC,YAAY,EAAEC,MAAM,EAAEC,OAAO,EAAE,GAAGnB;IAC1C,MAAMoB,yBAAyBnB,yBAAyB;QACtDgB;QACAI,MAAMZ,MAAM,CAAC,6BAA6B;IAC5C;IACA,MAAM,CAACa,UAAUC,YAAY,GAAG3B,MAAM4B,QAAQ,CAAwB;IAEtE,MAAMC,sBAAsB7B,MAAM8B,OAAO,CAAC;QACxC,OAAO;YACLrB,iBAAiB;gBACfsB,WAAW;gBACXC,UAAU;YACZ;YACAxB;YACAE,gBAAgB;gBAAEuB,SAAS;YAAE;YAC7B3B,gBAAgB;gBACd4B,SAASR;YACX;SACD;IACH,GAAG;QAACA;KAAS;IAEb,MAAM,EACJS,GAAGC,aAAa,EAChBC,GAAGC,aAAa,EAChBC,WAAWC,iBAAiB,EAC5BC,IAAI,EACJC,UAAUC,wBAAwB,EAClCC,gBAAgB,EAAEC,OAAOC,WAAW,EAAE,EACtCC,QAAQC,qBAAqB,EAC9B,GAAGrC,YAAY;QACd4B,WAAW;QACXU,YAAYpB;IACd;IAEA,MAAM,EACJqB,OAAOC,SAAS,EAChBC,SAASC,cAAc,EACvBC,UAAUC,eAAe,EAC1B,GAAGrD,gBAAgB;IAEpB,MAAMsD,gBAAgBrD,aAA8Ba,YAAYyB,KAAKgB,YAAY;IAEjF,MAAMC,oBAAoBxC,eAAgBG,CAAAA,gBAAgB8B,aAAahC,QAAO;IAE9E,MAAMwC,aAAa1C,cAAcA,WAAWiC,KAAK;IACjDlD,MAAM4D,SAAS,CACb,SAASC;QACP,IAAIH,qBAAqBC,eAAe,aAAa;YACnDX;QACF;IACF,GACA;QAACW;QAAYX;QAAuBU;KAAkB;IAGxD,qBACE,MAAC1D,MAAM8D,QAAQ;;0BACb,KAACC;gBACE,GAAG3C,SAAS;gBACb4C,KAAKR;gBACLS,cAAcZ;gBACda,cAAcX;gBACdxC,WAAWd,WACTY,MAAM,CAAC,cAAc,EACrBW,wBACAL,YAAYN,MAAM,CAAC,sBAAsB,EACzCsC,aAAatC,MAAM,CAAC,qBAAqB,EACzCE;0BAGF,cAAA,KAACoD;oBACE,GAAGlD,UAAU;oBACdmD,MAAK;oBACLrD,WAAWF,MAAM,CAAC,2BAA2B;oBAC7CwD,oBAAiB;oBACjB/C,QAAQA;oBACRC,SAASA;;;YAGZmC,mCACC,KAAC9C;gBACC0D,YAAW;gBACXtD,YAAYyB,KAAK8B,WAAW;gBAC5BC,OAAOjE,wCACLoC,0BACAP,eACAE;gBAEFmC,YAAY;oBACVC,QAAQ5B;oBACRP,WAAWC;oBACXxB,YAAYW;gBACd;gBACAgD,MAAMhB;;;;AAKhB,EAAE"}
+{"version":3,"sources":["../../../../../src/components/Slider/SliderThumb/SliderThumb.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useBooleanState } from '../../../hooks/useBooleanState';\nimport { useExternRef } from '../../../hooks/useExternRef';\nimport { useFocusVisible } from '../../../hooks/useFocusVisible';\nimport { useFocusVisibleClassName } from '../../../hooks/useFocusVisibleClassName';\nimport {\n  arrowMiddleware,\n  convertFloatingDataToReactCSSProperties,\n  flipMiddleware,\n  offsetMiddleware,\n  shiftMiddleware,\n  useFloating,\n} from '../../../lib/floating';\nimport type { HasDataAttribute, HasRootRef } from '../../../types';\nimport { TooltipBase } from '../../TooltipBase/TooltipBase';\nimport styles from './SliderThumb.module.css';\n\ninterface SliderThumbProps extends HasRootRef<HTMLSpanElement>, HasDataAttribute {\n  className?: string;\n  style?: React.CSSProperties;\n  inputProps?: React.InputHTMLAttributes<HTMLInputElement> &\n    React.RefAttributes<HTMLInputElement> &\n    HasDataAttribute;\n  withTooltip?: boolean;\n  isActive?: boolean;\n}\n\nexport const SliderThumb = ({\n  className,\n  getRootRef,\n  inputProps,\n  withTooltip,\n  isActive,\n  ...restProps\n}: SliderThumbProps): React.ReactNode => {\n  const { focusVisible, onBlur, onFocus } = useFocusVisible();\n  const focusVisibleClassNames = useFocusVisibleClassName({\n    focusVisible,\n    mode: styles['SliderThumb--focus-visible'],\n  });\n  const [arrowRef, setArrowRef] = React.useState<HTMLDivElement | null>(null);\n\n  const memoizedMiddlewares = React.useMemo(() => {\n    return [\n      offsetMiddleware({\n        crossAxis: 0,\n        mainAxis: 15,\n      }),\n      flipMiddleware(),\n      shiftMiddleware({ padding: 8 }),\n      arrowMiddleware({\n        element: arrowRef,\n      }),\n    ];\n  }, [arrowRef]);\n\n  const {\n    x: floatingDataX,\n    y: floatingDataY,\n    placement: resolvedPlacement,\n    refs,\n    strategy: floatingPositionStrategy,\n    middlewareData: { arrow: arrowCoords },\n    update: updateTooltipPosition,\n  } = useFloating({\n    placement: 'top',\n    middleware: memoizedMiddlewares,\n  });\n\n  const {\n    value: isHovered,\n    setTrue: setHoveredTrue,\n    setFalse: setHoveredFalse,\n  } = useBooleanState(false);\n\n  const handleRootRef = useExternRef<HTMLSpanElement>(getRootRef, refs.setReference);\n\n  const shouldShowTooltip = withTooltip && (focusVisible || isHovered || isActive);\n\n  const inputValue = inputProps && inputProps.value;\n  React.useEffect(\n    function udpateTooltipPositionOnValueChange() {\n      if (shouldShowTooltip && inputValue !== 'undefined') {\n        updateTooltipPosition();\n      }\n    },\n    [inputValue, updateTooltipPosition, shouldShowTooltip],\n  );\n\n  return (\n    <React.Fragment>\n      <span\n        {...restProps}\n        ref={handleRootRef}\n        onMouseEnter={setHoveredTrue}\n        onMouseLeave={setHoveredFalse}\n        className={classNames(\n          styles['SliderThumb'],\n          focusVisibleClassNames,\n          isActive && styles['SliderThumb--active'],\n          isHovered && styles['SliderThumb--hover'],\n          className,\n        )}\n      >\n        <input\n          {...inputProps}\n          type=\"range\"\n          className={styles['SliderThumb__nativeInput']}\n          aria-orientation=\"horizontal\"\n          onBlur={onBlur}\n          onFocus={onFocus}\n        />\n      </span>\n      {shouldShowTooltip && (\n        <TooltipBase\n          appearance=\"neutral\"\n          getRootRef={refs.setFloating}\n          style={convertFloatingDataToReactCSSProperties(\n            floatingPositionStrategy,\n            floatingDataX,\n            floatingDataY,\n          )}\n          arrowProps={{\n            coords: arrowCoords,\n            placement: resolvedPlacement,\n            getRootRef: setArrowRef,\n          }}\n          text={inputValue}\n        />\n      )}\n    </React.Fragment>\n  );\n};\n"],"names":["React","classNames","useBooleanState","useExternRef","useFocusVisible","useFocusVisibleClassName","arrowMiddleware","convertFloatingDataToReactCSSProperties","flipMiddleware","offsetMiddleware","shiftMiddleware","useFloating","TooltipBase","styles","SliderThumb","className","getRootRef","inputProps","withTooltip","isActive","restProps","focusVisible","onBlur","onFocus","focusVisibleClassNames","mode","arrowRef","setArrowRef","useState","memoizedMiddlewares","useMemo","crossAxis","mainAxis","padding","element","x","floatingDataX","y","floatingDataY","placement","resolvedPlacement","refs","strategy","floatingPositionStrategy","middlewareData","arrow","arrowCoords","update","updateTooltipPosition","middleware","value","isHovered","setTrue","setHoveredTrue","setFalse","setHoveredFalse","handleRootRef","setReference","shouldShowTooltip","inputValue","useEffect","udpateTooltipPositionOnValueChange","Fragment","span","ref","onMouseEnter","onMouseLeave","input","type","aria-orientation","appearance","setFloating","style","arrowProps","coords","text"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,eAAe,QAAQ,iCAAiC;AACjE,SAASC,YAAY,QAAQ,8BAA8B;AAC3D,SAASC,eAAe,QAAQ,iCAAiC;AACjE,SAASC,wBAAwB,QAAQ,0CAA0C;AACnF,SACEC,eAAe,EACfC,uCAAuC,EACvCC,cAAc,EACdC,gBAAgB,EAChBC,eAAe,EACfC,WAAW,QACN,wBAAwB;AAE/B,SAASC,WAAW,QAAQ,gCAAgC;AAC5D,OAAOC,YAAY,2BAA2B;AAY9C,OAAO,MAAMC,cAAc,CAAC,EAC1BC,SAAS,EACTC,UAAU,EACVC,UAAU,EACVC,WAAW,EACXC,QAAQ,EACR,GAAGC,WACc;IACjB,MAAM,EAAEC,YAAY,EAAEC,MAAM,EAAEC,OAAO,EAAE,GAAGnB;IAC1C,MAAMoB,yBAAyBnB,yBAAyB;QACtDgB;QACAI,MAAMZ,MAAM,CAAC,6BAA6B;IAC5C;IACA,MAAM,CAACa,UAAUC,YAAY,GAAG3B,MAAM4B,QAAQ,CAAwB;IAEtE,MAAMC,sBAAsB7B,MAAM8B,OAAO,CAAC;QACxC,OAAO;YACLrB,iBAAiB;gBACfsB,WAAW;gBACXC,UAAU;YACZ;YACAxB;YACAE,gBAAgB;gBAAEuB,SAAS;YAAE;YAC7B3B,gBAAgB;gBACd4B,SAASR;YACX;SACD;IACH,GAAG;QAACA;KAAS;IAEb,MAAM,EACJS,GAAGC,aAAa,EAChBC,GAAGC,aAAa,EAChBC,WAAWC,iBAAiB,EAC5BC,IAAI,EACJC,UAAUC,wBAAwB,EAClCC,gBAAgB,EAAEC,OAAOC,WAAW,EAAE,EACtCC,QAAQC,qBAAqB,EAC9B,GAAGrC,YAAY;QACd4B,WAAW;QACXU,YAAYpB;IACd;IAEA,MAAM,EACJqB,OAAOC,SAAS,EAChBC,SAASC,cAAc,EACvBC,UAAUC,eAAe,EAC1B,GAAGrD,gBAAgB;IAEpB,MAAMsD,gBAAgBrD,aAA8Ba,YAAYyB,KAAKgB,YAAY;IAEjF,MAAMC,oBAAoBxC,eAAgBG,CAAAA,gBAAgB8B,aAAahC,QAAO;IAE9E,MAAMwC,aAAa1C,cAAcA,WAAWiC,KAAK;IACjDlD,MAAM4D,SAAS,CACb,SAASC;QACP,IAAIH,qBAAqBC,eAAe,aAAa;YACnDX;QACF;IACF,GACA;QAACW;QAAYX;QAAuBU;KAAkB;IAGxD,qBACE,MAAC1D,MAAM8D,QAAQ;;0BACb,KAACC;gBACE,GAAG3C,SAAS;gBACb4C,KAAKR;gBACLS,cAAcZ;gBACda,cAAcX;gBACdxC,WAAWd,WACTY,MAAM,CAAC,cAAc,EACrBW,wBACAL,YAAYN,MAAM,CAAC,sBAAsB,EACzCsC,aAAatC,MAAM,CAAC,qBAAqB,EACzCE;0BAGF,cAAA,KAACoD;oBACE,GAAGlD,UAAU;oBACdmD,MAAK;oBACLrD,WAAWF,MAAM,CAAC,2BAA2B;oBAC7CwD,oBAAiB;oBACjB/C,QAAQA;oBACRC,SAASA;;;YAGZmC,mCACC,KAAC9C;gBACC0D,YAAW;gBACXtD,YAAYyB,KAAK8B,WAAW;gBAC5BC,OAAOjE,wCACLoC,0BACAP,eACAE;gBAEFmC,YAAY;oBACVC,QAAQ5B;oBACRP,WAAWC;oBACXxB,YAAYW;gBACd;gBACAgD,MAAMhB;;;;AAKhB,EAAE"}

package/dist/cssm/components/Slider/helpers.d.ts

@@ -5,14 +5,11 @@ export declare const offsetToValue: (startX: number, width: number, min: number,
 export declare const updateInternalStateValue: (prevValue: InternalValueState, nextValue: number, min: number, max: number, dragging: InternalDraggingType | null) => InternalValueState;
 export declare const updateInternalStateValueByNativeChange: (prevValue: InternalValueState, nextValue: number, dragging: InternalDraggingType | null) => InternalValueState;
 export declare function isMultipleValues(value: InternalValueState): value is [number, number];
-export declare const snapDirection: (prevValue: InternalValueState, nextValue: number, type: InternalDraggingType | null) => "end" | "start";
-export declare const getDraggingTypeByTargetDataset: <T extends (EventTarget & HTMLElement) | null>(target: T) => "end" | "start" | null;
+export declare const snapDirection: (prevValue: InternalValueState, nextValue: number, type: InternalDraggingType | null) => "start" | "end";
+export declare const getDraggingTypeByTargetDataset: <T extends (EventTarget & HTMLElement) | null>(target: T) => "start" | "end" | null;
 export declare const extractSliderAriaAttributesFromRestProps: <T extends React.AriaAttributes>(restProps: T) => T & {
     ariaLabel: string | undefined;
     ariaValueText: string | undefined;
     ariaLabelledBy: string | undefined;
-    'aria-label': undefined;
-    'aria-valuetext': undefined;
-    'aria-labelledby': undefined;
 };
 //# sourceMappingURL=helpers.d.ts.map

package/dist/cssm/components/Slider/helpers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../../src/components/Slider/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAExE,eAAO,MAAM,SAAS,MAAO,MAAM,OAAO,MAAM,OAAO,MAAM,WAAoC,CAAC;AAElG,eAAO,MAAM,aAAa,WAChB,MAAM,SACP,MAAM,OACR,MAAM,OACN,MAAM,SACJ,MAAM,WAGd,CAAC;AAYF,eAAO,MAAM,wBAAwB,cACxB,kBAAkB,aAClB,MAAM,OACZ,MAAM,OACN,MAAM,YACD,oBAAoB,GAAG,IAAI,KACpC,kBAoBF,CAAC;AAEF,eAAO,MAAM,sCAAsC,cACtC,kBAAkB,aAClB,MAAM,YACP,oBAAoB,GAAG,IAAI,KACpC,kBAWF,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,kBAAkB,GAAG,KAAK,IAAI,CAAC,MAAM,EAAE,MAAM,CAAC,CAErF;AAED,eAAO,MAAM,aAAa,cACb,kBAAkB,aAClB,MAAM,QACX,oBAAoB,GAAG,IAAI,oBAelC,CAAC;AAEF,eAAO,MAAM,8BAA8B,GAAI,CAAC,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC,GAAG,IAAI,UACjF,CAAC,2BAWV,CAAC;AAQF,eAAO,MAAM,wCAAwC,GAAI,CAAC,SAAS,KAAK,CAAC,cAAc,aAC1E,CAAC;;;;;;;CAMb,CAAC"}
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../../src/components/Slider/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAExE,eAAO,MAAM,SAAS,MAAO,MAAM,OAAO,MAAM,OAAO,MAAM,KAAG,MAC/B,CAAC;AAElC,eAAO,MAAM,aAAa,WAChB,MAAM,SACP,MAAM,OACR,MAAM,OACN,MAAM,SACJ,MAAM,KACZ,MAEF,CAAC;AAYF,eAAO,MAAM,wBAAwB,cACxB,kBAAkB,aAClB,MAAM,OACZ,MAAM,OACN,MAAM,YACD,oBAAoB,GAAG,IAAI,KACpC,kBAoBF,CAAC;AAEF,eAAO,MAAM,sCAAsC,cACtC,kBAAkB,aAClB,MAAM,YACP,oBAAoB,GAAG,IAAI,KACpC,kBAWF,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,kBAAkB,GAAG,KAAK,IAAI,CAAC,MAAM,EAAE,MAAM,CAAC,CAErF;AAED,eAAO,MAAM,aAAa,cACb,kBAAkB,aAClB,MAAM,QACX,oBAAoB,GAAG,IAAI,KAChC,OAAO,GAAG,KAcZ,CAAC;AAEF,eAAO,MAAM,8BAA8B,GAAI,CAAC,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC,GAAG,IAAI,UACjF,CAAC,KACR,OAAO,GAAG,KAAK,GAAG,IAUpB,CAAC;AAQF,eAAO,MAAM,wCAAwC,GAAI,CAAC,SAAS,KAAK,CAAC,cAAc,aAC1E,CAAC,KACX,CAAC,GAAG;IACL,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;IAC9B,aAAa,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC,cAAc,EAAE,MAAM,GAAG,SAAS,CAAC;CAMpC,CAAC"}

package/dist/cssm/components/Slider/helpers.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Slider/helpers.ts"],"sourcesContent":["import * as React from 'react';\nimport { rescale } from '../../helpers/math';\nimport type { InternalDraggingType, InternalValueState } from './types';\n\nexport const toPercent = (v: number, min: number, max: number) => ((v - min) / (max - min)) * 100;\n\nexport const offsetToValue = (\n  startX: number,\n  width: number,\n  min: number,\n  max: number,\n  step?: number,\n) => {\n  return rescale(startX, [0, width], [min, max], { step });\n};\n\nconst restrictValueByMinMax = (value: number, min: number, max: number) => {\n  if (value < min) {\n    return min;\n  }\n  if (value > max) {\n    return max;\n  }\n  return value;\n};\n\nexport const updateInternalStateValue = (\n  prevValue: InternalValueState,\n  nextValue: number,\n  min: number,\n  max: number,\n  dragging: InternalDraggingType | null,\n): InternalValueState => {\n  const [prevStartValue, prevEndValue] = prevValue;\n\n  if (prevEndValue === null) {\n    return [restrictValueByMinMax(nextValue, min, max), null];\n  }\n\n  switch (dragging) {\n    case 'start':\n      return nextValue > prevEndValue\n        ? [prevEndValue, prevEndValue]\n        : [restrictValueByMinMax(nextValue, min, max), prevEndValue];\n    case 'end':\n      return nextValue < prevStartValue\n        ? [prevStartValue, prevStartValue]\n        : [prevStartValue, restrictValueByMinMax(nextValue, min, max)];\n    case null:\n    default:\n      return prevValue;\n  }\n};\n\nexport const updateInternalStateValueByNativeChange = (\n  prevValue: InternalValueState,\n  nextValue: number,\n  dragging: InternalDraggingType | null,\n): InternalValueState => {\n  const [prevStartValue, prevEndValue] = prevValue;\n  switch (dragging) {\n    case 'start':\n      return [nextValue, prevEndValue];\n    case 'end':\n      return [prevStartValue, nextValue];\n    case null:\n    default:\n      return prevValue;\n  }\n};\n\nexport function isMultipleValues(value: InternalValueState): value is [number, number] {\n  return value[1] !== null;\n}\n\nexport const snapDirection = (\n  prevValue: InternalValueState,\n  nextValue: number,\n  type: InternalDraggingType | null,\n) => {\n  if (type === 'start') {\n    return 'start';\n  }\n  if (type === 'end') {\n    return 'end';\n  }\n\n  const [startRaw, endRaw] = prevValue;\n  /* startRaw и endRaw могут быть равны, поэтому насильно добавляем разницу. */\n  const FORCE_DIFF_VALUE = 0.1;\n  const start = endRaw !== null ? startRaw - FORCE_DIFF_VALUE : startRaw;\n  const end = endRaw !== null ? endRaw + FORCE_DIFF_VALUE : 0;\n  return Math.abs(start - nextValue) <= Math.abs(end - nextValue) ? 'start' : 'end';\n};\n\nexport const getDraggingTypeByTargetDataset = <T extends (EventTarget & HTMLElement) | null>(\n  target: T,\n) => {\n  if (target) {\n    if (target.dataset.type === 'start') {\n      return 'start';\n    }\n    if (target.dataset.type === 'end') {\n      return 'end';\n    }\n  }\n  return null;\n};\n\nconst resetProps = {\n  'aria-label': undefined,\n  'aria-valuetext': undefined,\n  'aria-labelledby': undefined,\n};\n\nexport const extractSliderAriaAttributesFromRestProps = <T extends React.AriaAttributes>(\n  restProps: T,\n) => {\n  const ariaLabel = restProps['aria-label'];\n  const ariaValueText = restProps['aria-valuetext'];\n  const ariaLabelledBy = restProps['aria-labelledby'];\n  return { ...restProps, ...resetProps, ariaLabel, ariaValueText, ariaLabelledBy };\n};\n"],"names":["React","rescale","toPercent","v","min","max","offsetToValue","startX","width","step","restrictValueByMinMax","value","updateInternalStateValue","prevValue","nextValue","dragging","prevStartValue","prevEndValue","updateInternalStateValueByNativeChange","isMultipleValues","snapDirection","type","startRaw","endRaw","FORCE_DIFF_VALUE","start","end","Math","abs","getDraggingTypeByTargetDataset","target","dataset","resetProps","undefined","extractSliderAriaAttributesFromRestProps","restProps","ariaLabel","ariaValueText","ariaLabelledBy"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,OAAO,QAAQ,qBAAqB;AAG7C,OAAO,MAAMC,YAAY,CAACC,GAAWC,KAAaC,MAAgB,AAAEF,CAAAA,IAAIC,GAAE,IAAMC,CAAAA,MAAMD,GAAE,IAAM,IAAI;AAElG,OAAO,MAAME,gBAAgB,CAC3BC,QACAC,OACAJ,KACAC,KACAI;IAEA,OAAOR,QAAQM,QAAQ;QAAC;QAAGC;KAAM,EAAE;QAACJ;QAAKC;KAAI,EAAE;QAAEI;IAAK;AACxD,EAAE;AAEF,MAAMC,wBAAwB,CAACC,OAAeP,KAAaC;IACzD,IAAIM,QAAQP,KAAK;QACf,OAAOA;IACT;IACA,IAAIO,QAAQN,KAAK;QACf,OAAOA;IACT;IACA,OAAOM;AACT;AAEA,OAAO,MAAMC,2BAA2B,CACtCC,WACAC,WACAV,KACAC,KACAU;IAEA,MAAM,CAACC,gBAAgBC,aAAa,GAAGJ;IAEvC,IAAII,iBAAiB,MAAM;QACzB,OAAO;YAACP,sBAAsBI,WAAWV,KAAKC;YAAM;SAAK;IAC3D;IAEA,OAAQU;QACN,KAAK;YACH,OAAOD,YAAYG,eACf;gBAACA;gBAAcA;aAAa,GAC5B;gBAACP,sBAAsBI,WAAWV,KAAKC;gBAAMY;aAAa;QAChE,KAAK;YACH,OAAOH,YAAYE,iBACf;gBAACA;gBAAgBA;aAAe,GAChC;gBAACA;gBAAgBN,sBAAsBI,WAAWV,KAAKC;aAAK;QAClE,KAAK;QACL;YACE,OAAOQ;IACX;AACF,EAAE;AAEF,OAAO,MAAMK,yCAAyC,CACpDL,WACAC,WACAC;IAEA,MAAM,CAACC,gBAAgBC,aAAa,GAAGJ;IACvC,OAAQE;QACN,KAAK;YACH,OAAO;gBAACD;gBAAWG;aAAa;QAClC,KAAK;YACH,OAAO;gBAACD;gBAAgBF;aAAU;QACpC,KAAK;QACL;YACE,OAAOD;IACX;AACF,EAAE;AAEF,OAAO,SAASM,iBAAiBR,KAAyB;IACxD,OAAOA,KAAK,CAAC,EAAE,KAAK;AACtB;AAEA,OAAO,MAAMS,gBAAgB,CAC3BP,WACAC,WACAO;IAEA,IAAIA,SAAS,SAAS;QACpB,OAAO;IACT;IACA,IAAIA,SAAS,OAAO;QAClB,OAAO;IACT;IAEA,MAAM,CAACC,UAAUC,OAAO,GAAGV;IAC3B,2EAA2E,GAC3E,MAAMW,mBAAmB;IACzB,MAAMC,QAAQF,WAAW,OAAOD,WAAWE,mBAAmBF;IAC9D,MAAMI,MAAMH,WAAW,OAAOA,SAASC,mBAAmB;IAC1D,OAAOG,KAAKC,GAAG,CAACH,QAAQX,cAAca,KAAKC,GAAG,CAACF,MAAMZ,aAAa,UAAU;AAC9E,EAAE;AAEF,OAAO,MAAMe,iCAAiC,CAC5CC;IAEA,IAAIA,QAAQ;QACV,IAAIA,OAAOC,OAAO,CAACV,IAAI,KAAK,SAAS;YACnC,OAAO;QACT;QACA,IAAIS,OAAOC,OAAO,CAACV,IAAI,KAAK,OAAO;YACjC,OAAO;QACT;IACF;IACA,OAAO;AACT,EAAE;AAEF,MAAMW,aAAa;IACjB,cAAcC;IACd,kBAAkBA;IAClB,mBAAmBA;AACrB;AAEA,OAAO,MAAMC,2CAA2C,CACtDC;IAEA,MAAMC,YAAYD,SAAS,CAAC,aAAa;IACzC,MAAME,gBAAgBF,SAAS,CAAC,iBAAiB;IACjD,MAAMG,iBAAiBH,SAAS,CAAC,kBAAkB;IACnD,OAAO;QAAE,GAAGA,SAAS;QAAE,GAAGH,UAAU;QAAEI;QAAWC;QAAeC;IAAe;AACjF,EAAE"}
+{"version":3,"sources":["../../../../src/components/Slider/helpers.ts"],"sourcesContent":["import * as React from 'react';\nimport { rescale } from '../../helpers/math';\nimport type { InternalDraggingType, InternalValueState } from './types';\n\nexport const toPercent = (v: number, min: number, max: number): number =>\n  ((v - min) / (max - min)) * 100;\n\nexport const offsetToValue = (\n  startX: number,\n  width: number,\n  min: number,\n  max: number,\n  step?: number,\n): number => {\n  return rescale(startX, [0, width], [min, max], { step });\n};\n\nconst restrictValueByMinMax = (value: number, min: number, max: number) => {\n  if (value < min) {\n    return min;\n  }\n  if (value > max) {\n    return max;\n  }\n  return value;\n};\n\nexport const updateInternalStateValue = (\n  prevValue: InternalValueState,\n  nextValue: number,\n  min: number,\n  max: number,\n  dragging: InternalDraggingType | null,\n): InternalValueState => {\n  const [prevStartValue, prevEndValue] = prevValue;\n\n  if (prevEndValue === null) {\n    return [restrictValueByMinMax(nextValue, min, max), null];\n  }\n\n  switch (dragging) {\n    case 'start':\n      return nextValue > prevEndValue\n        ? [prevEndValue, prevEndValue]\n        : [restrictValueByMinMax(nextValue, min, max), prevEndValue];\n    case 'end':\n      return nextValue < prevStartValue\n        ? [prevStartValue, prevStartValue]\n        : [prevStartValue, restrictValueByMinMax(nextValue, min, max)];\n    case null:\n    default:\n      return prevValue;\n  }\n};\n\nexport const updateInternalStateValueByNativeChange = (\n  prevValue: InternalValueState,\n  nextValue: number,\n  dragging: InternalDraggingType | null,\n): InternalValueState => {\n  const [prevStartValue, prevEndValue] = prevValue;\n  switch (dragging) {\n    case 'start':\n      return [nextValue, prevEndValue];\n    case 'end':\n      return [prevStartValue, nextValue];\n    case null:\n    default:\n      return prevValue;\n  }\n};\n\nexport function isMultipleValues(value: InternalValueState): value is [number, number] {\n  return value[1] !== null;\n}\n\nexport const snapDirection = (\n  prevValue: InternalValueState,\n  nextValue: number,\n  type: InternalDraggingType | null,\n): 'start' | 'end' => {\n  if (type === 'start') {\n    return 'start';\n  }\n  if (type === 'end') {\n    return 'end';\n  }\n\n  const [startRaw, endRaw] = prevValue;\n  /* startRaw и endRaw могут быть равны, поэтому насильно добавляем разницу. */\n  const FORCE_DIFF_VALUE = 0.1;\n  const start = endRaw !== null ? startRaw - FORCE_DIFF_VALUE : startRaw;\n  const end = endRaw !== null ? endRaw + FORCE_DIFF_VALUE : 0;\n  return Math.abs(start - nextValue) <= Math.abs(end - nextValue) ? 'start' : 'end';\n};\n\nexport const getDraggingTypeByTargetDataset = <T extends (EventTarget & HTMLElement) | null>(\n  target: T,\n): 'start' | 'end' | null => {\n  if (target) {\n    if (target.dataset.type === 'start') {\n      return 'start';\n    }\n    if (target.dataset.type === 'end') {\n      return 'end';\n    }\n  }\n  return null;\n};\n\nconst resetProps = {\n  'aria-label': undefined,\n  'aria-valuetext': undefined,\n  'aria-labelledby': undefined,\n};\n\nexport const extractSliderAriaAttributesFromRestProps = <T extends React.AriaAttributes>(\n  restProps: T,\n): T & {\n  ariaLabel: string | undefined;\n  ariaValueText: string | undefined;\n  ariaLabelledBy: string | undefined;\n} => {\n  const ariaLabel = restProps['aria-label'];\n  const ariaValueText = restProps['aria-valuetext'];\n  const ariaLabelledBy = restProps['aria-labelledby'];\n  return { ...restProps, ...resetProps, ariaLabel, ariaValueText, ariaLabelledBy };\n};\n"],"names":["React","rescale","toPercent","v","min","max","offsetToValue","startX","width","step","restrictValueByMinMax","value","updateInternalStateValue","prevValue","nextValue","dragging","prevStartValue","prevEndValue","updateInternalStateValueByNativeChange","isMultipleValues","snapDirection","type","startRaw","endRaw","FORCE_DIFF_VALUE","start","end","Math","abs","getDraggingTypeByTargetDataset","target","dataset","resetProps","undefined","extractSliderAriaAttributesFromRestProps","restProps","ariaLabel","ariaValueText","ariaLabelledBy"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,OAAO,QAAQ,qBAAqB;AAG7C,OAAO,MAAMC,YAAY,CAACC,GAAWC,KAAaC,MAChD,AAAEF,CAAAA,IAAIC,GAAE,IAAMC,CAAAA,MAAMD,GAAE,IAAM,IAAI;AAElC,OAAO,MAAME,gBAAgB,CAC3BC,QACAC,OACAJ,KACAC,KACAI;IAEA,OAAOR,QAAQM,QAAQ;QAAC;QAAGC;KAAM,EAAE;QAACJ;QAAKC;KAAI,EAAE;QAAEI;IAAK;AACxD,EAAE;AAEF,MAAMC,wBAAwB,CAACC,OAAeP,KAAaC;IACzD,IAAIM,QAAQP,KAAK;QACf,OAAOA;IACT;IACA,IAAIO,QAAQN,KAAK;QACf,OAAOA;IACT;IACA,OAAOM;AACT;AAEA,OAAO,MAAMC,2BAA2B,CACtCC,WACAC,WACAV,KACAC,KACAU;IAEA,MAAM,CAACC,gBAAgBC,aAAa,GAAGJ;IAEvC,IAAII,iBAAiB,MAAM;QACzB,OAAO;YAACP,sBAAsBI,WAAWV,KAAKC;YAAM;SAAK;IAC3D;IAEA,OAAQU;QACN,KAAK;YACH,OAAOD,YAAYG,eACf;gBAACA;gBAAcA;aAAa,GAC5B;gBAACP,sBAAsBI,WAAWV,KAAKC;gBAAMY;aAAa;QAChE,KAAK;YACH,OAAOH,YAAYE,iBACf;gBAACA;gBAAgBA;aAAe,GAChC;gBAACA;gBAAgBN,sBAAsBI,WAAWV,KAAKC;aAAK;QAClE,KAAK;QACL;YACE,OAAOQ;IACX;AACF,EAAE;AAEF,OAAO,MAAMK,yCAAyC,CACpDL,WACAC,WACAC;IAEA,MAAM,CAACC,gBAAgBC,aAAa,GAAGJ;IACvC,OAAQE;QACN,KAAK;YACH,OAAO;gBAACD;gBAAWG;aAAa;QAClC,KAAK;YACH,OAAO;gBAACD;gBAAgBF;aAAU;QACpC,KAAK;QACL;YACE,OAAOD;IACX;AACF,EAAE;AAEF,OAAO,SAASM,iBAAiBR,KAAyB;IACxD,OAAOA,KAAK,CAAC,EAAE,KAAK;AACtB;AAEA,OAAO,MAAMS,gBAAgB,CAC3BP,WACAC,WACAO;IAEA,IAAIA,SAAS,SAAS;QACpB,OAAO;IACT;IACA,IAAIA,SAAS,OAAO;QAClB,OAAO;IACT;IAEA,MAAM,CAACC,UAAUC,OAAO,GAAGV;IAC3B,2EAA2E,GAC3E,MAAMW,mBAAmB;IACzB,MAAMC,QAAQF,WAAW,OAAOD,WAAWE,mBAAmBF;IAC9D,MAAMI,MAAMH,WAAW,OAAOA,SAASC,mBAAmB;IAC1D,OAAOG,KAAKC,GAAG,CAACH,QAAQX,cAAca,KAAKC,GAAG,CAACF,MAAMZ,aAAa,UAAU;AAC9E,EAAE;AAEF,OAAO,MAAMe,iCAAiC,CAC5CC;IAEA,IAAIA,QAAQ;QACV,IAAIA,OAAOC,OAAO,CAACV,IAAI,KAAK,SAAS;YACnC,OAAO;QACT;QACA,IAAIS,OAAOC,OAAO,CAACV,IAAI,KAAK,OAAO;YACjC,OAAO;QACT;IACF;IACA,OAAO;AACT,EAAE;AAEF,MAAMW,aAAa;IACjB,cAAcC;IACd,kBAAkBA;IAClB,mBAAmBA;AACrB;AAEA,OAAO,MAAMC,2CAA2C,CACtDC;IAMA,MAAMC,YAAYD,SAAS,CAAC,aAAa;IACzC,MAAME,gBAAgBF,SAAS,CAAC,iBAAiB;IACjD,MAAMG,iBAAiBH,SAAS,CAAC,kBAAkB;IACnD,OAAO;QAAE,GAAGA,SAAS;QAAE,GAAGH,UAAU;QAAEI;QAAWC;QAAeC;IAAe;AACjF,EAAE"}

package/dist/cssm/components/Snackbar/Snackbar.d.ts

@@ -38,8 +38,7 @@ export interface SnackbarProps extends Omit<HTMLAttributesWithRootRef<HTMLDivEle
 /**
  * @see https://vkcom.github.io/VKUI/#/Snackbar
  */
-export declare const Snackbar: {
-    ({ placement, children, layout, action, before, after, duration, onActionClick, onClose, mode, subtitle, offsetY, style, getRootRef, ...restProps }: SnackbarProps): import("react/jsx-runtime").JSX.Element | null;
+export declare const Snackbar: React.FC<SnackbarProps> & {
     Basic: typeof Basic;
 };
 //# sourceMappingURL=Snackbar.d.ts.map

package/dist/cssm/components/Snackbar/Snackbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Snackbar.d.ts","sourceRoot":"","sources":["../../../../src/components/Snackbar/Snackbar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAGxD,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAChE,OAAO,KAAK,EAAa,iBAAiB,EAAE,MAAM,SAAS,CAAC;AA2B5D,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,MAAM,CAAC,EAC7D,UAAU;IACZ;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,iBAAiB,CAAC;IAC9B;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAClD;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;CACzC;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ;yJAgBlB,aAAa;;CAqMf,CAAC"}
+{"version":3,"file":"Snackbar.d.ts","sourceRoot":"","sources":["../../../../src/components/Snackbar/Snackbar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAGxD,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAChE,OAAO,KAAK,EAAa,iBAAiB,EAAE,MAAM,SAAS,CAAC;AA2B5D,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,MAAM,CAAC,EAC7D,UAAU;IACZ;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,iBAAiB,CAAC;IAC9B;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAClD;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;CACzC;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAAC,GAAG;IAAE,KAAK,EAAE,OAAO,KAAK,CAAA;CAqNrE,CAAC"}

package/dist/cssm/components/Snackbar/Snackbar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Snackbar/Snackbar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useFocusWithin } from '../../hooks/useFocusWithin';\nimport { useGlobalEscKeyDown } from '../../hooks/useGlobalEscKeyDown';\nimport { useMediaQueries } from '../../hooks/useMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useCSSKeyframesAnimationController } from '../../lib/animation';\nimport { getRelativeBoundingClientRect } from '../../lib/dom';\nimport { UIPanGestureRecognizer } from '../../lib/touch';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { Button } from '../Button/Button';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Basic, BasicProps } from './subcomponents/Basic/Basic';\nimport type { ShiftData, SnackbarPlacement } from './types';\nimport {\n  getInitialShiftData,\n  getMovedShiftData,\n  resolveOffsetYCssStyle,\n  shouldBeClosedByShiftData,\n} from './utils';\nimport styles from './Snackbar.module.css';\n\nconst placementClassNames = {\n  'top-start': styles['Snackbar--placement-top-start'],\n  'top': styles['Snackbar--placement-top'],\n  'top-end': styles['Snackbar--placement-top-end'],\n  'bottom-start': styles['Snackbar--placement-bottom-start'],\n  'bottom': styles['Snackbar--placement-bottom'],\n  'bottom-end': styles['Snackbar--placement-bottom-end'],\n};\n\nconst animationStateClassNames = {\n  enter: styles['Snackbar--state-enter'],\n  entering: styles['Snackbar--state-entering'],\n  entered: styles['Snackbar--state-entered'],\n  exit: styles['Snackbar--state-exit'],\n  exiting: styles['Snackbar--state-exiting'],\n  exited: undefined,\n};\n\nexport interface SnackbarProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'role'>,\n    BasicProps {\n  /**\n   * Задаёт расположение компонента.\n   *\n   * > Note: в мобильном режиме:\n   * > - `\"top-start\"`/`\"top-end\"` перебивается на `\"top\"`, чтобы поведение было схожим с нативными\n   * >   уведомлениями;\n   * > - `\"bottom\"`/`\"bottom-end\"` перебивается на \"bottom-start\", чтобы избежать вызова системных\n   * >   функций, таких как **Pull To Refresh** и **Режим управления одной рукой**.\n   */\n  placement?: SnackbarPlacement;\n  /**\n   * Название кнопки действия в уведомлении\n   * Не может использоваться одновременно с `subtitle`\n   */\n  action?: React.ReactNode;\n  /**\n   * Будет вызвано при клике на кнопку действия\n   */\n  onActionClick?: (event: React.MouseEvent) => void;\n  /**\n   * Время в миллисекундах, через которое плашка скроется\n   */\n  duration?: number;\n  /**\n   * Обработчик закрытия уведомления\n   */\n  onClose: () => void;\n  /**\n   * Величина отступа снизу. Используется для позиционирования элемента в случае, когда нежелательно, чтобы Snackbar при появлении перекрывал важные элементы интерфейса.\n   */\n  offsetY?: React.CSSProperties['bottom'];\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Snackbar\n */\nexport const Snackbar = ({\n  placement = 'bottom-start',\n  children,\n  layout,\n  action,\n  before,\n  after,\n  duration = 4000,\n  onActionClick = noop,\n  onClose,\n  mode = 'default',\n  subtitle,\n  offsetY,\n  style,\n  getRootRef,\n  ...restProps\n}: SnackbarProps) => {\n  const platform = usePlatform();\n\n  const [open, setOpen] = React.useState(true);\n  const [touched, setTouched] = React.useState(false);\n\n  const rootRef = useExternRef(getRootRef);\n  const focused = useFocusWithin(rootRef);\n  const inRef = React.useRef<HTMLDivElement>(null);\n  const panGestureRecognizer = React.useRef<UIPanGestureRecognizer | null>(null);\n\n  const shiftDataRef = React.useRef<ShiftData | null>(null);\n\n  const rafRef = React.useRef<ReturnType<typeof requestAnimationFrame> | null>(null);\n  const closeTimeoutIdRef = React.useRef<ReturnType<typeof setTimeout>>();\n  const mediaQueries = useMediaQueries();\n  const [animationState, animationHandlers] = useCSSKeyframesAnimationController(\n    open ? 'enter' : 'exit',\n    {\n      onExited: onClose,\n    },\n  );\n\n  const clearRAF = React.useCallback(() => {\n    if (rafRef.current !== null) {\n      cancelAnimationFrame(rafRef.current);\n      rafRef.current = null;\n    }\n  }, []);\n\n  const updateShiftAxisCSSProperties = React.useCallback(\n    (x: number | null, y: number | null) => {\n      rafRef.current = requestAnimationFrame(() => {\n        if (rootRef.current) {\n          x === null\n            ? rootRef.current.style.removeProperty('--vkui_internal--snackbar_shift_x')\n            : rootRef.current.style.setProperty('--vkui_internal--snackbar_shift_x', `${x}px`);\n          y === null\n            ? rootRef.current.style.removeProperty('--vkui_internal--snackbar_shift_y')\n            : rootRef.current.style.setProperty('--vkui_internal--snackbar_shift_y', `${y}px`);\n        }\n      });\n    },\n    [rootRef],\n  );\n\n  const close = React.useCallback(() => {\n    setOpen(false);\n  }, []);\n\n  const handleActionClick = (event: React.MouseEvent) => {\n    close();\n    if (action) {\n      onActionClick(event);\n    }\n  };\n\n  const handleTouchStart = (event: React.UIEvent<HTMLDivElement>) => {\n    panGestureRecognizer.current = new UIPanGestureRecognizer();\n    panGestureRecognizer.current.setStartCoords(event.nativeEvent);\n    shiftDataRef.current = getInitialShiftData(\n      rootRef.current!.offsetWidth,\n      rootRef.current!.offsetHeight,\n      mediaQueries,\n    );\n    setTouched(true);\n  };\n\n  const handleTouchMove = (event: React.UIEvent<HTMLDivElement>) => {\n    if (shiftDataRef.current && panGestureRecognizer.current) {\n      panGestureRecognizer.current.setInitialTimeOnce();\n      panGestureRecognizer.current.setEndCoords(event.nativeEvent);\n      shiftDataRef.current = getMovedShiftData(\n        placement,\n        shiftDataRef.current,\n        panGestureRecognizer.current.delta(),\n      );\n\n      if (shiftDataRef.current.shifted) {\n        updateShiftAxisCSSProperties(shiftDataRef.current.x, shiftDataRef.current.y);\n      }\n    }\n  };\n\n  const handleTouchEnd = () => {\n    if (\n      touched &&\n      shiftDataRef.current &&\n      panGestureRecognizer.current &&\n      shouldBeClosedByShiftData(\n        placement,\n        shiftDataRef.current,\n        getRelativeBoundingClientRect(rootRef.current!, inRef.current!),\n        panGestureRecognizer.current.velocity(),\n      )\n    ) {\n      close();\n    }\n\n    setTouched(false);\n  };\n\n  useIsomorphicLayoutEffect(\n    function closeAfterDelay() {\n      if (!open || focused || touched || animationState !== 'entered') {\n        return;\n      }\n      closeTimeoutIdRef.current = setTimeout(close, duration);\n      return function preventCloseAfterDelayOnUnmount() {\n        clearTimeout(closeTimeoutIdRef.current);\n      };\n    },\n    [open, focused, touched, animationState, close, duration],\n  );\n\n  useIsomorphicLayoutEffect(\n    function clearUserInteractionDataAfterTouchEnd() {\n      if (!touched) {\n        clearRAF();\n        shiftDataRef.current = null;\n        panGestureRecognizer.current = null;\n\n        if (open) {\n          updateShiftAxisCSSProperties(null, null);\n        }\n      }\n    },\n    [touched, open, updateShiftAxisCSSProperties, clearRAF],\n  );\n\n  React.useEffect(() => clearRAF, [clearRAF]);\n\n  useGlobalEscKeyDown(open, close);\n\n  if (animationState === 'exited') {\n    return null;\n  }\n\n  return (\n    <RootComponent\n      {...restProps}\n      role=\"presentation\"\n      baseClassName={classNames(\n        styles['Snackbar'],\n        platform === 'ios' && styles['Snackbar--ios'],\n        touched && styles['Snackbar--touched'],\n        placementClassNames[placement],\n        animationStateClassNames[animationState],\n      )}\n      style={resolveOffsetYCssStyle(placement, style, offsetY)}\n      getRootRef={rootRef}\n    >\n      <div\n        role=\"alert\"\n        className={styles['Snackbar__in']}\n        ref={inRef}\n        // mobile\n        onTouchStart={handleTouchStart}\n        onTouchMove={handleTouchMove}\n        onTouchEnd={handleTouchEnd}\n        // desktop\n        onMouseDown={handleTouchStart}\n        onMouseMove={handleTouchMove}\n        onMouseUp={handleTouchEnd}\n        onMouseLeave={handleTouchEnd}\n        {...animationHandlers}\n      >\n        <Basic\n          mode={mode}\n          layout={layout}\n          before={before}\n          after={after}\n          subtitle={subtitle}\n          action={\n            action && (\n              <Button\n                align=\"left\"\n                mode=\"link\"\n                appearance={\n                  mode === 'dark'\n                    ? /* istanbul ignore next: проверяется в e2e */\n                      'overlay'\n                    : 'accent'\n                }\n                size=\"s\"\n                onClick={handleActionClick}\n              >\n                {action}\n              </Button>\n            )\n          }\n        >\n          {children}\n        </Basic>\n      </div>\n    </RootComponent>\n  );\n};\n\nSnackbar.Basic = Basic;\n"],"names":["React","classNames","noop","useExternRef","useFocusWithin","useGlobalEscKeyDown","useMediaQueries","usePlatform","useCSSKeyframesAnimationController","getRelativeBoundingClientRect","UIPanGestureRecognizer","useIsomorphicLayoutEffect","Button","RootComponent","Basic","getInitialShiftData","getMovedShiftData","resolveOffsetYCssStyle","shouldBeClosedByShiftData","styles","placementClassNames","animationStateClassNames","enter","entering","entered","exit","exiting","exited","undefined","Snackbar","placement","children","layout","action","before","after","duration","onActionClick","onClose","mode","subtitle","offsetY","style","getRootRef","restProps","platform","open","setOpen","useState","touched","setTouched","rootRef","focused","inRef","useRef","panGestureRecognizer","shiftDataRef","rafRef","closeTimeoutIdRef","mediaQueries","animationState","animationHandlers","onExited","clearRAF","useCallback","current","cancelAnimationFrame","updateShiftAxisCSSProperties","x","y","requestAnimationFrame","removeProperty","setProperty","close","handleActionClick","event","handleTouchStart","setStartCoords","nativeEvent","offsetWidth","offsetHeight","handleTouchMove","setInitialTimeOnce","setEndCoords","delta","shifted","handleTouchEnd","velocity","closeAfterDelay","setTimeout","preventCloseAfterDelayOnUnmount","clearTimeout","clearUserInteractionDataAfterTouchEnd","useEffect","role","baseClassName","div","className","ref","onTouchStart","onTouchMove","onTouchEnd","onMouseDown","onMouseMove","onMouseUp","onMouseLeave","align","appearance","size","onClick"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/Snackbar/Snackbar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useFocusWithin } from '../../hooks/useFocusWithin';\nimport { useGlobalEscKeyDown } from '../../hooks/useGlobalEscKeyDown';\nimport { useMediaQueries } from '../../hooks/useMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useCSSKeyframesAnimationController } from '../../lib/animation';\nimport { getRelativeBoundingClientRect } from '../../lib/dom';\nimport { UIPanGestureRecognizer } from '../../lib/touch';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { Button } from '../Button/Button';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Basic, BasicProps } from './subcomponents/Basic/Basic';\nimport type { ShiftData, SnackbarPlacement } from './types';\nimport {\n  getInitialShiftData,\n  getMovedShiftData,\n  resolveOffsetYCssStyle,\n  shouldBeClosedByShiftData,\n} from './utils';\nimport styles from './Snackbar.module.css';\n\nconst placementClassNames = {\n  'top-start': styles['Snackbar--placement-top-start'],\n  'top': styles['Snackbar--placement-top'],\n  'top-end': styles['Snackbar--placement-top-end'],\n  'bottom-start': styles['Snackbar--placement-bottom-start'],\n  'bottom': styles['Snackbar--placement-bottom'],\n  'bottom-end': styles['Snackbar--placement-bottom-end'],\n};\n\nconst animationStateClassNames = {\n  enter: styles['Snackbar--state-enter'],\n  entering: styles['Snackbar--state-entering'],\n  entered: styles['Snackbar--state-entered'],\n  exit: styles['Snackbar--state-exit'],\n  exiting: styles['Snackbar--state-exiting'],\n  exited: undefined,\n};\n\nexport interface SnackbarProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'role'>,\n    BasicProps {\n  /**\n   * Задаёт расположение компонента.\n   *\n   * > Note: в мобильном режиме:\n   * > - `\"top-start\"`/`\"top-end\"` перебивается на `\"top\"`, чтобы поведение было схожим с нативными\n   * >   уведомлениями;\n   * > - `\"bottom\"`/`\"bottom-end\"` перебивается на \"bottom-start\", чтобы избежать вызова системных\n   * >   функций, таких как **Pull To Refresh** и **Режим управления одной рукой**.\n   */\n  placement?: SnackbarPlacement;\n  /**\n   * Название кнопки действия в уведомлении\n   * Не может использоваться одновременно с `subtitle`\n   */\n  action?: React.ReactNode;\n  /**\n   * Будет вызвано при клике на кнопку действия\n   */\n  onActionClick?: (event: React.MouseEvent) => void;\n  /**\n   * Время в миллисекундах, через которое плашка скроется\n   */\n  duration?: number;\n  /**\n   * Обработчик закрытия уведомления\n   */\n  onClose: () => void;\n  /**\n   * Величина отступа снизу. Используется для позиционирования элемента в случае, когда нежелательно, чтобы Snackbar при появлении перекрывал важные элементы интерфейса.\n   */\n  offsetY?: React.CSSProperties['bottom'];\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Snackbar\n */\nexport const Snackbar: React.FC<SnackbarProps> & { Basic: typeof Basic } = ({\n  placement = 'bottom-start',\n  children,\n  layout,\n  action,\n  before,\n  after,\n  duration = 4000,\n  onActionClick = noop,\n  onClose,\n  mode = 'default',\n  subtitle,\n  offsetY,\n  style,\n  getRootRef,\n  ...restProps\n}: SnackbarProps) => {\n  const platform = usePlatform();\n\n  const [open, setOpen] = React.useState(true);\n  const [touched, setTouched] = React.useState(false);\n\n  const rootRef = useExternRef(getRootRef);\n  const focused = useFocusWithin(rootRef);\n  const inRef = React.useRef<HTMLDivElement>(null);\n  const panGestureRecognizer = React.useRef<UIPanGestureRecognizer | null>(null);\n\n  const shiftDataRef = React.useRef<ShiftData | null>(null);\n\n  const rafRef = React.useRef<ReturnType<typeof requestAnimationFrame> | null>(null);\n  const closeTimeoutIdRef = React.useRef<ReturnType<typeof setTimeout>>();\n  const mediaQueries = useMediaQueries();\n  const [animationState, animationHandlers] = useCSSKeyframesAnimationController(\n    open ? 'enter' : 'exit',\n    {\n      onExited: onClose,\n    },\n  );\n\n  const clearRAF = React.useCallback(() => {\n    if (rafRef.current !== null) {\n      cancelAnimationFrame(rafRef.current);\n      rafRef.current = null;\n    }\n  }, []);\n\n  const updateShiftAxisCSSProperties = React.useCallback(\n    (x: number | null, y: number | null) => {\n      rafRef.current = requestAnimationFrame(() => {\n        if (rootRef.current) {\n          x === null\n            ? rootRef.current.style.removeProperty('--vkui_internal--snackbar_shift_x')\n            : rootRef.current.style.setProperty('--vkui_internal--snackbar_shift_x', `${x}px`);\n          y === null\n            ? rootRef.current.style.removeProperty('--vkui_internal--snackbar_shift_y')\n            : rootRef.current.style.setProperty('--vkui_internal--snackbar_shift_y', `${y}px`);\n        }\n      });\n    },\n    [rootRef],\n  );\n\n  const close = React.useCallback(() => {\n    setOpen(false);\n  }, []);\n\n  const handleActionClick = (event: React.MouseEvent) => {\n    close();\n    if (action) {\n      onActionClick(event);\n    }\n  };\n\n  const handleTouchStart = (event: React.UIEvent<HTMLDivElement>) => {\n    panGestureRecognizer.current = new UIPanGestureRecognizer();\n    panGestureRecognizer.current.setStartCoords(event.nativeEvent);\n    shiftDataRef.current = getInitialShiftData(\n      rootRef.current!.offsetWidth,\n      rootRef.current!.offsetHeight,\n      mediaQueries,\n    );\n    setTouched(true);\n  };\n\n  const handleTouchMove = (event: React.UIEvent<HTMLDivElement>) => {\n    if (shiftDataRef.current && panGestureRecognizer.current) {\n      panGestureRecognizer.current.setInitialTimeOnce();\n      panGestureRecognizer.current.setEndCoords(event.nativeEvent);\n      shiftDataRef.current = getMovedShiftData(\n        placement,\n        shiftDataRef.current,\n        panGestureRecognizer.current.delta(),\n      );\n\n      if (shiftDataRef.current.shifted) {\n        updateShiftAxisCSSProperties(shiftDataRef.current.x, shiftDataRef.current.y);\n      }\n    }\n  };\n\n  const handleTouchEnd = () => {\n    if (\n      touched &&\n      shiftDataRef.current &&\n      panGestureRecognizer.current &&\n      shouldBeClosedByShiftData(\n        placement,\n        shiftDataRef.current,\n        getRelativeBoundingClientRect(rootRef.current!, inRef.current!),\n        panGestureRecognizer.current.velocity(),\n      )\n    ) {\n      close();\n    }\n\n    setTouched(false);\n  };\n\n  useIsomorphicLayoutEffect(\n    function closeAfterDelay() {\n      if (!open || focused || touched || animationState !== 'entered') {\n        return;\n      }\n      closeTimeoutIdRef.current = setTimeout(close, duration);\n      return function preventCloseAfterDelayOnUnmount() {\n        clearTimeout(closeTimeoutIdRef.current);\n      };\n    },\n    [open, focused, touched, animationState, close, duration],\n  );\n\n  useIsomorphicLayoutEffect(\n    function clearUserInteractionDataAfterTouchEnd() {\n      if (!touched) {\n        clearRAF();\n        shiftDataRef.current = null;\n        panGestureRecognizer.current = null;\n\n        if (open) {\n          updateShiftAxisCSSProperties(null, null);\n        }\n      }\n    },\n    [touched, open, updateShiftAxisCSSProperties, clearRAF],\n  );\n\n  React.useEffect(() => clearRAF, [clearRAF]);\n\n  useGlobalEscKeyDown(open, close);\n\n  if (animationState === 'exited') {\n    return null;\n  }\n\n  return (\n    <RootComponent\n      {...restProps}\n      role=\"presentation\"\n      baseClassName={classNames(\n        styles['Snackbar'],\n        platform === 'ios' && styles['Snackbar--ios'],\n        touched && styles['Snackbar--touched'],\n        placementClassNames[placement],\n        animationStateClassNames[animationState],\n      )}\n      style={resolveOffsetYCssStyle(placement, style, offsetY)}\n      getRootRef={rootRef}\n    >\n      <div\n        role=\"alert\"\n        className={styles['Snackbar__in']}\n        ref={inRef}\n        // mobile\n        onTouchStart={handleTouchStart}\n        onTouchMove={handleTouchMove}\n        onTouchEnd={handleTouchEnd}\n        // desktop\n        onMouseDown={handleTouchStart}\n        onMouseMove={handleTouchMove}\n        onMouseUp={handleTouchEnd}\n        onMouseLeave={handleTouchEnd}\n        {...animationHandlers}\n      >\n        <Basic\n          mode={mode}\n          layout={layout}\n          before={before}\n          after={after}\n          subtitle={subtitle}\n          action={\n            action && (\n              <Button\n                align=\"left\"\n                mode=\"link\"\n                appearance={\n                  mode === 'dark'\n                    ? /* istanbul ignore next: проверяется в e2e */\n                      'overlay'\n                    : 'accent'\n                }\n                size=\"s\"\n                onClick={handleActionClick}\n              >\n                {action}\n              </Button>\n            )\n          }\n        >\n          {children}\n        </Basic>\n      </div>\n    </RootComponent>\n  );\n};\n\nSnackbar.Basic = Basic;\n"],"names":["React","classNames","noop","useExternRef","useFocusWithin","useGlobalEscKeyDown","useMediaQueries","usePlatform","useCSSKeyframesAnimationController","getRelativeBoundingClientRect","UIPanGestureRecognizer","useIsomorphicLayoutEffect","Button","RootComponent","Basic","getInitialShiftData","getMovedShiftData","resolveOffsetYCssStyle","shouldBeClosedByShiftData","styles","placementClassNames","animationStateClassNames","enter","entering","entered","exit","exiting","exited","undefined","Snackbar","placement","children","layout","action","before","after","duration","onActionClick","onClose","mode","subtitle","offsetY","style","getRootRef","restProps","platform","open","setOpen","useState","touched","setTouched","rootRef","focused","inRef","useRef","panGestureRecognizer","shiftDataRef","rafRef","closeTimeoutIdRef","mediaQueries","animationState","animationHandlers","onExited","clearRAF","useCallback","current","cancelAnimationFrame","updateShiftAxisCSSProperties","x","y","requestAnimationFrame","removeProperty","setProperty","close","handleActionClick","event","handleTouchStart","setStartCoords","nativeEvent","offsetWidth","offsetHeight","handleTouchMove","setInitialTimeOnce","setEndCoords","delta","shifted","handleTouchEnd","velocity","closeAfterDelay","setTimeout","preventCloseAfterDelayOnUnmount","clearTimeout","clearUserInteractionDataAfterTouchEnd","useEffect","role","baseClassName","div","className","ref","onTouchStart","onTouchMove","onTouchEnd","onMouseDown","onMouseMove","onMouseUp","onMouseLeave","align","appearance","size","onClick"],"mappings":"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"}

package/dist/cssm/components/Snackbar/subcomponents/Basic/Basic.d.ts

@@ -35,5 +35,5 @@ export interface BasicProps {
 }
 export interface SnackbarBasicProps extends HTMLAttributesWithRootRef<HTMLDivElement>, BasicProps {
 }
-export declare function Basic({ layout: layoutProps, action, after, before, mode, subtitle, children, ...restProps }: SnackbarBasicProps): import("react/jsx-runtime").JSX.Element;
+export declare function Basic({ layout: layoutProps, action, after, before, mode, subtitle, children, ...restProps }: SnackbarBasicProps): React.ReactNode;
 //# sourceMappingURL=Basic.d.ts.map

package/dist/cssm/components/Snackbar/subcomponents/Basic/Basic.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Basic.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Snackbar/subcomponents/Basic/Basic.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAiB9D,MAAM,WAAW,UAAU;IACzB;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB;;;;OAIG;IACH,MAAM,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IAEnC;;;;;OAKG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAE1B;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,MAAM,WAAW,kBAAmB,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU;CAAG;AAEpG,wBAAgB,KAAK,CAAC,EACpB,MAAM,EAAE,WAAW,EACnB,MAAM,EACN,KAAK,EACL,MAAM,EACN,IAAI,EACJ,QAAQ,EACR,QAAQ,EACR,GAAG,SAAS,EACb,EAAE,kBAAkB,2CA4BpB"}
+{"version":3,"file":"Basic.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Snackbar/subcomponents/Basic/Basic.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAiB9D,MAAM,WAAW,UAAU;IACzB;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB;;;;OAIG;IACH,MAAM,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IAEnC;;;;;OAKG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAE1B;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,MAAM,WAAW,kBAAmB,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU;CAAG;AAEpG,wBAAgB,KAAK,CAAC,EACpB,MAAM,EAAE,WAAW,EACnB,MAAM,EACN,KAAK,EACL,MAAM,EACN,IAAI,EACJ,QAAQ,EACR,QAAQ,EACR,GAAG,SAAS,EACb,EAAE,kBAAkB,GAAG,KAAK,CAAC,SAAS,CA4BtC"}

package/dist/cssm/components/Snackbar/subcomponents/Basic/Basic.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/components/Snackbar/subcomponents/Basic/Basic.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../../../hooks/useAdaptivity';\nimport { HTMLAttributesWithRootRef } from '../../../../types';\nimport { RootComponent } from '../../../RootComponent/RootComponent';\nimport { Paragraph } from '../../../Typography/Paragraph/Paragraph';\nimport { Subhead } from '../../../Typography/Subhead/Subhead';\nimport styles from './Basic.module.css';\n\nconst stylesLayout = {\n  none: styles['Snackbar--layout-none'],\n  vertical: styles['Snackbar--layout-vertical'],\n  horizontal: styles['Snackbar--layout-horizontal'],\n};\n\nconst sizeYClassNames = {\n  none: styles['Snackbar--sizeY-none'],\n  regular: styles['Snackbar--sizeY-regular'],\n};\n\nexport interface BasicProps {\n  /**\n   * Элемент действия.\n   * Не может использоваться одновременно с `subtitle`\n   */\n  action?: React.ReactNode;\n\n  /**\n   * Контент в правой части, может быть иконкой 24x24\n   */\n  after?: React.ReactNode;\n\n  /**\n   * Варианты расположения кнопки действия\n   * По умолчанию на десктопах, или при наличии элементов `after` или `subtitle`\n   * имеет значение `vertical`, в остальных случаях `horizontal`\n   */\n  layout?: 'vertical' | 'horizontal';\n\n  /**\n   * Может быть следующими компонентами:\n   *  - цветная иконка 24x24 или 28x28 пикселя\n   *  - `<Avatar size={32} />`\n   *  - `<Image size={40} />`\n   */\n  before?: React.ReactNode;\n\n  /**\n   * Задает стиль снекбара\n   */\n  mode?: 'default' | 'dark';\n\n  /**\n   * Дополнительная строка текста под `children`.\n   * Не может использоваться одновременно с `action`\n   */\n  subtitle?: React.ReactNode;\n}\n\nexport interface SnackbarBasicProps extends HTMLAttributesWithRootRef<HTMLDivElement>, BasicProps {}\n\nexport function Basic({\n  layout: layoutProps,\n  action,\n  after,\n  before,\n  mode,\n  subtitle,\n  children,\n  ...restProps\n}: SnackbarBasicProps) {\n  const { sizeY = 'none' } = useAdaptivity();\n  const layout = after || subtitle ? 'vertical' : 'none';\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles['Snackbar__body'],\n        stylesLayout[layoutProps || layout],\n        sizeY !== 'compact' && sizeYClassNames[sizeY],\n        mode === 'dark' && styles['Snackbar--mode-dark'],\n      )}\n    >\n      {before && <div className={styles['Snackbar__before']}>{before}</div>}\n\n      <div className={styles['Snackbar__content']}>\n        <Paragraph className={styles['Snackbar__content-text']}>{children}</Paragraph>\n        {subtitle && !action && (\n          <Subhead className={styles['Snackbar__content-subtitle']}>{subtitle}</Subhead>\n        )}\n\n        {action && !subtitle && <div className={styles['Snackbar__action']}>{action}</div>}\n      </div>\n\n      {after && <div className={styles['Snackbar__after']}>{after}</div>}\n    </RootComponent>\n  );\n}\n"],"names":["React","classNames","useAdaptivity","RootComponent","Paragraph","Subhead","styles","stylesLayout","none","vertical","horizontal","sizeYClassNames","regular","Basic","layout","layoutProps","action","after","before","mode","subtitle","children","restProps","sizeY","baseClassName","div","className"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,kCAAkC;AAEhE,SAASC,aAAa,QAAQ,uCAAuC;AACrE,SAASC,SAAS,QAAQ,0CAA0C;AACpE,SAASC,OAAO,QAAQ,sCAAsC;AAC9D,OAAOC,YAAY,qBAAqB;AAExC,MAAMC,eAAe;IACnBC,MAAMF,MAAM,CAAC,wBAAwB;IACrCG,UAAUH,MAAM,CAAC,4BAA4B;IAC7CI,YAAYJ,MAAM,CAAC,8BAA8B;AACnD;AAEA,MAAMK,kBAAkB;IACtBH,MAAMF,MAAM,CAAC,uBAAuB;IACpCM,SAASN,MAAM,CAAC,0BAA0B;AAC5C;AA2CA,OAAO,SAASO,MAAM,EACpBC,QAAQC,WAAW,EACnBC,MAAM,EACNC,KAAK,EACLC,MAAM,EACNC,IAAI,EACJC,QAAQ,EACRC,QAAQ,EACR,GAAGC,WACgB;IACnB,MAAM,EAAEC,QAAQ,MAAM,EAAE,GAAGrB;IAC3B,MAAMY,SAASG,SAASG,WAAW,aAAa;IAEhD,qBACE,MAACjB;QACE,GAAGmB,SAAS;QACbE,eAAevB,WACbK,MAAM,CAAC,iBAAiB,EACxBC,YAAY,CAACQ,eAAeD,OAAO,EACnCS,UAAU,aAAaZ,eAAe,CAACY,MAAM,EAC7CJ,SAAS,UAAUb,MAAM,CAAC,sBAAsB;;YAGjDY,wBAAU,KAACO;gBAAIC,WAAWpB,MAAM,CAAC,mBAAmB;0BAAGY;;0BAExD,MAACO;gBAAIC,WAAWpB,MAAM,CAAC,oBAAoB;;kCACzC,KAACF;wBAAUsB,WAAWpB,MAAM,CAAC,yBAAyB;kCAAGe;;oBACxDD,YAAY,CAACJ,wBACZ,KAACX;wBAAQqB,WAAWpB,MAAM,CAAC,6BAA6B;kCAAGc;;oBAG5DJ,UAAU,CAACI,0BAAY,KAACK;wBAAIC,WAAWpB,MAAM,CAAC,mBAAmB;kCAAGU;;;;YAGtEC,uBAAS,KAACQ;gBAAIC,WAAWpB,MAAM,CAAC,kBAAkB;0BAAGW;;;;AAG5D"}
+{"version":3,"sources":["../../../../../../src/components/Snackbar/subcomponents/Basic/Basic.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../../../hooks/useAdaptivity';\nimport { HTMLAttributesWithRootRef } from '../../../../types';\nimport { RootComponent } from '../../../RootComponent/RootComponent';\nimport { Paragraph } from '../../../Typography/Paragraph/Paragraph';\nimport { Subhead } from '../../../Typography/Subhead/Subhead';\nimport styles from './Basic.module.css';\n\nconst stylesLayout = {\n  none: styles['Snackbar--layout-none'],\n  vertical: styles['Snackbar--layout-vertical'],\n  horizontal: styles['Snackbar--layout-horizontal'],\n};\n\nconst sizeYClassNames = {\n  none: styles['Snackbar--sizeY-none'],\n  regular: styles['Snackbar--sizeY-regular'],\n};\n\nexport interface BasicProps {\n  /**\n   * Элемент действия.\n   * Не может использоваться одновременно с `subtitle`\n   */\n  action?: React.ReactNode;\n\n  /**\n   * Контент в правой части, может быть иконкой 24x24\n   */\n  after?: React.ReactNode;\n\n  /**\n   * Варианты расположения кнопки действия\n   * По умолчанию на десктопах, или при наличии элементов `after` или `subtitle`\n   * имеет значение `vertical`, в остальных случаях `horizontal`\n   */\n  layout?: 'vertical' | 'horizontal';\n\n  /**\n   * Может быть следующими компонентами:\n   *  - цветная иконка 24x24 или 28x28 пикселя\n   *  - `<Avatar size={32} />`\n   *  - `<Image size={40} />`\n   */\n  before?: React.ReactNode;\n\n  /**\n   * Задает стиль снекбара\n   */\n  mode?: 'default' | 'dark';\n\n  /**\n   * Дополнительная строка текста под `children`.\n   * Не может использоваться одновременно с `action`\n   */\n  subtitle?: React.ReactNode;\n}\n\nexport interface SnackbarBasicProps extends HTMLAttributesWithRootRef<HTMLDivElement>, BasicProps {}\n\nexport function Basic({\n  layout: layoutProps,\n  action,\n  after,\n  before,\n  mode,\n  subtitle,\n  children,\n  ...restProps\n}: SnackbarBasicProps): React.ReactNode {\n  const { sizeY = 'none' } = useAdaptivity();\n  const layout = after || subtitle ? 'vertical' : 'none';\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles['Snackbar__body'],\n        stylesLayout[layoutProps || layout],\n        sizeY !== 'compact' && sizeYClassNames[sizeY],\n        mode === 'dark' && styles['Snackbar--mode-dark'],\n      )}\n    >\n      {before && <div className={styles['Snackbar__before']}>{before}</div>}\n\n      <div className={styles['Snackbar__content']}>\n        <Paragraph className={styles['Snackbar__content-text']}>{children}</Paragraph>\n        {subtitle && !action && (\n          <Subhead className={styles['Snackbar__content-subtitle']}>{subtitle}</Subhead>\n        )}\n\n        {action && !subtitle && <div className={styles['Snackbar__action']}>{action}</div>}\n      </div>\n\n      {after && <div className={styles['Snackbar__after']}>{after}</div>}\n    </RootComponent>\n  );\n}\n"],"names":["React","classNames","useAdaptivity","RootComponent","Paragraph","Subhead","styles","stylesLayout","none","vertical","horizontal","sizeYClassNames","regular","Basic","layout","layoutProps","action","after","before","mode","subtitle","children","restProps","sizeY","baseClassName","div","className"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,kCAAkC;AAEhE,SAASC,aAAa,QAAQ,uCAAuC;AACrE,SAASC,SAAS,QAAQ,0CAA0C;AACpE,SAASC,OAAO,QAAQ,sCAAsC;AAC9D,OAAOC,YAAY,qBAAqB;AAExC,MAAMC,eAAe;IACnBC,MAAMF,MAAM,CAAC,wBAAwB;IACrCG,UAAUH,MAAM,CAAC,4BAA4B;IAC7CI,YAAYJ,MAAM,CAAC,8BAA8B;AACnD;AAEA,MAAMK,kBAAkB;IACtBH,MAAMF,MAAM,CAAC,uBAAuB;IACpCM,SAASN,MAAM,CAAC,0BAA0B;AAC5C;AA2CA,OAAO,SAASO,MAAM,EACpBC,QAAQC,WAAW,EACnBC,MAAM,EACNC,KAAK,EACLC,MAAM,EACNC,IAAI,EACJC,QAAQ,EACRC,QAAQ,EACR,GAAGC,WACgB;IACnB,MAAM,EAAEC,QAAQ,MAAM,EAAE,GAAGrB;IAC3B,MAAMY,SAASG,SAASG,WAAW,aAAa;IAEhD,qBACE,MAACjB;QACE,GAAGmB,SAAS;QACbE,eAAevB,WACbK,MAAM,CAAC,iBAAiB,EACxBC,YAAY,CAACQ,eAAeD,OAAO,EACnCS,UAAU,aAAaZ,eAAe,CAACY,MAAM,EAC7CJ,SAAS,UAAUb,MAAM,CAAC,sBAAsB;;YAGjDY,wBAAU,KAACO;gBAAIC,WAAWpB,MAAM,CAAC,mBAAmB;0BAAGY;;0BAExD,MAACO;gBAAIC,WAAWpB,MAAM,CAAC,oBAAoB;;kCACzC,KAACF;wBAAUsB,WAAWpB,MAAM,CAAC,yBAAyB;kCAAGe;;oBACxDD,YAAY,CAACJ,wBACZ,KAACX;wBAAQqB,WAAWpB,MAAM,CAAC,6BAA6B;kCAAGc;;oBAG5DJ,UAAU,CAACI,0BAAY,KAACK;wBAAIC,WAAWpB,MAAM,CAAC,mBAAmB;kCAAGU;;;;YAGtEC,uBAAS,KAACQ;gBAAIC,WAAWpB,MAAM,CAAC,kBAAkB;0BAAGW;;;;AAG5D"}

package/dist/cssm/components/Snackbar/subcomponents/Basic/Basic.module.css

@@ -11,7 +11,7 @@
   min-block-size: 56px;
   display: flex;
   align-items: center;
-  background: var(--vkui--color_background_modal);
+  background: var(--vkui--color_background_contrast_themed);
   box-shadow: var(--vkui--elevation4);
   border-radius: var(--vkui--size_card_border_radius--regular);
 }

package/dist/cssm/components/Snackbar/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/components/Snackbar/utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAEzD,OAAO,KAAK,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5D,wBAAgB,sBAAsB,CACpC,SAAS,EAAE,iBAAiB,EAC5B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,EAC3B,OAAO,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,OAAO,CAAC,mCAevC;AAED,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,EACd,YAAY,EAAE,YAAY,GACzB,SAAS,CASX;AAED,wBAAgB,iBAAiB,CAC/B,SAAS,EAAE,iBAAiB,EAC5B,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,GAClC,SAAS,CAuBX;AAID,wBAAgB,yBAAyB,CACvC,SAAS,EAAE,iBAAiB,EAC5B,SAAS,EAAE,SAAS,EACpB,kBAAkB,EAAE,OAAO,EAC3B,QAAQ,EAAE;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,WA6CnC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/components/Snackbar/utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAEzD,OAAO,KAAK,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5D,wBAAgB,sBAAsB,CACpC,SAAS,EAAE,iBAAiB,EAC5B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,EAC3B,OAAO,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,OAAO,CAAC,GACrC,KAAK,CAAC,aAAa,GAAG,SAAS,CAcjC;AAED,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,EACd,YAAY,EAAE,YAAY,GACzB,SAAS,CASX;AAED,wBAAgB,iBAAiB,CAC/B,SAAS,EAAE,iBAAiB,EAC5B,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,GAClC,SAAS,CAuBX;AAID,wBAAgB,yBAAyB,CACvC,SAAS,EAAE,iBAAiB,EAC5B,SAAS,EAAE,SAAS,EACpB,kBAAkB,EAAE,OAAO,EAC3B,QAAQ,EAAE;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,GACjC,OAAO,CA4CT"}

package/dist/cssm/components/Snackbar/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Snackbar/utils.ts"],"sourcesContent":["import * as React from 'react';\nimport type { MediaQueries } from '../../lib/adaptivity';\nimport { rubberbandIfOutOfBounds } from '../../lib/animation';\nimport type { ShiftData, SnackbarPlacement } from './types';\n\nexport function resolveOffsetYCssStyle(\n  placement: SnackbarPlacement,\n  style?: React.CSSProperties,\n  offsetY?: React.CSSProperties['inset'],\n) {\n  if (offsetY === undefined) {\n    return style;\n  }\n  switch (placement) {\n    case 'top-start':\n    case 'top':\n    case 'top-end':\n      return { ...style, top: offsetY };\n    case 'bottom-start':\n    case 'bottom':\n    case 'bottom-end':\n      return { ...style, bottom: offsetY };\n  }\n}\n\nexport function getInitialShiftData(\n  width: number,\n  height: number,\n  mediaQueries: MediaQueries,\n): ShiftData {\n  return {\n    shifted: false,\n    isDesktop: mediaQueries.smallTabletPlus.matches, // eslint-disable-line no-restricted-properties\n    x: 0,\n    y: 0,\n    width,\n    height,\n  };\n}\n\nexport function getMovedShiftData(\n  placement: SnackbarPlacement,\n  shiftData: ShiftData,\n  nextShift: { x: number; y: number },\n): ShiftData {\n  /* istanbul ignore else: TODO чтобы протестировать кейс в блоке else, нужно мокать useMediaQueries(), чтобы перебивать mediaQueries.smallTabletPlus.matches */\n  if (shiftData.isDesktop) {\n    if (placement.endsWith('start')) {\n      shiftData.x = rubberbandIfOutOfBounds(nextShift.x, -shiftData.width, 0);\n    } else if (placement.endsWith('end')) {\n      shiftData.x = rubberbandIfOutOfBounds(nextShift.x, 0, shiftData.width);\n    }\n\n    if (placement.startsWith('bottom')) {\n      shiftData.y = rubberbandIfOutOfBounds(nextShift.y, 0, shiftData.height);\n    }\n  } else if (placement.startsWith('bottom')) {\n    shiftData.x = rubberbandIfOutOfBounds(nextShift.x, -shiftData.width, 0);\n  }\n\n  if (placement.startsWith('top')) {\n    shiftData.y = rubberbandIfOutOfBounds(nextShift.y, -shiftData.height, 0);\n  }\n\n  shiftData.shifted = true;\n\n  return shiftData;\n}\n\nconst MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE = 200;\n\nexport function shouldBeClosedByShiftData(\n  placement: SnackbarPlacement,\n  shiftData: ShiftData,\n  relativeClientRect: DOMRect,\n  velocity: { x: number; y: number },\n) {\n  if (!shiftData.shifted) {\n    return false;\n  }\n\n  const shouldBeClosedThreshold = { x: false, y: false };\n  const shouldBeClosedByVelocity = { x: false, y: false };\n\n  /* istanbul ignore else: TODO чтобы протестировать кейс в блоке else, нужно мокать useMediaQueries(), чтобы перебивать mediaQueries.smallTabletPlus.matches */\n  if (shiftData.isDesktop) {\n    if (placement.endsWith('start')) {\n      shouldBeClosedThreshold.x = relativeClientRect.x < -relativeClientRect.width / 2;\n      shouldBeClosedByVelocity.x =\n        relativeClientRect.x < 0 ? velocity.x < -MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE : false;\n    } else if (placement.endsWith('end')) {\n      shouldBeClosedThreshold.x = relativeClientRect.x > relativeClientRect.width / 2;\n      shouldBeClosedByVelocity.x =\n        relativeClientRect.x > 0 ? velocity.x > MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE : false;\n    }\n\n    if (placement.startsWith('bottom')) {\n      shouldBeClosedThreshold.y = relativeClientRect.y > relativeClientRect.height / 2;\n      shouldBeClosedByVelocity.y =\n        relativeClientRect.y > 0 ? velocity.y > MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE : false;\n    }\n  } else if (placement.startsWith('bottom')) {\n    shouldBeClosedThreshold.x = relativeClientRect.x < -relativeClientRect.width / 2;\n    shouldBeClosedByVelocity.x =\n      relativeClientRect.x < 0 ? velocity.x < -MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE : false;\n  }\n\n  if (placement.startsWith('top')) {\n    shouldBeClosedThreshold.y = relativeClientRect.y < -relativeClientRect.height / 2;\n    shouldBeClosedByVelocity.y =\n      relativeClientRect.y < 0 ? velocity.y < -MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE : false;\n  }\n\n  return (\n    shouldBeClosedThreshold.x ||\n    shouldBeClosedByVelocity.x ||\n    shouldBeClosedThreshold.y ||\n    /* istanbul ignore next: подсвечивает жёлтым и пишет \"branch not covered\" */\n    shouldBeClosedByVelocity.y\n  );\n}\n"],"names":["React","rubberbandIfOutOfBounds","resolveOffsetYCssStyle","placement","style","offsetY","undefined","top","bottom","getInitialShiftData","width","height","mediaQueries","shifted","isDesktop","smallTabletPlus","matches","x","y","getMovedShiftData","shiftData","nextShift","endsWith","startsWith","MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE","shouldBeClosedByShiftData","relativeClientRect","velocity","shouldBeClosedThreshold","shouldBeClosedByVelocity"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/Snackbar/utils.ts"],"sourcesContent":["import * as React from 'react';\nimport type { MediaQueries } from '../../lib/adaptivity';\nimport { rubberbandIfOutOfBounds } from '../../lib/animation';\nimport type { ShiftData, SnackbarPlacement } from './types';\n\nexport function resolveOffsetYCssStyle(\n  placement: SnackbarPlacement,\n  style?: React.CSSProperties,\n  offsetY?: React.CSSProperties['inset'],\n): React.CSSProperties | undefined {\n  if (offsetY === undefined) {\n    return style;\n  }\n  switch (placement) {\n    case 'top-start':\n    case 'top':\n    case 'top-end':\n      return { ...style, top: offsetY };\n    case 'bottom-start':\n    case 'bottom':\n    case 'bottom-end':\n      return { ...style, bottom: offsetY };\n  }\n}\n\nexport function getInitialShiftData(\n  width: number,\n  height: number,\n  mediaQueries: MediaQueries,\n): ShiftData {\n  return {\n    shifted: false,\n    isDesktop: mediaQueries.smallTabletPlus.matches, // eslint-disable-line no-restricted-properties\n    x: 0,\n    y: 0,\n    width,\n    height,\n  };\n}\n\nexport function getMovedShiftData(\n  placement: SnackbarPlacement,\n  shiftData: ShiftData,\n  nextShift: { x: number; y: number },\n): ShiftData {\n  /* istanbul ignore else: TODO чтобы протестировать кейс в блоке else, нужно мокать useMediaQueries(), чтобы перебивать mediaQueries.smallTabletPlus.matches */\n  if (shiftData.isDesktop) {\n    if (placement.endsWith('start')) {\n      shiftData.x = rubberbandIfOutOfBounds(nextShift.x, -shiftData.width, 0);\n    } else if (placement.endsWith('end')) {\n      shiftData.x = rubberbandIfOutOfBounds(nextShift.x, 0, shiftData.width);\n    }\n\n    if (placement.startsWith('bottom')) {\n      shiftData.y = rubberbandIfOutOfBounds(nextShift.y, 0, shiftData.height);\n    }\n  } else if (placement.startsWith('bottom')) {\n    shiftData.x = rubberbandIfOutOfBounds(nextShift.x, -shiftData.width, 0);\n  }\n\n  if (placement.startsWith('top')) {\n    shiftData.y = rubberbandIfOutOfBounds(nextShift.y, -shiftData.height, 0);\n  }\n\n  shiftData.shifted = true;\n\n  return shiftData;\n}\n\nconst MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE = 200;\n\nexport function shouldBeClosedByShiftData(\n  placement: SnackbarPlacement,\n  shiftData: ShiftData,\n  relativeClientRect: DOMRect,\n  velocity: { x: number; y: number },\n): boolean {\n  if (!shiftData.shifted) {\n    return false;\n  }\n\n  const shouldBeClosedThreshold = { x: false, y: false };\n  const shouldBeClosedByVelocity = { x: false, y: false };\n\n  /* istanbul ignore else: TODO чтобы протестировать кейс в блоке else, нужно мокать useMediaQueries(), чтобы перебивать mediaQueries.smallTabletPlus.matches */\n  if (shiftData.isDesktop) {\n    if (placement.endsWith('start')) {\n      shouldBeClosedThreshold.x = relativeClientRect.x < -relativeClientRect.width / 2;\n      shouldBeClosedByVelocity.x =\n        relativeClientRect.x < 0 ? velocity.x < -MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE : false;\n    } else if (placement.endsWith('end')) {\n      shouldBeClosedThreshold.x = relativeClientRect.x > relativeClientRect.width / 2;\n      shouldBeClosedByVelocity.x =\n        relativeClientRect.x > 0 ? velocity.x > MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE : false;\n    }\n\n    if (placement.startsWith('bottom')) {\n      shouldBeClosedThreshold.y = relativeClientRect.y > relativeClientRect.height / 2;\n      shouldBeClosedByVelocity.y =\n        relativeClientRect.y > 0 ? velocity.y > MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE : false;\n    }\n  } else if (placement.startsWith('bottom')) {\n    shouldBeClosedThreshold.x = relativeClientRect.x < -relativeClientRect.width / 2;\n    shouldBeClosedByVelocity.x =\n      relativeClientRect.x < 0 ? velocity.x < -MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE : false;\n  }\n\n  if (placement.startsWith('top')) {\n    shouldBeClosedThreshold.y = relativeClientRect.y < -relativeClientRect.height / 2;\n    shouldBeClosedByVelocity.y =\n      relativeClientRect.y < 0 ? velocity.y < -MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE : false;\n  }\n\n  return (\n    shouldBeClosedThreshold.x ||\n    shouldBeClosedByVelocity.x ||\n    shouldBeClosedThreshold.y ||\n    /* istanbul ignore next: подсвечивает жёлтым и пишет \"branch not covered\" */\n    shouldBeClosedByVelocity.y\n  );\n}\n"],"names":["React","rubberbandIfOutOfBounds","resolveOffsetYCssStyle","placement","style","offsetY","undefined","top","bottom","getInitialShiftData","width","height","mediaQueries","shifted","isDesktop","smallTabletPlus","matches","x","y","getMovedShiftData","shiftData","nextShift","endsWith","startsWith","MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE","shouldBeClosedByShiftData","relativeClientRect","velocity","shouldBeClosedThreshold","shouldBeClosedByVelocity"],"mappings":"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"}