@vkontakte/vkui 6.1.2 → 6.2.0

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

@@ -1,6 +1,11 @@
 .Snackbar {
   --vkui_internal--snackbar_safe_area_inset_bottom: var(--vkui_internal--safe_area_inset_bottom);
   --vkui_internal--snackbar_in_padding: 8px;
+  --vkui_internal--snackbar_shift_x: 0;
+  --vkui_internal--snackbar_shift_y: 0;
+  --vkui_internal--snackbar_animation_from: translate3d(0, 0, 0);
+  --vkui_internal--snackbar_animation_to: translate3d(0, var(--vkui_internal--snackbar_shift_y), 0);
+  --vkui_internal--snackbar_animation_duration: 340ms;
 
   position: fixed;
   inset-inline: var(--vkui_internal--safe_area_inset_left)
@@ -12,20 +17,24 @@
           user-select: none;
 }
 
+.Snackbar--ios {
+  --vkui_internal--snackbar_animation_duration: 400ms;
+}
+
 .Snackbar--placement-top-start,
 .Snackbar--placement-top,
 .Snackbar--placement-top-end {
+  --vkui_internal--snackbar_animation_from: translate3d(0, -100%, 0);
+
   inset-block-start: var(--vkui_internal--safe_area_inset_top);
 }
 
 .Snackbar--placement-bottom-start,
 .Snackbar--placement-bottom,
 .Snackbar--placement-bottom-end {
-  inset-block-end: var(--vkui_internal--snackbar_safe_area_inset_bottom);
-}
+  --vkui_internal--snackbar_animation_from: translate3d(0, 100%, 0);
 
-.Snackbar__in {
-  padding: var(--vkui_internal--snackbar_in_padding);
+  inset-block-end: var(--vkui_internal--snackbar_safe_area_inset_bottom);
 }
 
 @media (min-width: 768px) and (pointer: fine),(min-width: 768px) and (min-height: 720px) {
@@ -52,110 +61,77 @@
 
   .Snackbar--placement-top-start,
   .Snackbar--placement-bottom-start {
+    --vkui_internal--snackbar_animation_from: translate3d(-100%, 0, 0);
+
     inset-inline-start: var(--vkui_internal--safe_area_inset_left);
     inset-inline-end: auto;
   }
 
   .Snackbar--placement-top-end,
   .Snackbar--placement-bottom-end {
+    --vkui_internal--snackbar_animation_from: translate3d(100%, 0, 0);
+
     inset-inline-start: auto;
     inset-inline-end: var(--vkui_internal--safe_area_inset_right);
   }
 
-  .Snackbar__in {
-    --vkui_internal--snackbar_in_padding: 12px;
-  }
-}
-
-/* Анимации */
-
-@media (prefers-reduced-motion: no-preference) {
-  .Snackbar {
-    --vkui_internal--snackbar_shift_x: 0;
-    --vkui_internal--snackbar_shift_y: 0;
-    --vkui_internal--snackbar_animation_from: translate3d(0, 0, 0);
+  .Snackbar--placement-top-start,
+  .Snackbar--placement-bottom-start,
+  .Snackbar--placement-top-end,
+  .Snackbar--placement-bottom-end {
     --vkui_internal--snackbar_animation_to: translate3d(
+      var(--vkui_internal--snackbar_shift_x),
       0,
-      var(--vkui_internal--snackbar_shift_y),
       0
     );
-    --vkui_internal--snackbar_animation_duration: 340ms;
-  }
-
-  .Snackbar--ios {
-    --vkui_internal--snackbar_animation_duration: 400ms;
-  }
-
-  .Snackbar--placement-top-start,
-  .Snackbar--placement-top,
-  .Snackbar--placement-top-end {
-    --vkui_internal--snackbar_animation_from: translate3d(0, -100%, 0);
   }
+}
 
-  .Snackbar--placement-bottom-start,
-  .Snackbar--placement-bottom,
-  .Snackbar--placement-bottom-end {
-    --vkui_internal--snackbar_animation_from: translate3d(0, 100%, 0);
-  }
+.Snackbar__in {
+  padding: var(--vkui_internal--snackbar_in_padding);
+  animation-duration: var(--vkui_internal--snackbar_animation_duration);
+  animation-timing-function: var(--vkui--animation_easing_platform);
+  animation-fill-mode: both;
+  transform: translate3d(0, var(--vkui_internal--snackbar_shift_y), 0);
+}
 
-  .Snackbar__in {
-    animation-duration: var(--vkui_internal--snackbar_animation_duration);
-    animation-timing-function: var(--vkui--animation_easing_platform);
-    animation-fill-mode: both;
-    transform: translate3d(0, var(--vkui_internal--snackbar_shift_y), 0);
-  }
+.Snackbar--state-enter .Snackbar__in,
+.Snackbar--state-entering .Snackbar__in {
+  animation-name: animation-snackbar-slide-in;
+}
 
+@media screen and (prefers-reduced-motion: reduce) {
   .Snackbar--state-enter .Snackbar__in,
   .Snackbar--state-entering .Snackbar__in {
-    animation-name: animation-snackbar-slide-in;
+    animation-name: animation-snackbar-fade-in;
   }
+}
 
-  .Snackbar--state-entered .Snackbar__in {
-    transition-property: transform;
-    transition-duration: var(--vkui_internal--snackbar_animation_duration);
-    transition-timing-function: var(--vkui--animation_easing_platform);
-  }
+.Snackbar--state-entered .Snackbar__in {
+  transition-property: transform;
+  transition-duration: var(--vkui_internal--snackbar_animation_duration);
+  transition-timing-function: var(--vkui--animation_easing_platform);
+}
 
-  .Snackbar--touched .Snackbar__in {
-    transition-property: none;
-  }
+.Snackbar--touched .Snackbar__in {
+  transition-property: none;
+}
 
+.Snackbar--state-exit .Snackbar__in,
+.Snackbar--state-exiting .Snackbar__in {
+  animation-name: animation-snackbar-slide-out;
+}
+
+@media screen and (prefers-reduced-motion: reduce) {
   .Snackbar--state-exit .Snackbar__in,
   .Snackbar--state-exiting .Snackbar__in {
-    animation-name: animation-snackbar-slide-out;
+    animation-name: animation-snackbar-fade-out;
   }
 }
 
-/* Выносим из @media, т.к. иначе элемент не скроется, если пользователь не удаляет Snackbar из DOM. */
-
-.Snackbar--state-exited .Snackbar__in {
-  transform: var(--vkui_internal--snackbar_animation_from);
-}
+/* stylelint-disable-next-line at-rule-empty-line-before */
 
 @media (min-width: 768px) and (pointer: fine),(min-width: 768px) and (min-height: 720px) {
-
-@media (max-color:2147477350) and (prefers-reduced-motion: no-preference) {
-  .Snackbar--placement-top-start,
-  .Snackbar--placement-bottom-start {
-    --vkui_internal--snackbar_animation_from: translate3d(-100%, 0, 0);
-  }
-
-  .Snackbar--placement-top-end,
-  .Snackbar--placement-bottom-end {
-    --vkui_internal--snackbar_animation_from: translate3d(100%, 0, 0);
-  }
-
-  .Snackbar--placement-top-start,
-  .Snackbar--placement-bottom-start,
-  .Snackbar--placement-top-end,
-  .Snackbar--placement-bottom-end {
-    --vkui_internal--snackbar_animation_to: translate3d(
-      var(--vkui_internal--snackbar_shift_x),
-      0,
-      0
-    );
-  }
-
   .Snackbar__in {
     --vkui_internal--snackbar_in_padding: 12px;
   }
@@ -167,65 +143,49 @@
     transform: translate3d(var(--vkui_internal--snackbar_shift_x), 0, 0);
   }
 }
-}
-
-@media not all and (min-width: 768px) and (pointer: fine),not all and (min-width: 768px) and (min-height: 720px) {
-
-@media (color:2147477350) and (prefers-reduced-motion: no-preference) {
-  .Snackbar--placement-top-start,
-  .Snackbar--placement-bottom-start {
-    --vkui_internal--snackbar_animation_from: translate3d(-100%, 0, 0);
-  }
 
-  .Snackbar--placement-top-end,
-  .Snackbar--placement-bottom-end {
-    --vkui_internal--snackbar_animation_from: translate3d(100%, 0, 0);
+@keyframes animation-snackbar-slide-in {
+  from {
+    opacity: 0;
+    transform: var(--vkui_internal--snackbar_animation_from);
   }
 
-  .Snackbar--placement-top-start,
-  .Snackbar--placement-bottom-start,
-  .Snackbar--placement-top-end,
-  .Snackbar--placement-bottom-end {
-    --vkui_internal--snackbar_animation_to: translate3d(
-      var(--vkui_internal--snackbar_shift_x),
-      0,
-      0
-    );
+  to {
+    opacity: 1;
+    transform: translate3d(0, 0, 0);
   }
+}
 
-  .Snackbar__in {
-    --vkui_internal--snackbar_in_padding: 12px;
+@keyframes animation-snackbar-slide-out {
+  from {
+    opacity: 1;
+    transform: var(--vkui_internal--snackbar_animation_to);
   }
 
-  .Snackbar--placement-top-start .Snackbar__in,
-  .Snackbar--placement-bottom-start .Snackbar__in,
-  .Snackbar--placement-top-end .Snackbar__in,
-  .Snackbar--placement-bottom-end .Snackbar__in {
-    transform: translate3d(var(--vkui_internal--snackbar_shift_x), 0, 0);
+  to {
+    opacity: 0;
+    transform: var(--vkui_internal--snackbar_animation_from);
   }
 }
-}
 
-@keyframes animation-snackbar-slide-in {
+/* Анимации при (prefers-reduced-motion: reduce) */
+
+@keyframes animation-snackbar-fade-in {
   from {
     opacity: 0;
-    transform: var(--vkui_internal--snackbar_animation_from);
   }
 
   to {
     opacity: 1;
-    transform: translate3d(0, 0, 0);
   }
 }
 
-@keyframes animation-snackbar-slide-out {
+@keyframes animation-snackbar-fade-out {
   from {
     opacity: 1;
-    transform: var(--vkui_internal--snackbar_animation_to);
   }
 
   to {
     opacity: 0;
-    transform: var(--vkui_internal--snackbar_animation_from);
   }
 }

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

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

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Snackbar/types.ts"],"sourcesContent":["export type SnackbarPlacement =\n  | 'top-start'\n  | 'top'\n  | 'top-end'\n  | 'bottom-start'\n  | 'bottom'\n  | 'bottom-end';\n\nexport type ShiftData = { x: number; y: number; width: number; height: number; shifted: boolean };\n"],"names":[],"rangeMappings":"","mappings":"AAQA,WAAkG"}
+{"version":3,"sources":["../../../../src/components/Snackbar/types.ts"],"sourcesContent":["export type SnackbarPlacement =\n  | 'top-start'\n  | 'top'\n  | 'top-end'\n  | 'bottom-start'\n  | 'bottom'\n  | 'bottom-end';\n\nexport type ShiftData = { x: number; y: number; width: number; height: number; shifted: boolean };\n"],"names":[],"mappings":"AAQA,WAAkG"}

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { ShiftData, SnackbarPlacement } from './types';
 export declare function resolveOffsetYCssStyle(placement: SnackbarPlacement, style?: React.CSSProperties, offsetY?: React.CSSProperties['inset']): import("react").CSSProperties | undefined;
 export declare function getInitialShiftData(width: number, height: number): {

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

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/components/Snackbar/utils.ts"],"names":[],"mappings":";AACA,OAAO,KAAK,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5D,wBAAgB,sBAAsB,CACpC,SAAS,EAAE,iBAAiB,EAC5B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,EAC3B,OAAO,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,OAAO,CAAC,6CAevC;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM;;;;;;EAQhE;AAED,wBAAgB,iBAAiB,CAC/B,SAAS,EAAE,iBAAiB,EAC5B,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,aA6BpC;AAID,wBAAgB,yBAAyB,CACvC,SAAS,EAAE,iBAAiB,EAC5B,SAAS,EAAE,SAAS,EACpB,kBAAkB,EAAE,OAAO,EAC3B,QAAQ,EAAE;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,WA2CnC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/components/Snackbar/utils.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5D,wBAAgB,sBAAsB,CACpC,SAAS,EAAE,iBAAiB,EAC5B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,EAC3B,OAAO,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,OAAO,CAAC,6CAevC;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM;;;;;;EAQhE;AAED,wBAAgB,iBAAiB,CAC/B,SAAS,EAAE,iBAAiB,EAC5B,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,aA6BpC;AAID,wBAAgB,yBAAyB,CACvC,SAAS,EAAE,iBAAiB,EAC5B,SAAS,EAAE,SAAS,EACpB,kBAAkB,EAAE,OAAO,EAC3B,QAAQ,EAAE;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,WA2CnC"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Snackbar/utils.ts"],"sourcesContent":["import { rubberbandIfOutOfBounds } from '../../lib/animation';\nimport type { ShiftData, SnackbarPlacement } from './types';\n\nexport function resolveOffsetYCssStyle(\n  placement: SnackbarPlacement,\n  style?: React.CSSProperties,\n  offsetY?: React.CSSProperties['inset'],\n) {\n  if (offsetY === undefined) {\n    return style;\n  }\n  switch (placement) {\n    case 'top-start':\n    case 'top':\n    case 'top-end':\n      return { ...style, top: offsetY };\n    case 'bottom-start':\n    case 'bottom':\n    case 'bottom-end':\n      return { ...style, bottom: offsetY };\n  }\n}\n\nexport function getInitialShiftData(width: number, height: number) {\n  return {\n    shifted: false,\n    x: 0,\n    y: 0,\n    width,\n    height,\n  };\n}\n\nexport function getMovedShiftData(\n  placement: SnackbarPlacement,\n  shiftData: ShiftData,\n  nextShift: { x: number; y: number },\n) {\n  switch (placement) {\n    case 'top-start':\n    case 'bottom-start':\n      shiftData.x = rubberbandIfOutOfBounds(nextShift.x, -shiftData.width, 0);\n      break;\n    case 'top-end':\n    case 'bottom-end':\n      shiftData.x = rubberbandIfOutOfBounds(nextShift.x, 0, shiftData.width);\n      break;\n  }\n\n  switch (placement) {\n    case 'top-start':\n    case 'top':\n    case 'top-end':\n      shiftData.y = rubberbandIfOutOfBounds(nextShift.y, -shiftData.height, 0);\n      break;\n    case 'bottom-start':\n    case 'bottom':\n    case 'bottom-end':\n      shiftData.y = rubberbandIfOutOfBounds(nextShift.y, 0, shiftData.height);\n      break;\n  }\n\n  shiftData.shifted = true;\n\n  return shiftData;\n}\n\nconst MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE = 200;\n\nexport function shouldBeClosedByShiftData(\n  placement: SnackbarPlacement,\n  shiftData: ShiftData,\n  relativeClientRect: DOMRect,\n  velocity: { x: number; y: number },\n) {\n  if (!shiftData.shifted) {\n    return false;\n  }\n  const shouldBeClosedThreshold = { x: false, y: false };\n  const shouldBeClosedByVelocity = { x: false, y: false };\n\n  switch (placement) {\n    case 'top-start':\n    case 'bottom-start':\n      shouldBeClosedThreshold.x = relativeClientRect.x < -relativeClientRect.width / 2;\n      shouldBeClosedByVelocity.x = velocity.x < -MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE;\n      break;\n    case 'top-end':\n    case 'bottom-end':\n      shouldBeClosedThreshold.x = relativeClientRect.x > relativeClientRect.width / 2;\n      shouldBeClosedByVelocity.x = velocity.x > MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE;\n      break;\n  }\n\n  switch (placement) {\n    case 'top-start':\n    case 'top':\n    case 'top-end':\n      shouldBeClosedThreshold.y = relativeClientRect.y < -relativeClientRect.height / 2;\n      shouldBeClosedByVelocity.y = velocity.y < -MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE;\n      break;\n    case 'bottom-start':\n    case 'bottom':\n    case 'bottom-end':\n      shouldBeClosedThreshold.y = relativeClientRect.y > relativeClientRect.height / 2;\n      shouldBeClosedByVelocity.y = velocity.y > MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE;\n      break;\n  }\n\n  return (\n    shouldBeClosedThreshold.x ||\n    shouldBeClosedByVelocity.x ||\n    shouldBeClosedThreshold.y ||\n    /* istanbul ignore next: подсвечивает жёлтым и пишет \"branch not covered\" */\n    shouldBeClosedByVelocity.y\n  );\n}\n"],"names":["rubberbandIfOutOfBounds","resolveOffsetYCssStyle","placement","style","offsetY","undefined","top","bottom","getInitialShiftData","width","height","shifted","x","y","getMovedShiftData","shiftData","nextShift","MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE","shouldBeClosedByShiftData","relativeClientRect","velocity","shouldBeClosedThreshold","shouldBeClosedByVelocity"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,uBAAuB,QAAQ,sBAAsB;AAG9D,OAAO,SAASC,uBACdC,SAA4B,EAC5BC,KAA2B,EAC3BC,OAAsC;IAEtC,IAAIA,YAAYC,WAAW;QACzB,OAAOF;IACT;IACA,OAAQD;QACN,KAAK;QACL,KAAK;QACL,KAAK;YACH,OAAO;gBAAE,GAAGC,KAAK;gBAAEG,KAAKF;YAAQ;QAClC,KAAK;QACL,KAAK;QACL,KAAK;YACH,OAAO;gBAAE,GAAGD,KAAK;gBAAEI,QAAQH;YAAQ;IACvC;AACF;AAEA,OAAO,SAASI,oBAAoBC,KAAa,EAAEC,MAAc;IAC/D,OAAO;QACLC,SAAS;QACTC,GAAG;QACHC,GAAG;QACHJ;QACAC;IACF;AACF;AAEA,OAAO,SAASI,kBACdZ,SAA4B,EAC5Ba,SAAoB,EACpBC,SAAmC;IAEnC,OAAQd;QACN,KAAK;QACL,KAAK;YACHa,UAAUH,CAAC,GAAGZ,wBAAwBgB,UAAUJ,CAAC,EAAE,CAACG,UAAUN,KAAK,EAAE;YACrE;QACF,KAAK;QACL,KAAK;YACHM,UAAUH,CAAC,GAAGZ,wBAAwBgB,UAAUJ,CAAC,EAAE,GAAGG,UAAUN,KAAK;YACrE;IACJ;IAEA,OAAQP;QACN,KAAK;QACL,KAAK;QACL,KAAK;YACHa,UAAUF,CAAC,GAAGb,wBAAwBgB,UAAUH,CAAC,EAAE,CAACE,UAAUL,MAAM,EAAE;YACtE;QACF,KAAK;QACL,KAAK;QACL,KAAK;YACHK,UAAUF,CAAC,GAAGb,wBAAwBgB,UAAUH,CAAC,EAAE,GAAGE,UAAUL,MAAM;YACtE;IACJ;IAEAK,UAAUJ,OAAO,GAAG;IAEpB,OAAOI;AACT;AAEA,MAAME,wCAAwC;AAE9C,OAAO,SAASC,0BACdhB,SAA4B,EAC5Ba,SAAoB,EACpBI,kBAA2B,EAC3BC,QAAkC;IAElC,IAAI,CAACL,UAAUJ,OAAO,EAAE;QACtB,OAAO;IACT;IACA,MAAMU,0BAA0B;QAAET,GAAG;QAAOC,GAAG;IAAM;IACrD,MAAMS,2BAA2B;QAAEV,GAAG;QAAOC,GAAG;IAAM;IAEtD,OAAQX;QACN,KAAK;QACL,KAAK;YACHmB,wBAAwBT,CAAC,GAAGO,mBAAmBP,CAAC,GAAG,CAACO,mBAAmBV,KAAK,GAAG;YAC/Ea,yBAAyBV,CAAC,GAAGQ,SAASR,CAAC,GAAG,CAACK;YAC3C;QACF,KAAK;QACL,KAAK;YACHI,wBAAwBT,CAAC,GAAGO,mBAAmBP,CAAC,GAAGO,mBAAmBV,KAAK,GAAG;YAC9Ea,yBAAyBV,CAAC,GAAGQ,SAASR,CAAC,GAAGK;YAC1C;IACJ;IAEA,OAAQf;QACN,KAAK;QACL,KAAK;QACL,KAAK;YACHmB,wBAAwBR,CAAC,GAAGM,mBAAmBN,CAAC,GAAG,CAACM,mBAAmBT,MAAM,GAAG;YAChFY,yBAAyBT,CAAC,GAAGO,SAASP,CAAC,GAAG,CAACI;YAC3C;QACF,KAAK;QACL,KAAK;QACL,KAAK;YACHI,wBAAwBR,CAAC,GAAGM,mBAAmBN,CAAC,GAAGM,mBAAmBT,MAAM,GAAG;YAC/EY,yBAAyBT,CAAC,GAAGO,SAASP,CAAC,GAAGI;YAC1C;IACJ;IAEA,OACEI,wBAAwBT,CAAC,IACzBU,yBAAyBV,CAAC,IAC1BS,wBAAwBR,CAAC,IACzB,0EAA0E,GAC1ES,yBAAyBT,CAAC;AAE9B"}
+{"version":3,"sources":["../../../../src/components/Snackbar/utils.ts"],"sourcesContent":["import { rubberbandIfOutOfBounds } from '../../lib/animation';\nimport type { ShiftData, SnackbarPlacement } from './types';\n\nexport function resolveOffsetYCssStyle(\n  placement: SnackbarPlacement,\n  style?: React.CSSProperties,\n  offsetY?: React.CSSProperties['inset'],\n) {\n  if (offsetY === undefined) {\n    return style;\n  }\n  switch (placement) {\n    case 'top-start':\n    case 'top':\n    case 'top-end':\n      return { ...style, top: offsetY };\n    case 'bottom-start':\n    case 'bottom':\n    case 'bottom-end':\n      return { ...style, bottom: offsetY };\n  }\n}\n\nexport function getInitialShiftData(width: number, height: number) {\n  return {\n    shifted: false,\n    x: 0,\n    y: 0,\n    width,\n    height,\n  };\n}\n\nexport function getMovedShiftData(\n  placement: SnackbarPlacement,\n  shiftData: ShiftData,\n  nextShift: { x: number; y: number },\n) {\n  switch (placement) {\n    case 'top-start':\n    case 'bottom-start':\n      shiftData.x = rubberbandIfOutOfBounds(nextShift.x, -shiftData.width, 0);\n      break;\n    case 'top-end':\n    case 'bottom-end':\n      shiftData.x = rubberbandIfOutOfBounds(nextShift.x, 0, shiftData.width);\n      break;\n  }\n\n  switch (placement) {\n    case 'top-start':\n    case 'top':\n    case 'top-end':\n      shiftData.y = rubberbandIfOutOfBounds(nextShift.y, -shiftData.height, 0);\n      break;\n    case 'bottom-start':\n    case 'bottom':\n    case 'bottom-end':\n      shiftData.y = rubberbandIfOutOfBounds(nextShift.y, 0, shiftData.height);\n      break;\n  }\n\n  shiftData.shifted = true;\n\n  return shiftData;\n}\n\nconst MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE = 200;\n\nexport function shouldBeClosedByShiftData(\n  placement: SnackbarPlacement,\n  shiftData: ShiftData,\n  relativeClientRect: DOMRect,\n  velocity: { x: number; y: number },\n) {\n  if (!shiftData.shifted) {\n    return false;\n  }\n  const shouldBeClosedThreshold = { x: false, y: false };\n  const shouldBeClosedByVelocity = { x: false, y: false };\n\n  switch (placement) {\n    case 'top-start':\n    case 'bottom-start':\n      shouldBeClosedThreshold.x = relativeClientRect.x < -relativeClientRect.width / 2;\n      shouldBeClosedByVelocity.x = velocity.x < -MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE;\n      break;\n    case 'top-end':\n    case 'bottom-end':\n      shouldBeClosedThreshold.x = relativeClientRect.x > relativeClientRect.width / 2;\n      shouldBeClosedByVelocity.x = velocity.x > MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE;\n      break;\n  }\n\n  switch (placement) {\n    case 'top-start':\n    case 'top':\n    case 'top-end':\n      shouldBeClosedThreshold.y = relativeClientRect.y < -relativeClientRect.height / 2;\n      shouldBeClosedByVelocity.y = velocity.y < -MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE;\n      break;\n    case 'bottom-start':\n    case 'bottom':\n    case 'bottom-end':\n      shouldBeClosedThreshold.y = relativeClientRect.y > relativeClientRect.height / 2;\n      shouldBeClosedByVelocity.y = velocity.y > MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE;\n      break;\n  }\n\n  return (\n    shouldBeClosedThreshold.x ||\n    shouldBeClosedByVelocity.x ||\n    shouldBeClosedThreshold.y ||\n    /* istanbul ignore next: подсвечивает жёлтым и пишет \"branch not covered\" */\n    shouldBeClosedByVelocity.y\n  );\n}\n"],"names":["rubberbandIfOutOfBounds","resolveOffsetYCssStyle","placement","style","offsetY","undefined","top","bottom","getInitialShiftData","width","height","shifted","x","y","getMovedShiftData","shiftData","nextShift","MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE","shouldBeClosedByShiftData","relativeClientRect","velocity","shouldBeClosedThreshold","shouldBeClosedByVelocity"],"mappings":"AAAA,SAASA,uBAAuB,QAAQ,sBAAsB;AAG9D,OAAO,SAASC,uBACdC,SAA4B,EAC5BC,KAA2B,EAC3BC,OAAsC;IAEtC,IAAIA,YAAYC,WAAW;QACzB,OAAOF;IACT;IACA,OAAQD;QACN,KAAK;QACL,KAAK;QACL,KAAK;YACH,OAAO;gBAAE,GAAGC,KAAK;gBAAEG,KAAKF;YAAQ;QAClC,KAAK;QACL,KAAK;QACL,KAAK;YACH,OAAO;gBAAE,GAAGD,KAAK;gBAAEI,QAAQH;YAAQ;IACvC;AACF;AAEA,OAAO,SAASI,oBAAoBC,KAAa,EAAEC,MAAc;IAC/D,OAAO;QACLC,SAAS;QACTC,GAAG;QACHC,GAAG;QACHJ;QACAC;IACF;AACF;AAEA,OAAO,SAASI,kBACdZ,SAA4B,EAC5Ba,SAAoB,EACpBC,SAAmC;IAEnC,OAAQd;QACN,KAAK;QACL,KAAK;YACHa,UAAUH,CAAC,GAAGZ,wBAAwBgB,UAAUJ,CAAC,EAAE,CAACG,UAAUN,KAAK,EAAE;YACrE;QACF,KAAK;QACL,KAAK;YACHM,UAAUH,CAAC,GAAGZ,wBAAwBgB,UAAUJ,CAAC,EAAE,GAAGG,UAAUN,KAAK;YACrE;IACJ;IAEA,OAAQP;QACN,KAAK;QACL,KAAK;QACL,KAAK;YACHa,UAAUF,CAAC,GAAGb,wBAAwBgB,UAAUH,CAAC,EAAE,CAACE,UAAUL,MAAM,EAAE;YACtE;QACF,KAAK;QACL,KAAK;QACL,KAAK;YACHK,UAAUF,CAAC,GAAGb,wBAAwBgB,UAAUH,CAAC,EAAE,GAAGE,UAAUL,MAAM;YACtE;IACJ;IAEAK,UAAUJ,OAAO,GAAG;IAEpB,OAAOI;AACT;AAEA,MAAME,wCAAwC;AAE9C,OAAO,SAASC,0BACdhB,SAA4B,EAC5Ba,SAAoB,EACpBI,kBAA2B,EAC3BC,QAAkC;IAElC,IAAI,CAACL,UAAUJ,OAAO,EAAE;QACtB,OAAO;IACT;IACA,MAAMU,0BAA0B;QAAET,GAAG;QAAOC,GAAG;IAAM;IACrD,MAAMS,2BAA2B;QAAEV,GAAG;QAAOC,GAAG;IAAM;IAEtD,OAAQX;QACN,KAAK;QACL,KAAK;YACHmB,wBAAwBT,CAAC,GAAGO,mBAAmBP,CAAC,GAAG,CAACO,mBAAmBV,KAAK,GAAG;YAC/Ea,yBAAyBV,CAAC,GAAGQ,SAASR,CAAC,GAAG,CAACK;YAC3C;QACF,KAAK;QACL,KAAK;YACHI,wBAAwBT,CAAC,GAAGO,mBAAmBP,CAAC,GAAGO,mBAAmBV,KAAK,GAAG;YAC9Ea,yBAAyBV,CAAC,GAAGQ,SAASR,CAAC,GAAGK;YAC1C;IACJ;IAEA,OAAQf;QACN,KAAK;QACL,KAAK;QACL,KAAK;YACHmB,wBAAwBR,CAAC,GAAGM,mBAAmBN,CAAC,GAAG,CAACM,mBAAmBT,MAAM,GAAG;YAChFY,yBAAyBT,CAAC,GAAGO,SAASP,CAAC,GAAG,CAACI;YAC3C;QACF,KAAK;QACL,KAAK;QACL,KAAK;YACHI,wBAAwBR,CAAC,GAAGM,mBAAmBN,CAAC,GAAGM,mBAAmBT,MAAM,GAAG;YAC/EY,yBAAyBT,CAAC,GAAGO,SAASP,CAAC,GAAGI;YAC1C;IACJ;IAEA,OACEI,wBAAwBT,CAAC,IACzBU,yBAAyBV,CAAC,IAC1BS,wBAAwBR,CAAC,IACzB,0EAA0E,GAC1ES,yBAAyBT,CAAC;AAE9B"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Spacing/Spacing.tsx"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './Spacing.module.css';\n\nexport const CUSTOM_CSS_TOKEN_FOR_USER_GAP = '--vkui_internal--Spacing_gap';\n\nexport const sizesClassNames = {\n  '3xs': styles['Spacing--3xs'],\n  '2xs': styles['Spacing--2xs'],\n  'xs': styles['Spacing--xs'],\n  's': styles['Spacing--s'],\n  'm': styles['Spacing--m'],\n  'l': styles['Spacing--l'],\n  'xl': styles['Spacing--xl'],\n  '2xl': styles['Spacing--2xl'],\n  '3xl': styles['Spacing--3xl'],\n  '4xl': styles['Spacing--4xl'],\n};\n\nexport type SpacingSize = keyof typeof sizesClassNames;\n\nexport interface SpacingProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Высота спэйсинга\n   */\n  size?: number | SpacingSize;\n}\n/**\n * @see https://vkcom.github.io/VKUI/#/Spacing\n */\nexport const Spacing = ({ size = 'm', style, className, ...restProps }: SpacingProps) => {\n  if (typeof size === 'string') {\n    className = className ? classNames(sizesClassNames[size], className) : sizesClassNames[size];\n  } else {\n    if (style) {\n      // @ts-expect-error: TS7053 В React.CSSProperties не учитывается Custom Properties\n      style[CUSTOM_CSS_TOKEN_FOR_USER_GAP] = size;\n    } else {\n      // @ts-expect-error: TS2353 В React.CSSProperties не учитывается Custom Properties\n      style = { [CUSTOM_CSS_TOKEN_FOR_USER_GAP]: size };\n    }\n  }\n\n  return (\n    <RootComponent\n      {...restProps}\n      style={style}\n      className={className}\n      baseClassName={styles['Spacing']}\n    />\n  );\n};\n"],"names":["classNames","RootComponent","styles","CUSTOM_CSS_TOKEN_FOR_USER_GAP","sizesClassNames","Spacing","size","style","className","restProps","baseClassName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,OAAOC,YAAY,uBAAuB;AAE1C,OAAO,MAAMC,gCAAgC,+BAA+B;AAE5E,OAAO,MAAMC,kBAAkB;IAC7B,OAAOF,MAAM,CAAC,eAAe;IAC7B,OAAOA,MAAM,CAAC,eAAe;IAC7B,MAAMA,MAAM,CAAC,cAAc;IAC3B,KAAKA,MAAM,CAAC,aAAa;IACzB,KAAKA,MAAM,CAAC,aAAa;IACzB,KAAKA,MAAM,CAAC,aAAa;IACzB,MAAMA,MAAM,CAAC,cAAc;IAC3B,OAAOA,MAAM,CAAC,eAAe;IAC7B,OAAOA,MAAM,CAAC,eAAe;IAC7B,OAAOA,MAAM,CAAC,eAAe;AAC/B,EAAE;AAUF;;CAEC,GACD,OAAO,MAAMG,UAAU,CAAC,EAAEC,OAAO,GAAG,EAAEC,KAAK,EAAEC,SAAS,EAAE,GAAGC,WAAyB;IAClF,IAAI,OAAOH,SAAS,UAAU;QAC5BE,YAAYA,YAAYR,WAAWI,eAAe,CAACE,KAAK,EAAEE,aAAaJ,eAAe,CAACE,KAAK;IAC9F,OAAO;QACL,IAAIC,OAAO;YACT,kFAAkF;YAClFA,KAAK,CAACJ,8BAA8B,GAAGG;QACzC,OAAO;YACL,kFAAkF;YAClFC,QAAQ;gBAAE,CAACJ,8BAA8B,EAAEG;YAAK;QAClD;IACF;IAEA,qBACE,KAACL;QACE,GAAGQ,SAAS;QACbF,OAAOA;QACPC,WAAWA;QACXE,eAAeR,MAAM,CAAC,UAAU;;AAGtC,EAAE"}
+{"version":3,"sources":["../../../../src/components/Spacing/Spacing.tsx"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './Spacing.module.css';\n\nexport const CUSTOM_CSS_TOKEN_FOR_USER_GAP = '--vkui_internal--Spacing_gap';\n\nexport const sizesClassNames = {\n  '3xs': styles['Spacing--3xs'],\n  '2xs': styles['Spacing--2xs'],\n  'xs': styles['Spacing--xs'],\n  's': styles['Spacing--s'],\n  'm': styles['Spacing--m'],\n  'l': styles['Spacing--l'],\n  'xl': styles['Spacing--xl'],\n  '2xl': styles['Spacing--2xl'],\n  '3xl': styles['Spacing--3xl'],\n  '4xl': styles['Spacing--4xl'],\n};\n\nexport type SpacingSize = keyof typeof sizesClassNames;\n\nexport interface SpacingProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Высота спэйсинга\n   */\n  size?: number | SpacingSize;\n}\n/**\n * @see https://vkcom.github.io/VKUI/#/Spacing\n */\nexport const Spacing = ({ size = 'm', style, className, ...restProps }: SpacingProps) => {\n  if (typeof size === 'string') {\n    className = className ? classNames(sizesClassNames[size], className) : sizesClassNames[size];\n  } else {\n    if (style) {\n      // @ts-expect-error: TS7053 В React.CSSProperties не учитывается Custom Properties\n      style[CUSTOM_CSS_TOKEN_FOR_USER_GAP] = size;\n    } else {\n      // @ts-expect-error: TS2353 В React.CSSProperties не учитывается Custom Properties\n      style = { [CUSTOM_CSS_TOKEN_FOR_USER_GAP]: size };\n    }\n  }\n\n  return (\n    <RootComponent\n      {...restProps}\n      style={style}\n      className={className}\n      baseClassName={styles['Spacing']}\n    />\n  );\n};\n"],"names":["classNames","RootComponent","styles","CUSTOM_CSS_TOKEN_FOR_USER_GAP","sizesClassNames","Spacing","size","style","className","restProps","baseClassName"],"mappings":";AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,OAAOC,YAAY,uBAAuB;AAE1C,OAAO,MAAMC,gCAAgC,+BAA+B;AAE5E,OAAO,MAAMC,kBAAkB;IAC7B,OAAOF,MAAM,CAAC,eAAe;IAC7B,OAAOA,MAAM,CAAC,eAAe;IAC7B,MAAMA,MAAM,CAAC,cAAc;IAC3B,KAAKA,MAAM,CAAC,aAAa;IACzB,KAAKA,MAAM,CAAC,aAAa;IACzB,KAAKA,MAAM,CAAC,aAAa;IACzB,MAAMA,MAAM,CAAC,cAAc;IAC3B,OAAOA,MAAM,CAAC,eAAe;IAC7B,OAAOA,MAAM,CAAC,eAAe;IAC7B,OAAOA,MAAM,CAAC,eAAe;AAC/B,EAAE;AAUF;;CAEC,GACD,OAAO,MAAMG,UAAU,CAAC,EAAEC,OAAO,GAAG,EAAEC,KAAK,EAAEC,SAAS,EAAE,GAAGC,WAAyB;IAClF,IAAI,OAAOH,SAAS,UAAU;QAC5BE,YAAYA,YAAYR,WAAWI,eAAe,CAACE,KAAK,EAAEE,aAAaJ,eAAe,CAACE,KAAK;IAC9F,OAAO;QACL,IAAIC,OAAO;YACT,kFAAkF;YAClFA,KAAK,CAACJ,8BAA8B,GAAGG;QACzC,OAAO;YACL,kFAAkF;YAClFC,QAAQ;gBAAE,CAACJ,8BAA8B,EAAEG;YAAK;QAClD;IACF;IAEA,qBACE,KAACL;QACE,GAAGQ,SAAS;QACbF,OAAOA;QACPC,WAAWA;QACXE,eAAeR,MAAM,CAAC,UAAU;;AAGtC,EAAE"}

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

@@ -8,6 +8,7 @@
 }
 
 .Spacing--3xs {
+  /* TODO [>=7]: удалить deprecated токен */
   --vkui_internal--Spacing_gap: var(--vkui--spacing_size_3xs);
 }
 

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

@@ -1 +1 @@
-{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../../../src/components/Spinner/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAKxD,MAAM,WAAW,YAAa,SAAQ,yBAAyB,CAAC,eAAe,CAAC;IAC9E,IAAI,CAAC,EAAE,OAAO,GAAG,SAAS,GAAG,QAAQ,GAAG,OAAO,CAAC;IAChD,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED;;GAEG;AACH,eAAO,MAAM,OAAO,iFAMf,YAAY,6CAyChB,CAAC"}
+{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../../../src/components/Spinner/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAKxD,MAAM,WAAW,YAAa,SAAQ,yBAAyB,CAAC,eAAe,CAAC;IAC9E,IAAI,CAAC,EAAE,OAAO,GAAG,SAAS,GAAG,QAAQ,GAAG,OAAO,CAAC;IAChD,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED;;GAEG;AACH,eAAO,MAAM,OAAO,iFAMf,YAAY,6CA0DhB,CAAC"}

package/dist/cssm/components/Spinner/Spinner.js

@@ -2,24 +2,53 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { Icon16Spinner, Icon24Spinner, Icon32Spinner, Icon44Spinner } from '@vkontakte/icons';
 import { hasReactNode } from '@vkontakte/vkjs';
+import { useReducedMotion } from '../../lib/animation';
 import { RootComponent } from '../RootComponent/RootComponent';
 import { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';
 import styles from './Spinner.module.css';
 /**
  * @see https://vkcom.github.io/VKUI/#/Spinner
- */ export const Spinner = /*#__PURE__*/ React.memo(({ size = 'regular', children = 'Загружается...', disableAnimation, ...restProps })=>{
+ */ export const Spinner = /*#__PURE__*/ React.memo(({ size = 'regular', children = 'Загружается...', disableAnimation = false, ...restProps })=>{
+    const isReducedMotion = useReducedMotion();
     const SpinnerIcon = {
         small: Icon16Spinner,
         regular: Icon24Spinner,
         medium: Icon32Spinner,
         large: Icon44Spinner
     }[size];
-    const center = {
-        small: 8,
-        regular: 12,
-        medium: 16,
-        large: 22
-    }[size];
+    let svgAnimateElement = null;
+    const [isReadyForSetSVGAnimateElement, setIsReadyForSetSVGAnimateElement] = React.useState(disableAnimation ? true : false);
+    React.useEffect(function waitReactHydrationBeforeSetSVGAnimateElement() {
+        setIsReadyForSetSVGAnimateElement(true);
+    }, []);
+    if (isReadyForSetSVGAnimateElement && !disableAnimation) {
+        if (isReducedMotion) {
+            svgAnimateElement = /*#__PURE__*/ _jsx("animate", {
+                attributeName: "opacity",
+                keyTimes: "0; 0.5; 1",
+                values: "1; 0.1; 1",
+                begin: "0s",
+                dur: "2s",
+                repeatCount: "indefinite"
+            });
+        } else {
+            const center = {
+                small: 8,
+                regular: 12,
+                medium: 16,
+                large: 22
+            }[size];
+            svgAnimateElement = /*#__PURE__*/ _jsx("animateTransform", {
+                attributeType: "XML",
+                attributeName: "transform",
+                type: "rotate",
+                from: `0 ${center} ${center}`,
+                to: `360 ${center} ${center}`,
+                dur: "0.7s",
+                repeatCount: "indefinite"
+            });
+        }
+    }
     return /*#__PURE__*/ _jsxs(RootComponent, {
         Component: "span",
         role: "status",
@@ -27,17 +56,7 @@ import styles from './Spinner.module.css';
         baseClassName: styles['Spinner'],
         children: [
             /*#__PURE__*/ _jsx(SpinnerIcon, {
-                children: !disableAnimation && // TODO [a11y]: use reduced motion hook?
-                //              https://github.com/VKCOM/VKUI/pull/4673
-                /*#__PURE__*/ _jsx("animateTransform", {
-                    attributeName: "transform",
-                    attributeType: "XML",
-                    type: "rotate",
-                    from: `0 ${center} ${center}`,
-                    to: `360 ${center} ${center}`,
-                    dur: "0.7s",
-                    repeatCount: "indefinite"
-                })
+                children: svgAnimateElement
             }),
             hasReactNode(children) && /*#__PURE__*/ _jsx(VisuallyHidden, {
                 children: children

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Spinner/Spinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Spinner, Icon24Spinner, Icon32Spinner, Icon44Spinner } from '@vkontakte/icons';\nimport { hasReactNode } from '@vkontakte/vkjs';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './Spinner.module.css';\n\nexport interface SpinnerProps extends HTMLAttributesWithRootRef<HTMLSpanElement> {\n  size?: 'small' | 'regular' | 'medium' | 'large';\n  disableAnimation?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Spinner\n */\nexport const Spinner = React.memo(\n  ({\n    size = 'regular',\n    children = 'Загружается...',\n    disableAnimation,\n    ...restProps\n  }: SpinnerProps) => {\n    const SpinnerIcon = {\n      small: Icon16Spinner,\n      regular: Icon24Spinner,\n      medium: Icon32Spinner,\n      large: Icon44Spinner,\n    }[size];\n\n    const center = {\n      small: 8,\n      regular: 12,\n      medium: 16,\n      large: 22,\n    }[size];\n\n    return (\n      <RootComponent\n        Component=\"span\"\n        role=\"status\"\n        {...restProps}\n        baseClassName={styles['Spinner']}\n      >\n        <SpinnerIcon>\n          {!disableAnimation && (\n            // TODO [a11y]: use reduced motion hook?\n            //              https://github.com/VKCOM/VKUI/pull/4673\n            <animateTransform\n              attributeName=\"transform\"\n              attributeType=\"XML\"\n              type=\"rotate\"\n              from={`0 ${center} ${center}`}\n              to={`360 ${center} ${center}`}\n              dur=\"0.7s\"\n              repeatCount=\"indefinite\"\n            />\n          )}\n        </SpinnerIcon>\n        {hasReactNode(children) && <VisuallyHidden>{children}</VisuallyHidden>}\n      </RootComponent>\n    );\n  },\n);\n\nSpinner.displayName = 'Spinner';\n"],"names":["React","Icon16Spinner","Icon24Spinner","Icon32Spinner","Icon44Spinner","hasReactNode","RootComponent","VisuallyHidden","styles","Spinner","memo","size","children","disableAnimation","restProps","SpinnerIcon","small","regular","medium","large","center","Component","role","baseClassName","animateTransform","attributeName","attributeType","type","from","to","dur","repeatCount","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,EAAEC,aAAa,EAAEC,aAAa,EAAEC,aAAa,QAAQ,mBAAmB;AAC9F,SAASC,YAAY,QAAQ,kBAAkB;AAE/C,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,cAAc,QAAQ,mCAAmC;AAClE,OAAOC,YAAY,uBAAuB;AAO1C;;CAEC,GACD,OAAO,MAAMC,wBAAUT,MAAMU,IAAI,CAC/B,CAAC,EACCC,OAAO,SAAS,EAChBC,WAAW,gBAAgB,EAC3BC,gBAAgB,EAChB,GAAGC,WACU;IACb,MAAMC,cAAc;QAClBC,OAAOf;QACPgB,SAASf;QACTgB,QAAQf;QACRgB,OAAOf;IACT,CAAC,CAACO,KAAK;IAEP,MAAMS,SAAS;QACbJ,OAAO;QACPC,SAAS;QACTC,QAAQ;QACRC,OAAO;IACT,CAAC,CAACR,KAAK;IAEP,qBACE,MAACL;QACCe,WAAU;QACVC,MAAK;QACJ,GAAGR,SAAS;QACbS,eAAef,MAAM,CAAC,UAAU;;0BAEhC,KAACO;0BACE,CAACF,oBACA,wCAAwC;gBACxC,uDAAuD;8BACvD,KAACW;oBACCC,eAAc;oBACdC,eAAc;oBACdC,MAAK;oBACLC,MAAM,CAAC,EAAE,EAAER,OAAO,CAAC,EAAEA,OAAO,CAAC;oBAC7BS,IAAI,CAAC,IAAI,EAAET,OAAO,CAAC,EAAEA,OAAO,CAAC;oBAC7BU,KAAI;oBACJC,aAAY;;;YAIjB1B,aAAaO,2BAAa,KAACL;0BAAgBK;;;;AAGlD,GACA;AAEFH,QAAQuB,WAAW,GAAG"}
+{"version":3,"sources":["../../../../src/components/Spinner/Spinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Spinner, Icon24Spinner, Icon32Spinner, Icon44Spinner } from '@vkontakte/icons';\nimport { hasReactNode } from '@vkontakte/vkjs';\nimport { useReducedMotion } from '../../lib/animation';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './Spinner.module.css';\n\nexport interface SpinnerProps extends HTMLAttributesWithRootRef<HTMLSpanElement> {\n  size?: 'small' | 'regular' | 'medium' | 'large';\n  disableAnimation?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Spinner\n */\nexport const Spinner = React.memo(\n  ({\n    size = 'regular',\n    children = 'Загружается...',\n    disableAnimation = false,\n    ...restProps\n  }: SpinnerProps) => {\n    const isReducedMotion = useReducedMotion();\n    const SpinnerIcon = {\n      small: Icon16Spinner,\n      regular: Icon24Spinner,\n      medium: Icon32Spinner,\n      large: Icon44Spinner,\n    }[size];\n    let svgAnimateElement: React.ReactNode = null;\n\n    const [isReadyForSetSVGAnimateElement, setIsReadyForSetSVGAnimateElement] = React.useState(\n      disableAnimation ? true : false,\n    );\n\n    React.useEffect(function waitReactHydrationBeforeSetSVGAnimateElement() {\n      setIsReadyForSetSVGAnimateElement(true);\n    }, []);\n\n    if (isReadyForSetSVGAnimateElement && !disableAnimation) {\n      if (isReducedMotion) {\n        svgAnimateElement = (\n          <animate\n            attributeName=\"opacity\"\n            keyTimes=\"0; 0.5; 1\"\n            values=\"1; 0.1; 1\"\n            begin=\"0s\"\n            dur=\"2s\"\n            repeatCount=\"indefinite\"\n          />\n        );\n      } else {\n        const center = { small: 8, regular: 12, medium: 16, large: 22 }[size];\n        svgAnimateElement = (\n          <animateTransform\n            attributeType=\"XML\"\n            attributeName=\"transform\"\n            type=\"rotate\"\n            from={`0 ${center} ${center}`}\n            to={`360 ${center} ${center}`}\n            dur=\"0.7s\"\n            repeatCount=\"indefinite\"\n          />\n        );\n      }\n    }\n\n    return (\n      <RootComponent\n        Component=\"span\"\n        role=\"status\"\n        {...restProps}\n        baseClassName={styles['Spinner']}\n      >\n        <SpinnerIcon>{svgAnimateElement}</SpinnerIcon>\n        {hasReactNode(children) && <VisuallyHidden>{children}</VisuallyHidden>}\n      </RootComponent>\n    );\n  },\n);\n\nSpinner.displayName = 'Spinner';\n"],"names":["React","Icon16Spinner","Icon24Spinner","Icon32Spinner","Icon44Spinner","hasReactNode","useReducedMotion","RootComponent","VisuallyHidden","styles","Spinner","memo","size","children","disableAnimation","restProps","isReducedMotion","SpinnerIcon","small","regular","medium","large","svgAnimateElement","isReadyForSetSVGAnimateElement","setIsReadyForSetSVGAnimateElement","useState","useEffect","waitReactHydrationBeforeSetSVGAnimateElement","animate","attributeName","keyTimes","values","begin","dur","repeatCount","center","animateTransform","attributeType","type","from","to","Component","role","baseClassName","displayName"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,EAAEC,aAAa,EAAEC,aAAa,EAAEC,aAAa,QAAQ,mBAAmB;AAC9F,SAASC,YAAY,QAAQ,kBAAkB;AAC/C,SAASC,gBAAgB,QAAQ,sBAAsB;AAEvD,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,cAAc,QAAQ,mCAAmC;AAClE,OAAOC,YAAY,uBAAuB;AAO1C;;CAEC,GACD,OAAO,MAAMC,wBAAUV,MAAMW,IAAI,CAC/B,CAAC,EACCC,OAAO,SAAS,EAChBC,WAAW,gBAAgB,EAC3BC,mBAAmB,KAAK,EACxB,GAAGC,WACU;IACb,MAAMC,kBAAkBV;IACxB,MAAMW,cAAc;QAClBC,OAAOjB;QACPkB,SAASjB;QACTkB,QAAQjB;QACRkB,OAAOjB;IACT,CAAC,CAACQ,KAAK;IACP,IAAIU,oBAAqC;IAEzC,MAAM,CAACC,gCAAgCC,kCAAkC,GAAGxB,MAAMyB,QAAQ,CACxFX,mBAAmB,OAAO;IAG5Bd,MAAM0B,SAAS,CAAC,SAASC;QACvBH,kCAAkC;IACpC,GAAG,EAAE;IAEL,IAAID,kCAAkC,CAACT,kBAAkB;QACvD,IAAIE,iBAAiB;YACnBM,kCACE,KAACM;gBACCC,eAAc;gBACdC,UAAS;gBACTC,QAAO;gBACPC,OAAM;gBACNC,KAAI;gBACJC,aAAY;;QAGlB,OAAO;YACL,MAAMC,SAAS;gBAAEjB,OAAO;gBAAGC,SAAS;gBAAIC,QAAQ;gBAAIC,OAAO;YAAG,CAAC,CAACT,KAAK;YACrEU,kCACE,KAACc;gBACCC,eAAc;gBACdR,eAAc;gBACdS,MAAK;gBACLC,MAAM,CAAC,EAAE,EAAEJ,OAAO,CAAC,EAAEA,OAAO,CAAC;gBAC7BK,IAAI,CAAC,IAAI,EAAEL,OAAO,CAAC,EAAEA,OAAO,CAAC;gBAC7BF,KAAI;gBACJC,aAAY;;QAGlB;IACF;IAEA,qBACE,MAAC3B;QACCkC,WAAU;QACVC,MAAK;QACJ,GAAG3B,SAAS;QACb4B,eAAelC,MAAM,CAAC,UAAU;;0BAEhC,KAACQ;0BAAaK;;YACbjB,aAAaQ,2BAAa,KAACL;0BAAgBK;;;;AAGlD,GACA;AAEFH,QAAQkC,WAAW,GAAG"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SplitCol/SplitCol.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useMediaQueries } from '../../hooks/useMediaQueries';\nimport { useObjectMemo } from '../../hooks/useObjectMemo';\nimport { ViewWidth, viewWidthToClassName } from '../../lib/adaptivity';\nimport { matchMediaListAddListener, matchMediaListRemoveListener } from '../../lib/matchMedia';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { SplitColContext } from './SplitColContext';\nimport styles from './SplitCol.module.css';\n\nconst breakpointClassNames = {\n  none: classNames(styles['SplitCol--viewWidth-none'], 'vkuiInternalSplitCol--viewWidth-none'),\n  tabletMinus: styles['SplitCol--viewWidth-tabletMinus'],\n  smallTabletPlus: styles['SplitCol--viewWidth-smallTabletPlus'],\n  tabletPlus: 'vkuiInternalSplitCol--viewWidth-tabletPlus',\n};\n\nfunction useTransitionAnimate(animateProp?: boolean) {\n  const { viewWidth } = useAdaptivity();\n  const [animate, setAnimate] = React.useState(Boolean(animateProp));\n  const mediaQueries = useMediaQueries();\n\n  React.useEffect(() => {\n    if (animateProp !== undefined) {\n      setAnimate(animateProp);\n      return;\n    }\n\n    if (viewWidth !== undefined) {\n      setAnimate(viewWidth < ViewWidth.TABLET);\n      return;\n    }\n\n    // eslint-disable-next-line no-restricted-properties\n    const listener = () => setAnimate(!mediaQueries.smallTabletPlus.matches);\n    listener();\n\n    matchMediaListAddListener(mediaQueries.smallTabletPlus, listener);\n    return () => {\n      matchMediaListRemoveListener(mediaQueries.smallTabletPlus, listener);\n    };\n  }, [animateProp, viewWidth, mediaQueries]);\n\n  return animate;\n}\n\nexport interface SplitColProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  width?: number | string;\n  maxWidth?: number | string;\n  minWidth?: number | string;\n  /**\n   * Если false, то переходы между Panel происходят без анимации\n   */\n  animate?: boolean;\n  /**\n   * Если true, то добавляются боковые отступы фиксированной величины при ширине больше чем `smallTablet`\n   */\n  autoSpaced?: boolean;\n  fixed?: boolean;\n  /**\n   * Если true, то ширина контейнера становится 100% при ширине меньше чем `tablet`\n   */\n  stretchedOnMobile?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SplitCol\n */\nexport const SplitCol = (props: SplitColProps) => {\n  const {\n    children,\n    width,\n    maxWidth,\n    minWidth,\n    animate: animateProp,\n    fixed,\n    style,\n    autoSpaced,\n    stretchedOnMobile,\n    getRootRef,\n    ...restProps\n  } = props;\n  const baseRef = useExternRef(getRootRef);\n  const { viewWidth } = useAdaptivity();\n  const animate = useTransitionAnimate(animateProp);\n\n  const contextValue = useObjectMemo({\n    colRef: baseRef,\n    animate,\n  });\n\n  return (\n    <RootComponent\n      {...restProps}\n      style={{\n        ...style,\n        width: width,\n        maxWidth: maxWidth,\n        minWidth: minWidth,\n      }}\n      getRootRef={baseRef}\n      baseClassName={classNames(\n        styles['SplitCol'],\n        viewWidthToClassName(breakpointClassNames, viewWidth),\n        autoSpaced &&\n          classNames(styles['SplitCol--spaced-auto'], 'vkuiInternalSplitCol--spaced-auto'),\n        fixed && styles['SplitCol--fixed'],\n        stretchedOnMobile && styles['SplitCol--stretched-on-mobile'],\n      )}\n    >\n      <SplitColContext.Provider value={contextValue}>\n        {fixed ? <div className={styles['SplitCol__fixedInner']}>{children}</div> : children}\n      </SplitColContext.Provider>\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useExternRef","useMediaQueries","useObjectMemo","ViewWidth","viewWidthToClassName","matchMediaListAddListener","matchMediaListRemoveListener","RootComponent","SplitColContext","styles","breakpointClassNames","none","tabletMinus","smallTabletPlus","tabletPlus","useTransitionAnimate","animateProp","viewWidth","animate","setAnimate","useState","Boolean","mediaQueries","useEffect","undefined","TABLET","listener","matches","SplitCol","props","children","width","maxWidth","minWidth","fixed","style","autoSpaced","stretchedOnMobile","getRootRef","restProps","baseRef","contextValue","colRef","baseClassName","Provider","value","div","className"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,eAAe,QAAQ,8BAA8B;AAC9D,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,SAAS,EAAEC,oBAAoB,QAAQ,uBAAuB;AACvE,SAASC,yBAAyB,EAAEC,4BAA4B,QAAQ,uBAAuB;AAE/F,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,eAAe,QAAQ,oBAAoB;AACpD,OAAOC,YAAY,wBAAwB;AAE3C,MAAMC,uBAAuB;IAC3BC,MAAMb,WAAWW,MAAM,CAAC,2BAA2B,EAAE;IACrDG,aAAaH,MAAM,CAAC,kCAAkC;IACtDI,iBAAiBJ,MAAM,CAAC,sCAAsC;IAC9DK,YAAY;AACd;AAEA,SAASC,qBAAqBC,WAAqB;IACjD,MAAM,EAAEC,SAAS,EAAE,GAAGlB;IACtB,MAAM,CAACmB,SAASC,WAAW,GAAGtB,MAAMuB,QAAQ,CAACC,QAAQL;IACrD,MAAMM,eAAerB;IAErBJ,MAAM0B,SAAS,CAAC;QACd,IAAIP,gBAAgBQ,WAAW;YAC7BL,WAAWH;YACX;QACF;QAEA,IAAIC,cAAcO,WAAW;YAC3BL,WAAWF,YAAYd,UAAUsB,MAAM;YACvC;QACF;QAEA,oDAAoD;QACpD,MAAMC,WAAW,IAAMP,WAAW,CAACG,aAAaT,eAAe,CAACc,OAAO;QACvED;QAEArB,0BAA0BiB,aAAaT,eAAe,EAAEa;QACxD,OAAO;YACLpB,6BAA6BgB,aAAaT,eAAe,EAAEa;QAC7D;IACF,GAAG;QAACV;QAAaC;QAAWK;KAAa;IAEzC,OAAOJ;AACT;AAqBA;;CAEC,GACD,OAAO,MAAMU,WAAW,CAACC;IACvB,MAAM,EACJC,QAAQ,EACRC,KAAK,EACLC,QAAQ,EACRC,QAAQ,EACRf,SAASF,WAAW,EACpBkB,KAAK,EACLC,KAAK,EACLC,UAAU,EACVC,iBAAiB,EACjBC,UAAU,EACV,GAAGC,WACJ,GAAGV;IACJ,MAAMW,UAAUxC,aAAasC;IAC7B,MAAM,EAAErB,SAAS,EAAE,GAAGlB;IACtB,MAAMmB,UAAUH,qBAAqBC;IAErC,MAAMyB,eAAevC,cAAc;QACjCwC,QAAQF;QACRtB;IACF;IAEA,qBACE,KAACX;QACE,GAAGgC,SAAS;QACbJ,OAAO;YACL,GAAGA,KAAK;YACRJ,OAAOA;YACPC,UAAUA;YACVC,UAAUA;QACZ;QACAK,YAAYE;QACZG,eAAe7C,WACbW,MAAM,CAAC,WAAW,EAClBL,qBAAqBM,sBAAsBO,YAC3CmB,cACEtC,WAAWW,MAAM,CAAC,wBAAwB,EAAE,sCAC9CyB,SAASzB,MAAM,CAAC,kBAAkB,EAClC4B,qBAAqB5B,MAAM,CAAC,gCAAgC;kBAG9D,cAAA,KAACD,gBAAgBoC,QAAQ;YAACC,OAAOJ;sBAC9BP,sBAAQ,KAACY;gBAAIC,WAAWtC,MAAM,CAAC,uBAAuB;0BAAGqB;iBAAkBA;;;AAIpF,EAAE"}
+{"version":3,"sources":["../../../../src/components/SplitCol/SplitCol.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useMediaQueries } from '../../hooks/useMediaQueries';\nimport { useObjectMemo } from '../../hooks/useObjectMemo';\nimport { ViewWidth, viewWidthToClassName } from '../../lib/adaptivity';\nimport { matchMediaListAddListener, matchMediaListRemoveListener } from '../../lib/matchMedia';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { SplitColContext } from './SplitColContext';\nimport styles from './SplitCol.module.css';\n\nconst breakpointClassNames = {\n  none: classNames(styles['SplitCol--viewWidth-none'], 'vkuiInternalSplitCol--viewWidth-none'),\n  tabletMinus: styles['SplitCol--viewWidth-tabletMinus'],\n  smallTabletPlus: styles['SplitCol--viewWidth-smallTabletPlus'],\n  tabletPlus: 'vkuiInternalSplitCol--viewWidth-tabletPlus',\n};\n\nfunction useTransitionAnimate(animateProp?: boolean) {\n  const { viewWidth } = useAdaptivity();\n  const [animate, setAnimate] = React.useState(Boolean(animateProp));\n  const mediaQueries = useMediaQueries();\n\n  React.useEffect(() => {\n    if (animateProp !== undefined) {\n      setAnimate(animateProp);\n      return;\n    }\n\n    if (viewWidth !== undefined) {\n      setAnimate(viewWidth < ViewWidth.TABLET);\n      return;\n    }\n\n    // eslint-disable-next-line no-restricted-properties\n    const listener = () => setAnimate(!mediaQueries.smallTabletPlus.matches);\n    listener();\n\n    matchMediaListAddListener(mediaQueries.smallTabletPlus, listener);\n    return () => {\n      matchMediaListRemoveListener(mediaQueries.smallTabletPlus, listener);\n    };\n  }, [animateProp, viewWidth, mediaQueries]);\n\n  return animate;\n}\n\nexport interface SplitColProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  width?: number | string;\n  maxWidth?: number | string;\n  minWidth?: number | string;\n  /**\n   * Если false, то переходы между Panel происходят без анимации\n   */\n  animate?: boolean;\n  /**\n   * Если true, то добавляются боковые отступы фиксированной величины при ширине больше чем `smallTablet`\n   */\n  autoSpaced?: boolean;\n  fixed?: boolean;\n  /**\n   * Если true, то ширина контейнера становится 100% при ширине меньше чем `tablet`\n   */\n  stretchedOnMobile?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SplitCol\n */\nexport const SplitCol = (props: SplitColProps) => {\n  const {\n    children,\n    width,\n    maxWidth,\n    minWidth,\n    animate: animateProp,\n    fixed,\n    style,\n    autoSpaced,\n    stretchedOnMobile,\n    getRootRef,\n    ...restProps\n  } = props;\n  const baseRef = useExternRef(getRootRef);\n  const { viewWidth } = useAdaptivity();\n  const animate = useTransitionAnimate(animateProp);\n\n  const contextValue = useObjectMemo({\n    colRef: baseRef,\n    animate,\n  });\n\n  return (\n    <RootComponent\n      {...restProps}\n      style={{\n        ...style,\n        width: width,\n        maxWidth: maxWidth,\n        minWidth: minWidth,\n      }}\n      getRootRef={baseRef}\n      baseClassName={classNames(\n        styles['SplitCol'],\n        viewWidthToClassName(breakpointClassNames, viewWidth),\n        autoSpaced &&\n          classNames(styles['SplitCol--spaced-auto'], 'vkuiInternalSplitCol--spaced-auto'),\n        fixed && styles['SplitCol--fixed'],\n        stretchedOnMobile && styles['SplitCol--stretched-on-mobile'],\n      )}\n    >\n      <SplitColContext.Provider value={contextValue}>\n        {fixed ? <div className={styles['SplitCol__fixedInner']}>{children}</div> : children}\n      </SplitColContext.Provider>\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useExternRef","useMediaQueries","useObjectMemo","ViewWidth","viewWidthToClassName","matchMediaListAddListener","matchMediaListRemoveListener","RootComponent","SplitColContext","styles","breakpointClassNames","none","tabletMinus","smallTabletPlus","tabletPlus","useTransitionAnimate","animateProp","viewWidth","animate","setAnimate","useState","Boolean","mediaQueries","useEffect","undefined","TABLET","listener","matches","SplitCol","props","children","width","maxWidth","minWidth","fixed","style","autoSpaced","stretchedOnMobile","getRootRef","restProps","baseRef","contextValue","colRef","baseClassName","Provider","value","div","className"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,eAAe,QAAQ,8BAA8B;AAC9D,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,SAAS,EAAEC,oBAAoB,QAAQ,uBAAuB;AACvE,SAASC,yBAAyB,EAAEC,4BAA4B,QAAQ,uBAAuB;AAE/F,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,eAAe,QAAQ,oBAAoB;AACpD,OAAOC,YAAY,wBAAwB;AAE3C,MAAMC,uBAAuB;IAC3BC,MAAMb,WAAWW,MAAM,CAAC,2BAA2B,EAAE;IACrDG,aAAaH,MAAM,CAAC,kCAAkC;IACtDI,iBAAiBJ,MAAM,CAAC,sCAAsC;IAC9DK,YAAY;AACd;AAEA,SAASC,qBAAqBC,WAAqB;IACjD,MAAM,EAAEC,SAAS,EAAE,GAAGlB;IACtB,MAAM,CAACmB,SAASC,WAAW,GAAGtB,MAAMuB,QAAQ,CAACC,QAAQL;IACrD,MAAMM,eAAerB;IAErBJ,MAAM0B,SAAS,CAAC;QACd,IAAIP,gBAAgBQ,WAAW;YAC7BL,WAAWH;YACX;QACF;QAEA,IAAIC,cAAcO,WAAW;YAC3BL,WAAWF,YAAYd,UAAUsB,MAAM;YACvC;QACF;QAEA,oDAAoD;QACpD,MAAMC,WAAW,IAAMP,WAAW,CAACG,aAAaT,eAAe,CAACc,OAAO;QACvED;QAEArB,0BAA0BiB,aAAaT,eAAe,EAAEa;QACxD,OAAO;YACLpB,6BAA6BgB,aAAaT,eAAe,EAAEa;QAC7D;IACF,GAAG;QAACV;QAAaC;QAAWK;KAAa;IAEzC,OAAOJ;AACT;AAqBA;;CAEC,GACD,OAAO,MAAMU,WAAW,CAACC;IACvB,MAAM,EACJC,QAAQ,EACRC,KAAK,EACLC,QAAQ,EACRC,QAAQ,EACRf,SAASF,WAAW,EACpBkB,KAAK,EACLC,KAAK,EACLC,UAAU,EACVC,iBAAiB,EACjBC,UAAU,EACV,GAAGC,WACJ,GAAGV;IACJ,MAAMW,UAAUxC,aAAasC;IAC7B,MAAM,EAAErB,SAAS,EAAE,GAAGlB;IACtB,MAAMmB,UAAUH,qBAAqBC;IAErC,MAAMyB,eAAevC,cAAc;QACjCwC,QAAQF;QACRtB;IACF;IAEA,qBACE,KAACX;QACE,GAAGgC,SAAS;QACbJ,OAAO;YACL,GAAGA,KAAK;YACRJ,OAAOA;YACPC,UAAUA;YACVC,UAAUA;QACZ;QACAK,YAAYE;QACZG,eAAe7C,WACbW,MAAM,CAAC,WAAW,EAClBL,qBAAqBM,sBAAsBO,YAC3CmB,cACEtC,WAAWW,MAAM,CAAC,wBAAwB,EAAE,sCAC9CyB,SAASzB,MAAM,CAAC,kBAAkB,EAClC4B,qBAAqB5B,MAAM,CAAC,gCAAgC;kBAG9D,cAAA,KAACD,gBAAgBoC,QAAQ;YAACC,OAAOJ;sBAC9BP,sBAAQ,KAACY;gBAAIC,WAAWtC,MAAM,CAAC,uBAAuB;0BAAGqB;iBAAkBA;;;AAIpF,EAAE"}

package/dist/cssm/components/SplitCol/SplitColContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SplitCol/SplitColContext.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport interface SplitColContextProps {\n  colRef: React.RefObject<HTMLDivElement> | null;\n  animate: boolean;\n}\n\nexport const SplitColContext = React.createContext<SplitColContextProps>({\n  colRef: null,\n  animate: true,\n});\n\nexport const useSplitCol = () => React.useContext(SplitColContext);\n"],"names":["React","SplitColContext","createContext","colRef","animate","useSplitCol","useContext"],"rangeMappings":";;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAO/B,OAAO,MAAMC,gCAAkBD,MAAME,aAAa,CAAuB;IACvEC,QAAQ;IACRC,SAAS;AACX,GAAG;AAEH,OAAO,MAAMC,cAAc,IAAML,MAAMM,UAAU,CAACL,iBAAiB"}
+{"version":3,"sources":["../../../../src/components/SplitCol/SplitColContext.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport interface SplitColContextProps {\n  colRef: React.RefObject<HTMLDivElement> | null;\n  animate: boolean;\n}\n\nexport const SplitColContext = React.createContext<SplitColContextProps>({\n  colRef: null,\n  animate: true,\n});\n\nexport const useSplitCol = () => React.useContext(SplitColContext);\n"],"names":["React","SplitColContext","createContext","colRef","animate","useSplitCol","useContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAO/B,OAAO,MAAMC,gCAAkBD,MAAME,aAAa,CAAuB;IACvEC,QAAQ;IACRC,SAAS;AACX,GAAG;AAEH,OAAO,MAAMC,cAAc,IAAML,MAAMM,UAAU,CAACL,iBAAiB"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SplitLayout/SplitLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HasRef, HTMLAttributesWithRootRef } from '../../types';\nimport { PopoutRoot } from '../PopoutRoot/PopoutRoot';\nimport styles from './SplitLayout.module.css';\n\nexport interface SplitLayoutProps\n  extends HTMLAttributesWithRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * Свойство для отрисовки `Alert`, `ActionSheet` и `ScreenSpinner`.\n   */\n  popout?: React.ReactNode;\n  /**\n   * Свойство для отрисовки `ModalRoot`.\n   */\n  modal?: React.ReactNode;\n  header?: React.ReactNode;\n  /**\n   * Центрирует контент.\n   */\n  center?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SplitLayout\n */\nexport const SplitLayout = ({\n  popout,\n  modal,\n  header,\n  children,\n  getRootRef,\n  getRef,\n  className,\n  center,\n  ...restProps\n}: SplitLayoutProps) => {\n  const platform = usePlatform();\n\n  return (\n    <PopoutRoot\n      className={classNames(\n        styles['SplitLayout'],\n        platform === 'ios' && styles['SplitLayout--ios'],\n      )}\n      popout={popout}\n      modal={modal}\n      getRootRef={getRootRef}\n    >\n      {header}\n      <div\n        {...restProps}\n        ref={getRef}\n        className={classNames(\n          styles['SplitLayout__inner'],\n          !!header && styles['SplitLayout__inner--header'],\n          center && styles['SplitLayout__inner--center'],\n          className,\n        )}\n      >\n        {children}\n      </div>\n    </PopoutRoot>\n  );\n};\n"],"names":["React","classNames","usePlatform","PopoutRoot","styles","SplitLayout","popout","modal","header","children","getRootRef","getRef","className","center","restProps","platform","div","ref"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,0BAA0B;AAEtD,SAASC,UAAU,QAAQ,2BAA2B;AACtD,OAAOC,YAAY,2BAA2B;AAoB9C;;CAEC,GACD,OAAO,MAAMC,cAAc,CAAC,EAC1BC,MAAM,EACNC,KAAK,EACLC,MAAM,EACNC,QAAQ,EACRC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,MAAM,EACN,GAAGC,WACc;IACjB,MAAMC,WAAWb;IAEjB,qBACE,MAACC;QACCS,WAAWX,WACTG,MAAM,CAAC,cAAc,EACrBW,aAAa,SAASX,MAAM,CAAC,mBAAmB;QAElDE,QAAQA;QACRC,OAAOA;QACPG,YAAYA;;YAEXF;0BACD,KAACQ;gBACE,GAAGF,SAAS;gBACbG,KAAKN;gBACLC,WAAWX,WACTG,MAAM,CAAC,qBAAqB,EAC5B,CAAC,CAACI,UAAUJ,MAAM,CAAC,6BAA6B,EAChDS,UAAUT,MAAM,CAAC,6BAA6B,EAC9CQ;0BAGDH;;;;AAIT,EAAE"}
+{"version":3,"sources":["../../../../src/components/SplitLayout/SplitLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HasRef, HTMLAttributesWithRootRef } from '../../types';\nimport { PopoutRoot } from '../PopoutRoot/PopoutRoot';\nimport styles from './SplitLayout.module.css';\n\nexport interface SplitLayoutProps\n  extends HTMLAttributesWithRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * Свойство для отрисовки `Alert`, `ActionSheet` и `ScreenSpinner`.\n   */\n  popout?: React.ReactNode;\n  /**\n   * Свойство для отрисовки `ModalRoot`.\n   */\n  modal?: React.ReactNode;\n  header?: React.ReactNode;\n  /**\n   * Центрирует контент.\n   */\n  center?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SplitLayout\n */\nexport const SplitLayout = ({\n  popout,\n  modal,\n  header,\n  children,\n  getRootRef,\n  getRef,\n  className,\n  center,\n  ...restProps\n}: SplitLayoutProps) => {\n  const platform = usePlatform();\n\n  return (\n    <PopoutRoot\n      className={classNames(\n        styles['SplitLayout'],\n        platform === 'ios' && styles['SplitLayout--ios'],\n      )}\n      popout={popout}\n      modal={modal}\n      getRootRef={getRootRef}\n    >\n      {header}\n      <div\n        {...restProps}\n        ref={getRef}\n        className={classNames(\n          styles['SplitLayout__inner'],\n          !!header && styles['SplitLayout__inner--header'],\n          center && styles['SplitLayout__inner--center'],\n          className,\n        )}\n      >\n        {children}\n      </div>\n    </PopoutRoot>\n  );\n};\n"],"names":["React","classNames","usePlatform","PopoutRoot","styles","SplitLayout","popout","modal","header","children","getRootRef","getRef","className","center","restProps","platform","div","ref"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,0BAA0B;AAEtD,SAASC,UAAU,QAAQ,2BAA2B;AACtD,OAAOC,YAAY,2BAA2B;AAoB9C;;CAEC,GACD,OAAO,MAAMC,cAAc,CAAC,EAC1BC,MAAM,EACNC,KAAK,EACLC,MAAM,EACNC,QAAQ,EACRC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,MAAM,EACN,GAAGC,WACc;IACjB,MAAMC,WAAWb;IAEjB,qBACE,MAACC;QACCS,WAAWX,WACTG,MAAM,CAAC,cAAc,EACrBW,aAAa,SAASX,MAAM,CAAC,mBAAmB;QAElDE,QAAQA;QACRC,OAAOA;QACPG,YAAYA;;YAEXF;0BACD,KAACQ;gBACE,GAAGF,SAAS;gBACbG,KAAKN;gBACLC,WAAWX,WACTG,MAAM,CAAC,qBAAqB,EAC5B,CAAC,CAACI,UAAUJ,MAAM,CAAC,6BAA6B,EAChDS,UAAUT,MAAM,CAAC,6BAA6B,EAC9CQ;0BAGDH;;;;AAIT,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SubnavigationBar/SubnavigationBar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { hasReactNode } from '@vkontakte/vkjs';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport {\n  HorizontalScroll,\n  HorizontalScrollProps,\n  ScrollPositionHandler,\n} from '../HorizontalScroll/HorizontalScroll';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './SubnavigationBar.module.css';\n\nexport interface SubnavigationBarProps\n  extends HTMLAttributesWithRootRef<HTMLDivElement>,\n    Pick<\n      HorizontalScrollProps,\n      'showArrows' | 'getScrollToLeft' | 'getScrollToRight' | 'scrollAnimationDuration'\n    > {\n  mode?: 'fixed' | 'overflow';\n}\n\nconst defaultScrollToLeft: ScrollPositionHandler = (x) => x - 240;\n\nconst defaultScrollToRight: ScrollPositionHandler = (x) => x + 240;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SubnavigationBar\n */\nexport const SubnavigationBar = ({\n  mode = 'overflow',\n  children,\n  showArrows = true,\n  getScrollToLeft = defaultScrollToLeft,\n  getScrollToRight = defaultScrollToRight,\n  scrollAnimationDuration,\n  ...restProps\n}: SubnavigationBarProps) => {\n  let ScrollWrapper: React.ElementType;\n  let scrollWrapperProps = {};\n\n  if (mode === 'fixed') {\n    ScrollWrapper = 'div';\n  } else {\n    ScrollWrapper = HorizontalScroll;\n    scrollWrapperProps = {\n      showArrows,\n      getScrollToLeft,\n      getScrollToRight,\n      scrollAnimationDuration,\n    };\n  }\n\n  return (\n    <RootComponent\n      baseClassName={mode === 'fixed' && styles['SubnavigationBar--mode-fixed']}\n      {...restProps}\n    >\n      <ScrollWrapper className={styles['SubnavigationBar__in']} {...scrollWrapperProps}>\n        <ul className={styles['SubnavigationBar__scrollIn']}>\n          {React.Children.map(children, (child, idx) =>\n            hasReactNode(child) ? (\n              <li key={idx} className={styles['SubnavigationBar__item']}>\n                {child}\n              </li>\n            ) : null,\n          )}\n        </ul>\n      </ScrollWrapper>\n    </RootComponent>\n  );\n};\n"],"names":["React","hasReactNode","HorizontalScroll","RootComponent","styles","defaultScrollToLeft","x","defaultScrollToRight","SubnavigationBar","mode","children","showArrows","getScrollToLeft","getScrollToRight","scrollAnimationDuration","restProps","ScrollWrapper","scrollWrapperProps","baseClassName","className","ul","Children","map","child","idx","li"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,kBAAkB;AAE/C,SACEC,gBAAgB,QAGX,uCAAuC;AAC9C,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,OAAOC,YAAY,gCAAgC;AAWnD,MAAMC,sBAA6C,CAACC,IAAMA,IAAI;AAE9D,MAAMC,uBAA8C,CAACD,IAAMA,IAAI;AAE/D;;CAEC,GACD,OAAO,MAAME,mBAAmB,CAAC,EAC/BC,OAAO,UAAU,EACjBC,QAAQ,EACRC,aAAa,IAAI,EACjBC,kBAAkBP,mBAAmB,EACrCQ,mBAAmBN,oBAAoB,EACvCO,uBAAuB,EACvB,GAAGC,WACmB;IACtB,IAAIC;IACJ,IAAIC,qBAAqB,CAAC;IAE1B,IAAIR,SAAS,SAAS;QACpBO,gBAAgB;IAClB,OAAO;QACLA,gBAAgBd;QAChBe,qBAAqB;YACnBN;YACAC;YACAC;YACAC;QACF;IACF;IAEA,qBACE,KAACX;QACCe,eAAeT,SAAS,WAAWL,MAAM,CAAC,+BAA+B;QACxE,GAAGW,SAAS;kBAEb,cAAA,KAACC;YAAcG,WAAWf,MAAM,CAAC,uBAAuB;YAAG,GAAGa,kBAAkB;sBAC9E,cAAA,KAACG;gBAAGD,WAAWf,MAAM,CAAC,6BAA6B;0BAChDJ,MAAMqB,QAAQ,CAACC,GAAG,CAACZ,UAAU,CAACa,OAAOC,MACpCvB,aAAasB,uBACX,KAACE;wBAAaN,WAAWf,MAAM,CAAC,yBAAyB;kCACtDmB;uBADMC,OAGP;;;;AAMhB,EAAE"}
+{"version":3,"sources":["../../../../src/components/SubnavigationBar/SubnavigationBar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { hasReactNode } from '@vkontakte/vkjs';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport {\n  HorizontalScroll,\n  HorizontalScrollProps,\n  ScrollPositionHandler,\n} from '../HorizontalScroll/HorizontalScroll';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './SubnavigationBar.module.css';\n\nexport interface SubnavigationBarProps\n  extends HTMLAttributesWithRootRef<HTMLDivElement>,\n    Pick<\n      HorizontalScrollProps,\n      'showArrows' | 'getScrollToLeft' | 'getScrollToRight' | 'scrollAnimationDuration'\n    > {\n  mode?: 'fixed' | 'overflow';\n}\n\nconst defaultScrollToLeft: ScrollPositionHandler = (x) => x - 240;\n\nconst defaultScrollToRight: ScrollPositionHandler = (x) => x + 240;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SubnavigationBar\n */\nexport const SubnavigationBar = ({\n  mode = 'overflow',\n  children,\n  showArrows = true,\n  getScrollToLeft = defaultScrollToLeft,\n  getScrollToRight = defaultScrollToRight,\n  scrollAnimationDuration,\n  ...restProps\n}: SubnavigationBarProps) => {\n  let ScrollWrapper: React.ElementType;\n  let scrollWrapperProps = {};\n\n  if (mode === 'fixed') {\n    ScrollWrapper = 'div';\n  } else {\n    ScrollWrapper = HorizontalScroll;\n    scrollWrapperProps = {\n      showArrows,\n      getScrollToLeft,\n      getScrollToRight,\n      scrollAnimationDuration,\n    };\n  }\n\n  return (\n    <RootComponent\n      baseClassName={mode === 'fixed' && styles['SubnavigationBar--mode-fixed']}\n      {...restProps}\n    >\n      <ScrollWrapper className={styles['SubnavigationBar__in']} {...scrollWrapperProps}>\n        <ul className={styles['SubnavigationBar__scrollIn']}>\n          {React.Children.map(children, (child, idx) =>\n            hasReactNode(child) ? (\n              <li key={idx} className={styles['SubnavigationBar__item']}>\n                {child}\n              </li>\n            ) : null,\n          )}\n        </ul>\n      </ScrollWrapper>\n    </RootComponent>\n  );\n};\n"],"names":["React","hasReactNode","HorizontalScroll","RootComponent","styles","defaultScrollToLeft","x","defaultScrollToRight","SubnavigationBar","mode","children","showArrows","getScrollToLeft","getScrollToRight","scrollAnimationDuration","restProps","ScrollWrapper","scrollWrapperProps","baseClassName","className","ul","Children","map","child","idx","li"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,kBAAkB;AAE/C,SACEC,gBAAgB,QAGX,uCAAuC;AAC9C,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,OAAOC,YAAY,gCAAgC;AAWnD,MAAMC,sBAA6C,CAACC,IAAMA,IAAI;AAE9D,MAAMC,uBAA8C,CAACD,IAAMA,IAAI;AAE/D;;CAEC,GACD,OAAO,MAAME,mBAAmB,CAAC,EAC/BC,OAAO,UAAU,EACjBC,QAAQ,EACRC,aAAa,IAAI,EACjBC,kBAAkBP,mBAAmB,EACrCQ,mBAAmBN,oBAAoB,EACvCO,uBAAuB,EACvB,GAAGC,WACmB;IACtB,IAAIC;IACJ,IAAIC,qBAAqB,CAAC;IAE1B,IAAIR,SAAS,SAAS;QACpBO,gBAAgB;IAClB,OAAO;QACLA,gBAAgBd;QAChBe,qBAAqB;YACnBN;YACAC;YACAC;YACAC;QACF;IACF;IAEA,qBACE,KAACX;QACCe,eAAeT,SAAS,WAAWL,MAAM,CAAC,+BAA+B;QACxE,GAAGW,SAAS;kBAEb,cAAA,KAACC;YAAcG,WAAWf,MAAM,CAAC,uBAAuB;YAAG,GAAGa,kBAAkB;sBAC9E,cAAA,KAACG;gBAAGD,WAAWf,MAAM,CAAC,6BAA6B;0BAChDJ,MAAMqB,QAAQ,CAACC,GAAG,CAACZ,UAAU,CAACa,OAAOC,MACpCvB,aAAasB,uBACX,KAACE;wBAAaN,WAAWf,MAAM,CAAC,yBAAyB;kCACtDmB;uBADMC,OAGP;;;;AAMhB,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SubnavigationButton/SubnavigationButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Dropdown } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { HasChildren, HasComponent } from '../../types';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './SubnavigationButton.module.css';\n\nconst appearanceStyles = {\n  accent: styles['SubnavigationButton--appearance-accent'],\n  neutral: styles['SubnavigationButton--appearance-neutral'],\n};\n\nconst modeStyles = {\n  primary: styles['SubnavigationButton--mode-primary'],\n  outline: styles['SubnavigationButton--mode-outline'],\n  tertiary: styles['SubnavigationButton--mode-tertiary'],\n};\n\nconst sizeStyles = {\n  s: styles['SubnavigationButton--size-s'],\n  m: styles['SubnavigationButton--size-m'],\n  l: styles['SubnavigationButton--size-l'],\n};\n\nconst sizeYClassNames = {\n  none: styles['SubnavigationButton--sizeY-none'],\n  ['compact']: styles['SubnavigationButton--sizeY-compact'],\n};\n\nexport interface SubnavigationButtonProps extends Omit<TappableProps, 'size'> {\n  mode?: 'primary' | 'outline' | 'tertiary';\n  appearance?: 'accent' | 'neutral';\n  size?: 's' | 'm' | 'l';\n  selected?: boolean;\n  /**\n   * Размер шрифта. Этим свойством рекомендуется пользоваться, чтобы отрегулировать размер шрифта у кнопок в `<SubnavigationBar mode=\"fixed\" />`\n   */\n  textLevel?: '1' | '2' | '3';\n  /**\n   * Рекомендуется использовать только иконки с размером 24\n   */\n  before?: React.ReactNode;\n  /**\n   * Рекомендуется использовать только `<Counter size=\"s\" />` или `<Badge />`\n   */\n  after?: React.ReactNode;\n  expandable?: boolean;\n}\n\ntype SubnavigationButtonTypographyProps = Pick<\n  SubnavigationButtonProps,\n  'textLevel' | 'className'\n> &\n  HasComponent &\n  HasChildren;\n\nconst SubnavigationButtonTypography = ({\n  textLevel,\n  ...restProps\n}: SubnavigationButtonTypographyProps) => {\n  if (textLevel === '1') {\n    return <Subhead {...restProps} />;\n  }\n\n  return <Caption level={textLevel === '2' ? '1' : '2'} {...restProps} />;\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SubnavigationButton\n */\nexport const SubnavigationButton = ({\n  mode = 'primary',\n  appearance = 'accent',\n  size = 'm',\n  selected,\n  textLevel = '1',\n  before,\n  after,\n  expandable,\n  children,\n  className,\n  ...restProps\n}: SubnavigationButtonProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <Tappable\n      {...restProps}\n      hasActive={false}\n      focusVisibleMode=\"outside\"\n      className={classNames(\n        styles['SubnavigationButton'],\n        sizeStyles[size],\n        modeStyles[mode],\n        appearanceStyles[appearance],\n        selected && styles['SubnavigationButton--selected'],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        className,\n      )}\n    >\n      <span className={styles['SubnavigationButton__in']}>\n        {before && <span className={styles['SubnavigationButton__before']}>{before}</span>}\n        <SubnavigationButtonTypography\n          textLevel={textLevel}\n          className={styles['SubnavigationButton__label']}\n          Component=\"span\"\n        >\n          {children}\n        </SubnavigationButtonTypography>\n        {after && <span className={styles['SubnavigationButton__after']}>{after}</span>}\n        {expandable && <Icon16Dropdown className={styles['SubnavigationButton__expandableIcon']} />}\n      </span>\n    </Tappable>\n  );\n};\n"],"names":["React","Icon16Dropdown","classNames","useAdaptivity","Tappable","Caption","Subhead","styles","appearanceStyles","accent","neutral","modeStyles","primary","outline","tertiary","sizeStyles","s","m","l","sizeYClassNames","none","SubnavigationButtonTypography","textLevel","restProps","level","SubnavigationButton","mode","appearance","size","selected","before","after","expandable","children","className","sizeY","hasActive","focusVisibleMode","span","Component"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,cAAc,QAAQ,mBAAmB;AAClD,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAE1D,SAASC,QAAQ,QAAuB,uBAAuB;AAC/D,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,OAAO,QAAQ,gCAAgC;AACxD,OAAOC,YAAY,mCAAmC;AAEtD,MAAMC,mBAAmB;IACvBC,QAAQF,MAAM,CAAC,yCAAyC;IACxDG,SAASH,MAAM,CAAC,0CAA0C;AAC5D;AAEA,MAAMI,aAAa;IACjBC,SAASL,MAAM,CAAC,oCAAoC;IACpDM,SAASN,MAAM,CAAC,oCAAoC;IACpDO,UAAUP,MAAM,CAAC,qCAAqC;AACxD;AAEA,MAAMQ,aAAa;IACjBC,GAAGT,MAAM,CAAC,8BAA8B;IACxCU,GAAGV,MAAM,CAAC,8BAA8B;IACxCW,GAAGX,MAAM,CAAC,8BAA8B;AAC1C;AAEA,MAAMY,kBAAkB;IACtBC,MAAMb,MAAM,CAAC,kCAAkC;IAC/C,CAAC,UAAU,EAAEA,MAAM,CAAC,qCAAqC;AAC3D;AA6BA,MAAMc,gCAAgC,CAAC,EACrCC,SAAS,EACT,GAAGC,WACgC;IACnC,IAAID,cAAc,KAAK;QACrB,qBAAO,KAAChB;YAAS,GAAGiB,SAAS;;IAC/B;IAEA,qBAAO,KAAClB;QAAQmB,OAAOF,cAAc,MAAM,MAAM;QAAM,GAAGC,SAAS;;AACrE;AAEA;;CAEC,GACD,OAAO,MAAME,sBAAsB,CAAC,EAClCC,OAAO,SAAS,EAChBC,aAAa,QAAQ,EACrBC,OAAO,GAAG,EACVC,QAAQ,EACRP,YAAY,GAAG,EACfQ,MAAM,EACNC,KAAK,EACLC,UAAU,EACVC,QAAQ,EACRC,SAAS,EACT,GAAGX,WACsB;IACzB,MAAM,EAAEY,QAAQ,MAAM,EAAE,GAAGhC;IAE3B,qBACE,KAACC;QACE,GAAGmB,SAAS;QACba,WAAW;QACXC,kBAAiB;QACjBH,WAAWhC,WACTK,MAAM,CAAC,sBAAsB,EAC7BQ,UAAU,CAACa,KAAK,EAChBjB,UAAU,CAACe,KAAK,EAChBlB,gBAAgB,CAACmB,WAAW,EAC5BE,YAAYtB,MAAM,CAAC,gCAAgC,EACnD4B,UAAU,aAAahB,eAAe,CAACgB,MAAM,EAC7CD;kBAGF,cAAA,MAACI;YAAKJ,WAAW3B,MAAM,CAAC,0BAA0B;;gBAC/CuB,wBAAU,KAACQ;oBAAKJ,WAAW3B,MAAM,CAAC,8BAA8B;8BAAGuB;;8BACpE,KAACT;oBACCC,WAAWA;oBACXY,WAAW3B,MAAM,CAAC,6BAA6B;oBAC/CgC,WAAU;8BAETN;;gBAEFF,uBAAS,KAACO;oBAAKJ,WAAW3B,MAAM,CAAC,6BAA6B;8BAAGwB;;gBACjEC,4BAAc,KAAC/B;oBAAeiC,WAAW3B,MAAM,CAAC,sCAAsC;;;;;AAI/F,EAAE"}
+{"version":3,"sources":["../../../../src/components/SubnavigationButton/SubnavigationButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Dropdown } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { HasChildren, HasComponent } from '../../types';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './SubnavigationButton.module.css';\n\nconst appearanceStyles = {\n  accent: styles['SubnavigationButton--appearance-accent'],\n  neutral: styles['SubnavigationButton--appearance-neutral'],\n};\n\nconst modeStyles = {\n  primary: styles['SubnavigationButton--mode-primary'],\n  outline: styles['SubnavigationButton--mode-outline'],\n  tertiary: styles['SubnavigationButton--mode-tertiary'],\n};\n\nconst sizeStyles = {\n  s: styles['SubnavigationButton--size-s'],\n  m: styles['SubnavigationButton--size-m'],\n  l: styles['SubnavigationButton--size-l'],\n};\n\nconst sizeYClassNames = {\n  none: styles['SubnavigationButton--sizeY-none'],\n  ['compact']: styles['SubnavigationButton--sizeY-compact'],\n};\n\nexport interface SubnavigationButtonProps extends Omit<TappableProps, 'size'> {\n  mode?: 'primary' | 'outline' | 'tertiary';\n  appearance?: 'accent' | 'neutral';\n  size?: 's' | 'm' | 'l';\n  selected?: boolean;\n  /**\n   * Размер шрифта. Этим свойством рекомендуется пользоваться, чтобы отрегулировать размер шрифта у кнопок в `<SubnavigationBar mode=\"fixed\" />`\n   */\n  textLevel?: '1' | '2' | '3';\n  /**\n   * Рекомендуется использовать только иконки с размером 24\n   */\n  before?: React.ReactNode;\n  /**\n   * Рекомендуется использовать только `<Counter size=\"s\" />` или `<Badge />`\n   */\n  after?: React.ReactNode;\n  expandable?: boolean;\n}\n\ntype SubnavigationButtonTypographyProps = Pick<\n  SubnavigationButtonProps,\n  'textLevel' | 'className'\n> &\n  HasComponent &\n  HasChildren;\n\nconst SubnavigationButtonTypography = ({\n  textLevel,\n  ...restProps\n}: SubnavigationButtonTypographyProps) => {\n  if (textLevel === '1') {\n    return <Subhead {...restProps} />;\n  }\n\n  return <Caption level={textLevel === '2' ? '1' : '2'} {...restProps} />;\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SubnavigationButton\n */\nexport const SubnavigationButton = ({\n  mode = 'primary',\n  appearance = 'accent',\n  size = 'm',\n  selected,\n  textLevel = '1',\n  before,\n  after,\n  expandable,\n  children,\n  className,\n  ...restProps\n}: SubnavigationButtonProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <Tappable\n      {...restProps}\n      hasActive={false}\n      focusVisibleMode=\"outside\"\n      className={classNames(\n        styles['SubnavigationButton'],\n        sizeStyles[size],\n        modeStyles[mode],\n        appearanceStyles[appearance],\n        selected && styles['SubnavigationButton--selected'],\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        className,\n      )}\n    >\n      <span className={styles['SubnavigationButton__in']}>\n        {before && <span className={styles['SubnavigationButton__before']}>{before}</span>}\n        <SubnavigationButtonTypography\n          textLevel={textLevel}\n          className={styles['SubnavigationButton__label']}\n          Component=\"span\"\n        >\n          {children}\n        </SubnavigationButtonTypography>\n        {after && <span className={styles['SubnavigationButton__after']}>{after}</span>}\n        {expandable && <Icon16Dropdown className={styles['SubnavigationButton__expandableIcon']} />}\n      </span>\n    </Tappable>\n  );\n};\n"],"names":["React","Icon16Dropdown","classNames","useAdaptivity","Tappable","Caption","Subhead","styles","appearanceStyles","accent","neutral","modeStyles","primary","outline","tertiary","sizeStyles","s","m","l","sizeYClassNames","none","SubnavigationButtonTypography","textLevel","restProps","level","SubnavigationButton","mode","appearance","size","selected","before","after","expandable","children","className","sizeY","hasActive","focusVisibleMode","span","Component"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,cAAc,QAAQ,mBAAmB;AAClD,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAE1D,SAASC,QAAQ,QAAuB,uBAAuB;AAC/D,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,OAAO,QAAQ,gCAAgC;AACxD,OAAOC,YAAY,mCAAmC;AAEtD,MAAMC,mBAAmB;IACvBC,QAAQF,MAAM,CAAC,yCAAyC;IACxDG,SAASH,MAAM,CAAC,0CAA0C;AAC5D;AAEA,MAAMI,aAAa;IACjBC,SAASL,MAAM,CAAC,oCAAoC;IACpDM,SAASN,MAAM,CAAC,oCAAoC;IACpDO,UAAUP,MAAM,CAAC,qCAAqC;AACxD;AAEA,MAAMQ,aAAa;IACjBC,GAAGT,MAAM,CAAC,8BAA8B;IACxCU,GAAGV,MAAM,CAAC,8BAA8B;IACxCW,GAAGX,MAAM,CAAC,8BAA8B;AAC1C;AAEA,MAAMY,kBAAkB;IACtBC,MAAMb,MAAM,CAAC,kCAAkC;IAC/C,CAAC,UAAU,EAAEA,MAAM,CAAC,qCAAqC;AAC3D;AA6BA,MAAMc,gCAAgC,CAAC,EACrCC,SAAS,EACT,GAAGC,WACgC;IACnC,IAAID,cAAc,KAAK;QACrB,qBAAO,KAAChB;YAAS,GAAGiB,SAAS;;IAC/B;IAEA,qBAAO,KAAClB;QAAQmB,OAAOF,cAAc,MAAM,MAAM;QAAM,GAAGC,SAAS;;AACrE;AAEA;;CAEC,GACD,OAAO,MAAME,sBAAsB,CAAC,EAClCC,OAAO,SAAS,EAChBC,aAAa,QAAQ,EACrBC,OAAO,GAAG,EACVC,QAAQ,EACRP,YAAY,GAAG,EACfQ,MAAM,EACNC,KAAK,EACLC,UAAU,EACVC,QAAQ,EACRC,SAAS,EACT,GAAGX,WACsB;IACzB,MAAM,EAAEY,QAAQ,MAAM,EAAE,GAAGhC;IAE3B,qBACE,KAACC;QACE,GAAGmB,SAAS;QACba,WAAW;QACXC,kBAAiB;QACjBH,WAAWhC,WACTK,MAAM,CAAC,sBAAsB,EAC7BQ,UAAU,CAACa,KAAK,EAChBjB,UAAU,CAACe,KAAK,EAChBlB,gBAAgB,CAACmB,WAAW,EAC5BE,YAAYtB,MAAM,CAAC,gCAAgC,EACnD4B,UAAU,aAAahB,eAAe,CAACgB,MAAM,EAC7CD;kBAGF,cAAA,MAACI;YAAKJ,WAAW3B,MAAM,CAAC,0BAA0B;;gBAC/CuB,wBAAU,KAACQ;oBAAKJ,WAAW3B,MAAM,CAAC,8BAA8B;8BAAGuB;;8BACpE,KAACT;oBACCC,WAAWA;oBACXY,WAAW3B,MAAM,CAAC,6BAA6B;oBAC/CgC,WAAU;8BAETN;;gBAEFF,uBAAS,KAACO;oBAAKJ,WAAW3B,MAAM,CAAC,6BAA6B;8BAAGwB;;gBACjEC,4BAAc,KAAC/B;oBAAeiC,WAAW3B,MAAM,CAAC,sCAAsC;;;;;AAI/F,EAAE"}