@vkontakte/vkui 6.0.3 → 6.1.0

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Banner/Banner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Cancel, Icon24Chevron, Icon24Dismiss, Icon24DismissDark } from '@vkontakte/icons';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { IconButton } from '../IconButton/IconButton';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Text } from '../Typography/Text/Text';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './Banner.module.css';\n\nexport interface BannerProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Тип баннера.\n   */\n  mode?: 'tint' | 'image';\n  size?: 's' | 'm';\n  /**\n   * Тип действия в правой части баннера.\n   *\n   * - `dismiss` – отображается иконка крестика, при клике на неё сработает свойство `onDismiss`.\n   * - `expand` – отображается иконка шеврона, которая подразумевает, что при клике на баннер можно куда-то перейти.\n   */\n  asideMode?: 'dismiss' | 'expand';\n  /**\n   * Срабатывает при клике на иконку крестика при `asideMode=\"dismiss\"`.\n   */\n  onDismiss?: React.MouseEventHandler<HTMLButtonElement>;\n  /**\n   * Текст кнопки закрытия. Делает ее доступной для ассистивных технологий\n   */\n  dismissLabel?: string;\n  /**\n   * Содержимое, отображаемое в левой части баннера.\n   */\n  before?: React.ReactNode;\n  /**\n   * Заголовок.\n   */\n  header?: React.ReactNode;\n  /**\n   * Подзаголовок.\n   */\n  subheader?: React.ReactNode;\n  /**\n   * Текст баннера.\n   */\n  text?: React.ReactNode;\n  /**\n   * При использовании `mode=\"image\"`.\n   *\n   * - `light` – в качестве фона используется светлое изображение, цвет текста в баннере будет тёмным.\n   * - `dark` – в качестве фона используется тёмное изображение, цвет текста будет светлым.\n   */\n  imageTheme?: 'light' | 'dark';\n  /**\n   * При использовании `mode=\"image\"`.\n   *\n   * Элемент, который нужно стилизовать цветом и/или фоном. Этот элемент будет растянут на 100% ширины и высоты баннера.\n   */\n  background?: React.ReactNode;\n  /**\n   * Кнопки-действия. Принимает [`Button`](https://vkcom.github.io/VKUI/#/Button).\n   *\n   * - В режиме `tint` или `image` со светлым фоном используйте только с параметрами:\n   *    - `mode=\"primary\"`\n   *    - `mode=\"secondary\"`\n   * - В режиме `image` с тёмным фоном используйте с параметрами:\n   *    - `appearance=\"overlay\"`.\n   *\n   * Для набора кнопок используйте [`ButtonGroup`](https://vkcom.github.io/VKUI/#/ButtonGroup) с параметрами:\n   *\n   * - `gap=\"m\" mode=\"horizontal\" stretched`\n   * - `gap=\"m\" mode=\"vertical\" stretched`\n   */\n  actions?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Banner\n */\nexport const Banner = ({\n  mode = 'tint',\n  imageTheme = 'dark',\n  size = 's',\n  before,\n  asideMode,\n  header,\n  subheader,\n  text,\n  children,\n  background,\n  actions,\n  onDismiss,\n  dismissLabel = 'Скрыть',\n  ...restProps\n}: BannerProps) => {\n  const platform = usePlatform();\n\n  const HeaderTypography = size === 'm' ? Title : Headline;\n  const SubheaderTypography = size === 'm' ? Text : Subhead;\n\n  const IconDismissIOS = mode === 'image' ? Icon24DismissDark : Icon24Dismiss;\n\n  const content = (\n    <>\n      {mode === 'image' && background && (\n        <div aria-hidden className={styles['Banner__bg']}>\n          {background}\n        </div>\n      )}\n\n      {before && <div className={styles['Banner__before']}>{before}</div>}\n\n      <div className={styles['Banner__content']}>\n        {hasReactNode(header) && (\n          <HeaderTypography Component=\"div\" weight=\"2\" level={size === 'm' ? '2' : '1'}>\n            {header}\n          </HeaderTypography>\n        )}\n        {hasReactNode(subheader) && (\n          <SubheaderTypography Component=\"div\" className={styles['Banner__subheader']}>\n            {subheader}\n          </SubheaderTypography>\n        )}\n        {hasReactNode(text) && (\n          <Text Component=\"div\" className={styles['Banner__text']}>\n            {text}\n          </Text>\n        )}\n        {hasReactNode(actions) && React.Children.count(actions) > 0 && (\n          <div className={styles['Banner__actions']}>{actions}</div>\n        )}\n      </div>\n    </>\n  );\n\n  return (\n    <RootComponent\n      Component=\"section\"\n      {...restProps}\n      baseClassName={classNames(\n        styles['Banner'],\n        platform === 'ios' && styles['Banner--ios'],\n        mode === 'image' && styles['Banner--mode-image'],\n        size === 'm' && styles['Banner--size-m'],\n        mode === 'image' && imageTheme === 'dark' && styles['Banner--inverted'],\n      )}\n    >\n      {asideMode === 'expand' ? (\n        <Tappable\n          className={styles['Banner__in']}\n          activeMode={platform === 'ios' ? 'opacity' : 'background'}\n          onClick={noop}\n        >\n          {content}\n\n          <div className={styles['Banner__aside']}>\n            <Icon24Chevron className={styles['Banner__expand']} />\n          </div>\n        </Tappable>\n      ) : (\n        <div className={styles['Banner__in']}>\n          {content}\n\n          {asideMode === 'dismiss' && (\n            <div className={styles['Banner__aside']}>\n              <IconButton\n                label={dismissLabel}\n                className={styles['Banner__dismiss']}\n                onClick={onDismiss}\n                hoverMode=\"opacity\"\n                hasActive={false}\n              >\n                {platform === 'ios' ? <IconDismissIOS /> : <Icon24Cancel />}\n              </IconButton>\n            </div>\n          )}\n        </div>\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["React","Icon24Cancel","Icon24Chevron","Icon24Dismiss","Icon24DismissDark","classNames","hasReactNode","noop","usePlatform","IconButton","RootComponent","Tappable","Headline","Subhead","Text","Title","styles","Banner","mode","imageTheme","size","before","asideMode","header","subheader","text","children","background","actions","onDismiss","dismissLabel","restProps","platform","HeaderTypography","SubheaderTypography","IconDismissIOS","content","div","aria-hidden","className","Component","weight","level","Children","count","baseClassName","activeMode","onClick","label","hoverMode","hasActive"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,EAAEC,aAAa,EAAEC,aAAa,EAAEC,iBAAiB,QAAQ,mBAAmB;AACjG,SAASC,UAAU,EAAEC,YAAY,EAAEC,IAAI,QAAQ,kBAAkB;AACjE,SAASC,WAAW,QAAQ,0BAA0B;AAEtD,SAASC,UAAU,QAAQ,2BAA2B;AACtD,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,IAAI,QAAQ,0BAA0B;AAC/C,SAASC,KAAK,QAAQ,4BAA4B;AAClD,OAAOC,YAAY,sBAAsB;AAqEzC;;CAEC,GACD,OAAO,MAAMC,SAAS,CAAC,EACrBC,OAAO,MAAM,EACbC,aAAa,MAAM,EACnBC,OAAO,GAAG,EACVC,MAAM,EACNC,SAAS,EACTC,MAAM,EACNC,SAAS,EACTC,IAAI,EACJC,QAAQ,EACRC,UAAU,EACVC,OAAO,EACPC,SAAS,EACTC,eAAe,QAAQ,EACvB,GAAGC,WACS;IACZ,MAAMC,WAAWxB;IAEjB,MAAMyB,mBAAmBb,SAAS,MAAML,QAAQH;IAChD,MAAMsB,sBAAsBd,SAAS,MAAMN,OAAOD;IAElD,MAAMsB,iBAAiBjB,SAAS,UAAUd,oBAAoBD;IAE9D,MAAMiC,wBACJ,0CACGlB,SAAS,WAAWS,4BACnB,oBAACU;QAAIC,eAAAA;QAAYC,WAAWvB,MAAM,CAAC,aAAa;OAC7CW,aAIJN,wBAAU,oBAACgB;QAAIE,WAAWvB,MAAM,CAAC,iBAAiB;OAAGK,uBAEtD,oBAACgB;QAAIE,WAAWvB,MAAM,CAAC,kBAAkB;OACtCV,aAAaiB,yBACZ,oBAACU;QAAiBO,WAAU;QAAMC,QAAO;QAAIC,OAAOtB,SAAS,MAAM,MAAM;OACtEG,SAGJjB,aAAakB,4BACZ,oBAACU;QAAoBM,WAAU;QAAMD,WAAWvB,MAAM,CAAC,oBAAoB;OACxEQ,YAGJlB,aAAamB,uBACZ,oBAACX;QAAK0B,WAAU;QAAMD,WAAWvB,MAAM,CAAC,eAAe;OACpDS,OAGJnB,aAAasB,YAAY5B,MAAM2C,QAAQ,CAACC,KAAK,CAAChB,WAAW,mBACxD,oBAACS;QAAIE,WAAWvB,MAAM,CAAC,kBAAkB;OAAGY;IAMpD,qBACE,oBAAClB;QACC8B,WAAU;QACT,GAAGT,SAAS;QACbc,eAAexC,WACbW,MAAM,CAAC,SAAS,EAChBgB,aAAa,SAAShB,MAAM,CAAC,cAAc,EAC3CE,SAAS,WAAWF,MAAM,CAAC,qBAAqB,EAChDI,SAAS,OAAOJ,MAAM,CAAC,iBAAiB,EACxCE,SAAS,WAAWC,eAAe,UAAUH,MAAM,CAAC,mBAAmB;OAGxEM,cAAc,yBACb,oBAACX;QACC4B,WAAWvB,MAAM,CAAC,aAAa;QAC/B8B,YAAYd,aAAa,QAAQ,YAAY;QAC7Ce,SAASxC;OAER6B,uBAED,oBAACC;QAAIE,WAAWvB,MAAM,CAAC,gBAAgB;qBACrC,oBAACd;QAAcqC,WAAWvB,MAAM,CAAC,iBAAiB;yBAItD,oBAACqB;QAAIE,WAAWvB,MAAM,CAAC,aAAa;OACjCoB,SAEAd,cAAc,2BACb,oBAACe;QAAIE,WAAWvB,MAAM,CAAC,gBAAgB;qBACrC,oBAACP;QACCuC,OAAOlB;QACPS,WAAWvB,MAAM,CAAC,kBAAkB;QACpC+B,SAASlB;QACToB,WAAU;QACVC,WAAW;OAEVlB,aAAa,sBAAQ,oBAACG,sCAAoB,oBAAClC;AAQ5D,EAAE"}
+{"version":3,"sources":["../../../../src/components/Banner/Banner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Cancel, Icon24Chevron, Icon24Dismiss, Icon24DismissDark } from '@vkontakte/icons';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { IconButton } from '../IconButton/IconButton';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Text } from '../Typography/Text/Text';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './Banner.module.css';\n\nexport interface BannerProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Тип баннера.\n   */\n  mode?: 'tint' | 'image';\n  size?: 's' | 'm';\n  /**\n   * Тип действия в правой части баннера.\n   *\n   * - `dismiss` – отображается иконка крестика, при клике на неё сработает свойство `onDismiss`.\n   * - `expand` – отображается иконка шеврона, которая подразумевает, что при клике на баннер можно куда-то перейти.\n   */\n  asideMode?: 'dismiss' | 'expand';\n  /**\n   * Срабатывает при клике на иконку крестика при `asideMode=\"dismiss\"`.\n   */\n  onDismiss?: React.MouseEventHandler<HTMLButtonElement>;\n  /**\n   * Текст кнопки закрытия. Делает ее доступной для ассистивных технологий\n   */\n  dismissLabel?: string;\n  /**\n   * Содержимое, отображаемое в левой части баннера.\n   */\n  before?: React.ReactNode;\n  /**\n   * Заголовок.\n   */\n  header?: React.ReactNode;\n  /**\n   * Подзаголовок.\n   */\n  subheader?: React.ReactNode;\n  /**\n   * Текст баннера.\n   */\n  text?: React.ReactNode;\n  /**\n   * При использовании `mode=\"image\"`.\n   *\n   * - `light` – в качестве фона используется светлое изображение, цвет текста в баннере будет тёмным.\n   * - `dark` – в качестве фона используется тёмное изображение, цвет текста будет светлым.\n   */\n  imageTheme?: 'light' | 'dark';\n  /**\n   * При использовании `mode=\"image\"`.\n   *\n   * Элемент, который нужно стилизовать цветом и/или фоном. Этот элемент будет растянут на 100% ширины и высоты баннера.\n   */\n  background?: React.ReactNode;\n  /**\n   * Кнопки-действия. Принимает [`Button`](https://vkcom.github.io/VKUI/#/Button).\n   *\n   * - В режиме `tint` или `image` со светлым фоном используйте только с параметрами:\n   *    - `mode=\"primary\"`\n   *    - `mode=\"secondary\"`\n   * - В режиме `image` с тёмным фоном используйте с параметрами:\n   *    - `appearance=\"overlay\"`.\n   *\n   * Для набора кнопок используйте [`ButtonGroup`](https://vkcom.github.io/VKUI/#/ButtonGroup) с параметрами:\n   *\n   * - `gap=\"m\" mode=\"horizontal\" stretched`\n   * - `gap=\"m\" mode=\"vertical\" stretched`\n   */\n  actions?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Banner\n */\nexport const Banner = ({\n  mode = 'tint',\n  imageTheme = 'dark',\n  size = 's',\n  before,\n  asideMode,\n  header,\n  subheader,\n  text,\n  children,\n  background,\n  actions,\n  onDismiss,\n  dismissLabel = 'Скрыть',\n  ...restProps\n}: BannerProps) => {\n  const platform = usePlatform();\n\n  const HeaderTypography = size === 'm' ? Title : Headline;\n  const SubheaderTypography = size === 'm' ? Text : Subhead;\n\n  const IconDismissIOS = mode === 'image' ? Icon24DismissDark : Icon24Dismiss;\n\n  const content = (\n    <>\n      {mode === 'image' && background && (\n        <div aria-hidden className={styles['Banner__bg']}>\n          {background}\n        </div>\n      )}\n\n      {before && <div className={styles['Banner__before']}>{before}</div>}\n\n      <div className={styles['Banner__content']}>\n        {hasReactNode(header) && (\n          <HeaderTypography Component=\"div\" weight=\"2\" level={size === 'm' ? '2' : '1'}>\n            {header}\n          </HeaderTypography>\n        )}\n        {hasReactNode(subheader) && (\n          <SubheaderTypography Component=\"div\" className={styles['Banner__subheader']}>\n            {subheader}\n          </SubheaderTypography>\n        )}\n        {hasReactNode(text) && (\n          <Text Component=\"div\" className={styles['Banner__text']}>\n            {text}\n          </Text>\n        )}\n        {hasReactNode(actions) && React.Children.count(actions) > 0 && (\n          <div className={styles['Banner__actions']}>{actions}</div>\n        )}\n      </div>\n    </>\n  );\n\n  return (\n    <RootComponent\n      Component=\"section\"\n      {...restProps}\n      baseClassName={classNames(\n        styles['Banner'],\n        platform === 'ios' && styles['Banner--ios'],\n        mode === 'image' && styles['Banner--mode-image'],\n        size === 'm' && styles['Banner--size-m'],\n        mode === 'image' && imageTheme === 'dark' && styles['Banner--inverted'],\n      )}\n    >\n      {asideMode === 'expand' ? (\n        <Tappable\n          className={styles['Banner__in']}\n          activeMode={platform === 'ios' ? 'opacity' : 'background'}\n          onClick={noop}\n        >\n          {content}\n\n          <div className={styles['Banner__aside']}>\n            <Icon24Chevron className={styles['Banner__expand']} />\n          </div>\n        </Tappable>\n      ) : (\n        <div className={styles['Banner__in']}>\n          {content}\n\n          {asideMode === 'dismiss' && (\n            <div className={styles['Banner__aside']}>\n              <IconButton\n                label={dismissLabel}\n                className={styles['Banner__dismiss']}\n                onClick={onDismiss}\n                hoverMode=\"opacity\"\n                hasActive={false}\n              >\n                {platform === 'ios' ? <IconDismissIOS /> : <Icon24Cancel />}\n              </IconButton>\n            </div>\n          )}\n        </div>\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["React","Icon24Cancel","Icon24Chevron","Icon24Dismiss","Icon24DismissDark","classNames","hasReactNode","noop","usePlatform","IconButton","RootComponent","Tappable","Headline","Subhead","Text","Title","styles","Banner","mode","imageTheme","size","before","asideMode","header","subheader","text","children","background","actions","onDismiss","dismissLabel","restProps","platform","HeaderTypography","SubheaderTypography","IconDismissIOS","content","div","aria-hidden","className","Component","weight","level","Children","count","baseClassName","activeMode","onClick","label","hoverMode","hasActive"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

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

@@ -58,7 +58,7 @@
   z-index: var(--vkui_internal--z_index_banner_background);
 }
 
-/* stylelint-disable-next-line selector-max-universal */
+/* stylelint-disable selector-max-universal */
 
 .Banner__bg,
 .Banner__bg > * {
@@ -66,6 +66,8 @@
   block-size: 100%;
 }
 
+/* stylelint-enable selector-max-universal */
+
 .Banner__aside {
   display: flex;
   flex-flow: row nowrap;

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { BaseGalleryProps } from './types';
-export declare const BaseGallery: ({ bullets, getRootRef, children, slideWidth, slideIndex, dragDisabled, onDragStart, onDragEnd, onChange, onPrevClick, onNextClick, align, showArrows, getRef, arrowSize, ...restProps }: BaseGalleryProps) => React.JSX.Element;
+export declare const BaseGallery: ({ bullets, getRootRef, children, slideWidth, slideIndex, dragDisabled, onDragStart, onDragEnd, onChange, onPrevClick, onNextClick, align, showArrows, getRef, arrowSize, ...restProps }: BaseGalleryProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=BaseGallery.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"BaseGallery.d.ts","sourceRoot":"","sources":["../../../../src/components/BaseGallery/BaseGallery.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B,OAAO,EAAE,gBAAgB,EAAkD,MAAM,SAAS,CAAC;AA2B3F,eAAO,MAAM,WAAW,4LAiBrB,gBAAgB,sBA0UlB,CAAC"}
+{"version":3,"file":"BaseGallery.d.ts","sourceRoot":"","sources":["../../../../src/components/BaseGallery/BaseGallery.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,gBAAgB,EAAkD,MAAM,SAAS,CAAC;AA2B3F,eAAO,MAAM,WAAW,4LAiBrB,gBAAgB,4CA0UlB,CAAC"}

package/dist/cssm/components/BaseGallery/BaseGallery.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
 import { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';
@@ -240,44 +241,52 @@ export const BaseGallery = ({ bullets = false, getRootRef, children, slideWidth
     const canSlideRight = !layoutState.current.isFullyVisible && // we can't move right when gallery layer fully scrolled right, if gallery aligned by left side
     (align === 'left' && layoutState.current.containerWidth - shiftState.shiftX < (layoutState.current.layerWidth ?? 0) || // otherwise we need to check current slide index (align = right or align = center)
     align !== 'left' && slideIndex < layoutState.current.slides.length - 1);
-    return /*#__PURE__*/ React.createElement(RootComponent, {
+    return /*#__PURE__*/ _jsxs(RootComponent, {
         ...restProps,
         baseClassName: classNames(styles['BaseGallery'], align === 'center' && styles['BaseGallery--align-center'], slideWidth === 'custom' && styles['BaseGallery--custom-width'], isDraggable && styles['BaseGallery--draggable']),
-        getRootRef: rootRef
-    }, /*#__PURE__*/ React.createElement(Touch, {
-        className: styles['BaseGallery__viewport'],
-        onStartX: onStart,
-        onMoveX: onMoveX,
-        onEnd: onEnd,
-        style: {
-            width: slideWidth === 'custom' ? '100%' : slideWidth
-        },
-        getRootRef: viewportRef,
-        noSlideClick: true
-    }, /*#__PURE__*/ React.createElement("div", {
-        className: styles['BaseGallery__layer'],
-        style: layerStyle
-    }, React.Children.map(children, (item, i)=>/*#__PURE__*/ React.createElement("div", {
-            className: styles['BaseGallery__slide'],
-            key: `slide-${i}`,
-            ref: (el)=>setSlideRef(el, i)
-        }, item)))), bullets && /*#__PURE__*/ React.createElement("div", {
-        "aria-hidden": true,
-        className: classNames(styles['BaseGallery__bullets'], stylesBullets[bullets])
-    }, React.Children.map(children, (_item, index)=>/*#__PURE__*/ React.createElement("div", {
-            className: classNames(styles['BaseGallery__bullet'], index === slideIndex && styles['BaseGallery__bullet--active']),
-            key: index
-        }))), showArrows && hasPointer && canSlideLeft && /*#__PURE__*/ React.createElement(ScrollArrow, {
-        className: styles['BaseGallery__arrow'],
-        direction: "left",
-        onClick: slideLeft,
-        size: arrowSize
-    }), showArrows && hasPointer && canSlideRight && /*#__PURE__*/ React.createElement(ScrollArrow, {
-        className: styles['BaseGallery__arrow'],
-        direction: "right",
-        onClick: slideRight,
-        size: arrowSize
-    }));
+        getRootRef: rootRef,
+        children: [
+            /*#__PURE__*/ _jsx(Touch, {
+                className: styles['BaseGallery__viewport'],
+                onStartX: onStart,
+                onMoveX: onMoveX,
+                onEnd: onEnd,
+                style: {
+                    width: slideWidth === 'custom' ? '100%' : slideWidth
+                },
+                getRootRef: viewportRef,
+                noSlideClick: true,
+                children: /*#__PURE__*/ _jsx("div", {
+                    className: styles['BaseGallery__layer'],
+                    style: layerStyle,
+                    children: React.Children.map(children, (item, i)=>/*#__PURE__*/ _jsx("div", {
+                            className: styles['BaseGallery__slide'],
+                            ref: (el)=>setSlideRef(el, i),
+                            children: item
+                        }, `slide-${i}`))
+                })
+            }),
+            bullets && /*#__PURE__*/ _jsx("div", {
+                "aria-hidden": true,
+                className: classNames(styles['BaseGallery__bullets'], stylesBullets[bullets]),
+                children: React.Children.map(children, (_item, index)=>/*#__PURE__*/ _jsx("div", {
+                        className: classNames(styles['BaseGallery__bullet'], index === slideIndex && styles['BaseGallery__bullet--active'])
+                    }, index))
+            }),
+            showArrows && hasPointer && canSlideLeft && /*#__PURE__*/ _jsx(ScrollArrow, {
+                className: styles['BaseGallery__arrow'],
+                direction: "left",
+                onClick: slideLeft,
+                size: arrowSize
+            }),
+            showArrows && hasPointer && canSlideRight && /*#__PURE__*/ _jsx(ScrollArrow, {
+                className: styles['BaseGallery__arrow'],
+                direction: "right",
+                onClick: slideRight,
+                size: arrowSize
+            })
+        ]
+    });
 };
 
 //# sourceMappingURL=BaseGallery.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/BaseGallery/BaseGallery.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ScrollArrow } from '../ScrollArrow/ScrollArrow';\nimport { Touch, TouchEvent } from '../Touch/Touch';\nimport { calcMax, calcMin } from './helpers';\nimport { BaseGalleryProps, GallerySlidesState, LayoutState, ShiftingState } from './types';\nimport styles from './BaseGallery.module.css';\n\nconst ANIMATION_DURATION = 0.24;\n\nconst LAYOUT_DEFAULT_STATE = {\n  containerWidth: 0,\n  viewportOffsetWidth: 0,\n  layerWidth: 0,\n  min: 0,\n  max: 0,\n  slides: [],\n  isFullyVisible: true,\n};\n\nconst SHIFT_DEFAULT_STATE = {\n  animation: undefined,\n  shiftX: 0,\n  dragging: false,\n  deltaX: 0,\n  indent: 0,\n};\n\nconst stylesBullets = {\n  dark: styles['BaseGallery__bullets--dark'],\n  light: styles['BaseGallery__bullets--light'],\n};\nexport const BaseGallery = ({\n  bullets = false,\n  getRootRef,\n  children,\n  slideWidth = '100%',\n  slideIndex = 0,\n  dragDisabled = false,\n  onDragStart,\n  onDragEnd,\n  onChange,\n  onPrevClick,\n  onNextClick,\n  align = 'left',\n  showArrows,\n  getRef,\n  arrowSize = 'l',\n  ...restProps\n}: BaseGalleryProps) => {\n  const slidesStore = React.useRef<Record<string, HTMLDivElement | null>>({});\n  const layoutState = React.useRef<LayoutState>(LAYOUT_DEFAULT_STATE);\n  const [shiftState, setShiftState] = React.useState<ShiftingState>(SHIFT_DEFAULT_STATE);\n\n  const rootRef = useExternRef(getRootRef);\n  const viewportRef = useExternRef(getRef);\n\n  const { window } = useDOM();\n  const hasPointer = useAdaptivityHasPointer();\n\n  const isCenterWithCustomWidth = slideWidth === 'custom' && align === 'center';\n\n  const validateIndent = (value: number) => {\n    const localMax = layoutState.current.max ?? 0;\n    const localMin = layoutState.current.min ?? 0;\n\n    if (value < localMin) {\n      return localMin;\n    } else if (value > localMax) {\n      return localMax;\n    }\n\n    return value;\n  };\n\n  /*\n   * Считает отступ слоя галереи\n   */\n  const calculateIndent = (targetIndex: number) => {\n    if (layoutState.current.isFullyVisible) {\n      return 0;\n    }\n\n    const targetSlide = layoutState.current.slides?.length\n      ? layoutState.current.slides[targetIndex]\n      : null;\n\n    if (targetSlide) {\n      const { coordX, width } = targetSlide;\n\n      if (isCenterWithCustomWidth) {\n        const viewportWidth = layoutState.current.viewportOffsetWidth ?? 0;\n        return viewportWidth / 2 - coordX - width / 2;\n      }\n\n      return validateIndent(-1 * coordX);\n    }\n\n    return 0;\n  };\n\n  /*\n   * Считает отступ слоя галереи во время драга\n   */\n  const calculateDragIndent = () => {\n    const localMax = layoutState.current.max ?? 0;\n    const localMin = layoutState.current.min ?? 0;\n    const indent = shiftState.shiftX + shiftState.deltaX;\n\n    if (indent > localMax) {\n      return localMax + Number((indent - localMax) / 3);\n    } else if (indent < localMin) {\n      return localMin + Number((indent - localMin) / 3);\n    }\n\n    return indent;\n  };\n\n  const initializeSlides = (options: { animation?: boolean } = {}) => {\n    const localSlides =\n      React.Children.map(children, (_item: React.ReactNode, i: number): GallerySlidesState => {\n        const elem = slidesStore.current[`slide-${i}`];\n        return {\n          coordX: elem?.offsetLeft ?? 0,\n          width: elem?.offsetWidth ?? 0,\n        };\n      }) ?? [];\n\n    const localContainerWidth = rootRef.current?.offsetWidth ?? 0;\n    const localViewportOffsetWidth = viewportRef.current?.offsetWidth ?? 0;\n    const localLayerWidth = localSlides.reduce(\n      (val: number, slide: GallerySlidesState) => slide.width + val,\n      0,\n    );\n    const adjustShiftX =\n      localSlides.length <= layoutState.current.slides.length ||\n      layoutState.current.slides[slideIndex]?.coordX !== localSlides[slideIndex]?.coordX;\n\n    layoutState.current = {\n      containerWidth: localContainerWidth,\n      viewportOffsetWidth: localViewportOffsetWidth,\n      layerWidth: localLayerWidth,\n      max: calcMax({\n        slides: localSlides,\n        viewportOffsetWidth: localViewportOffsetWidth,\n        isCenterWithCustomWidth,\n      }),\n      min: calcMin({\n        containerWidth: localContainerWidth,\n        layerWidth: localLayerWidth,\n        slides: localSlides,\n        viewportOffsetWidth: localViewportOffsetWidth,\n        isCenterWithCustomWidth,\n        align,\n      }),\n      slides: localSlides,\n      isFullyVisible: localLayerWidth <= localContainerWidth,\n    };\n\n    setShiftState((prevState) => ({\n      ...prevState,\n      shiftX: adjustShiftX ? calculateIndent(slideIndex) : prevState.shiftX,\n      animation: options.animation ?? prevState.shiftX === validateIndent(prevState.shiftX),\n    }));\n  };\n\n  const onResize = () => {\n    if (shiftState.animation !== undefined) {\n      initializeSlides({ animation: false });\n    }\n  };\n\n  useGlobalEventListener(window, 'resize', onResize);\n\n  useIsomorphicLayoutEffect(() => {\n    initializeSlides({ animation: false });\n  }, [children, align, slideWidth]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (shiftState.animation !== undefined) {\n      setShiftState((prevState) => ({\n        ...prevState,\n        animation: true,\n        deltaX: 0,\n        shiftX: calculateIndent(slideIndex ?? 0),\n      }));\n    }\n  }, [slideIndex]);\n\n  const slideLeft = (event: React.MouseEvent) => {\n    onChange?.(slideIndex - 1);\n    onPrevClick?.(event);\n  };\n\n  const slideRight = (event: React.MouseEvent) => {\n    onChange?.(slideIndex + 1);\n    onNextClick?.(event);\n  };\n\n  /*\n   * Получает индекс слайда, к которому будет осуществлен переход\n   */\n  const getTarget = (e: TouchEvent) => {\n    const expectDeltaX = (shiftState.deltaX / e.duration) * 240 * 0.6;\n    const shift =\n      shiftState.shiftX + shiftState.deltaX + expectDeltaX - (layoutState.current.max ?? 0);\n    const direction = shiftState.deltaX < 0 ? 1 : -1;\n\n    // Находим ближайшую границу слайда к текущему отступу\n    let targetIndex = layoutState.current.slides.reduce(\n      (val: number, item: GallerySlidesState, index: number) => {\n        const previousValue = Math.abs(layoutState.current.slides[val].coordX + shift);\n        const currentValue = Math.abs(item.coordX + shift);\n\n        return previousValue < currentValue ? val : index;\n      },\n      slideIndex,\n    );\n\n    if (targetIndex === slideIndex) {\n      let targetSlide = slideIndex + direction;\n\n      if (targetSlide >= 0 && targetSlide < layoutState.current.slides.length) {\n        if (Math.abs(shiftState.deltaX) > layoutState.current.slides[targetSlide].width * 0.05) {\n          targetIndex = targetSlide;\n        }\n      }\n    }\n\n    return targetIndex;\n  };\n\n  const isDraggable = !dragDisabled && !layoutState.current.isFullyVisible;\n\n  const onStart = (e: TouchEvent) => {\n    e.originalEvent.stopPropagation();\n    if (isDraggable) {\n      onDragStart?.(e);\n      setShiftState((prevState) => ({ ...prevState, animation: false }));\n    }\n  };\n\n  const onMoveX = (e: TouchEvent) => {\n    if (isDraggable) {\n      e.originalEvent.preventDefault();\n\n      if (e.isSlideX) {\n        if (shiftState.deltaX !== e.shiftX) {\n          setShiftState((prevState) => ({\n            ...prevState,\n            deltaX: e.shiftX,\n            dragging: e.isSlideX,\n          }));\n        }\n      }\n    }\n  };\n\n  const onEnd = (e: TouchEvent) => {\n    if (isDraggable) {\n      const targetIndex = e.isSlide ? getTarget(e) : slideIndex ?? 0;\n      onDragEnd?.(e, targetIndex);\n\n      const nextShiftState: Partial<ShiftingState> = {\n        animation: true,\n        dragging: false,\n        deltaX: 0,\n      };\n\n      const shiftXStick = calculateDragIndent();\n      if (targetIndex !== slideIndex) {\n        // Сохраняем сдвиг слайда в том положении, в каком его оставили после драга (fix issue #2185)\n        nextShiftState.shiftX = shiftXStick;\n      }\n\n      setShiftState((prevState) => ({ ...prevState, ...nextShiftState }));\n      if (targetIndex !== slideIndex) {\n        onChange?.(targetIndex);\n      }\n    }\n  };\n\n  const indent = shiftState.dragging ? calculateDragIndent() : shiftState.shiftX;\n\n  const layerStyle = {\n    WebkitTransform: `translateX(${indent}px)`,\n    transform: `translateX(${indent}px)`,\n    WebkitTransition: shiftState.animation\n      ? `-webkit-transform ${ANIMATION_DURATION}s cubic-bezier(.1, 0, .25, 1)`\n      : 'none',\n    transition: shiftState.animation\n      ? `transform ${ANIMATION_DURATION}s cubic-bezier(.1, 0, .25, 1)`\n      : 'none',\n  };\n\n  const setSlideRef = (slideRef: HTMLDivElement | null, slideIndex: number) => {\n    slidesStore.current[`slide-${slideIndex}`] = slideRef;\n  };\n\n  // shiftX is negative number <= 0, we can swipe back only if it is < 0\n  const canSlideLeft = !layoutState.current.isFullyVisible && shiftState.shiftX < 0;\n\n  const canSlideRight =\n    !layoutState.current.isFullyVisible &&\n    // we can't move right when gallery layer fully scrolled right, if gallery aligned by left side\n    ((align === 'left' &&\n      layoutState.current.containerWidth - shiftState.shiftX <\n        (layoutState.current.layerWidth ?? 0)) ||\n      // otherwise we need to check current slide index (align = right or align = center)\n      (align !== 'left' && slideIndex < layoutState.current.slides.length - 1));\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles['BaseGallery'],\n        align === 'center' && styles['BaseGallery--align-center'],\n        slideWidth === 'custom' && styles['BaseGallery--custom-width'],\n        isDraggable && styles['BaseGallery--draggable'],\n      )}\n      getRootRef={rootRef}\n    >\n      <Touch\n        className={styles['BaseGallery__viewport']}\n        onStartX={onStart}\n        onMoveX={onMoveX}\n        onEnd={onEnd}\n        style={{ width: slideWidth === 'custom' ? '100%' : slideWidth }}\n        getRootRef={viewportRef}\n        noSlideClick\n      >\n        <div className={styles['BaseGallery__layer']} style={layerStyle}>\n          {React.Children.map(children, (item: React.ReactNode, i: number) => (\n            <div\n              className={styles['BaseGallery__slide']}\n              key={`slide-${i}`}\n              ref={(el) => setSlideRef(el, i)}\n            >\n              {item}\n            </div>\n          ))}\n        </div>\n      </Touch>\n\n      {bullets && (\n        <div\n          aria-hidden\n          className={classNames(styles['BaseGallery__bullets'], stylesBullets[bullets])}\n        >\n          {React.Children.map(children, (_item: React.ReactNode, index: number) => (\n            <div\n              className={classNames(\n                styles['BaseGallery__bullet'],\n                index === slideIndex && styles['BaseGallery__bullet--active'],\n              )}\n              key={index}\n            />\n          ))}\n        </div>\n      )}\n\n      {showArrows && hasPointer && canSlideLeft && (\n        <ScrollArrow\n          className={styles['BaseGallery__arrow']}\n          direction=\"left\"\n          onClick={slideLeft}\n          size={arrowSize}\n        />\n      )}\n      {showArrows && hasPointer && canSlideRight && (\n        <ScrollArrow\n          className={styles['BaseGallery__arrow']}\n          direction=\"right\"\n          onClick={slideRight}\n          size={arrowSize}\n        />\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","useAdaptivityHasPointer","useExternRef","useGlobalEventListener","useDOM","useIsomorphicLayoutEffect","RootComponent","ScrollArrow","Touch","calcMax","calcMin","styles","ANIMATION_DURATION","LAYOUT_DEFAULT_STATE","containerWidth","viewportOffsetWidth","layerWidth","min","max","slides","isFullyVisible","SHIFT_DEFAULT_STATE","animation","undefined","shiftX","dragging","deltaX","indent","stylesBullets","dark","light","BaseGallery","bullets","getRootRef","children","slideWidth","slideIndex","dragDisabled","onDragStart","onDragEnd","onChange","onPrevClick","onNextClick","align","showArrows","getRef","arrowSize","restProps","slidesStore","useRef","layoutState","shiftState","setShiftState","useState","rootRef","viewportRef","window","hasPointer","isCenterWithCustomWidth","validateIndent","value","localMax","current","localMin","calculateIndent","targetIndex","targetSlide","length","coordX","width","viewportWidth","calculateDragIndent","Number","initializeSlides","options","localSlides","Children","map","_item","i","elem","offsetLeft","offsetWidth","localContainerWidth","localViewportOffsetWidth","localLayerWidth","reduce","val","slide","adjustShiftX","prevState","onResize","slideLeft","event","slideRight","getTarget","e","expectDeltaX","duration","shift","direction","item","index","previousValue","Math","abs","currentValue","isDraggable","onStart","originalEvent","stopPropagation","onMoveX","preventDefault","isSlideX","onEnd","isSlide","nextShiftState","shiftXStick","layerStyle","WebkitTransform","transform","WebkitTransition","transition","setSlideRef","slideRef","canSlideLeft","canSlideRight","baseClassName","className","onStartX","style","noSlideClick","div","key","ref","el","aria-hidden","onClick","size"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/BaseGallery/BaseGallery.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ScrollArrow } from '../ScrollArrow/ScrollArrow';\nimport { Touch, TouchEvent } from '../Touch/Touch';\nimport { calcMax, calcMin } from './helpers';\nimport { BaseGalleryProps, GallerySlidesState, LayoutState, ShiftingState } from './types';\nimport styles from './BaseGallery.module.css';\n\nconst ANIMATION_DURATION = 0.24;\n\nconst LAYOUT_DEFAULT_STATE = {\n  containerWidth: 0,\n  viewportOffsetWidth: 0,\n  layerWidth: 0,\n  min: 0,\n  max: 0,\n  slides: [],\n  isFullyVisible: true,\n};\n\nconst SHIFT_DEFAULT_STATE = {\n  animation: undefined,\n  shiftX: 0,\n  dragging: false,\n  deltaX: 0,\n  indent: 0,\n};\n\nconst stylesBullets = {\n  dark: styles['BaseGallery__bullets--dark'],\n  light: styles['BaseGallery__bullets--light'],\n};\nexport const BaseGallery = ({\n  bullets = false,\n  getRootRef,\n  children,\n  slideWidth = '100%',\n  slideIndex = 0,\n  dragDisabled = false,\n  onDragStart,\n  onDragEnd,\n  onChange,\n  onPrevClick,\n  onNextClick,\n  align = 'left',\n  showArrows,\n  getRef,\n  arrowSize = 'l',\n  ...restProps\n}: BaseGalleryProps) => {\n  const slidesStore = React.useRef<Record<string, HTMLDivElement | null>>({});\n  const layoutState = React.useRef<LayoutState>(LAYOUT_DEFAULT_STATE);\n  const [shiftState, setShiftState] = React.useState<ShiftingState>(SHIFT_DEFAULT_STATE);\n\n  const rootRef = useExternRef(getRootRef);\n  const viewportRef = useExternRef(getRef);\n\n  const { window } = useDOM();\n  const hasPointer = useAdaptivityHasPointer();\n\n  const isCenterWithCustomWidth = slideWidth === 'custom' && align === 'center';\n\n  const validateIndent = (value: number) => {\n    const localMax = layoutState.current.max ?? 0;\n    const localMin = layoutState.current.min ?? 0;\n\n    if (value < localMin) {\n      return localMin;\n    } else if (value > localMax) {\n      return localMax;\n    }\n\n    return value;\n  };\n\n  /*\n   * Считает отступ слоя галереи\n   */\n  const calculateIndent = (targetIndex: number) => {\n    if (layoutState.current.isFullyVisible) {\n      return 0;\n    }\n\n    const targetSlide = layoutState.current.slides?.length\n      ? layoutState.current.slides[targetIndex]\n      : null;\n\n    if (targetSlide) {\n      const { coordX, width } = targetSlide;\n\n      if (isCenterWithCustomWidth) {\n        const viewportWidth = layoutState.current.viewportOffsetWidth ?? 0;\n        return viewportWidth / 2 - coordX - width / 2;\n      }\n\n      return validateIndent(-1 * coordX);\n    }\n\n    return 0;\n  };\n\n  /*\n   * Считает отступ слоя галереи во время драга\n   */\n  const calculateDragIndent = () => {\n    const localMax = layoutState.current.max ?? 0;\n    const localMin = layoutState.current.min ?? 0;\n    const indent = shiftState.shiftX + shiftState.deltaX;\n\n    if (indent > localMax) {\n      return localMax + Number((indent - localMax) / 3);\n    } else if (indent < localMin) {\n      return localMin + Number((indent - localMin) / 3);\n    }\n\n    return indent;\n  };\n\n  const initializeSlides = (options: { animation?: boolean } = {}) => {\n    const localSlides =\n      React.Children.map(children, (_item: React.ReactNode, i: number): GallerySlidesState => {\n        const elem = slidesStore.current[`slide-${i}`];\n        return {\n          coordX: elem?.offsetLeft ?? 0,\n          width: elem?.offsetWidth ?? 0,\n        };\n      }) ?? [];\n\n    const localContainerWidth = rootRef.current?.offsetWidth ?? 0;\n    const localViewportOffsetWidth = viewportRef.current?.offsetWidth ?? 0;\n    const localLayerWidth = localSlides.reduce(\n      (val: number, slide: GallerySlidesState) => slide.width + val,\n      0,\n    );\n    const adjustShiftX =\n      localSlides.length <= layoutState.current.slides.length ||\n      layoutState.current.slides[slideIndex]?.coordX !== localSlides[slideIndex]?.coordX;\n\n    layoutState.current = {\n      containerWidth: localContainerWidth,\n      viewportOffsetWidth: localViewportOffsetWidth,\n      layerWidth: localLayerWidth,\n      max: calcMax({\n        slides: localSlides,\n        viewportOffsetWidth: localViewportOffsetWidth,\n        isCenterWithCustomWidth,\n      }),\n      min: calcMin({\n        containerWidth: localContainerWidth,\n        layerWidth: localLayerWidth,\n        slides: localSlides,\n        viewportOffsetWidth: localViewportOffsetWidth,\n        isCenterWithCustomWidth,\n        align,\n      }),\n      slides: localSlides,\n      isFullyVisible: localLayerWidth <= localContainerWidth,\n    };\n\n    setShiftState((prevState) => ({\n      ...prevState,\n      shiftX: adjustShiftX ? calculateIndent(slideIndex) : prevState.shiftX,\n      animation: options.animation ?? prevState.shiftX === validateIndent(prevState.shiftX),\n    }));\n  };\n\n  const onResize = () => {\n    if (shiftState.animation !== undefined) {\n      initializeSlides({ animation: false });\n    }\n  };\n\n  useGlobalEventListener(window, 'resize', onResize);\n\n  useIsomorphicLayoutEffect(() => {\n    initializeSlides({ animation: false });\n  }, [children, align, slideWidth]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (shiftState.animation !== undefined) {\n      setShiftState((prevState) => ({\n        ...prevState,\n        animation: true,\n        deltaX: 0,\n        shiftX: calculateIndent(slideIndex ?? 0),\n      }));\n    }\n  }, [slideIndex]);\n\n  const slideLeft = (event: React.MouseEvent) => {\n    onChange?.(slideIndex - 1);\n    onPrevClick?.(event);\n  };\n\n  const slideRight = (event: React.MouseEvent) => {\n    onChange?.(slideIndex + 1);\n    onNextClick?.(event);\n  };\n\n  /*\n   * Получает индекс слайда, к которому будет осуществлен переход\n   */\n  const getTarget = (e: TouchEvent) => {\n    const expectDeltaX = (shiftState.deltaX / e.duration) * 240 * 0.6;\n    const shift =\n      shiftState.shiftX + shiftState.deltaX + expectDeltaX - (layoutState.current.max ?? 0);\n    const direction = shiftState.deltaX < 0 ? 1 : -1;\n\n    // Находим ближайшую границу слайда к текущему отступу\n    let targetIndex = layoutState.current.slides.reduce(\n      (val: number, item: GallerySlidesState, index: number) => {\n        const previousValue = Math.abs(layoutState.current.slides[val].coordX + shift);\n        const currentValue = Math.abs(item.coordX + shift);\n\n        return previousValue < currentValue ? val : index;\n      },\n      slideIndex,\n    );\n\n    if (targetIndex === slideIndex) {\n      let targetSlide = slideIndex + direction;\n\n      if (targetSlide >= 0 && targetSlide < layoutState.current.slides.length) {\n        if (Math.abs(shiftState.deltaX) > layoutState.current.slides[targetSlide].width * 0.05) {\n          targetIndex = targetSlide;\n        }\n      }\n    }\n\n    return targetIndex;\n  };\n\n  const isDraggable = !dragDisabled && !layoutState.current.isFullyVisible;\n\n  const onStart = (e: TouchEvent) => {\n    e.originalEvent.stopPropagation();\n    if (isDraggable) {\n      onDragStart?.(e);\n      setShiftState((prevState) => ({ ...prevState, animation: false }));\n    }\n  };\n\n  const onMoveX = (e: TouchEvent) => {\n    if (isDraggable) {\n      e.originalEvent.preventDefault();\n\n      if (e.isSlideX) {\n        if (shiftState.deltaX !== e.shiftX) {\n          setShiftState((prevState) => ({\n            ...prevState,\n            deltaX: e.shiftX,\n            dragging: e.isSlideX,\n          }));\n        }\n      }\n    }\n  };\n\n  const onEnd = (e: TouchEvent) => {\n    if (isDraggable) {\n      const targetIndex = e.isSlide ? getTarget(e) : slideIndex ?? 0;\n      onDragEnd?.(e, targetIndex);\n\n      const nextShiftState: Partial<ShiftingState> = {\n        animation: true,\n        dragging: false,\n        deltaX: 0,\n      };\n\n      const shiftXStick = calculateDragIndent();\n      if (targetIndex !== slideIndex) {\n        // Сохраняем сдвиг слайда в том положении, в каком его оставили после драга (fix issue #2185)\n        nextShiftState.shiftX = shiftXStick;\n      }\n\n      setShiftState((prevState) => ({ ...prevState, ...nextShiftState }));\n      if (targetIndex !== slideIndex) {\n        onChange?.(targetIndex);\n      }\n    }\n  };\n\n  const indent = shiftState.dragging ? calculateDragIndent() : shiftState.shiftX;\n\n  const layerStyle = {\n    WebkitTransform: `translateX(${indent}px)`,\n    transform: `translateX(${indent}px)`,\n    WebkitTransition: shiftState.animation\n      ? `-webkit-transform ${ANIMATION_DURATION}s cubic-bezier(.1, 0, .25, 1)`\n      : 'none',\n    transition: shiftState.animation\n      ? `transform ${ANIMATION_DURATION}s cubic-bezier(.1, 0, .25, 1)`\n      : 'none',\n  };\n\n  const setSlideRef = (slideRef: HTMLDivElement | null, slideIndex: number) => {\n    slidesStore.current[`slide-${slideIndex}`] = slideRef;\n  };\n\n  // shiftX is negative number <= 0, we can swipe back only if it is < 0\n  const canSlideLeft = !layoutState.current.isFullyVisible && shiftState.shiftX < 0;\n\n  const canSlideRight =\n    !layoutState.current.isFullyVisible &&\n    // we can't move right when gallery layer fully scrolled right, if gallery aligned by left side\n    ((align === 'left' &&\n      layoutState.current.containerWidth - shiftState.shiftX <\n        (layoutState.current.layerWidth ?? 0)) ||\n      // otherwise we need to check current slide index (align = right or align = center)\n      (align !== 'left' && slideIndex < layoutState.current.slides.length - 1));\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles['BaseGallery'],\n        align === 'center' && styles['BaseGallery--align-center'],\n        slideWidth === 'custom' && styles['BaseGallery--custom-width'],\n        isDraggable && styles['BaseGallery--draggable'],\n      )}\n      getRootRef={rootRef}\n    >\n      <Touch\n        className={styles['BaseGallery__viewport']}\n        onStartX={onStart}\n        onMoveX={onMoveX}\n        onEnd={onEnd}\n        style={{ width: slideWidth === 'custom' ? '100%' : slideWidth }}\n        getRootRef={viewportRef}\n        noSlideClick\n      >\n        <div className={styles['BaseGallery__layer']} style={layerStyle}>\n          {React.Children.map(children, (item: React.ReactNode, i: number) => (\n            <div\n              className={styles['BaseGallery__slide']}\n              key={`slide-${i}`}\n              ref={(el) => setSlideRef(el, i)}\n            >\n              {item}\n            </div>\n          ))}\n        </div>\n      </Touch>\n\n      {bullets && (\n        <div\n          aria-hidden\n          className={classNames(styles['BaseGallery__bullets'], stylesBullets[bullets])}\n        >\n          {React.Children.map(children, (_item: React.ReactNode, index: number) => (\n            <div\n              className={classNames(\n                styles['BaseGallery__bullet'],\n                index === slideIndex && styles['BaseGallery__bullet--active'],\n              )}\n              key={index}\n            />\n          ))}\n        </div>\n      )}\n\n      {showArrows && hasPointer && canSlideLeft && (\n        <ScrollArrow\n          className={styles['BaseGallery__arrow']}\n          direction=\"left\"\n          onClick={slideLeft}\n          size={arrowSize}\n        />\n      )}\n      {showArrows && hasPointer && canSlideRight && (\n        <ScrollArrow\n          className={styles['BaseGallery__arrow']}\n          direction=\"right\"\n          onClick={slideRight}\n          size={arrowSize}\n        />\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","useAdaptivityHasPointer","useExternRef","useGlobalEventListener","useDOM","useIsomorphicLayoutEffect","RootComponent","ScrollArrow","Touch","calcMax","calcMin","styles","ANIMATION_DURATION","LAYOUT_DEFAULT_STATE","containerWidth","viewportOffsetWidth","layerWidth","min","max","slides","isFullyVisible","SHIFT_DEFAULT_STATE","animation","undefined","shiftX","dragging","deltaX","indent","stylesBullets","dark","light","BaseGallery","bullets","getRootRef","children","slideWidth","slideIndex","dragDisabled","onDragStart","onDragEnd","onChange","onPrevClick","onNextClick","align","showArrows","getRef","arrowSize","restProps","slidesStore","useRef","layoutState","shiftState","setShiftState","useState","rootRef","viewportRef","window","hasPointer","isCenterWithCustomWidth","validateIndent","value","localMax","current","localMin","calculateIndent","targetIndex","targetSlide","length","coordX","width","viewportWidth","calculateDragIndent","Number","initializeSlides","options","localSlides","Children","map","_item","i","elem","offsetLeft","offsetWidth","localContainerWidth","localViewportOffsetWidth","localLayerWidth","reduce","val","slide","adjustShiftX","prevState","onResize","slideLeft","event","slideRight","getTarget","e","expectDeltaX","duration","shift","direction","item","index","previousValue","Math","abs","currentValue","isDraggable","onStart","originalEvent","stopPropagation","onMoveX","preventDefault","isSlideX","onEnd","isSlide","nextShiftState","shiftXStick","layerStyle","WebkitTransform","transform","WebkitTransition","transition","setSlideRef","slideRef","canSlideLeft","canSlideRight","baseClassName","className","onStartX","style","noSlideClick","div","ref","el","aria-hidden","onClick","size"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/dist/cssm/components/BaseGallery/CarouselBase/CarouselBase.d.ts

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { BaseGalleryProps } from '../types';
-export declare const CarouselBase: ({ bullets, getRootRef, children, slideWidth, slideIndex, dragDisabled, onDragStart, onDragEnd, onChange, onPrevClick, onNextClick, align, showArrows, getRef, arrowSize, ...restProps }: BaseGalleryProps) => React.JSX.Element;
+export declare const CarouselBase: ({ bullets, getRootRef, children, slideWidth, slideIndex, dragDisabled, onDragStart, onDragEnd, onChange, onPrevClick, onNextClick, align, showArrows, getRef, arrowSize, ...restProps }: BaseGalleryProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=CarouselBase.d.ts.map

package/dist/cssm/components/BaseGallery/CarouselBase/CarouselBase.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CarouselBase.d.ts","sourceRoot":"","sources":["../../../../../src/components/BaseGallery/CarouselBase/CarouselBase.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B,OAAO,EAAE,gBAAgB,EAAsB,MAAM,UAAU,CAAC;AAchE,eAAO,MAAM,YAAY,4LAiBtB,gBAAgB,sBAsVlB,CAAC"}
+{"version":3,"file":"CarouselBase.d.ts","sourceRoot":"","sources":["../../../../../src/components/BaseGallery/CarouselBase/CarouselBase.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,gBAAgB,EAAsB,MAAM,UAAU,CAAC;AAchE,eAAO,MAAM,YAAY,4LAiBtB,gBAAgB,4CAsVlB,CAAC"}

package/dist/cssm/components/BaseGallery/CarouselBase/CarouselBase.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
 import { useAdaptivityHasPointer } from '../../../hooks/useAdaptivityHasPointer';
@@ -238,44 +239,52 @@ export const CarouselBase = ({ bullets = false, getRootRef, children, slideWidth
         slidesStore.current[slideIndex] = slideRef;
     };
     const { canSlideLeft, canSlideRight, isDraggable } = controlElementsState;
-    return /*#__PURE__*/ React.createElement(RootComponent, {
+    return /*#__PURE__*/ _jsxs(RootComponent, {
         ...restProps,
         baseClassName: classNames(styles['BaseGallery'], slideWidth === 'custom' && styles['BaseGallery--custom-width'], isDraggable && styles['BaseGallery--draggable']),
-        getRootRef: rootRef
-    }, /*#__PURE__*/ React.createElement(Touch, {
-        className: styles['BaseGallery__viewport'],
-        onStartX: onStart,
-        onMoveX: onMoveX,
-        onEnd: onEnd,
-        style: {
-            width: slideWidth === 'custom' ? '100%' : slideWidth
-        },
-        getRootRef: viewportRef,
-        noSlideClick: true
-    }, /*#__PURE__*/ React.createElement("div", {
-        className: styles['BaseGallery__layer'],
-        ref: layerRef
-    }, React.Children.map(children, (item, i)=>/*#__PURE__*/ React.createElement("div", {
-            className: styles['BaseGallery__slide'],
-            key: `slide-${i}`,
-            ref: (el)=>setSlideRef(el, i)
-        }, item)))), bullets && /*#__PURE__*/ React.createElement("div", {
-        "aria-hidden": true,
-        className: classNames(styles['BaseGallery__bullets'], stylesBullets[bullets])
-    }, React.Children.map(children, (_item, index)=>/*#__PURE__*/ React.createElement("div", {
-            className: classNames(styles['BaseGallery__bullet'], index === slideIndex && styles['BaseGallery__bullet--active']),
-            key: index
-        }))), showArrows && hasPointer && canSlideLeft && /*#__PURE__*/ React.createElement(ScrollArrow, {
-        className: styles['BaseGallery__arrow'],
-        direction: "left",
-        onClick: slideLeft,
-        size: arrowSize
-    }), showArrows && hasPointer && canSlideRight && /*#__PURE__*/ React.createElement(ScrollArrow, {
-        className: styles['BaseGallery__arrow'],
-        direction: "right",
-        onClick: slideRight,
-        size: arrowSize
-    }));
+        getRootRef: rootRef,
+        children: [
+            /*#__PURE__*/ _jsx(Touch, {
+                className: styles['BaseGallery__viewport'],
+                onStartX: onStart,
+                onMoveX: onMoveX,
+                onEnd: onEnd,
+                style: {
+                    width: slideWidth === 'custom' ? '100%' : slideWidth
+                },
+                getRootRef: viewportRef,
+                noSlideClick: true,
+                children: /*#__PURE__*/ _jsx("div", {
+                    className: styles['BaseGallery__layer'],
+                    ref: layerRef,
+                    children: React.Children.map(children, (item, i)=>/*#__PURE__*/ _jsx("div", {
+                            className: styles['BaseGallery__slide'],
+                            ref: (el)=>setSlideRef(el, i),
+                            children: item
+                        }, `slide-${i}`))
+                })
+            }),
+            bullets && /*#__PURE__*/ _jsx("div", {
+                "aria-hidden": true,
+                className: classNames(styles['BaseGallery__bullets'], stylesBullets[bullets]),
+                children: React.Children.map(children, (_item, index)=>/*#__PURE__*/ _jsx("div", {
+                        className: classNames(styles['BaseGallery__bullet'], index === slideIndex && styles['BaseGallery__bullet--active'])
+                    }, index))
+            }),
+            showArrows && hasPointer && canSlideLeft && /*#__PURE__*/ _jsx(ScrollArrow, {
+                className: styles['BaseGallery__arrow'],
+                direction: "left",
+                onClick: slideLeft,
+                size: arrowSize
+            }),
+            showArrows && hasPointer && canSlideRight && /*#__PURE__*/ _jsx(ScrollArrow, {
+                className: styles['BaseGallery__arrow'],
+                direction: "right",
+                onClick: slideRight,
+                size: arrowSize
+            })
+        ]
+    });
 };
 
 //# sourceMappingURL=CarouselBase.js.map

package/dist/cssm/components/BaseGallery/CarouselBase/CarouselBase.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/BaseGallery/CarouselBase/CarouselBase.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../../hooks/useAdaptivityHasPointer';\nimport { useExternRef } from '../../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../../hooks/useGlobalEventListener';\nimport { useDOM } from '../../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../../lib/warnOnce';\nimport { RootComponent } from '../../RootComponent/RootComponent';\nimport { ScrollArrow } from '../../ScrollArrow/ScrollArrow';\nimport { Touch, TouchEvent } from '../../Touch/Touch';\nimport { BaseGalleryProps, GallerySlidesState } from '../types';\nimport { ANIMATION_DURATION, CONTROL_ELEMENTS_STATE, SLIDES_MANAGER_STATE } from './constants';\nimport { calculateIndent, getLoopPoints, getTargetIndex } from './helpers';\nimport { useSlideAnimation } from './hooks';\nimport { ControlElementsState, SlidesManagerState } from './types';\nimport styles from '../BaseGallery.module.css';\n\nconst stylesBullets = {\n  dark: styles['BaseGallery__bullets--dark'],\n  light: styles['BaseGallery__bullets--light'],\n};\n\nconst warn = warnOnce('Gallery');\n\nexport const CarouselBase = ({\n  bullets = false,\n  getRootRef,\n  children,\n  slideWidth = '100%',\n  slideIndex = 0,\n  dragDisabled = false,\n  onDragStart,\n  onDragEnd,\n  onChange,\n  onPrevClick,\n  onNextClick,\n  align = 'left',\n  showArrows,\n  getRef,\n  arrowSize = 'l',\n  ...restProps\n}: BaseGalleryProps) => {\n  const slidesStore = React.useRef<Record<string, HTMLDivElement | null>>({});\n  const slidesManager = React.useRef<SlidesManagerState>(SLIDES_MANAGER_STATE);\n\n  const rootRef = useExternRef(getRootRef);\n  const viewportRef = useExternRef(getRef);\n  const layerRef = React.useRef<HTMLDivElement>(null);\n  const animationFrameRef = React.useRef<ReturnType<typeof requestAnimationFrame> | null>(null);\n  const shiftXCurrentRef = React.useRef<number>(0);\n  const shiftXDeltaRef = React.useRef<number>(0);\n  const initialized = React.useRef<boolean>(false);\n  const { addToAnimationQueue, getAnimateFunction, startAnimation } = useSlideAnimation();\n\n  const [controlElementsState, setControlElementsState] =\n    React.useState<ControlElementsState>(CONTROL_ELEMENTS_STATE);\n\n  const { window } = useDOM();\n  const hasPointer = useAdaptivityHasPointer();\n\n  const isCenterWithCustomWidth = slideWidth === 'custom' && align === 'center';\n\n  const transformCssStyles = (shiftX: number, animation = false) => {\n    slidesManager.current.loopPoints.forEach((loopPoint) => {\n      const { target, index } = loopPoint;\n      const slide = slidesStore.current[index];\n      if (slide) {\n        slide.style.transform = `translate3d(${target(shiftX)}px, 0, 0)`;\n      }\n    });\n\n    if (layerRef.current) {\n      layerRef.current.style.transform = `translate3d(${shiftX}px, 0, 0)`;\n      layerRef.current.style.transition = animation\n        ? `transform ${ANIMATION_DURATION}ms cubic-bezier(.1, 0, .25, 1)`\n        : '';\n    }\n  };\n\n  const requestTransform = (shiftX: number, animation = false) => {\n    const { snaps, contentSize, slides } = slidesManager.current;\n\n    if (animationFrameRef.current !== null) {\n      cancelAnimationFrame(animationFrameRef.current);\n    }\n    animationFrameRef.current = requestAnimationFrame(() => {\n      if (shiftX > snaps[0]) {\n        shiftXCurrentRef.current = -contentSize + snaps[0];\n        shiftX = shiftXCurrentRef.current + shiftXDeltaRef.current;\n      }\n      const lastPoint = slides[slides.length - 1].width + slides[slides.length - 1].coordX;\n\n      if (shiftX <= -lastPoint) {\n        shiftXCurrentRef.current = Math.abs(shiftXDeltaRef.current) + snaps[0];\n      }\n      transformCssStyles(shiftX, animation);\n    });\n  };\n\n  const initializeSlides = () => {\n    if (!rootRef.current || !viewportRef.current) {\n      return;\n    }\n    let localSlides =\n      React.Children.map(children, (_item, i): GallerySlidesState => {\n        const elem = slidesStore.current[i] || { offsetLeft: 0, offsetWidth: 0 };\n        return { coordX: elem.offsetLeft, width: elem.offsetWidth };\n      }) || [];\n\n    const containerWidth = rootRef.current.offsetWidth;\n    const viewportOffsetWidth = viewportRef.current.offsetWidth;\n    const layerWidth = localSlides.reduce((val, slide) => slide.width + val, 0);\n\n    if (process.env.NODE_ENV === 'development') {\n      let remainingWidth = containerWidth;\n      let slideIndex = 0;\n\n      while (remainingWidth > 0 && slideIndex < localSlides.length) {\n        remainingWidth -= localSlides[slideIndex].width;\n        slideIndex++;\n      }\n      if (remainingWidth <= 0 && slideIndex === localSlides.length) {\n        warn(\n          'Ширины слайдов недостаточно для корректной работы свойства \"looped\". Пожалуйста, сделайте её больше.\"',\n        );\n      }\n    }\n    if (align === 'center') {\n      const firstSlideShift = (containerWidth - localSlides[0].width) / 2;\n      localSlides = localSlides.map((item) => {\n        return {\n          width: item.width,\n          coordX: item.coordX - firstSlideShift,\n        };\n      });\n    }\n\n    slidesManager.current = {\n      ...slidesManager.current,\n      viewportOffsetWidth,\n      slides: localSlides,\n      isFullyVisible: layerWidth <= containerWidth,\n    };\n\n    const snaps = localSlides.map((_, index) =>\n      calculateIndent(index, slidesManager.current, isCenterWithCustomWidth),\n    );\n\n    let contentSize = -snaps[snaps.length - 1] + localSlides[localSlides.length - 1].width;\n    if (align === 'center') {\n      contentSize += snaps[0];\n    }\n\n    slidesManager.current.snaps = snaps;\n    slidesManager.current.contentSize = contentSize;\n    slidesManager.current.loopPoints = getLoopPoints(slidesManager.current, containerWidth);\n\n    setControlElementsState({\n      canSlideLeft: !slidesManager.current.isFullyVisible,\n      canSlideRight: !slidesManager.current.isFullyVisible,\n      isDraggable: !(dragDisabled || slidesManager.current.isFullyVisible),\n    });\n\n    shiftXCurrentRef.current = snaps[slideIndex];\n    initialized.current = true;\n\n    requestTransform(shiftXCurrentRef.current);\n  };\n\n  const onResize = () => {\n    if (initialized.current) {\n      initializeSlides();\n    }\n  };\n\n  useGlobalEventListener(window, 'resize', onResize);\n\n  useIsomorphicLayoutEffect(\n    function performSlideChange() {\n      if (!initialized.current) {\n        return;\n      }\n      const { snaps, slides } = slidesManager.current;\n      const indent = snaps[slideIndex];\n      let startPoint = shiftXCurrentRef.current;\n\n      /**\n       * Переключаемся с последнего элемента на первый\n       * Для корректной анимации мы прокручиваем последний слайд на всю длину (shiftX) \"вперед\"\n       * В конце анимации при отрисовке следующего кадра задаем всем слайдам начальные значения\n       */\n      if (indent === snaps[0] && shiftXCurrentRef.current <= snaps[snaps.length - 1]) {\n        const distance =\n          Math.abs(snaps[snaps.length - 1]) + slides[slides.length - 1].width + startPoint;\n\n        addToAnimationQueue(\n          getAnimateFunction((progress) => {\n            const shiftX = startPoint + progress * distance * -1;\n\n            transformCssStyles(shiftX);\n\n            if (shiftX <= snaps[snaps.length - 1] - slides[slides.length - 1].width) {\n              requestAnimationFrame(() => {\n                shiftXCurrentRef.current = indent;\n                transformCssStyles(snaps[0]);\n              });\n            }\n          }),\n        );\n        /**\n         * Переключаемся с первого слайда на последний\n         * Для корректной анимации сначала задаем первым видимым слайдам смещение\n         * В следующем кадре начинаем анимация прокрутки \"назад\"\n         */\n      } else if (indent === snaps[snaps.length - 1] && shiftXCurrentRef.current === snaps[0]) {\n        startPoint = indent - slides[slides.length - 1].width;\n\n        addToAnimationQueue(() => {\n          requestAnimationFrame(() => {\n            const shiftX = indent - slides[slides.length - 1].width;\n            transformCssStyles(shiftX);\n\n            getAnimateFunction((progress) => {\n              transformCssStyles(startPoint + progress * slides[slides.length - 1].width);\n            })();\n          });\n        });\n        /**\n         * Если не обработаны `corner`-кейсы выше, то просто проигрываем анимацию смещения\n         */\n      } else {\n        addToAnimationQueue(() => {\n          const distance = Math.abs(indent - startPoint);\n          let direction = startPoint <= indent ? 1 : -1;\n\n          getAnimateFunction((progress) => {\n            const shiftX = startPoint + progress * distance * direction;\n            transformCssStyles(shiftX);\n          })();\n        });\n      }\n\n      startAnimation();\n\n      shiftXCurrentRef.current = indent;\n    },\n    [slideIndex],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    initializeSlides();\n  }, [children, align, slideWidth]);\n\n  const slideLeft = (event: React.MouseEvent) => {\n    onChange?.(\n      (slideIndex - 1 + slidesManager.current.slides.length) % slidesManager.current.slides.length,\n    );\n    onPrevClick?.(event);\n  };\n\n  const slideRight = (event: React.MouseEvent) => {\n    onChange?.((slideIndex + 1) % slidesManager.current.slides.length);\n    onNextClick?.(event);\n  };\n\n  const onStart = (e: TouchEvent) => {\n    e.originalEvent.stopPropagation();\n    if (controlElementsState.isDraggable) {\n      onDragStart?.(e);\n      shiftXCurrentRef.current = slidesManager.current.snaps[slideIndex];\n      shiftXDeltaRef.current = 0;\n    }\n  };\n\n  const onMoveX = (e: TouchEvent) => {\n    if (controlElementsState.isDraggable) {\n      e.originalEvent.preventDefault();\n\n      if (e.isSlideX) {\n        if (shiftXDeltaRef.current !== e.shiftX) {\n          shiftXDeltaRef.current = e.shiftX;\n          requestTransform(shiftXCurrentRef.current + shiftXDeltaRef.current);\n        }\n      }\n    }\n  };\n\n  const onEnd = (e: TouchEvent) => {\n    if (controlElementsState.isDraggable) {\n      let targetIndex = slideIndex;\n      if (e.isSlide) {\n        targetIndex = getTargetIndex(\n          slidesManager.current.slides,\n          slideIndex,\n          shiftXCurrentRef.current,\n          shiftXDeltaRef.current,\n        );\n      }\n      onDragEnd?.(e, targetIndex);\n\n      if (targetIndex !== slideIndex) {\n        shiftXCurrentRef.current = shiftXCurrentRef.current + shiftXDeltaRef.current;\n        onChange?.(targetIndex);\n      } else {\n        const initialShiftX = slidesManager.current.snaps[targetIndex];\n        requestTransform(initialShiftX, true);\n      }\n    }\n  };\n\n  const setSlideRef = (slideRef: HTMLDivElement | null, slideIndex: number) => {\n    slidesStore.current[slideIndex] = slideRef;\n  };\n\n  const { canSlideLeft, canSlideRight, isDraggable } = controlElementsState;\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles['BaseGallery'],\n        slideWidth === 'custom' && styles['BaseGallery--custom-width'],\n        isDraggable && styles['BaseGallery--draggable'],\n      )}\n      getRootRef={rootRef}\n    >\n      <Touch\n        className={styles['BaseGallery__viewport']}\n        onStartX={onStart}\n        onMoveX={onMoveX}\n        onEnd={onEnd}\n        style={{ width: slideWidth === 'custom' ? '100%' : slideWidth }}\n        getRootRef={viewportRef}\n        noSlideClick\n      >\n        <div className={styles['BaseGallery__layer']} ref={layerRef}>\n          {React.Children.map(children, (item: React.ReactNode, i: number) => (\n            <div\n              className={styles['BaseGallery__slide']}\n              key={`slide-${i}`}\n              ref={(el) => setSlideRef(el, i)}\n            >\n              {item}\n            </div>\n          ))}\n        </div>\n      </Touch>\n\n      {bullets && (\n        <div\n          aria-hidden\n          className={classNames(styles['BaseGallery__bullets'], stylesBullets[bullets])}\n        >\n          {React.Children.map(children, (_item: React.ReactNode, index: number) => (\n            <div\n              className={classNames(\n                styles['BaseGallery__bullet'],\n                index === slideIndex && styles['BaseGallery__bullet--active'],\n              )}\n              key={index}\n            />\n          ))}\n        </div>\n      )}\n\n      {showArrows && hasPointer && canSlideLeft && (\n        <ScrollArrow\n          className={styles['BaseGallery__arrow']}\n          direction=\"left\"\n          onClick={slideLeft}\n          size={arrowSize}\n        />\n      )}\n      {showArrows && hasPointer && canSlideRight && (\n        <ScrollArrow\n          className={styles['BaseGallery__arrow']}\n          direction=\"right\"\n          onClick={slideRight}\n          size={arrowSize}\n        />\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","useAdaptivityHasPointer","useExternRef","useGlobalEventListener","useDOM","useIsomorphicLayoutEffect","warnOnce","RootComponent","ScrollArrow","Touch","ANIMATION_DURATION","CONTROL_ELEMENTS_STATE","SLIDES_MANAGER_STATE","calculateIndent","getLoopPoints","getTargetIndex","useSlideAnimation","styles","stylesBullets","dark","light","warn","CarouselBase","bullets","getRootRef","children","slideWidth","slideIndex","dragDisabled","onDragStart","onDragEnd","onChange","onPrevClick","onNextClick","align","showArrows","getRef","arrowSize","restProps","slidesStore","useRef","slidesManager","rootRef","viewportRef","layerRef","animationFrameRef","shiftXCurrentRef","shiftXDeltaRef","initialized","addToAnimationQueue","getAnimateFunction","startAnimation","controlElementsState","setControlElementsState","useState","window","hasPointer","isCenterWithCustomWidth","transformCssStyles","shiftX","animation","current","loopPoints","forEach","loopPoint","target","index","slide","style","transform","transition","requestTransform","snaps","contentSize","slides","cancelAnimationFrame","requestAnimationFrame","lastPoint","length","width","coordX","Math","abs","initializeSlides","localSlides","Children","map","_item","i","elem","offsetLeft","offsetWidth","containerWidth","viewportOffsetWidth","layerWidth","reduce","val","process","env","NODE_ENV","remainingWidth","firstSlideShift","item","isFullyVisible","_","canSlideLeft","canSlideRight","isDraggable","onResize","performSlideChange","indent","startPoint","distance","progress","direction","slideLeft","event","slideRight","onStart","e","originalEvent","stopPropagation","onMoveX","preventDefault","isSlideX","onEnd","targetIndex","isSlide","initialShiftX","setSlideRef","slideRef","baseClassName","className","onStartX","noSlideClick","div","ref","key","el","aria-hidden","onClick","size"],"mappings":"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"}
+{"version":3,"sources":["../../../../../src/components/BaseGallery/CarouselBase/CarouselBase.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../../hooks/useAdaptivityHasPointer';\nimport { useExternRef } from '../../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../../hooks/useGlobalEventListener';\nimport { useDOM } from '../../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../../lib/warnOnce';\nimport { RootComponent } from '../../RootComponent/RootComponent';\nimport { ScrollArrow } from '../../ScrollArrow/ScrollArrow';\nimport { Touch, TouchEvent } from '../../Touch/Touch';\nimport { BaseGalleryProps, GallerySlidesState } from '../types';\nimport { ANIMATION_DURATION, CONTROL_ELEMENTS_STATE, SLIDES_MANAGER_STATE } from './constants';\nimport { calculateIndent, getLoopPoints, getTargetIndex } from './helpers';\nimport { useSlideAnimation } from './hooks';\nimport { ControlElementsState, SlidesManagerState } from './types';\nimport styles from '../BaseGallery.module.css';\n\nconst stylesBullets = {\n  dark: styles['BaseGallery__bullets--dark'],\n  light: styles['BaseGallery__bullets--light'],\n};\n\nconst warn = warnOnce('Gallery');\n\nexport const CarouselBase = ({\n  bullets = false,\n  getRootRef,\n  children,\n  slideWidth = '100%',\n  slideIndex = 0,\n  dragDisabled = false,\n  onDragStart,\n  onDragEnd,\n  onChange,\n  onPrevClick,\n  onNextClick,\n  align = 'left',\n  showArrows,\n  getRef,\n  arrowSize = 'l',\n  ...restProps\n}: BaseGalleryProps) => {\n  const slidesStore = React.useRef<Record<string, HTMLDivElement | null>>({});\n  const slidesManager = React.useRef<SlidesManagerState>(SLIDES_MANAGER_STATE);\n\n  const rootRef = useExternRef(getRootRef);\n  const viewportRef = useExternRef(getRef);\n  const layerRef = React.useRef<HTMLDivElement>(null);\n  const animationFrameRef = React.useRef<ReturnType<typeof requestAnimationFrame> | null>(null);\n  const shiftXCurrentRef = React.useRef<number>(0);\n  const shiftXDeltaRef = React.useRef<number>(0);\n  const initialized = React.useRef<boolean>(false);\n  const { addToAnimationQueue, getAnimateFunction, startAnimation } = useSlideAnimation();\n\n  const [controlElementsState, setControlElementsState] =\n    React.useState<ControlElementsState>(CONTROL_ELEMENTS_STATE);\n\n  const { window } = useDOM();\n  const hasPointer = useAdaptivityHasPointer();\n\n  const isCenterWithCustomWidth = slideWidth === 'custom' && align === 'center';\n\n  const transformCssStyles = (shiftX: number, animation = false) => {\n    slidesManager.current.loopPoints.forEach((loopPoint) => {\n      const { target, index } = loopPoint;\n      const slide = slidesStore.current[index];\n      if (slide) {\n        slide.style.transform = `translate3d(${target(shiftX)}px, 0, 0)`;\n      }\n    });\n\n    if (layerRef.current) {\n      layerRef.current.style.transform = `translate3d(${shiftX}px, 0, 0)`;\n      layerRef.current.style.transition = animation\n        ? `transform ${ANIMATION_DURATION}ms cubic-bezier(.1, 0, .25, 1)`\n        : '';\n    }\n  };\n\n  const requestTransform = (shiftX: number, animation = false) => {\n    const { snaps, contentSize, slides } = slidesManager.current;\n\n    if (animationFrameRef.current !== null) {\n      cancelAnimationFrame(animationFrameRef.current);\n    }\n    animationFrameRef.current = requestAnimationFrame(() => {\n      if (shiftX > snaps[0]) {\n        shiftXCurrentRef.current = -contentSize + snaps[0];\n        shiftX = shiftXCurrentRef.current + shiftXDeltaRef.current;\n      }\n      const lastPoint = slides[slides.length - 1].width + slides[slides.length - 1].coordX;\n\n      if (shiftX <= -lastPoint) {\n        shiftXCurrentRef.current = Math.abs(shiftXDeltaRef.current) + snaps[0];\n      }\n      transformCssStyles(shiftX, animation);\n    });\n  };\n\n  const initializeSlides = () => {\n    if (!rootRef.current || !viewportRef.current) {\n      return;\n    }\n    let localSlides =\n      React.Children.map(children, (_item, i): GallerySlidesState => {\n        const elem = slidesStore.current[i] || { offsetLeft: 0, offsetWidth: 0 };\n        return { coordX: elem.offsetLeft, width: elem.offsetWidth };\n      }) || [];\n\n    const containerWidth = rootRef.current.offsetWidth;\n    const viewportOffsetWidth = viewportRef.current.offsetWidth;\n    const layerWidth = localSlides.reduce((val, slide) => slide.width + val, 0);\n\n    if (process.env.NODE_ENV === 'development') {\n      let remainingWidth = containerWidth;\n      let slideIndex = 0;\n\n      while (remainingWidth > 0 && slideIndex < localSlides.length) {\n        remainingWidth -= localSlides[slideIndex].width;\n        slideIndex++;\n      }\n      if (remainingWidth <= 0 && slideIndex === localSlides.length) {\n        warn(\n          'Ширины слайдов недостаточно для корректной работы свойства \"looped\". Пожалуйста, сделайте её больше.\"',\n        );\n      }\n    }\n    if (align === 'center') {\n      const firstSlideShift = (containerWidth - localSlides[0].width) / 2;\n      localSlides = localSlides.map((item) => {\n        return {\n          width: item.width,\n          coordX: item.coordX - firstSlideShift,\n        };\n      });\n    }\n\n    slidesManager.current = {\n      ...slidesManager.current,\n      viewportOffsetWidth,\n      slides: localSlides,\n      isFullyVisible: layerWidth <= containerWidth,\n    };\n\n    const snaps = localSlides.map((_, index) =>\n      calculateIndent(index, slidesManager.current, isCenterWithCustomWidth),\n    );\n\n    let contentSize = -snaps[snaps.length - 1] + localSlides[localSlides.length - 1].width;\n    if (align === 'center') {\n      contentSize += snaps[0];\n    }\n\n    slidesManager.current.snaps = snaps;\n    slidesManager.current.contentSize = contentSize;\n    slidesManager.current.loopPoints = getLoopPoints(slidesManager.current, containerWidth);\n\n    setControlElementsState({\n      canSlideLeft: !slidesManager.current.isFullyVisible,\n      canSlideRight: !slidesManager.current.isFullyVisible,\n      isDraggable: !(dragDisabled || slidesManager.current.isFullyVisible),\n    });\n\n    shiftXCurrentRef.current = snaps[slideIndex];\n    initialized.current = true;\n\n    requestTransform(shiftXCurrentRef.current);\n  };\n\n  const onResize = () => {\n    if (initialized.current) {\n      initializeSlides();\n    }\n  };\n\n  useGlobalEventListener(window, 'resize', onResize);\n\n  useIsomorphicLayoutEffect(\n    function performSlideChange() {\n      if (!initialized.current) {\n        return;\n      }\n      const { snaps, slides } = slidesManager.current;\n      const indent = snaps[slideIndex];\n      let startPoint = shiftXCurrentRef.current;\n\n      /**\n       * Переключаемся с последнего элемента на первый\n       * Для корректной анимации мы прокручиваем последний слайд на всю длину (shiftX) \"вперед\"\n       * В конце анимации при отрисовке следующего кадра задаем всем слайдам начальные значения\n       */\n      if (indent === snaps[0] && shiftXCurrentRef.current <= snaps[snaps.length - 1]) {\n        const distance =\n          Math.abs(snaps[snaps.length - 1]) + slides[slides.length - 1].width + startPoint;\n\n        addToAnimationQueue(\n          getAnimateFunction((progress) => {\n            const shiftX = startPoint + progress * distance * -1;\n\n            transformCssStyles(shiftX);\n\n            if (shiftX <= snaps[snaps.length - 1] - slides[slides.length - 1].width) {\n              requestAnimationFrame(() => {\n                shiftXCurrentRef.current = indent;\n                transformCssStyles(snaps[0]);\n              });\n            }\n          }),\n        );\n        /**\n         * Переключаемся с первого слайда на последний\n         * Для корректной анимации сначала задаем первым видимым слайдам смещение\n         * В следующем кадре начинаем анимация прокрутки \"назад\"\n         */\n      } else if (indent === snaps[snaps.length - 1] && shiftXCurrentRef.current === snaps[0]) {\n        startPoint = indent - slides[slides.length - 1].width;\n\n        addToAnimationQueue(() => {\n          requestAnimationFrame(() => {\n            const shiftX = indent - slides[slides.length - 1].width;\n            transformCssStyles(shiftX);\n\n            getAnimateFunction((progress) => {\n              transformCssStyles(startPoint + progress * slides[slides.length - 1].width);\n            })();\n          });\n        });\n        /**\n         * Если не обработаны `corner`-кейсы выше, то просто проигрываем анимацию смещения\n         */\n      } else {\n        addToAnimationQueue(() => {\n          const distance = Math.abs(indent - startPoint);\n          let direction = startPoint <= indent ? 1 : -1;\n\n          getAnimateFunction((progress) => {\n            const shiftX = startPoint + progress * distance * direction;\n            transformCssStyles(shiftX);\n          })();\n        });\n      }\n\n      startAnimation();\n\n      shiftXCurrentRef.current = indent;\n    },\n    [slideIndex],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    initializeSlides();\n  }, [children, align, slideWidth]);\n\n  const slideLeft = (event: React.MouseEvent) => {\n    onChange?.(\n      (slideIndex - 1 + slidesManager.current.slides.length) % slidesManager.current.slides.length,\n    );\n    onPrevClick?.(event);\n  };\n\n  const slideRight = (event: React.MouseEvent) => {\n    onChange?.((slideIndex + 1) % slidesManager.current.slides.length);\n    onNextClick?.(event);\n  };\n\n  const onStart = (e: TouchEvent) => {\n    e.originalEvent.stopPropagation();\n    if (controlElementsState.isDraggable) {\n      onDragStart?.(e);\n      shiftXCurrentRef.current = slidesManager.current.snaps[slideIndex];\n      shiftXDeltaRef.current = 0;\n    }\n  };\n\n  const onMoveX = (e: TouchEvent) => {\n    if (controlElementsState.isDraggable) {\n      e.originalEvent.preventDefault();\n\n      if (e.isSlideX) {\n        if (shiftXDeltaRef.current !== e.shiftX) {\n          shiftXDeltaRef.current = e.shiftX;\n          requestTransform(shiftXCurrentRef.current + shiftXDeltaRef.current);\n        }\n      }\n    }\n  };\n\n  const onEnd = (e: TouchEvent) => {\n    if (controlElementsState.isDraggable) {\n      let targetIndex = slideIndex;\n      if (e.isSlide) {\n        targetIndex = getTargetIndex(\n          slidesManager.current.slides,\n          slideIndex,\n          shiftXCurrentRef.current,\n          shiftXDeltaRef.current,\n        );\n      }\n      onDragEnd?.(e, targetIndex);\n\n      if (targetIndex !== slideIndex) {\n        shiftXCurrentRef.current = shiftXCurrentRef.current + shiftXDeltaRef.current;\n        onChange?.(targetIndex);\n      } else {\n        const initialShiftX = slidesManager.current.snaps[targetIndex];\n        requestTransform(initialShiftX, true);\n      }\n    }\n  };\n\n  const setSlideRef = (slideRef: HTMLDivElement | null, slideIndex: number) => {\n    slidesStore.current[slideIndex] = slideRef;\n  };\n\n  const { canSlideLeft, canSlideRight, isDraggable } = controlElementsState;\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles['BaseGallery'],\n        slideWidth === 'custom' && styles['BaseGallery--custom-width'],\n        isDraggable && styles['BaseGallery--draggable'],\n      )}\n      getRootRef={rootRef}\n    >\n      <Touch\n        className={styles['BaseGallery__viewport']}\n        onStartX={onStart}\n        onMoveX={onMoveX}\n        onEnd={onEnd}\n        style={{ width: slideWidth === 'custom' ? '100%' : slideWidth }}\n        getRootRef={viewportRef}\n        noSlideClick\n      >\n        <div className={styles['BaseGallery__layer']} ref={layerRef}>\n          {React.Children.map(children, (item: React.ReactNode, i: number) => (\n            <div\n              className={styles['BaseGallery__slide']}\n              key={`slide-${i}`}\n              ref={(el) => setSlideRef(el, i)}\n            >\n              {item}\n            </div>\n          ))}\n        </div>\n      </Touch>\n\n      {bullets && (\n        <div\n          aria-hidden\n          className={classNames(styles['BaseGallery__bullets'], stylesBullets[bullets])}\n        >\n          {React.Children.map(children, (_item: React.ReactNode, index: number) => (\n            <div\n              className={classNames(\n                styles['BaseGallery__bullet'],\n                index === slideIndex && styles['BaseGallery__bullet--active'],\n              )}\n              key={index}\n            />\n          ))}\n        </div>\n      )}\n\n      {showArrows && hasPointer && canSlideLeft && (\n        <ScrollArrow\n          className={styles['BaseGallery__arrow']}\n          direction=\"left\"\n          onClick={slideLeft}\n          size={arrowSize}\n        />\n      )}\n      {showArrows && hasPointer && canSlideRight && (\n        <ScrollArrow\n          className={styles['BaseGallery__arrow']}\n          direction=\"right\"\n          onClick={slideRight}\n          size={arrowSize}\n        />\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","useAdaptivityHasPointer","useExternRef","useGlobalEventListener","useDOM","useIsomorphicLayoutEffect","warnOnce","RootComponent","ScrollArrow","Touch","ANIMATION_DURATION","CONTROL_ELEMENTS_STATE","SLIDES_MANAGER_STATE","calculateIndent","getLoopPoints","getTargetIndex","useSlideAnimation","styles","stylesBullets","dark","light","warn","CarouselBase","bullets","getRootRef","children","slideWidth","slideIndex","dragDisabled","onDragStart","onDragEnd","onChange","onPrevClick","onNextClick","align","showArrows","getRef","arrowSize","restProps","slidesStore","useRef","slidesManager","rootRef","viewportRef","layerRef","animationFrameRef","shiftXCurrentRef","shiftXDeltaRef","initialized","addToAnimationQueue","getAnimateFunction","startAnimation","controlElementsState","setControlElementsState","useState","window","hasPointer","isCenterWithCustomWidth","transformCssStyles","shiftX","animation","current","loopPoints","forEach","loopPoint","target","index","slide","style","transform","transition","requestTransform","snaps","contentSize","slides","cancelAnimationFrame","requestAnimationFrame","lastPoint","length","width","coordX","Math","abs","initializeSlides","localSlides","Children","map","_item","i","elem","offsetLeft","offsetWidth","containerWidth","viewportOffsetWidth","layerWidth","reduce","val","process","env","NODE_ENV","remainingWidth","firstSlideShift","item","isFullyVisible","_","canSlideLeft","canSlideRight","isDraggable","onResize","performSlideChange","indent","startPoint","distance","progress","direction","slideLeft","event","slideRight","onStart","e","originalEvent","stopPropagation","onMoveX","preventDefault","isSlideX","onEnd","targetIndex","isSlide","initialShiftX","setSlideRef","slideRef","baseClassName","className","onStartX","noSlideClick","div","ref","el","aria-hidden","onClick","size"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/dist/cssm/components/BaseGallery/CarouselBase/constants.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/BaseGallery/CarouselBase/constants.ts"],"sourcesContent":["import { ControlElementsState, SlidesManagerState } from './types';\n\nexport const ANIMATION_DURATION = 240;\n\nexport const SLIDE_THRESHOLD = 0.05;\n\nexport const CONTROL_ELEMENTS_STATE: ControlElementsState = {\n  canSlideLeft: true,\n  canSlideRight: true,\n  isDraggable: true,\n};\n\nexport const SLIDES_MANAGER_STATE: SlidesManagerState = {\n  viewportOffsetWidth: 0,\n  slides: [],\n  isFullyVisible: true,\n  loopPoints: [],\n  contentSize: 0,\n  snaps: [],\n};\n"],"names":["ANIMATION_DURATION","SLIDE_THRESHOLD","CONTROL_ELEMENTS_STATE","canSlideLeft","canSlideRight","isDraggable","SLIDES_MANAGER_STATE","viewportOffsetWidth","slides","isFullyVisible","loopPoints","contentSize","snaps"],"mappings":"AAEA,OAAO,MAAMA,qBAAqB,IAAI;AAEtC,OAAO,MAAMC,kBAAkB,KAAK;AAEpC,OAAO,MAAMC,yBAA+C;IAC1DC,cAAc;IACdC,eAAe;IACfC,aAAa;AACf,EAAE;AAEF,OAAO,MAAMC,uBAA2C;IACtDC,qBAAqB;IACrBC,QAAQ,EAAE;IACVC,gBAAgB;IAChBC,YAAY,EAAE;IACdC,aAAa;IACbC,OAAO,EAAE;AACX,EAAE"}
+{"version":3,"sources":["../../../../../src/components/BaseGallery/CarouselBase/constants.ts"],"sourcesContent":["import { ControlElementsState, SlidesManagerState } from './types';\n\nexport const ANIMATION_DURATION = 240;\n\nexport const SLIDE_THRESHOLD = 0.05;\n\nexport const CONTROL_ELEMENTS_STATE: ControlElementsState = {\n  canSlideLeft: true,\n  canSlideRight: true,\n  isDraggable: true,\n};\n\nexport const SLIDES_MANAGER_STATE: SlidesManagerState = {\n  viewportOffsetWidth: 0,\n  slides: [],\n  isFullyVisible: true,\n  loopPoints: [],\n  contentSize: 0,\n  snaps: [],\n};\n"],"names":["ANIMATION_DURATION","SLIDE_THRESHOLD","CONTROL_ELEMENTS_STATE","canSlideLeft","canSlideRight","isDraggable","SLIDES_MANAGER_STATE","viewportOffsetWidth","slides","isFullyVisible","loopPoints","contentSize","snaps"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAEA,OAAO,MAAMA,qBAAqB,IAAI;AAEtC,OAAO,MAAMC,kBAAkB,KAAK;AAEpC,OAAO,MAAMC,yBAA+C;IAC1DC,cAAc;IACdC,eAAe;IACfC,aAAa;AACf,EAAE;AAEF,OAAO,MAAMC,uBAA2C;IACtDC,qBAAqB;IACrBC,QAAQ,EAAE;IACVC,gBAAgB;IAChBC,YAAY,EAAE;IACdC,aAAa;IACbC,OAAO,EAAE;AACX,EAAE"}

package/dist/cssm/components/BaseGallery/CarouselBase/helpers.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/BaseGallery/CarouselBase/helpers.ts"],"sourcesContent":["import { GallerySlidesState } from '../types';\nimport { SLIDE_THRESHOLD } from './constants';\nimport { LoopPoint, SlidesManagerState } from './types';\n\n/*\n * Считает отступ слоя галереи\n */\nexport function calculateIndent(\n  targetIndex: number,\n  slidesManager: SlidesManagerState,\n  isCenterWithCustomWidth: boolean,\n) {\n  if (slidesManager.isFullyVisible || !slidesManager.slides.length) {\n    return 0;\n  }\n\n  const targetSlide = slidesManager.slides[targetIndex];\n\n  if (targetSlide) {\n    const { coordX, width } = targetSlide;\n\n    if (isCenterWithCustomWidth) {\n      return slidesManager.viewportOffsetWidth / 2 - coordX - width / 2;\n    }\n\n    return -1 * coordX;\n  }\n\n  return 0;\n}\n\n/**\n * Вычисляем индексы слайдов, которые необходимо смещать\n */\nexport function getShiftedIndexes(\n  direction: 1 | -1,\n  slides: GallerySlidesState[],\n  availableWidth: number,\n) {\n  let gap = availableWidth;\n  const shiftedSlideIndexes = [];\n  const startIndex = direction === 1 ? 0 : slides.length - 1;\n  const endIndex = direction === 1 ? slides.length - 1 : 0;\n\n  for (\n    let i = startIndex;\n    (direction === 1 ? i <= endIndex : i >= endIndex) && gap > 0;\n    i += direction\n  ) {\n    const slideWidth = slides[i].width;\n\n    if (gap > 0) {\n      shiftedSlideIndexes.push(i);\n    }\n    gap -= slideWidth;\n  }\n\n  return shiftedSlideIndexes;\n}\n\nexport function calculateLoopPoints(\n  indexes: number[],\n  edge: 'start' | 'end',\n  slidesManager: SlidesManagerState,\n  containerWidth: number,\n): LoopPoint[] {\n  const { contentSize, slides, snaps } = slidesManager;\n  const isStartEdge = edge === 'start';\n  const offset = isStartEdge ? -contentSize : contentSize;\n\n  return indexes.map((index) => {\n    const initial = isStartEdge ? 0 : -contentSize;\n    const altered = isStartEdge ? contentSize : 0;\n    const loopPoint = isStartEdge\n      ? snaps[index] + containerWidth + offset\n      : snaps[index] - slides[index].width + offset - snaps[0];\n\n    return {\n      index,\n      target: (currentLocation) => {\n        return currentLocation >= loopPoint ? initial : altered;\n      },\n    };\n  });\n}\n\n/**\n * Вычисляем \"ключевые\" точки, на которых должно происходить смещение слайдов\n */\nexport function getLoopPoints(slidesManager: SlidesManagerState, containerWidth: number) {\n  const { slides, snaps } = slidesManager;\n  const startShiftedIndexes = getShiftedIndexes(-1, slides, snaps[0]);\n  const endShiftedIndexes = getShiftedIndexes(1, slides, containerWidth - snaps[0]);\n\n  return [\n    ...calculateLoopPoints(endShiftedIndexes, 'start', slidesManager, containerWidth),\n    ...calculateLoopPoints(startShiftedIndexes, 'end', slidesManager, containerWidth),\n  ];\n}\n\n/*\n * Получает индекс слайда, к которому будет осуществлен переход\n */\nexport function getTargetIndex(\n  slides: GallerySlidesState[],\n  slideIndex: number,\n  currentShiftX: number,\n  currentShiftXDelta: number,\n) {\n  const shift = currentShiftX + currentShiftXDelta;\n  const direction = currentShiftXDelta < 0 ? 1 : -1;\n\n  // Находим ближайшую границу слайда к текущему отступу\n  let targetIndex = slides.reduce((val: number, item: GallerySlidesState, index: number) => {\n    const previousValue = Math.abs(slides[val].coordX + shift);\n    const currentValue = Math.abs(item.coordX + shift);\n\n    return previousValue < currentValue ? val : index;\n  }, slideIndex);\n\n  if (targetIndex === slideIndex) {\n    let targetSlide = slideIndex + direction;\n\n    if (targetSlide >= 0 && targetSlide < slides.length) {\n      if (Math.abs(currentShiftXDelta) > slides[targetSlide].width * SLIDE_THRESHOLD) {\n        return targetSlide;\n      }\n      return targetIndex;\n    }\n    return direction < 0\n      ? (targetSlide + slides.length) % slides.length\n      : targetSlide % slides.length;\n  }\n\n  return targetIndex;\n}\n"],"names":["SLIDE_THRESHOLD","calculateIndent","targetIndex","slidesManager","isCenterWithCustomWidth","isFullyVisible","slides","length","targetSlide","coordX","width","viewportOffsetWidth","getShiftedIndexes","direction","availableWidth","gap","shiftedSlideIndexes","startIndex","endIndex","i","slideWidth","push","calculateLoopPoints","indexes","edge","containerWidth","contentSize","snaps","isStartEdge","offset","map","index","initial","altered","loopPoint","target","currentLocation","getLoopPoints","startShiftedIndexes","endShiftedIndexes","getTargetIndex","slideIndex","currentShiftX","currentShiftXDelta","shift","reduce","val","item","previousValue","Math","abs","currentValue"],"mappings":"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"}
+{"version":3,"sources":["../../../../../src/components/BaseGallery/CarouselBase/helpers.ts"],"sourcesContent":["import { GallerySlidesState } from '../types';\nimport { SLIDE_THRESHOLD } from './constants';\nimport { LoopPoint, SlidesManagerState } from './types';\n\n/*\n * Считает отступ слоя галереи\n */\nexport function calculateIndent(\n  targetIndex: number,\n  slidesManager: SlidesManagerState,\n  isCenterWithCustomWidth: boolean,\n) {\n  if (slidesManager.isFullyVisible || !slidesManager.slides.length) {\n    return 0;\n  }\n\n  const targetSlide = slidesManager.slides[targetIndex];\n\n  if (targetSlide) {\n    const { coordX, width } = targetSlide;\n\n    if (isCenterWithCustomWidth) {\n      return slidesManager.viewportOffsetWidth / 2 - coordX - width / 2;\n    }\n\n    return -1 * coordX;\n  }\n\n  return 0;\n}\n\n/**\n * Вычисляем индексы слайдов, которые необходимо смещать\n */\nexport function getShiftedIndexes(\n  direction: 1 | -1,\n  slides: GallerySlidesState[],\n  availableWidth: number,\n) {\n  let gap = availableWidth;\n  const shiftedSlideIndexes = [];\n  const startIndex = direction === 1 ? 0 : slides.length - 1;\n  const endIndex = direction === 1 ? slides.length - 1 : 0;\n\n  for (\n    let i = startIndex;\n    (direction === 1 ? i <= endIndex : i >= endIndex) && gap > 0;\n    i += direction\n  ) {\n    const slideWidth = slides[i].width;\n\n    if (gap > 0) {\n      shiftedSlideIndexes.push(i);\n    }\n    gap -= slideWidth;\n  }\n\n  return shiftedSlideIndexes;\n}\n\nexport function calculateLoopPoints(\n  indexes: number[],\n  edge: 'start' | 'end',\n  slidesManager: SlidesManagerState,\n  containerWidth: number,\n): LoopPoint[] {\n  const { contentSize, slides, snaps } = slidesManager;\n  const isStartEdge = edge === 'start';\n  const offset = isStartEdge ? -contentSize : contentSize;\n\n  return indexes.map((index) => {\n    const initial = isStartEdge ? 0 : -contentSize;\n    const altered = isStartEdge ? contentSize : 0;\n    const loopPoint = isStartEdge\n      ? snaps[index] + containerWidth + offset\n      : snaps[index] - slides[index].width + offset - snaps[0];\n\n    return {\n      index,\n      target: (currentLocation) => {\n        return currentLocation >= loopPoint ? initial : altered;\n      },\n    };\n  });\n}\n\n/**\n * Вычисляем \"ключевые\" точки, на которых должно происходить смещение слайдов\n */\nexport function getLoopPoints(slidesManager: SlidesManagerState, containerWidth: number) {\n  const { slides, snaps } = slidesManager;\n  const startShiftedIndexes = getShiftedIndexes(-1, slides, snaps[0]);\n  const endShiftedIndexes = getShiftedIndexes(1, slides, containerWidth - snaps[0]);\n\n  return [\n    ...calculateLoopPoints(endShiftedIndexes, 'start', slidesManager, containerWidth),\n    ...calculateLoopPoints(startShiftedIndexes, 'end', slidesManager, containerWidth),\n  ];\n}\n\n/*\n * Получает индекс слайда, к которому будет осуществлен переход\n */\nexport function getTargetIndex(\n  slides: GallerySlidesState[],\n  slideIndex: number,\n  currentShiftX: number,\n  currentShiftXDelta: number,\n) {\n  const shift = currentShiftX + currentShiftXDelta;\n  const direction = currentShiftXDelta < 0 ? 1 : -1;\n\n  // Находим ближайшую границу слайда к текущему отступу\n  let targetIndex = slides.reduce((val: number, item: GallerySlidesState, index: number) => {\n    const previousValue = Math.abs(slides[val].coordX + shift);\n    const currentValue = Math.abs(item.coordX + shift);\n\n    return previousValue < currentValue ? val : index;\n  }, slideIndex);\n\n  if (targetIndex === slideIndex) {\n    let targetSlide = slideIndex + direction;\n\n    if (targetSlide >= 0 && targetSlide < slides.length) {\n      if (Math.abs(currentShiftXDelta) > slides[targetSlide].width * SLIDE_THRESHOLD) {\n        return targetSlide;\n      }\n      return targetIndex;\n    }\n    return direction < 0\n      ? (targetSlide + slides.length) % slides.length\n      : targetSlide % slides.length;\n  }\n\n  return targetIndex;\n}\n"],"names":["SLIDE_THRESHOLD","calculateIndent","targetIndex","slidesManager","isCenterWithCustomWidth","isFullyVisible","slides","length","targetSlide","coordX","width","viewportOffsetWidth","getShiftedIndexes","direction","availableWidth","gap","shiftedSlideIndexes","startIndex","endIndex","i","slideWidth","push","calculateLoopPoints","indexes","edge","containerWidth","contentSize","snaps","isStartEdge","offset","map","index","initial","altered","loopPoint","target","currentLocation","getLoopPoints","startShiftedIndexes","endShiftedIndexes","getTargetIndex","slideIndex","currentShiftX","currentShiftXDelta","shift","reduce","val","item","previousValue","Math","abs","currentValue"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/dist/cssm/components/BaseGallery/CarouselBase/hooks.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/BaseGallery/CarouselBase/hooks.ts"],"sourcesContent":["import * as React from 'react';\nimport { animate, DrawInterface } from '../../../lib/animate';\nimport { cubicBezier } from '../../../lib/fx';\nimport { ANIMATION_DURATION } from './constants';\n\nconst TIMING_FUNCTION = cubicBezier(0.8, 1);\n\nexport function useSlideAnimation() {\n  const animationQueue = React.useRef<VoidFunction[]>([]);\n\n  function getAnimateFunction(drawFunction: DrawInterface) {\n    return () => {\n      animate({\n        duration: ANIMATION_DURATION,\n        timing: TIMING_FUNCTION,\n        animationQueue: animationQueue.current,\n        draw: drawFunction,\n      });\n    };\n  }\n\n  function addToAnimationQueue(func: VoidFunction) {\n    animationQueue.current.push(func);\n  }\n\n  function startAnimation() {\n    if (animationQueue.current.length === 1) {\n      animationQueue.current[0]();\n    }\n  }\n\n  return {\n    getAnimateFunction,\n    addToAnimationQueue,\n    startAnimation,\n  };\n}\n"],"names":["React","animate","cubicBezier","ANIMATION_DURATION","TIMING_FUNCTION","useSlideAnimation","animationQueue","useRef","getAnimateFunction","drawFunction","duration","timing","current","draw","addToAnimationQueue","func","push","startAnimation","length"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,OAAO,QAAuB,uBAAuB;AAC9D,SAASC,WAAW,QAAQ,kBAAkB;AAC9C,SAASC,kBAAkB,QAAQ,cAAc;AAEjD,MAAMC,kBAAkBF,YAAY,KAAK;AAEzC,OAAO,SAASG;IACd,MAAMC,iBAAiBN,MAAMO,MAAM,CAAiB,EAAE;IAEtD,SAASC,mBAAmBC,YAA2B;QACrD,OAAO;YACLR,QAAQ;gBACNS,UAAUP;gBACVQ,QAAQP;gBACRE,gBAAgBA,eAAeM,OAAO;gBACtCC,MAAMJ;YACR;QACF;IACF;IAEA,SAASK,oBAAoBC,IAAkB;QAC7CT,eAAeM,OAAO,CAACI,IAAI,CAACD;IAC9B;IAEA,SAASE;QACP,IAAIX,eAAeM,OAAO,CAACM,MAAM,KAAK,GAAG;YACvCZ,eAAeM,OAAO,CAAC,EAAE;QAC3B;IACF;IAEA,OAAO;QACLJ;QACAM;QACAG;IACF;AACF"}
+{"version":3,"sources":["../../../../../src/components/BaseGallery/CarouselBase/hooks.ts"],"sourcesContent":["import * as React from 'react';\nimport { animate, DrawInterface } from '../../../lib/animate';\nimport { cubicBezier } from '../../../lib/fx';\nimport { ANIMATION_DURATION } from './constants';\n\nconst TIMING_FUNCTION = cubicBezier(0.8, 1);\n\nexport function useSlideAnimation() {\n  const animationQueue = React.useRef<VoidFunction[]>([]);\n\n  function getAnimateFunction(drawFunction: DrawInterface) {\n    return () => {\n      animate({\n        duration: ANIMATION_DURATION,\n        timing: TIMING_FUNCTION,\n        animationQueue: animationQueue.current,\n        draw: drawFunction,\n      });\n    };\n  }\n\n  function addToAnimationQueue(func: VoidFunction) {\n    animationQueue.current.push(func);\n  }\n\n  function startAnimation() {\n    if (animationQueue.current.length === 1) {\n      animationQueue.current[0]();\n    }\n  }\n\n  return {\n    getAnimateFunction,\n    addToAnimationQueue,\n    startAnimation,\n  };\n}\n"],"names":["React","animate","cubicBezier","ANIMATION_DURATION","TIMING_FUNCTION","useSlideAnimation","animationQueue","useRef","getAnimateFunction","drawFunction","duration","timing","current","draw","addToAnimationQueue","func","push","startAnimation","length"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,OAAO,QAAuB,uBAAuB;AAC9D,SAASC,WAAW,QAAQ,kBAAkB;AAC9C,SAASC,kBAAkB,QAAQ,cAAc;AAEjD,MAAMC,kBAAkBF,YAAY,KAAK;AAEzC,OAAO,SAASG;IACd,MAAMC,iBAAiBN,MAAMO,MAAM,CAAiB,EAAE;IAEtD,SAASC,mBAAmBC,YAA2B;QACrD,OAAO;YACLR,QAAQ;gBACNS,UAAUP;gBACVQ,QAAQP;gBACRE,gBAAgBA,eAAeM,OAAO;gBACtCC,MAAMJ;YACR;QACF;IACF;IAEA,SAASK,oBAAoBC,IAAkB;QAC7CT,eAAeM,OAAO,CAACI,IAAI,CAACD;IAC9B;IAEA,SAASE;QACP,IAAIX,eAAeM,OAAO,CAACM,MAAM,KAAK,GAAG;YACvCZ,eAAeM,OAAO,CAAC,EAAE;QAC3B;IACF;IAEA,OAAO;QACLJ;QACAM;QACAG;IACF;AACF"}