@vkontakte/vkui 7.1.1 → 7.1.2-alpha.0

package/dist/components/HorizontalScroll/HorizontalScroll.d.ts

@@ -35,5 +35,5 @@ export interface HorizontalScrollProps extends HTMLAttributesWithRootRef<HTMLDiv
 /**
  * @see https://vkcom.github.io/VKUI/#/HorizontalScroll
  */
-export declare const HorizontalScroll: ({ children, getScrollToLeft, getScrollToRight, showArrows, arrowSize, arrowOffsetY, scrollAnimationDuration, getRef, scrollOnAnyWheel, prevButtonTestId, nextButtonTestId, ...restProps }: HorizontalScrollProps) => React.ReactNode;
+export declare const HorizontalScroll: ({ children, getScrollToLeft, getScrollToRight, showArrows, arrowSize, arrowOffsetY, scrollAnimationDuration, getRef, scrollOnAnyWheel, prevButtonTestId, nextButtonTestId, getRootRef, ...restProps }: HorizontalScrollProps) => React.ReactNode;
 //# sourceMappingURL=HorizontalScroll.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"HorizontalScroll.d.ts","sourceRoot":"","sources":["../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAE,MAAM,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAErE,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAmBhF,MAAM,MAAM,qBAAqB,GAAG,CAAC,eAAe,EAAE,MAAM,KAAK,MAAM,CAAC;AAExE,MAAM,WAAW,qBACf,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAC/C,MAAM,CAAC,cAAc,CAAC;IACxB;;OAEG;IACH,eAAe,CAAC,EAAE,qBAAqB,CAAC;IACxC;;OAEG;IACH,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;IACzC,SAAS,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACrC;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,UAAU,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAChC,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAsGD;;GAEG;AACH,eAAO,MAAM,gBAAgB,8LAa1B,qBAAqB,KAAG,KAAK,CAAC,SA2IhC,CAAC"}
+{"version":3,"file":"HorizontalScroll.d.ts","sourceRoot":"","sources":["../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,KAAK,EAAE,MAAM,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAErE,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAmBhF,MAAM,MAAM,qBAAqB,GAAG,CAAC,eAAe,EAAE,MAAM,KAAK,MAAM,CAAC;AAExE,MAAM,WAAW,qBACf,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAC/C,MAAM,CAAC,cAAc,CAAC;IACxB;;OAEG;IACH,eAAe,CAAC,EAAE,qBAAqB,CAAC;IACxC;;OAEG;IACH,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;IACzC,SAAS,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACrC;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,UAAU,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAChC,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAsGD;;GAEG;AACH,eAAO,MAAM,gBAAgB,0MAc1B,qBAAqB,KAAG,KAAK,CAAC,SAmIhC,CAAC"}

package/dist/components/HorizontalScroll/HorizontalScroll.js

@@ -4,11 +4,12 @@ import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
 import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { classNames } from "@vkontakte/vkjs";
+import { classNames, noop } from "@vkontakte/vkjs";
 import { useAdaptivityHasPointer } from "../../hooks/useAdaptivityHasPointer.js";
 import { useDirection } from "../../hooks/useDirection.js";
 import { useExternRef } from "../../hooks/useExternRef.js";
 import { easeInOutSine } from "../../lib/fx.js";
+import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect.js";
 import { RootComponent } from "../RootComponent/RootComponent.js";
 import { ScrollArrow } from "../ScrollArrow/ScrollArrow.js";
 /**
@@ -80,7 +81,7 @@ function doScroll({ scrollElement, getScrollPosition, animationQueue, onScrollTo
 /**
  * @see https://vkcom.github.io/VKUI/#/HorizontalScroll
  */ export const HorizontalScroll = (_param)=>{
-    var { children, getScrollToLeft, getScrollToRight, showArrows = true, arrowSize = 'm', arrowOffsetY, scrollAnimationDuration = SCROLL_ONE_FRAME_TIME, getRef, scrollOnAnyWheel = false, prevButtonTestId, nextButtonTestId } = _param, restProps = _object_without_properties(_param, [
+    var { children, getScrollToLeft, getScrollToRight, showArrows = true, arrowSize = 'm', arrowOffsetY, scrollAnimationDuration = SCROLL_ONE_FRAME_TIME, getRef, scrollOnAnyWheel = false, prevButtonTestId, nextButtonTestId, getRootRef } = _param, restProps = _object_without_properties(_param, [
         "children",
         "getScrollToLeft",
         "getScrollToRight",
@@ -91,7 +92,8 @@ function doScroll({ scrollElement, getScrollPosition, animationQueue, onScrollTo
         "getRef",
         "scrollOnAnyWheel",
         "prevButtonTestId",
-        "nextButtonTestId"
+        "nextButtonTestId",
+        "getRootRef"
     ]);
     const [canScrollLeft, setCanScrollLeft] = React.useState(false);
     const [canScrollRight, setCanScrollRight] = React.useState(false);
@@ -101,6 +103,7 @@ function doScroll({ scrollElement, getScrollPosition, animationQueue, onScrollTo
     const setCanScrollEnd = direction === 'ltr' ? setCanScrollRight : setCanScrollLeft;
     const isCustomScrollingRef = React.useRef(false);
     const scrollerRef = useExternRef(getRef, directionRef);
+    const rootRef = useExternRef(getRootRef);
     const animationQueue = React.useRef([]);
     const hasPointer = useAdaptivityHasPointer();
     const scrollTo = React.useCallback((getScrollPosition)=>{
@@ -161,31 +164,39 @@ function doScroll({ scrollElement, getScrollPosition, animationQueue, onScrollTo
         calculateArrowsVisibility,
         children
     ]);
-    const _onWheel = React.useCallback((e)=>{
-        scrollerRef.current.scrollBy({
-            left: e.deltaX + e.deltaY,
-            behavior: 'auto'
-        });
-    }, [
-        scrollerRef
-    ]);
-    /**
-   * Прокрутка с помощью любого колеса мыши
-   */ const onScrollWheel = React.useCallback((e)=>{
-        _onWheel(e);
-        e.preventDefault();
-    }, [
-        _onWheel
-    ]);
-    const onArrowWheel = React.useCallback((e)=>{
-        if (e.deltaX || e.deltaY && scrollOnAnyWheel) {
-            _onWheel(e);
+    useIsomorphicLayoutEffect(function addWheelEventHandler() {
+        var _rootRef_current;
+        if (!rootRef.current) {
+            return noop;
         }
+        /**
+       * Прокрутка с помощью любого колеса мыши
+       */ const onWheel = (e)=>{
+            const left = e.deltaX + (scrollOnAnyWheel ? e.deltaY : 0);
+            scrollerRef.current.scrollBy({
+                left,
+                behavior: 'auto'
+            });
+            if (e.deltaY && scrollOnAnyWheel) {
+                e.preventDefault();
+            }
+        };
+        const listenerOptions = {
+            passive: false
+        };
+        (_rootRef_current = rootRef.current) === null || _rootRef_current === void 0 ? void 0 : _rootRef_current.addEventListener('wheel', onWheel, listenerOptions);
+        // @ts-expect-error: TS2769 В интерфейсе EventListenerOptions для wheel нет passive свойства
+        return ()=>{
+            var _rootRef_current;
+            return (_rootRef_current = rootRef.current) === null || _rootRef_current === void 0 ? void 0 : _rootRef_current.removeEventListener('wheel', onWheel, listenerOptions);
+        };
     }, [
-        _onWheel,
-        scrollOnAnyWheel
+        rootRef,
+        scrollOnAnyWheel,
+        scrollerRef
     ]);
     return /*#__PURE__*/ _jsxs(RootComponent, _object_spread_props(_object_spread({}, restProps), {
+        getRootRef: rootRef,
         baseClassName: classNames("vkuiHorizontalScroll__host", 'vkuiInternalHorizontalScroll', showArrows === 'always' && "vkuiHorizontalScroll__withConstArrows"),
         onMouseEnter: calculateArrowsVisibility,
         children: [
@@ -197,8 +208,7 @@ function doScroll({ scrollElement, getScrollPosition, animationQueue, onScrollTo
                 "aria-hidden": true,
                 tabIndex: -1,
                 className: classNames("vkuiHorizontalScroll__arrow", "vkuiHorizontalScroll__arrowLeft"),
-                onClick: scrollToLeft,
-                onWheel: onArrowWheel
+                onClick: scrollToLeft
             }),
             showArrows && (hasPointer || hasPointer === undefined) && canScrollRight && /*#__PURE__*/ _jsx(ScrollArrow, {
                 "data-testid": nextButtonTestId,
@@ -208,14 +218,12 @@ function doScroll({ scrollElement, getScrollPosition, animationQueue, onScrollTo
                 "aria-hidden": true,
                 tabIndex: -1,
                 className: classNames("vkuiHorizontalScroll__arrow", "vkuiHorizontalScroll__arrowRight"),
-                onClick: scrollToRight,
-                onWheel: onArrowWheel
+                onClick: scrollToRight
             }),
             /*#__PURE__*/ _jsx("div", {
                 className: "vkuiHorizontalScroll__in",
                 ref: scrollerRef,
                 onScroll: calculateArrowsVisibility,
-                onWheel: scrollOnAnyWheel ? onScrollWheel : undefined,
                 children: /*#__PURE__*/ _jsx("div", {
                     className: "vkuiHorizontalScroll__inWrapper",
                     children: children

package/dist/components/HorizontalScroll/HorizontalScroll.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useDirection } from '../../hooks/useDirection';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { easeInOutSine } from '../../lib/fx';\nimport type { HasRef, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ScrollArrow, type ScrollArrowProps } from '../ScrollArrow/ScrollArrow';\nimport styles from './HorizontalScroll.module.css';\n\ninterface ScrollContext {\n  scrollElement: HTMLElement | null;\n  scrollAnimationDuration: number;\n  animationQueue: VoidFunction[];\n  getScrollPosition: (currentPosition: number) => number;\n  onScrollToEndBorder: VoidFunction;\n  onScrollEnd: VoidFunction;\n  onScrollStart: VoidFunction;\n  /**\n   * Начальная ширина прокрутки.\n   * В некоторых случаях может отличаться от текущей ширины прокрутки из-за transforms: translate\n   */\n  initialScrollWidth: number;\n  textDirection: 'ltr' | 'rtl';\n}\n\nexport type ScrollPositionHandler = (currentPosition: number) => number;\n\nexport interface HorizontalScrollProps\n  extends HTMLAttributesWithRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * Функция для расчета величины прокрутки при клике на левую стрелку.\n   */\n  getScrollToLeft?: ScrollPositionHandler;\n  /**\n   * Функция для расчета величины прокрутки при клике на правую стрелку.\n   */\n  getScrollToRight?: ScrollPositionHandler;\n  arrowSize?: ScrollArrowProps['size'];\n  /**\n   * Смещает иконки кнопок навигации по вертикали.\n   */\n  arrowOffsetY?: number | string;\n  showArrows?: boolean | 'always';\n  scrollAnimationDuration?: number;\n  /**\n   * Добавляет возможность прокручивать контент на любое колесо мыши.\n   * По умолчанию прокручивается как любой горизонтальный контент через shift.\n   */\n  scrollOnAnyWheel?: boolean;\n  /**\n   * Передает атрибут `data-testid` для кнопки прокрутки горизонтального скролла в направлении предыдущего элемента\n   */\n  prevButtonTestId?: string;\n  /**\n   * Передает атрибут `data-testid` для кнопки прокрутки горизонтального скролла в направлении следующего элемента\n   */\n  nextButtonTestId?: string;\n}\n\n/**\n * timing method\n */\nfunction now() {\n  return performance && performance.now ? performance.now() : Date.now();\n}\n\n/**\n * Округление к большему по модулю\n *\n * ## Пример\n *\n * ```ts\n * import { strict as assert } from 'node:assert';\n *\n * assert.equal(roundingAwayFromZero(5.1), 6)\n * assert.equal(roundingAwayFromZero(-5.1), -6)\n * ```\n */\nfunction roundingAwayFromZero(value: number): number {\n  return value > 0 ? Math.ceil(value) : Math.floor(value);\n}\n\n/**\n * Округляем el.scrollLeft\n * https://github.com/VKCOM/VKUI/pull/2445\n */\nconst roundUpElementScrollLeft = (el: HTMLElement) => roundingAwayFromZero(el.scrollLeft);\n\n/**\n * Код анимации скрола, на основе полифила: https://github.com/iamdustan/smoothscroll\n * Константа взята из полифила (468), на дизайн-ревью уточнили до 250\n * @var {number} SCROLL_ONE_FRAME_TIME время анимации скролла\n */\nconst SCROLL_ONE_FRAME_TIME = 250;\n\nfunction doScroll({\n  scrollElement,\n  getScrollPosition,\n  animationQueue,\n  onScrollToEndBorder,\n  onScrollEnd,\n  onScrollStart,\n  initialScrollWidth,\n  scrollAnimationDuration,\n  textDirection,\n}: ScrollContext) {\n  if (!scrollElement || !getScrollPosition) {\n    return;\n  }\n\n  /**\n   * крайнее значение сдвига\n   */\n  const extremeScrollLeft =\n    (textDirection === 'ltr' ? 1 : -1) * (initialScrollWidth - scrollElement.offsetWidth);\n\n  let startScrollLeft = roundUpElementScrollLeft(scrollElement);\n  let endScrollLeft = getScrollPosition(startScrollLeft);\n\n  onScrollStart();\n\n  /**\n   * Если окончание прокрутки вышло за ноль\n   */\n  if (startScrollLeft * endScrollLeft < 0) {\n    endScrollLeft = 0;\n  }\n\n  if (Math.abs(endScrollLeft) >= Math.abs(extremeScrollLeft)) {\n    onScrollToEndBorder();\n    endScrollLeft = extremeScrollLeft;\n  }\n\n  const startTime = now();\n\n  (function scroll() {\n    const time = now();\n    const elapsed = Math.min((time - startTime) / scrollAnimationDuration, 1);\n\n    const value = easeInOutSine(elapsed);\n\n    const currentScrollLeft = startScrollLeft + (endScrollLeft - startScrollLeft) * value;\n    scrollElement.scrollLeft = roundingAwayFromZero(currentScrollLeft);\n\n    const scrollEnd =\n      textDirection === 'ltr' ? Math.max(0, endScrollLeft) : Math.min(0, endScrollLeft);\n    if (roundUpElementScrollLeft(scrollElement) !== scrollEnd && elapsed !== 1) {\n      requestAnimationFrame(scroll);\n      return;\n    }\n\n    onScrollEnd();\n    animationQueue.shift();\n    if (animationQueue.length > 0) {\n      animationQueue[0]();\n    }\n  })();\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/HorizontalScroll\n */\nexport const HorizontalScroll = ({\n  children,\n  getScrollToLeft,\n  getScrollToRight,\n  showArrows = true,\n  arrowSize = 'm',\n  arrowOffsetY,\n  scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n  getRef,\n  scrollOnAnyWheel = false,\n  prevButtonTestId,\n  nextButtonTestId,\n  ...restProps\n}: HorizontalScrollProps): React.ReactNode => {\n  const [canScrollLeft, setCanScrollLeft] = React.useState(false);\n  const [canScrollRight, setCanScrollRight] = React.useState(false);\n  const [directionRef, textDirection] = useDirection<HTMLDivElement>();\n  const direction = textDirection || 'ltr';\n  const setCanScrollStart = direction === 'ltr' ? setCanScrollLeft : setCanScrollRight;\n  const setCanScrollEnd = direction === 'ltr' ? setCanScrollRight : setCanScrollLeft;\n\n  const isCustomScrollingRef = React.useRef(false);\n\n  const scrollerRef = useExternRef(getRef, directionRef);\n\n  const animationQueue = React.useRef<VoidFunction[]>([]);\n\n  const hasPointer = useAdaptivityHasPointer();\n\n  const scrollTo = React.useCallback(\n    (getScrollPosition: ScrollPositionHandler) => {\n      const scrollElement = scrollerRef.current;\n\n      animationQueue.current.push(() =>\n        doScroll({\n          scrollElement,\n          getScrollPosition,\n          animationQueue: animationQueue.current,\n          onScrollToEndBorder: () => setCanScrollEnd(false),\n          onScrollEnd: () => (isCustomScrollingRef.current = false),\n          onScrollStart: () => (isCustomScrollingRef.current = true),\n          initialScrollWidth: scrollElement?.firstElementChild?.scrollWidth || 0,\n          scrollAnimationDuration,\n          textDirection: direction,\n        }),\n      );\n      if (animationQueue.current.length === 1) {\n        animationQueue.current[0]();\n      }\n    },\n    [scrollerRef, scrollAnimationDuration, direction, setCanScrollEnd],\n  );\n\n  const scrollToLeft = React.useCallback(() => {\n    const getScrollPosition =\n      getScrollToLeft ?? ((i: number) => i - scrollerRef.current!.offsetWidth);\n    scrollTo(getScrollPosition);\n  }, [getScrollToLeft, scrollTo, scrollerRef]);\n\n  const scrollToRight = React.useCallback(() => {\n    const getScrollPosition =\n      getScrollToRight ?? ((i: number) => i + scrollerRef.current!.offsetWidth);\n    scrollTo(getScrollPosition);\n  }, [getScrollToRight, scrollTo, scrollerRef]);\n\n  const calculateArrowsVisibility = React.useCallback(() => {\n    if (showArrows && hasPointer && scrollerRef.current && !isCustomScrollingRef.current) {\n      const scrollElement = scrollerRef.current;\n\n      setCanScrollStart(scrollElement.scrollLeft !== 0);\n      setCanScrollEnd(\n        Math.abs(roundUpElementScrollLeft(scrollElement)) + scrollElement.offsetWidth <\n          scrollElement.scrollWidth,\n      );\n    }\n  }, [showArrows, hasPointer, scrollerRef, setCanScrollStart, setCanScrollEnd]);\n\n  React.useEffect(calculateArrowsVisibility, [calculateArrowsVisibility, children]);\n\n  const _onWheel = React.useCallback(\n    (e: React.WheelEvent) => {\n      scrollerRef.current!.scrollBy({ left: e.deltaX + e.deltaY, behavior: 'auto' });\n    },\n    [scrollerRef],\n  );\n\n  /**\n   * Прокрутка с помощью любого колеса мыши\n   */\n  const onScrollWheel = React.useCallback(\n    (e: React.WheelEvent) => {\n      _onWheel(e);\n      e.preventDefault();\n    },\n    [_onWheel],\n  );\n\n  const onArrowWheel = React.useCallback(\n    (e: React.WheelEvent) => {\n      if (e.deltaX || (e.deltaY && scrollOnAnyWheel)) {\n        _onWheel(e);\n      }\n    },\n    [_onWheel, scrollOnAnyWheel],\n  );\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(\n        styles.host,\n        'vkuiInternalHorizontalScroll',\n        showArrows === 'always' && styles.withConstArrows,\n      )}\n      onMouseEnter={calculateArrowsVisibility}\n    >\n      {showArrows && (hasPointer || hasPointer === undefined) && canScrollLeft && (\n        <ScrollArrow\n          data-testid={prevButtonTestId}\n          size={arrowSize}\n          offsetY={arrowOffsetY}\n          direction=\"left\"\n          aria-hidden\n          tabIndex={-1}\n          className={classNames(styles.arrow, styles.arrowLeft)}\n          onClick={scrollToLeft}\n          onWheel={onArrowWheel}\n        />\n      )}\n      {showArrows && (hasPointer || hasPointer === undefined) && canScrollRight && (\n        <ScrollArrow\n          data-testid={nextButtonTestId}\n          size={arrowSize}\n          offsetY={arrowOffsetY}\n          direction=\"right\"\n          aria-hidden\n          tabIndex={-1}\n          className={classNames(styles.arrow, styles.arrowRight)}\n          onClick={scrollToRight}\n          onWheel={onArrowWheel}\n        />\n      )}\n      <div\n        className={styles.in}\n        ref={scrollerRef}\n        onScroll={calculateArrowsVisibility}\n        onWheel={scrollOnAnyWheel ? onScrollWheel : undefined}\n      >\n        <div className={styles.inWrapper}>{children}</div>\n      </div>\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","useAdaptivityHasPointer","useDirection","useExternRef","easeInOutSine","RootComponent","ScrollArrow","now","performance","Date","roundingAwayFromZero","value","Math","ceil","floor","roundUpElementScrollLeft","el","scrollLeft","SCROLL_ONE_FRAME_TIME","doScroll","scrollElement","getScrollPosition","animationQueue","onScrollToEndBorder","onScrollEnd","onScrollStart","initialScrollWidth","scrollAnimationDuration","textDirection","extremeScrollLeft","offsetWidth","startScrollLeft","endScrollLeft","abs","startTime","scroll","time","elapsed","min","currentScrollLeft","scrollEnd","max","requestAnimationFrame","shift","length","HorizontalScroll","children","getScrollToLeft","getScrollToRight","showArrows","arrowSize","arrowOffsetY","getRef","scrollOnAnyWheel","prevButtonTestId","nextButtonTestId","restProps","canScrollLeft","setCanScrollLeft","useState","canScrollRight","setCanScrollRight","directionRef","direction","setCanScrollStart","setCanScrollEnd","isCustomScrollingRef","useRef","scrollerRef","hasPointer","scrollTo","useCallback","current","push","firstElementChild","scrollWidth","scrollToLeft","i","scrollToRight","calculateArrowsVisibility","useEffect","_onWheel","e","scrollBy","left","deltaX","deltaY","behavior","onScrollWheel","preventDefault","onArrowWheel","baseClassName","onMouseEnter","undefined","data-testid","size","offsetY","aria-hidden","tabIndex","className","onClick","onWheel","div","ref","onScroll"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,uBAAuB,QAAQ,yCAAsC;AAC9E,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,aAAa,QAAQ,kBAAe;AAE7C,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,WAAW,QAA+B,gCAA6B;AAsDhF;;CAEC,GACD,SAASC;IACP,OAAOC,eAAeA,YAAYD,GAAG,GAAGC,YAAYD,GAAG,KAAKE,KAAKF,GAAG;AACtE;AAEA;;;;;;;;;;;CAWC,GACD,SAASG,qBAAqBC,KAAa;IACzC,OAAOA,QAAQ,IAAIC,KAAKC,IAAI,CAACF,SAASC,KAAKE,KAAK,CAACH;AACnD;AAEA;;;CAGC,GACD,MAAMI,2BAA2B,CAACC,KAAoBN,qBAAqBM,GAAGC,UAAU;AAExF;;;;CAIC,GACD,MAAMC,wBAAwB;AAE9B,SAASC,SAAS,EAChBC,aAAa,EACbC,iBAAiB,EACjBC,cAAc,EACdC,mBAAmB,EACnBC,WAAW,EACXC,aAAa,EACbC,kBAAkB,EAClBC,uBAAuB,EACvBC,aAAa,EACC;IACd,IAAI,CAACR,iBAAiB,CAACC,mBAAmB;QACxC;IACF;IAEA;;GAEC,GACD,MAAMQ,oBACJ,AAACD,CAAAA,kBAAkB,QAAQ,IAAI,CAAC,CAAA,IAAMF,CAAAA,qBAAqBN,cAAcU,WAAW,AAAD;IAErF,IAAIC,kBAAkBhB,yBAAyBK;IAC/C,IAAIY,gBAAgBX,kBAAkBU;IAEtCN;IAEA;;GAEC,GACD,IAAIM,kBAAkBC,gBAAgB,GAAG;QACvCA,gBAAgB;IAClB;IAEA,IAAIpB,KAAKqB,GAAG,CAACD,kBAAkBpB,KAAKqB,GAAG,CAACJ,oBAAoB;QAC1DN;QACAS,gBAAgBH;IAClB;IAEA,MAAMK,YAAY3B;IAEjB,CAAA,SAAS4B;QACR,MAAMC,OAAO7B;QACb,MAAM8B,UAAUzB,KAAK0B,GAAG,CAAC,AAACF,CAAAA,OAAOF,SAAQ,IAAKP,yBAAyB;QAEvE,MAAMhB,QAAQP,cAAciC;QAE5B,MAAME,oBAAoBR,kBAAkB,AAACC,CAAAA,gBAAgBD,eAAc,IAAKpB;QAChFS,cAAcH,UAAU,GAAGP,qBAAqB6B;QAEhD,MAAMC,YACJZ,kBAAkB,QAAQhB,KAAK6B,GAAG,CAAC,GAAGT,iBAAiBpB,KAAK0B,GAAG,CAAC,GAAGN;QACrE,IAAIjB,yBAAyBK,mBAAmBoB,aAAaH,YAAY,GAAG;YAC1EK,sBAAsBP;YACtB;QACF;QAEAX;QACAF,eAAeqB,KAAK;QACpB,IAAIrB,eAAesB,MAAM,GAAG,GAAG;YAC7BtB,cAAc,CAAC,EAAE;QACnB;IACF,CAAA;AACF;AAEA;;CAEC,GACD,OAAO,MAAMuB,mBAAmB;QAAC,EAC/BC,QAAQ,EACRC,eAAe,EACfC,gBAAgB,EAChBC,aAAa,IAAI,EACjBC,YAAY,GAAG,EACfC,YAAY,EACZxB,0BAA0BT,qBAAqB,EAC/CkC,MAAM,EACNC,mBAAmB,KAAK,EACxBC,gBAAgB,EAChBC,gBAAgB,EAEM,WADnBC;QAXHV;QACAC;QACAC;QACAC;QACAC;QACAC;QACAxB;QACAyB;QACAC;QACAC;QACAC;;IAGA,MAAM,CAACE,eAAeC,iBAAiB,GAAG3D,MAAM4D,QAAQ,CAAC;IACzD,MAAM,CAACC,gBAAgBC,kBAAkB,GAAG9D,MAAM4D,QAAQ,CAAC;IAC3D,MAAM,CAACG,cAAclC,cAAc,GAAG1B;IACtC,MAAM6D,YAAYnC,iBAAiB;IACnC,MAAMoC,oBAAoBD,cAAc,QAAQL,mBAAmBG;IACnE,MAAMI,kBAAkBF,cAAc,QAAQF,oBAAoBH;IAElE,MAAMQ,uBAAuBnE,MAAMoE,MAAM,CAAC;IAE1C,MAAMC,cAAcjE,aAAaiD,QAAQU;IAEzC,MAAMxC,iBAAiBvB,MAAMoE,MAAM,CAAiB,EAAE;IAEtD,MAAME,aAAapE;IAEnB,MAAMqE,WAAWvE,MAAMwE,WAAW,CAChC,CAAClD;QACC,MAAMD,gBAAgBgD,YAAYI,OAAO;QAEzClD,eAAekD,OAAO,CAACC,IAAI,CAAC;gBAQJrD;mBAPtBD,SAAS;gBACPC;gBACAC;gBACAC,gBAAgBA,eAAekD,OAAO;gBACtCjD,qBAAqB,IAAM0C,gBAAgB;gBAC3CzC,aAAa,IAAO0C,qBAAqBM,OAAO,GAAG;gBACnD/C,eAAe,IAAOyC,qBAAqBM,OAAO,GAAG;gBACrD9C,oBAAoBN,CAAAA,0BAAAA,qCAAAA,mCAAAA,cAAesD,iBAAiB,cAAhCtD,uDAAAA,iCAAkCuD,WAAW,KAAI;gBACrEhD;gBACAC,eAAemC;YACjB;;QAEF,IAAIzC,eAAekD,OAAO,CAAC5B,MAAM,KAAK,GAAG;YACvCtB,eAAekD,OAAO,CAAC,EAAE;QAC3B;IACF,GACA;QAACJ;QAAazC;QAAyBoC;QAAWE;KAAgB;IAGpE,MAAMW,eAAe7E,MAAMwE,WAAW,CAAC;QACrC,MAAMlD,oBACJ0B,4BAAAA,6BAAAA,kBAAoB,CAAC8B,IAAcA,IAAIT,YAAYI,OAAO,CAAE1C,WAAW;QACzEwC,SAASjD;IACX,GAAG;QAAC0B;QAAiBuB;QAAUF;KAAY;IAE3C,MAAMU,gBAAgB/E,MAAMwE,WAAW,CAAC;QACtC,MAAMlD,oBACJ2B,6BAAAA,8BAAAA,mBAAqB,CAAC6B,IAAcA,IAAIT,YAAYI,OAAO,CAAE1C,WAAW;QAC1EwC,SAASjD;IACX,GAAG;QAAC2B;QAAkBsB;QAAUF;KAAY;IAE5C,MAAMW,4BAA4BhF,MAAMwE,WAAW,CAAC;QAClD,IAAItB,cAAcoB,cAAcD,YAAYI,OAAO,IAAI,CAACN,qBAAqBM,OAAO,EAAE;YACpF,MAAMpD,gBAAgBgD,YAAYI,OAAO;YAEzCR,kBAAkB5C,cAAcH,UAAU,KAAK;YAC/CgD,gBACErD,KAAKqB,GAAG,CAAClB,yBAAyBK,kBAAkBA,cAAcU,WAAW,GAC3EV,cAAcuD,WAAW;QAE/B;IACF,GAAG;QAAC1B;QAAYoB;QAAYD;QAAaJ;QAAmBC;KAAgB;IAE5ElE,MAAMiF,SAAS,CAACD,2BAA2B;QAACA;QAA2BjC;KAAS;IAEhF,MAAMmC,WAAWlF,MAAMwE,WAAW,CAChC,CAACW;QACCd,YAAYI,OAAO,CAAEW,QAAQ,CAAC;YAAEC,MAAMF,EAAEG,MAAM,GAAGH,EAAEI,MAAM;YAAEC,UAAU;QAAO;IAC9E,GACA;QAACnB;KAAY;IAGf;;GAEC,GACD,MAAMoB,gBAAgBzF,MAAMwE,WAAW,CACrC,CAACW;QACCD,SAASC;QACTA,EAAEO,cAAc;IAClB,GACA;QAACR;KAAS;IAGZ,MAAMS,eAAe3F,MAAMwE,WAAW,CACpC,CAACW;QACC,IAAIA,EAAEG,MAAM,IAAKH,EAAEI,MAAM,IAAIjC,kBAAmB;YAC9C4B,SAASC;QACX;IACF,GACA;QAACD;QAAU5B;KAAiB;IAG9B,qBACE,MAAChD,uDACKmD;QACJmC,eAAe3F,yCAEb,gCACAiD,eAAe;QAEjB2C,cAAcb;;YAEb9B,cAAeoB,CAAAA,cAAcA,eAAewB,SAAQ,KAAMpC,+BACzD,KAACnD;gBACCwF,eAAaxC;gBACbyC,MAAM7C;gBACN8C,SAAS7C;gBACTY,WAAU;gBACVkC,aAAW;gBACXC,UAAU,CAAC;gBACXC,WAAWnG;gBACXoG,SAASxB;gBACTyB,SAASX;;YAGZzC,cAAeoB,CAAAA,cAAcA,eAAewB,SAAQ,KAAMjC,gCACzD,KAACtD;gBACCwF,eAAavC;gBACbwC,MAAM7C;gBACN8C,SAAS7C;gBACTY,WAAU;gBACVkC,aAAW;gBACXC,UAAU,CAAC;gBACXC,WAAWnG;gBACXoG,SAAStB;gBACTuB,SAASX;;0BAGb,KAACY;gBACCH,SAAS;gBACTI,KAAKnC;gBACLoC,UAAUzB;gBACVsB,SAAShD,mBAAmBmC,gBAAgBK;0BAE5C,cAAA,KAACS;oBAAIH,SAAS;8BAAqBrD;;;;;AAI3C,EAAE"}
+{"version":3,"sources":["../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useDirection } from '../../hooks/useDirection';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { easeInOutSine } from '../../lib/fx';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport type { HasRef, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ScrollArrow, type ScrollArrowProps } from '../ScrollArrow/ScrollArrow';\nimport styles from './HorizontalScroll.module.css';\n\ninterface ScrollContext {\n  scrollElement: HTMLElement | null;\n  scrollAnimationDuration: number;\n  animationQueue: VoidFunction[];\n  getScrollPosition: (currentPosition: number) => number;\n  onScrollToEndBorder: VoidFunction;\n  onScrollEnd: VoidFunction;\n  onScrollStart: VoidFunction;\n  /**\n   * Начальная ширина прокрутки.\n   * В некоторых случаях может отличаться от текущей ширины прокрутки из-за transforms: translate\n   */\n  initialScrollWidth: number;\n  textDirection: 'ltr' | 'rtl';\n}\n\nexport type ScrollPositionHandler = (currentPosition: number) => number;\n\nexport interface HorizontalScrollProps\n  extends HTMLAttributesWithRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * Функция для расчета величины прокрутки при клике на левую стрелку.\n   */\n  getScrollToLeft?: ScrollPositionHandler;\n  /**\n   * Функция для расчета величины прокрутки при клике на правую стрелку.\n   */\n  getScrollToRight?: ScrollPositionHandler;\n  arrowSize?: ScrollArrowProps['size'];\n  /**\n   * Смещает иконки кнопок навигации по вертикали.\n   */\n  arrowOffsetY?: number | string;\n  showArrows?: boolean | 'always';\n  scrollAnimationDuration?: number;\n  /**\n   * Добавляет возможность прокручивать контент на любое колесо мыши.\n   * По умолчанию прокручивается как любой горизонтальный контент через shift.\n   */\n  scrollOnAnyWheel?: boolean;\n  /**\n   * Передает атрибут `data-testid` для кнопки прокрутки горизонтального скролла в направлении предыдущего элемента\n   */\n  prevButtonTestId?: string;\n  /**\n   * Передает атрибут `data-testid` для кнопки прокрутки горизонтального скролла в направлении следующего элемента\n   */\n  nextButtonTestId?: string;\n}\n\n/**\n * timing method\n */\nfunction now() {\n  return performance && performance.now ? performance.now() : Date.now();\n}\n\n/**\n * Округление к большему по модулю\n *\n * ## Пример\n *\n * ```ts\n * import { strict as assert } from 'node:assert';\n *\n * assert.equal(roundingAwayFromZero(5.1), 6)\n * assert.equal(roundingAwayFromZero(-5.1), -6)\n * ```\n */\nfunction roundingAwayFromZero(value: number): number {\n  return value > 0 ? Math.ceil(value) : Math.floor(value);\n}\n\n/**\n * Округляем el.scrollLeft\n * https://github.com/VKCOM/VKUI/pull/2445\n */\nconst roundUpElementScrollLeft = (el: HTMLElement) => roundingAwayFromZero(el.scrollLeft);\n\n/**\n * Код анимации скрола, на основе полифила: https://github.com/iamdustan/smoothscroll\n * Константа взята из полифила (468), на дизайн-ревью уточнили до 250\n * @var {number} SCROLL_ONE_FRAME_TIME время анимации скролла\n */\nconst SCROLL_ONE_FRAME_TIME = 250;\n\nfunction doScroll({\n  scrollElement,\n  getScrollPosition,\n  animationQueue,\n  onScrollToEndBorder,\n  onScrollEnd,\n  onScrollStart,\n  initialScrollWidth,\n  scrollAnimationDuration,\n  textDirection,\n}: ScrollContext) {\n  if (!scrollElement || !getScrollPosition) {\n    return;\n  }\n\n  /**\n   * крайнее значение сдвига\n   */\n  const extremeScrollLeft =\n    (textDirection === 'ltr' ? 1 : -1) * (initialScrollWidth - scrollElement.offsetWidth);\n\n  let startScrollLeft = roundUpElementScrollLeft(scrollElement);\n  let endScrollLeft = getScrollPosition(startScrollLeft);\n\n  onScrollStart();\n\n  /**\n   * Если окончание прокрутки вышло за ноль\n   */\n  if (startScrollLeft * endScrollLeft < 0) {\n    endScrollLeft = 0;\n  }\n\n  if (Math.abs(endScrollLeft) >= Math.abs(extremeScrollLeft)) {\n    onScrollToEndBorder();\n    endScrollLeft = extremeScrollLeft;\n  }\n\n  const startTime = now();\n\n  (function scroll() {\n    const time = now();\n    const elapsed = Math.min((time - startTime) / scrollAnimationDuration, 1);\n\n    const value = easeInOutSine(elapsed);\n\n    const currentScrollLeft = startScrollLeft + (endScrollLeft - startScrollLeft) * value;\n    scrollElement.scrollLeft = roundingAwayFromZero(currentScrollLeft);\n\n    const scrollEnd =\n      textDirection === 'ltr' ? Math.max(0, endScrollLeft) : Math.min(0, endScrollLeft);\n    if (roundUpElementScrollLeft(scrollElement) !== scrollEnd && elapsed !== 1) {\n      requestAnimationFrame(scroll);\n      return;\n    }\n\n    onScrollEnd();\n    animationQueue.shift();\n    if (animationQueue.length > 0) {\n      animationQueue[0]();\n    }\n  })();\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/HorizontalScroll\n */\nexport const HorizontalScroll = ({\n  children,\n  getScrollToLeft,\n  getScrollToRight,\n  showArrows = true,\n  arrowSize = 'm',\n  arrowOffsetY,\n  scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n  getRef,\n  scrollOnAnyWheel = false,\n  prevButtonTestId,\n  nextButtonTestId,\n  getRootRef,\n  ...restProps\n}: HorizontalScrollProps): React.ReactNode => {\n  const [canScrollLeft, setCanScrollLeft] = React.useState(false);\n  const [canScrollRight, setCanScrollRight] = React.useState(false);\n  const [directionRef, textDirection] = useDirection<HTMLDivElement>();\n  const direction = textDirection || 'ltr';\n  const setCanScrollStart = direction === 'ltr' ? setCanScrollLeft : setCanScrollRight;\n  const setCanScrollEnd = direction === 'ltr' ? setCanScrollRight : setCanScrollLeft;\n\n  const isCustomScrollingRef = React.useRef(false);\n\n  const scrollerRef = useExternRef(getRef, directionRef);\n\n  const rootRef = useExternRef(getRootRef);\n\n  const animationQueue = React.useRef<VoidFunction[]>([]);\n\n  const hasPointer = useAdaptivityHasPointer();\n\n  const scrollTo = React.useCallback(\n    (getScrollPosition: ScrollPositionHandler) => {\n      const scrollElement = scrollerRef.current;\n\n      animationQueue.current.push(() =>\n        doScroll({\n          scrollElement,\n          getScrollPosition,\n          animationQueue: animationQueue.current,\n          onScrollToEndBorder: () => setCanScrollEnd(false),\n          onScrollEnd: () => (isCustomScrollingRef.current = false),\n          onScrollStart: () => (isCustomScrollingRef.current = true),\n          initialScrollWidth: scrollElement?.firstElementChild?.scrollWidth || 0,\n          scrollAnimationDuration,\n          textDirection: direction,\n        }),\n      );\n      if (animationQueue.current.length === 1) {\n        animationQueue.current[0]();\n      }\n    },\n    [scrollerRef, scrollAnimationDuration, direction, setCanScrollEnd],\n  );\n\n  const scrollToLeft = React.useCallback(() => {\n    const getScrollPosition =\n      getScrollToLeft ?? ((i: number) => i - scrollerRef.current!.offsetWidth);\n    scrollTo(getScrollPosition);\n  }, [getScrollToLeft, scrollTo, scrollerRef]);\n\n  const scrollToRight = React.useCallback(() => {\n    const getScrollPosition =\n      getScrollToRight ?? ((i: number) => i + scrollerRef.current!.offsetWidth);\n    scrollTo(getScrollPosition);\n  }, [getScrollToRight, scrollTo, scrollerRef]);\n\n  const calculateArrowsVisibility = React.useCallback(() => {\n    if (showArrows && hasPointer && scrollerRef.current && !isCustomScrollingRef.current) {\n      const scrollElement = scrollerRef.current;\n\n      setCanScrollStart(scrollElement.scrollLeft !== 0);\n      setCanScrollEnd(\n        Math.abs(roundUpElementScrollLeft(scrollElement)) + scrollElement.offsetWidth <\n          scrollElement.scrollWidth,\n      );\n    }\n  }, [showArrows, hasPointer, scrollerRef, setCanScrollStart, setCanScrollEnd]);\n\n  React.useEffect(calculateArrowsVisibility, [calculateArrowsVisibility, children]);\n\n  useIsomorphicLayoutEffect(\n    function addWheelEventHandler() {\n      if (!rootRef.current) {\n        return noop;\n      }\n      /**\n       * Прокрутка с помощью любого колеса мыши\n       */\n      const onWheel = (e: WheelEvent) => {\n        const left = e.deltaX + (scrollOnAnyWheel ? e.deltaY : 0);\n        scrollerRef.current!.scrollBy({ left, behavior: 'auto' });\n        if (e.deltaY && scrollOnAnyWheel) {\n          e.preventDefault();\n        }\n      };\n      const listenerOptions = { passive: false };\n      rootRef.current?.addEventListener('wheel', onWheel, listenerOptions);\n      // @ts-expect-error: TS2769 В интерфейсе EventListenerOptions для wheel нет passive свойства\n      return () => rootRef.current?.removeEventListener('wheel', onWheel, listenerOptions);\n    },\n    [rootRef, scrollOnAnyWheel, scrollerRef],\n  );\n\n  return (\n    <RootComponent\n      {...restProps}\n      getRootRef={rootRef}\n      baseClassName={classNames(\n        styles.host,\n        'vkuiInternalHorizontalScroll',\n        showArrows === 'always' && styles.withConstArrows,\n      )}\n      onMouseEnter={calculateArrowsVisibility}\n    >\n      {showArrows && (hasPointer || hasPointer === undefined) && canScrollLeft && (\n        <ScrollArrow\n          data-testid={prevButtonTestId}\n          size={arrowSize}\n          offsetY={arrowOffsetY}\n          direction=\"left\"\n          aria-hidden\n          tabIndex={-1}\n          className={classNames(styles.arrow, styles.arrowLeft)}\n          onClick={scrollToLeft}\n        />\n      )}\n      {showArrows && (hasPointer || hasPointer === undefined) && canScrollRight && (\n        <ScrollArrow\n          data-testid={nextButtonTestId}\n          size={arrowSize}\n          offsetY={arrowOffsetY}\n          direction=\"right\"\n          aria-hidden\n          tabIndex={-1}\n          className={classNames(styles.arrow, styles.arrowRight)}\n          onClick={scrollToRight}\n        />\n      )}\n      <div className={styles.in} ref={scrollerRef} onScroll={calculateArrowsVisibility}>\n        <div className={styles.inWrapper}>{children}</div>\n      </div>\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","noop","useAdaptivityHasPointer","useDirection","useExternRef","easeInOutSine","useIsomorphicLayoutEffect","RootComponent","ScrollArrow","now","performance","Date","roundingAwayFromZero","value","Math","ceil","floor","roundUpElementScrollLeft","el","scrollLeft","SCROLL_ONE_FRAME_TIME","doScroll","scrollElement","getScrollPosition","animationQueue","onScrollToEndBorder","onScrollEnd","onScrollStart","initialScrollWidth","scrollAnimationDuration","textDirection","extremeScrollLeft","offsetWidth","startScrollLeft","endScrollLeft","abs","startTime","scroll","time","elapsed","min","currentScrollLeft","scrollEnd","max","requestAnimationFrame","shift","length","HorizontalScroll","children","getScrollToLeft","getScrollToRight","showArrows","arrowSize","arrowOffsetY","getRef","scrollOnAnyWheel","prevButtonTestId","nextButtonTestId","getRootRef","restProps","canScrollLeft","setCanScrollLeft","useState","canScrollRight","setCanScrollRight","directionRef","direction","setCanScrollStart","setCanScrollEnd","isCustomScrollingRef","useRef","scrollerRef","rootRef","hasPointer","scrollTo","useCallback","current","push","firstElementChild","scrollWidth","scrollToLeft","i","scrollToRight","calculateArrowsVisibility","useEffect","addWheelEventHandler","onWheel","e","left","deltaX","deltaY","scrollBy","behavior","preventDefault","listenerOptions","passive","addEventListener","removeEventListener","baseClassName","onMouseEnter","undefined","data-testid","size","offsetY","aria-hidden","tabIndex","className","onClick","div","ref","onScroll"],"mappings":"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"}

package/dist/components/ModalCard/ModalCardInternal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModalCardInternal.d.ts","sourceRoot":"","sources":["../../../src/components/ModalCard/ModalCardInternal.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,aAAa,EAAsB,KAAK,SAAS,EAAe,MAAM,OAAO,CAAC;AAa5F,OAAO,EAEL,KAAK,iBAAiB,EACvB,MAAM,8BAA8B,CAAC;AACtC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAoB9C,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,cAAc,EAAE,KAAK,GAAG,aAAa,CAAC;IACzF,YAAY,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;CACjD;AAED;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,8TAyB3B,sBAAsB,KAAG,SAqG3B,CAAC"}
+{"version":3,"file":"ModalCardInternal.d.ts","sourceRoot":"","sources":["../../../src/components/ModalCard/ModalCardInternal.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,aAAa,EAAsB,KAAK,SAAS,EAAe,MAAM,OAAO,CAAC;AAa5F,OAAO,EAEL,KAAK,iBAAiB,EACvB,MAAM,8BAA8B,CAAC;AACtC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAoB9C,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,cAAc,EAAE,KAAK,GAAG,aAAa,CAAC;IACzF,YAAY,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;CACjD;AAED;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,8TAyB3B,sBAAsB,KAAG,SAsG3B,CAAC"}

package/dist/components/ModalCard/ModalCardInternal.js

@@ -115,6 +115,7 @@ const transitionStateClassNames = {
     });
     return /*#__PURE__*/ _jsxs(ModalOutlet, {
         hidden: hidden,
+        isDesktop: isDesktop,
         onKeyDown: handleEscKeyDown,
         children: [
             modalOverlay,
@@ -124,7 +125,7 @@ const transitionStateClassNames = {
                 "aria-modal": "true",
                 getRootRef: handleRef,
                 style: style,
-                className: classNames("vkuiModalCard__host", sizeByPlatformClassNames[platform], transitionStateClassNames[transitionState], className),
+                className: classNames("vkuiModalCard__host", isDesktop ? "vkuiModalCard__hostDesktop" : "vkuiModalCard__hostMobile", sizeByPlatformClassNames[platform], transitionStateClassNames[transitionState], className),
                 onTransitionEnd: onTransitionEnd
             }), bottomSheetEventHandlers), {
                 icon: icon,

package/dist/components/ModalCard/ModalCardInternal.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ModalCard/ModalCardInternal.tsx"],"sourcesContent":["'use client';\n\nimport { type ComponentType, type KeyboardEvent, type ReactNode, useCallback } from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useFocusTrap } from '../../hooks/useFocusTrap';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useVirtualKeyboardState } from '../../hooks/useVirtualKeyboardState';\nimport { Keys, pressedKey } from '../../lib/accessibility';\nimport { useCSSTransition, type UseCSSTransitionState } from '../../lib/animation';\nimport { useBottomSheet } from '../../lib/sheet';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { ModalCardBase } from '../ModalCardBase/ModalCardBase';\nimport { ModalOutlet } from '../ModalOutlet/ModalOutlet';\nimport {\n  ModalOverlay as ModalOverlayDefault,\n  type ModalOverlayProps,\n} from '../ModalOverlay/ModalOverlay';\nimport type { ModalCardProps } from './types';\nimport styles from './ModalCard.module.css';\n\nconst sizeByPlatformClassNames = {\n  vkcom: styles['hostMaxWidthS'],\n  ios: styles['hostMaxWidthM'],\n  android: styles['hostMaxWidthL'],\n};\n\nconst transitionStateClassNames: Partial<Record<UseCSSTransitionState, string>> = {\n  appear: styles['hostStateEnter'],\n  appearing: styles['hostStateEntering'],\n\n  enter: styles['hostStateEnter'],\n  entering: styles['hostStateEntering'],\n\n  exiting: styles['hostStateExiting'],\n  exited: styles['hostStateExited'],\n};\n\nexport interface ModalCardInternalProps extends Omit<ModalCardProps, 'nav' | 'keepMounted'> {\n  ModalOverlay?: ComponentType<ModalOverlayProps>;\n}\n\n/**\n * В компоненте заложена вся логика модального окна.\n *\n * @private\n */\nexport const ModalCardInternal = ({\n  icon,\n  title,\n  titleComponent,\n  description,\n  descriptionComponent,\n  children,\n  actions,\n  size,\n  open,\n  style: styleProp,\n  className,\n  preventClose,\n  ModalOverlay = ModalOverlayDefault,\n  modalOverlayTestId,\n  modalDismissButtonTestId,\n  getRootRef,\n  dismissButtonMode,\n  dismissLabel,\n  noFocusToDialog,\n  onOpen,\n  onOpened,\n  onClose = noop,\n  onClosed,\n  ...restProps\n}: ModalCardInternalProps): ReactNode => {\n  const platform = usePlatform();\n  const [transitionState, { ref, onTransitionEnd }] = useCSSTransition<HTMLDivElement>(open, {\n    enableAppear: true,\n    onEnter() {\n      onOpen?.();\n    },\n    onEntered() {\n      onOpened?.();\n    },\n    onExited() {\n      onClosed?.();\n    },\n  });\n  const opened = transitionState === 'appeared' || transitionState === 'entered';\n  const hidden = transitionState === 'exited';\n  const closable = !preventClose && opened;\n\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const bottomSheetEnabled = !isDesktop && !preventClose && transitionState !== 'exited';\n\n  const { opened: keyboardOpened } = useVirtualKeyboardState(bottomSheetEnabled);\n  const [{ setSheetEl, setBackdropEl }, bottomSheetEventHandlers] = useBottomSheet(\n    bottomSheetEnabled,\n    {\n      blocked: keyboardOpened,\n      snapPoint: 'auto',\n      sheetCSSProperty: '--vkui_internal_ModalCard--translateY',\n      backdropCSSProperty: '--vkui_internal--modal-overlay--opacity',\n      onDismiss() {\n        onClose?.('swipe-down');\n      },\n    },\n  );\n  const handleRef = useExternRef<HTMLDivElement>(setSheetEl, ref, getRootRef);\n  const style = keyboardOpened\n    ? {\n        ...styleProp,\n        '--vkui_internal_ModalCard--safeAreaInsetBottom': '0px',\n      }\n    : styleProp;\n  const modalOverlay = (\n    <ModalOverlay\n      getRootRef={setBackdropEl}\n      data-testid={modalOverlayTestId}\n      visible={open}\n      onClick={\n        closable\n          ? function handleBackdropClick(event) {\n              onClose('click-overlay', event);\n            }\n          : undefined\n      }\n    />\n  );\n  const handleEscKeyDown = useCallback(\n    (event: KeyboardEvent<HTMLElement>) => {\n      if (closable && pressedKey(event) === Keys.ESCAPE) {\n        onClose('escape-key');\n      }\n    },\n    [closable, onClose],\n  );\n\n  useScrollLock(!hidden);\n  useFocusTrap(ref, { autoFocus: !noFocusToDialog, disabled: !opened || hidden });\n\n  return (\n    <ModalOutlet hidden={hidden} onKeyDown={handleEscKeyDown}>\n      {modalOverlay}\n      <ModalCardBase\n        {...restProps}\n        tabIndex={-1}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        getRootRef={handleRef}\n        style={style}\n        className={classNames(\n          styles.host,\n          sizeByPlatformClassNames[platform],\n          transitionStateClassNames[transitionState],\n          className,\n        )}\n        onTransitionEnd={onTransitionEnd}\n        {...bottomSheetEventHandlers}\n        icon={icon}\n        title={title}\n        titleComponent={titleComponent}\n        description={description}\n        descriptionComponent={descriptionComponent}\n        actions={actions}\n        onClose={() => onClose('click-close-button')}\n        size={size}\n        modalDismissButtonTestId={modalDismissButtonTestId}\n        dismissButtonMode={dismissButtonMode}\n        dismissLabel={dismissLabel}\n      >\n        {children}\n      </ModalCardBase>\n    </ModalOutlet>\n  );\n};\n"],"names":["useCallback","classNames","noop","useAdaptivityWithJSMediaQueries","useExternRef","useFocusTrap","usePlatform","useVirtualKeyboardState","Keys","pressedKey","useCSSTransition","useBottomSheet","useScrollLock","ModalCardBase","ModalOutlet","ModalOverlay","ModalOverlayDefault","sizeByPlatformClassNames","vkcom","ios","android","transitionStateClassNames","appear","appearing","enter","entering","exiting","exited","ModalCardInternal","icon","title","titleComponent","description","descriptionComponent","children","actions","size","open","style","styleProp","className","preventClose","modalOverlayTestId","modalDismissButtonTestId","getRootRef","dismissButtonMode","dismissLabel","noFocusToDialog","onOpen","onOpened","onClose","onClosed","restProps","platform","transitionState","ref","onTransitionEnd","enableAppear","onEnter","onEntered","onExited","opened","hidden","closable","isDesktop","bottomSheetEnabled","keyboardOpened","setSheetEl","setBackdropEl","bottomSheetEventHandlers","blocked","snapPoint","sheetCSSProperty","backdropCSSProperty","onDismiss","handleRef","modalOverlay","data-testid","visible","onClick","handleBackdropClick","event","undefined","handleEscKeyDown","ESCAPE","autoFocus","disabled","onKeyDown","tabIndex","role","aria-modal"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/ModalCard/ModalCardInternal.tsx"],"sourcesContent":["'use client';\n\nimport { type ComponentType, type KeyboardEvent, type ReactNode, useCallback } from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useFocusTrap } from '../../hooks/useFocusTrap';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useVirtualKeyboardState } from '../../hooks/useVirtualKeyboardState';\nimport { Keys, pressedKey } from '../../lib/accessibility';\nimport { useCSSTransition, type UseCSSTransitionState } from '../../lib/animation';\nimport { useBottomSheet } from '../../lib/sheet';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { ModalCardBase } from '../ModalCardBase/ModalCardBase';\nimport { ModalOutlet } from '../ModalOutlet/ModalOutlet';\nimport {\n  ModalOverlay as ModalOverlayDefault,\n  type ModalOverlayProps,\n} from '../ModalOverlay/ModalOverlay';\nimport type { ModalCardProps } from './types';\nimport styles from './ModalCard.module.css';\n\nconst sizeByPlatformClassNames = {\n  vkcom: styles['hostMaxWidthS'],\n  ios: styles['hostMaxWidthM'],\n  android: styles['hostMaxWidthL'],\n};\n\nconst transitionStateClassNames: Partial<Record<UseCSSTransitionState, string>> = {\n  appear: styles['hostStateEnter'],\n  appearing: styles['hostStateEntering'],\n\n  enter: styles['hostStateEnter'],\n  entering: styles['hostStateEntering'],\n\n  exiting: styles['hostStateExiting'],\n  exited: styles['hostStateExited'],\n};\n\nexport interface ModalCardInternalProps extends Omit<ModalCardProps, 'nav' | 'keepMounted'> {\n  ModalOverlay?: ComponentType<ModalOverlayProps>;\n}\n\n/**\n * В компоненте заложена вся логика модального окна.\n *\n * @private\n */\nexport const ModalCardInternal = ({\n  icon,\n  title,\n  titleComponent,\n  description,\n  descriptionComponent,\n  children,\n  actions,\n  size,\n  open,\n  style: styleProp,\n  className,\n  preventClose,\n  ModalOverlay = ModalOverlayDefault,\n  modalOverlayTestId,\n  modalDismissButtonTestId,\n  getRootRef,\n  dismissButtonMode,\n  dismissLabel,\n  noFocusToDialog,\n  onOpen,\n  onOpened,\n  onClose = noop,\n  onClosed,\n  ...restProps\n}: ModalCardInternalProps): ReactNode => {\n  const platform = usePlatform();\n  const [transitionState, { ref, onTransitionEnd }] = useCSSTransition<HTMLDivElement>(open, {\n    enableAppear: true,\n    onEnter() {\n      onOpen?.();\n    },\n    onEntered() {\n      onOpened?.();\n    },\n    onExited() {\n      onClosed?.();\n    },\n  });\n  const opened = transitionState === 'appeared' || transitionState === 'entered';\n  const hidden = transitionState === 'exited';\n  const closable = !preventClose && opened;\n\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const bottomSheetEnabled = !isDesktop && !preventClose && transitionState !== 'exited';\n\n  const { opened: keyboardOpened } = useVirtualKeyboardState(bottomSheetEnabled);\n  const [{ setSheetEl, setBackdropEl }, bottomSheetEventHandlers] = useBottomSheet(\n    bottomSheetEnabled,\n    {\n      blocked: keyboardOpened,\n      snapPoint: 'auto',\n      sheetCSSProperty: '--vkui_internal_ModalCard--translateY',\n      backdropCSSProperty: '--vkui_internal--modal-overlay--opacity',\n      onDismiss() {\n        onClose?.('swipe-down');\n      },\n    },\n  );\n  const handleRef = useExternRef<HTMLDivElement>(setSheetEl, ref, getRootRef);\n  const style = keyboardOpened\n    ? {\n        ...styleProp,\n        '--vkui_internal_ModalCard--safeAreaInsetBottom': '0px',\n      }\n    : styleProp;\n  const modalOverlay = (\n    <ModalOverlay\n      getRootRef={setBackdropEl}\n      data-testid={modalOverlayTestId}\n      visible={open}\n      onClick={\n        closable\n          ? function handleBackdropClick(event) {\n              onClose('click-overlay', event);\n            }\n          : undefined\n      }\n    />\n  );\n  const handleEscKeyDown = useCallback(\n    (event: KeyboardEvent<HTMLElement>) => {\n      if (closable && pressedKey(event) === Keys.ESCAPE) {\n        onClose('escape-key');\n      }\n    },\n    [closable, onClose],\n  );\n\n  useScrollLock(!hidden);\n  useFocusTrap(ref, { autoFocus: !noFocusToDialog, disabled: !opened || hidden });\n\n  return (\n    <ModalOutlet hidden={hidden} isDesktop={isDesktop} onKeyDown={handleEscKeyDown}>\n      {modalOverlay}\n      <ModalCardBase\n        {...restProps}\n        tabIndex={-1}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        getRootRef={handleRef}\n        style={style}\n        className={classNames(\n          styles.host,\n          isDesktop ? styles.hostDesktop : styles.hostMobile,\n          sizeByPlatformClassNames[platform],\n          transitionStateClassNames[transitionState],\n          className,\n        )}\n        onTransitionEnd={onTransitionEnd}\n        {...bottomSheetEventHandlers}\n        icon={icon}\n        title={title}\n        titleComponent={titleComponent}\n        description={description}\n        descriptionComponent={descriptionComponent}\n        actions={actions}\n        onClose={() => onClose('click-close-button')}\n        size={size}\n        modalDismissButtonTestId={modalDismissButtonTestId}\n        dismissButtonMode={dismissButtonMode}\n        dismissLabel={dismissLabel}\n      >\n        {children}\n      </ModalCardBase>\n    </ModalOutlet>\n  );\n};\n"],"names":["useCallback","classNames","noop","useAdaptivityWithJSMediaQueries","useExternRef","useFocusTrap","usePlatform","useVirtualKeyboardState","Keys","pressedKey","useCSSTransition","useBottomSheet","useScrollLock","ModalCardBase","ModalOutlet","ModalOverlay","ModalOverlayDefault","sizeByPlatformClassNames","vkcom","ios","android","transitionStateClassNames","appear","appearing","enter","entering","exiting","exited","ModalCardInternal","icon","title","titleComponent","description","descriptionComponent","children","actions","size","open","style","styleProp","className","preventClose","modalOverlayTestId","modalDismissButtonTestId","getRootRef","dismissButtonMode","dismissLabel","noFocusToDialog","onOpen","onOpened","onClose","onClosed","restProps","platform","transitionState","ref","onTransitionEnd","enableAppear","onEnter","onEntered","onExited","opened","hidden","closable","isDesktop","bottomSheetEnabled","keyboardOpened","setSheetEl","setBackdropEl","bottomSheetEventHandlers","blocked","snapPoint","sheetCSSProperty","backdropCSSProperty","onDismiss","handleRef","modalOverlay","data-testid","visible","onClick","handleBackdropClick","event","undefined","handleEscKeyDown","ESCAPE","autoFocus","disabled","onKeyDown","tabIndex","role","aria-modal"],"mappings":"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"}

package/dist/components/ModalOutlet/ModalOutlet.d.ts

@@ -1,9 +1,10 @@
 import type { HTMLAttributesWithRootRef } from '../../types';
 export interface ModalOutletProps extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'hidden' | 'aria-hidden'> {
     hidden?: boolean;
+    isDesktop?: boolean;
 }
 /**
  * @private
  */
-export declare const ModalOutlet: ({ className, hidden, children, getRootRef, ...restProps }: ModalOutletProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ModalOutlet: ({ className, hidden, isDesktop, children, getRootRef, ...restProps }: ModalOutletProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ModalOutlet.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"ModalOutlet.d.ts","sourceRoot":"","sources":["../../../src/components/ModalOutlet/ModalOutlet.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAG7D,MAAM,WAAW,gBACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,QAAQ,GAAG,aAAa,CAAC;IACjF,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED;;GAEG;AACH,eAAO,MAAM,WAAW,8DAMrB,gBAAgB,4CAYlB,CAAC"}
+{"version":3,"file":"ModalOutlet.d.ts","sourceRoot":"","sources":["../../../src/components/ModalOutlet/ModalOutlet.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAG7D,MAAM,WAAW,gBACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,QAAQ,GAAG,aAAa,CAAC;IACjF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;GAEG;AACH,eAAO,MAAM,WAAW,yEAOrB,gBAAgB,4CAYlB,CAAC"}

package/dist/components/ModalOutlet/ModalOutlet.js

@@ -6,15 +6,16 @@ import { classNames } from "@vkontakte/vkjs";
 /**
  * @private
  */ export const ModalOutlet = (_param)=>{
-    var { className, hidden, children, getRootRef } = _param, restProps = _object_without_properties(_param, [
+    var { className, hidden, isDesktop, children, getRootRef } = _param, restProps = _object_without_properties(_param, [
         "className",
         "hidden",
+        "isDesktop",
         "children",
         "getRootRef"
     ]);
     return /*#__PURE__*/ _jsx("div", _object_spread_props(_object_spread({
         ref: getRootRef,
-        className: classNames(className, "vkuiModalOutlet__host"),
+        className: classNames(className, "vkuiModalOutlet__host", isDesktop && "vkuiModalOutlet__hostDesktop"),
         hidden: hidden,
         "aria-hidden": hidden
     }, restProps), {

package/dist/components/ModalOutlet/ModalOutlet.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ModalOutlet/ModalOutlet.tsx"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport styles from './ModalOutlet.module.css';\n\nexport interface ModalOutletProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'hidden' | 'aria-hidden'> {\n  hidden?: boolean;\n}\n\n/**\n * @private\n */\nexport const ModalOutlet = ({\n  className,\n  hidden,\n  children,\n  getRootRef,\n  ...restProps\n}: ModalOutletProps) => {\n  return (\n    <div\n      ref={getRootRef}\n      className={classNames(className, styles.host)}\n      hidden={hidden}\n      aria-hidden={hidden}\n      {...restProps}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["classNames","ModalOutlet","className","hidden","children","getRootRef","restProps","div","ref","aria-hidden"],"mappings":";;;;AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAS7C;;CAEC,GACD,OAAO,MAAMC,cAAc;QAAC,EAC1BC,SAAS,EACTC,MAAM,EACNC,QAAQ,EACRC,UAAU,EAEO,WADdC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,qBACE,KAACE;QACCC,KAAKH;QACLH,WAAWF,WAAWE;QACtBC,QAAQA;QACRM,eAAaN;OACTG;kBAEHF;;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/ModalOutlet/ModalOutlet.tsx"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport styles from './ModalOutlet.module.css';\n\nexport interface ModalOutletProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'hidden' | 'aria-hidden'> {\n  hidden?: boolean;\n  isDesktop?: boolean;\n}\n\n/**\n * @private\n */\nexport const ModalOutlet = ({\n  className,\n  hidden,\n  isDesktop,\n  children,\n  getRootRef,\n  ...restProps\n}: ModalOutletProps) => {\n  return (\n    <div\n      ref={getRootRef}\n      className={classNames(className, styles.host, isDesktop && styles.hostDesktop)}\n      hidden={hidden}\n      aria-hidden={hidden}\n      {...restProps}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["classNames","ModalOutlet","className","hidden","isDesktop","children","getRootRef","restProps","div","ref","aria-hidden"],"mappings":";;;;AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAU7C;;CAEC,GACD,OAAO,MAAMC,cAAc;QAAC,EAC1BC,SAAS,EACTC,MAAM,EACNC,SAAS,EACTC,QAAQ,EACRC,UAAU,EAEO,WADdC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,KAACE;QACCC,KAAKH;QACLJ,WAAWF,WAAWE,oCAAwBE;QAC9CD,QAAQA;QACRO,eAAaP;OACTI;kBAEHF;;AAGP,EAAE"}

package/dist/components/ModalPage/ModalPageInternal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModalPageInternal.d.ts","sourceRoot":"","sources":["../../../src/components/ModalPage/ModalPageInternal.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,aAAa,EAAmC,MAAM,OAAO,CAAC;AAO5E,OAAO,EAEL,KAAK,SAAS,EACd,KAAK,eAAe,EAErB,MAAM,iBAAiB,CAAC;AAOzB,OAAO,EAEL,KAAK,iBAAiB,EACvB,MAAM,8BAA8B,CAAC;AAEtC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAc9C,MAAM,WAAW,sBACf,SAAQ,IAAI,CAAC,cAAc,EAAE,KAAK,GAAG,aAAa,GAAG,gBAAgB,GAAG,sBAAsB,CAAC;IAC/F,SAAS,EAAE,SAAS,CAAC;IACrB,YAAY,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAChD,iBAAiB,CAAC,EAAE,eAAe,CAAC;CACrC;AAED;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,2VAyB3B,sBAAsB,4CAqIxB,CAAC"}
+{"version":3,"file":"ModalPageInternal.d.ts","sourceRoot":"","sources":["../../../src/components/ModalPage/ModalPageInternal.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,aAAa,EAAmC,MAAM,OAAO,CAAC;AAQ5E,OAAO,EAEL,KAAK,SAAS,EACd,KAAK,eAAe,EAErB,MAAM,iBAAiB,CAAC;AAOzB,OAAO,EAEL,KAAK,iBAAiB,EACvB,MAAM,8BAA8B,CAAC;AAEtC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAc9C,MAAM,WAAW,sBACf,SAAQ,IAAI,CAAC,cAAc,EAAE,KAAK,GAAG,aAAa,GAAG,gBAAgB,GAAG,sBAAsB,CAAC;IAC/F,SAAS,EAAE,SAAS,CAAC;IACrB,YAAY,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAChD,iBAAiB,CAAC,EAAE,eAAe,CAAC;CACrC;AAED;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,2VAyB3B,sBAAsB,4CAyIxB,CAAC"}

package/dist/components/ModalPage/ModalPageInternal.js

@@ -5,6 +5,7 @@ import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback } from "react";
 import { classNames, hasReactNode, noop } from "@vkontakte/vkjs";
+import { mergeStyle } from "../../helpers/mergeStyle.js";
 import { useAdaptivityWithJSMediaQueries } from "../../hooks/useAdaptivityWithJSMediaQueries.js";
 import { useExternRef } from "../../hooks/useExternRef.js";
 import { useVirtualKeyboardState } from "../../hooks/useVirtualKeyboardState.js";
@@ -91,7 +92,7 @@ const transitionStateClassNames = {
     const handleSheetRef = useExternRef(setSheetEl, ref);
     const handleSheetScrollRef = useExternRef(setSheetScrollEl, getModalContentRef);
     const disableContentPanningGestureProp = disableContentPanningGesture ? BLOCK_SHEET_BEHAVIOR_DATA_ATTRIBUTE : undefined;
-    const [desktopMaxWidthClassName, desktopMaxWidthStyle] = resolveDesktopMaxWidth(desktopMaxWidth);
+    const [desktopMaxWidthClassName, desktopMaxWidthStyle] = resolveDesktopMaxWidth(isDesktop ? desktopMaxWidth : 's');
     const modalOverlay = /*#__PURE__*/ _jsx(ModalOverlay, {
         getRootRef: setBackdropEl,
         "data-testid": modalOverlayTestId,
@@ -117,6 +118,7 @@ const transitionStateClassNames = {
     useScrollLock(!hidden);
     return /*#__PURE__*/ _jsxs(ModalOutlet, {
         hidden: hidden,
+        isDesktop: isDesktop,
         onKeyDown: handleEscKeyDown,
         children: [
             modalOverlay,
@@ -125,17 +127,17 @@ const transitionStateClassNames = {
                 role: "dialog",
                 "aria-modal": "true",
                 disabled: !opened || hidden,
-                className: classNames(className, "vkuiModalPage__host", sizeX === 'regular' && 'vkuiInternalModalPage--sizeX-regular', hasCustomPanelHeaderAfter ? "vkuiModalPage__hostSafeAreaInsetTopWithCustomOffset" : "vkuiModalPage__hostSafeAreaInsetTop", desktopMaxWidthClassName),
-                style: _object_spread({}, style, desktopMaxWidthStyle, getHeightCSSVariable(height)),
+                className: classNames(className, "vkuiModalPage__host", isDesktop ? "vkuiModalPage__hostDesktop" : "vkuiModalPage__hostMobile", !isDesktop && (hasCustomPanelHeaderAfter ? "vkuiModalPage__hostMobileSafeAreaInsetTopWithCustomOffset" : "vkuiModalPage__hostMobileSafeAreaInsetTop"), desktopMaxWidthClassName, sizeX === 'regular' && 'vkuiInternalModalPage--sizeX-regular'),
+                style: mergeStyle(mergeStyle(desktopMaxWidthStyle, getHeightCSSVariable(height)), style),
                 children: /*#__PURE__*/ _jsxs("div", _object_spread_props(_object_spread({}, bottomSheetEventHandlers), {
                     ref: handleSheetRef,
                     role: "document",
                     style: documentStyle,
-                    className: classNames("vkuiModalPage__document", transitionStateClassNames[transitionState]),
+                    className: classNames("vkuiModalPage__document", isDesktop ? "vkuiModalPage__documentDesktop" : "vkuiModalPage__documentMobile", transitionStateClassNames[transitionState]),
                     onTransitionEnd: onTransitionEnd,
                     children: [
                         /*#__PURE__*/ _jsxs("div", {
-                            className: "vkuiModalPage__children",
+                            className: classNames("vkuiModalPage__children", isDesktop && "vkuiModalPage__childrenDesktop"),
                             children: [
                                 hasReactNode(header) && header,
                                 /*#__PURE__*/ _jsx(ModalPageContent, _object_spread_props(_object_spread({
@@ -155,9 +157,9 @@ const transitionStateClassNames = {
     });
 };
 const desktopMaxWidthClassNames = {
-    s: "vkuiModalPage__hostMaxWidthS",
-    m: "vkuiModalPage__hostMaxWidthM",
-    l: "vkuiModalPage__hostMaxWidthL"
+    s: "vkuiModalPage__hostDesktopMaxWidthS",
+    m: "vkuiModalPage__hostDesktopMaxWidthM",
+    l: "vkuiModalPage__hostDesktopMaxWidthL"
 };
 function resolveDesktopMaxWidth(desktopMaxWidth = 's') {
     if (typeof desktopMaxWidth === 'string') {
@@ -175,7 +177,7 @@ function resolveDesktopMaxWidth(desktopMaxWidth = 's') {
 }
 function getHeightCSSVariable(height) {
     return height !== undefined ? {
-        '--vkui_internal_ModalPage--userHeight': `${height}`
+        '--vkui_internal_ModalPage--userHeight': typeof height === 'number' ? `${height}px` : height
     } : undefined;
 }
 

package/dist/components/ModalPage/ModalPageInternal.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ModalPage/ModalPageInternal.tsx"],"sourcesContent":["'use client';\n\nimport { type ComponentType, type KeyboardEvent, useCallback } from 'react';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useVirtualKeyboardState } from '../../hooks/useVirtualKeyboardState';\nimport { Keys, pressedKey } from '../../lib/accessibility';\nimport { useCSSTransition, type UseCSSTransitionState } from '../../lib/animation';\nimport {\n  BLOCK_SHEET_BEHAVIOR_DATA_ATTRIBUTE,\n  type SnapPoint,\n  type SnapPointChange,\n  useBottomSheet,\n} from '../../lib/sheet';\nimport type { CSSCustomProperties } from '../../types';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { ModalOutlet } from '../ModalOutlet/ModalOutlet';\nimport {\n  ModalOverlay as ModalOverlayDefault,\n  type ModalOverlayProps,\n} from '../ModalOverlay/ModalOverlay';\nimport { ModalPageContent } from '../ModalPageContent/ModalPageContent';\nimport type { ModalPageProps } from './types';\nimport styles from './ModalPage.module.css';\n\nconst transitionStateClassNames: Partial<Record<UseCSSTransitionState, string>> = {\n  appear: styles['documentStateEnter'],\n  appearing: styles['documentStateEntering'],\n\n  enter: styles['documentStateEnter'],\n  entering: styles['documentStateEntering'],\n\n  exiting: styles['documentStateExiting'],\n  exited: styles['documentStateExited'],\n};\n\nexport interface ModalPageInternalProps\n  extends Omit<ModalPageProps, 'nav' | 'keepMounted' | 'settlingHeight' | 'dynamicContentHeight'> {\n  snapPoint: SnapPoint;\n  ModalOverlay?: ComponentType<ModalOverlayProps>;\n  onSnapPointChange?: SnapPointChange;\n}\n\n/**\n * В компоненте заложена вся логика модального окна.\n *\n * @private\n */\nexport const ModalPageInternal = ({\n  open,\n  header,\n  footer,\n  size: desktopMaxWidth,\n  height,\n  children,\n  className,\n  style,\n  snapPoint,\n  onSnapPointChange,\n  getModalContentRef,\n  ModalOverlay = ModalOverlayDefault,\n  modalOverlayTestId,\n  modalContentTestId,\n  modalDismissButtonTestId,\n  noFocusToDialog,\n  hideCloseButton,\n  preventClose,\n  disableContentPanningGesture,\n  onOpen,\n  onOpened,\n  onClose = noop,\n  onClosed,\n  ...restProps\n}: ModalPageInternalProps) => {\n  const { hasCustomPanelHeaderAfter } = useConfigProvider();\n  const [transitionState, { ref, onTransitionEnd }] = useCSSTransition<HTMLDivElement>(open, {\n    enableAppear: true,\n    onEnter() {\n      onOpen?.();\n    },\n    onEntered() {\n      onOpened?.();\n    },\n    onExited() {\n      onClosed?.();\n    },\n  });\n  const opened = transitionState === 'appeared' || transitionState === 'entered';\n  const hidden = transitionState === 'exited';\n  const closable = !preventClose && opened;\n\n  const { sizeX, isDesktop } = useAdaptivityWithJSMediaQueries();\n  const bottomSheetEnabled = !isDesktop && !preventClose && transitionState !== 'exited';\n  const { opened: keyboardOpened } = useVirtualKeyboardState(bottomSheetEnabled);\n\n  const [{ initialStyle, setSheetEl, setSheetScrollEl, setBackdropEl }, bottomSheetEventHandlers] =\n    useBottomSheet(bottomSheetEnabled, {\n      blocked: keyboardOpened,\n      snapPoint,\n      sheetCSSProperty: '--vkui_internal_ModalPageDocument--snapPoint',\n      backdropCSSProperty: '--vkui_internal--modal-overlay--opacity',\n      onSnapPointChange,\n      onDismiss() {\n        onClose('swipe-down');\n      },\n    });\n  const documentStyle = keyboardOpened\n    ? {\n        '--vkui_internal_ModalPageDocument--safeAreaInsetBottom': '0px',\n        ...initialStyle,\n      }\n    : initialStyle;\n  const handleSheetRef = useExternRef<HTMLDivElement>(setSheetEl, ref);\n  const handleSheetScrollRef = useExternRef<HTMLDivElement>(setSheetScrollEl, getModalContentRef);\n\n  const disableContentPanningGestureProp = disableContentPanningGesture\n    ? BLOCK_SHEET_BEHAVIOR_DATA_ATTRIBUTE\n    : undefined;\n  const [desktopMaxWidthClassName, desktopMaxWidthStyle] = resolveDesktopMaxWidth(desktopMaxWidth);\n\n  const modalOverlay = (\n    <ModalOverlay\n      getRootRef={setBackdropEl}\n      data-testid={modalOverlayTestId}\n      visible={open}\n      onClick={\n        closable\n          ? function handleBackdropClick(event) {\n              onClose('click-overlay', event);\n            }\n          : undefined\n      }\n    />\n  );\n  const closeButton =\n    hideCloseButton || !isDesktop ? null : (\n      <ModalDismissButton\n        data-testid={modalDismissButtonTestId}\n        onClick={\n          closable\n            ? function handleDismissButtonClick(event) {\n                onClose('click-close-button', event);\n              }\n            : undefined\n        }\n      />\n    );\n  const handleEscKeyDown = useCallback(\n    (event: KeyboardEvent<HTMLElement>) => {\n      if (closable && pressedKey(event) === Keys.ESCAPE) {\n        onClose('escape-key');\n      }\n    },\n    [closable, onClose],\n  );\n\n  useScrollLock(!hidden);\n\n  return (\n    <ModalOutlet hidden={hidden} onKeyDown={handleEscKeyDown}>\n      {modalOverlay}\n      <FocusTrap\n        {...restProps}\n        autoFocus={!noFocusToDialog}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        disabled={!opened || hidden}\n        className={classNames(\n          className,\n          styles.host,\n          sizeX === 'regular' && 'vkuiInternalModalPage--sizeX-regular',\n          hasCustomPanelHeaderAfter\n            ? styles.hostSafeAreaInsetTopWithCustomOffset\n            : styles.hostSafeAreaInsetTop,\n          desktopMaxWidthClassName,\n        )}\n        style={{\n          ...style,\n          ...desktopMaxWidthStyle,\n          ...getHeightCSSVariable(height),\n        }}\n      >\n        <div\n          {...bottomSheetEventHandlers}\n          ref={handleSheetRef}\n          role=\"document\"\n          style={documentStyle}\n          className={classNames(styles.document, transitionStateClassNames[transitionState])}\n          onTransitionEnd={onTransitionEnd}\n        >\n          <div className={styles.children}>\n            {hasReactNode(header) && header}\n            <ModalPageContent\n              getRootRef={handleSheetScrollRef}\n              data-testid={modalContentTestId}\n              {...disableContentPanningGestureProp}\n            >\n              {children}\n            </ModalPageContent>\n            {hasReactNode(footer) && footer}\n          </div>\n          {closeButton}\n        </div>\n      </FocusTrap>\n    </ModalOutlet>\n  );\n};\n\nconst desktopMaxWidthClassNames = {\n  s: styles['hostMaxWidthS'],\n  m: styles['hostMaxWidthM'],\n  l: styles['hostMaxWidthL'],\n};\n\nfunction resolveDesktopMaxWidth(\n  desktopMaxWidth: ModalPageInternalProps['size'] = 's',\n): [string | undefined, CSSCustomProperties | undefined] {\n  if (typeof desktopMaxWidth === 'string') {\n    return [desktopMaxWidthClassNames[desktopMaxWidth], undefined];\n  }\n\n  return [\n    undefined,\n    typeof desktopMaxWidth === 'number'\n      ? { '--vkui_internal_ModalPage--desktopMaxWidth': `${desktopMaxWidth}px` }\n      : undefined,\n  ];\n}\n\nfunction getHeightCSSVariable(height?: number | string): CSSCustomProperties | undefined {\n  return height !== undefined\n    ? { '--vkui_internal_ModalPage--userHeight': `${height}` }\n    : undefined;\n}\n"],"names":["useCallback","classNames","hasReactNode","noop","useAdaptivityWithJSMediaQueries","useExternRef","useVirtualKeyboardState","Keys","pressedKey","useCSSTransition","BLOCK_SHEET_BEHAVIOR_DATA_ATTRIBUTE","useBottomSheet","useScrollLock","useConfigProvider","FocusTrap","ModalDismissButton","ModalOutlet","ModalOverlay","ModalOverlayDefault","ModalPageContent","transitionStateClassNames","appear","appearing","enter","entering","exiting","exited","ModalPageInternal","open","header","footer","size","desktopMaxWidth","height","children","className","style","snapPoint","onSnapPointChange","getModalContentRef","modalOverlayTestId","modalContentTestId","modalDismissButtonTestId","noFocusToDialog","hideCloseButton","preventClose","disableContentPanningGesture","onOpen","onOpened","onClose","onClosed","restProps","hasCustomPanelHeaderAfter","transitionState","ref","onTransitionEnd","enableAppear","onEnter","onEntered","onExited","opened","hidden","closable","sizeX","isDesktop","bottomSheetEnabled","keyboardOpened","initialStyle","setSheetEl","setSheetScrollEl","setBackdropEl","bottomSheetEventHandlers","blocked","sheetCSSProperty","backdropCSSProperty","onDismiss","documentStyle","handleSheetRef","handleSheetScrollRef","disableContentPanningGestureProp","undefined","desktopMaxWidthClassName","desktopMaxWidthStyle","resolveDesktopMaxWidth","modalOverlay","getRootRef","data-testid","visible","onClick","handleBackdropClick","event","closeButton","handleDismissButtonClick","handleEscKeyDown","ESCAPE","onKeyDown","autoFocus","role","aria-modal","disabled","getHeightCSSVariable","div","desktopMaxWidthClassNames","s","m","l"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/ModalPage/ModalPageInternal.tsx"],"sourcesContent":["'use client';\n\nimport { type ComponentType, type KeyboardEvent, useCallback } from 'react';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { mergeStyle } from '../../helpers/mergeStyle';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useVirtualKeyboardState } from '../../hooks/useVirtualKeyboardState';\nimport { Keys, pressedKey } from '../../lib/accessibility';\nimport { useCSSTransition, type UseCSSTransitionState } from '../../lib/animation';\nimport {\n  BLOCK_SHEET_BEHAVIOR_DATA_ATTRIBUTE,\n  type SnapPoint,\n  type SnapPointChange,\n  useBottomSheet,\n} from '../../lib/sheet';\nimport type { CSSCustomProperties } from '../../types';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { ModalOutlet } from '../ModalOutlet/ModalOutlet';\nimport {\n  ModalOverlay as ModalOverlayDefault,\n  type ModalOverlayProps,\n} from '../ModalOverlay/ModalOverlay';\nimport { ModalPageContent } from '../ModalPageContent/ModalPageContent';\nimport type { ModalPageProps } from './types';\nimport styles from './ModalPage.module.css';\n\nconst transitionStateClassNames: Partial<Record<UseCSSTransitionState, string>> = {\n  appear: styles['documentStateEnter'],\n  appearing: styles['documentStateEntering'],\n\n  enter: styles['documentStateEnter'],\n  entering: styles['documentStateEntering'],\n\n  exiting: styles['documentStateExiting'],\n  exited: styles['documentStateExited'],\n};\n\nexport interface ModalPageInternalProps\n  extends Omit<ModalPageProps, 'nav' | 'keepMounted' | 'settlingHeight' | 'dynamicContentHeight'> {\n  snapPoint: SnapPoint;\n  ModalOverlay?: ComponentType<ModalOverlayProps>;\n  onSnapPointChange?: SnapPointChange;\n}\n\n/**\n * В компоненте заложена вся логика модального окна.\n *\n * @private\n */\nexport const ModalPageInternal = ({\n  open,\n  header,\n  footer,\n  size: desktopMaxWidth,\n  height,\n  children,\n  className,\n  style,\n  snapPoint,\n  onSnapPointChange,\n  getModalContentRef,\n  ModalOverlay = ModalOverlayDefault,\n  modalOverlayTestId,\n  modalContentTestId,\n  modalDismissButtonTestId,\n  noFocusToDialog,\n  hideCloseButton,\n  preventClose,\n  disableContentPanningGesture,\n  onOpen,\n  onOpened,\n  onClose = noop,\n  onClosed,\n  ...restProps\n}: ModalPageInternalProps) => {\n  const { hasCustomPanelHeaderAfter } = useConfigProvider();\n  const [transitionState, { ref, onTransitionEnd }] = useCSSTransition<HTMLDivElement>(open, {\n    enableAppear: true,\n    onEnter() {\n      onOpen?.();\n    },\n    onEntered() {\n      onOpened?.();\n    },\n    onExited() {\n      onClosed?.();\n    },\n  });\n  const opened = transitionState === 'appeared' || transitionState === 'entered';\n  const hidden = transitionState === 'exited';\n  const closable = !preventClose && opened;\n\n  const { sizeX, isDesktop } = useAdaptivityWithJSMediaQueries();\n  const bottomSheetEnabled = !isDesktop && !preventClose && transitionState !== 'exited';\n  const { opened: keyboardOpened } = useVirtualKeyboardState(bottomSheetEnabled);\n\n  const [{ initialStyle, setSheetEl, setSheetScrollEl, setBackdropEl }, bottomSheetEventHandlers] =\n    useBottomSheet(bottomSheetEnabled, {\n      blocked: keyboardOpened,\n      snapPoint,\n      sheetCSSProperty: '--vkui_internal_ModalPageDocument--snapPoint',\n      backdropCSSProperty: '--vkui_internal--modal-overlay--opacity',\n      onSnapPointChange,\n      onDismiss() {\n        onClose('swipe-down');\n      },\n    });\n  const documentStyle = keyboardOpened\n    ? {\n        '--vkui_internal_ModalPageDocument--safeAreaInsetBottom': '0px',\n        ...initialStyle,\n      }\n    : initialStyle;\n  const handleSheetRef = useExternRef<HTMLDivElement>(setSheetEl, ref);\n  const handleSheetScrollRef = useExternRef<HTMLDivElement>(setSheetScrollEl, getModalContentRef);\n\n  const disableContentPanningGestureProp = disableContentPanningGesture\n    ? BLOCK_SHEET_BEHAVIOR_DATA_ATTRIBUTE\n    : undefined;\n  const [desktopMaxWidthClassName, desktopMaxWidthStyle] = resolveDesktopMaxWidth(\n    isDesktop ? desktopMaxWidth : 's',\n  );\n\n  const modalOverlay = (\n    <ModalOverlay\n      getRootRef={setBackdropEl}\n      data-testid={modalOverlayTestId}\n      visible={open}\n      onClick={\n        closable\n          ? function handleBackdropClick(event) {\n              onClose('click-overlay', event);\n            }\n          : undefined\n      }\n    />\n  );\n  const closeButton =\n    hideCloseButton || !isDesktop ? null : (\n      <ModalDismissButton\n        data-testid={modalDismissButtonTestId}\n        onClick={\n          closable\n            ? function handleDismissButtonClick(event) {\n                onClose('click-close-button', event);\n              }\n            : undefined\n        }\n      />\n    );\n  const handleEscKeyDown = useCallback(\n    (event: KeyboardEvent<HTMLElement>) => {\n      if (closable && pressedKey(event) === Keys.ESCAPE) {\n        onClose('escape-key');\n      }\n    },\n    [closable, onClose],\n  );\n\n  useScrollLock(!hidden);\n\n  return (\n    <ModalOutlet hidden={hidden} isDesktop={isDesktop} onKeyDown={handleEscKeyDown}>\n      {modalOverlay}\n      <FocusTrap\n        {...restProps}\n        autoFocus={!noFocusToDialog}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        disabled={!opened || hidden}\n        className={classNames(\n          className,\n          styles.host,\n          isDesktop ? styles.hostDesktop : styles.hostMobile,\n          !isDesktop &&\n            (hasCustomPanelHeaderAfter\n              ? styles.hostMobileSafeAreaInsetTopWithCustomOffset\n              : styles.hostMobileSafeAreaInsetTop),\n          desktopMaxWidthClassName,\n          sizeX === 'regular' && 'vkuiInternalModalPage--sizeX-regular',\n        )}\n        style={mergeStyle(mergeStyle(desktopMaxWidthStyle, getHeightCSSVariable(height)), style)}\n      >\n        <div\n          {...bottomSheetEventHandlers}\n          ref={handleSheetRef}\n          role=\"document\"\n          style={documentStyle}\n          className={classNames(\n            styles.document,\n            isDesktop ? styles.documentDesktop : styles.documentMobile,\n            transitionStateClassNames[transitionState],\n          )}\n          onTransitionEnd={onTransitionEnd}\n        >\n          <div className={classNames(styles.children, isDesktop && styles.childrenDesktop)}>\n            {hasReactNode(header) && header}\n            <ModalPageContent\n              getRootRef={handleSheetScrollRef}\n              data-testid={modalContentTestId}\n              {...disableContentPanningGestureProp}\n            >\n              {children}\n            </ModalPageContent>\n            {hasReactNode(footer) && footer}\n          </div>\n          {closeButton}\n        </div>\n      </FocusTrap>\n    </ModalOutlet>\n  );\n};\n\nconst desktopMaxWidthClassNames = {\n  s: styles['hostDesktopMaxWidthS'],\n  m: styles['hostDesktopMaxWidthM'],\n  l: styles['hostDesktopMaxWidthL'],\n};\n\nfunction resolveDesktopMaxWidth(\n  desktopMaxWidth: ModalPageInternalProps['size'] = 's',\n): [string | undefined, CSSCustomProperties | undefined] {\n  if (typeof desktopMaxWidth === 'string') {\n    return [desktopMaxWidthClassNames[desktopMaxWidth], undefined];\n  }\n\n  return [\n    undefined,\n    typeof desktopMaxWidth === 'number'\n      ? { '--vkui_internal_ModalPage--desktopMaxWidth': `${desktopMaxWidth}px` }\n      : undefined,\n  ];\n}\n\nfunction getHeightCSSVariable(height?: number | string): CSSCustomProperties | undefined {\n  return height !== undefined\n    ? {\n        '--vkui_internal_ModalPage--userHeight':\n          typeof height === 'number' ? `${height}px` : height,\n      }\n    : undefined;\n}\n"],"names":["useCallback","classNames","hasReactNode","noop","mergeStyle","useAdaptivityWithJSMediaQueries","useExternRef","useVirtualKeyboardState","Keys","pressedKey","useCSSTransition","BLOCK_SHEET_BEHAVIOR_DATA_ATTRIBUTE","useBottomSheet","useScrollLock","useConfigProvider","FocusTrap","ModalDismissButton","ModalOutlet","ModalOverlay","ModalOverlayDefault","ModalPageContent","transitionStateClassNames","appear","appearing","enter","entering","exiting","exited","ModalPageInternal","open","header","footer","size","desktopMaxWidth","height","children","className","style","snapPoint","onSnapPointChange","getModalContentRef","modalOverlayTestId","modalContentTestId","modalDismissButtonTestId","noFocusToDialog","hideCloseButton","preventClose","disableContentPanningGesture","onOpen","onOpened","onClose","onClosed","restProps","hasCustomPanelHeaderAfter","transitionState","ref","onTransitionEnd","enableAppear","onEnter","onEntered","onExited","opened","hidden","closable","sizeX","isDesktop","bottomSheetEnabled","keyboardOpened","initialStyle","setSheetEl","setSheetScrollEl","setBackdropEl","bottomSheetEventHandlers","blocked","sheetCSSProperty","backdropCSSProperty","onDismiss","documentStyle","handleSheetRef","handleSheetScrollRef","disableContentPanningGestureProp","undefined","desktopMaxWidthClassName","desktopMaxWidthStyle","resolveDesktopMaxWidth","modalOverlay","getRootRef","data-testid","visible","onClick","handleBackdropClick","event","closeButton","handleDismissButtonClick","handleEscKeyDown","ESCAPE","onKeyDown","autoFocus","role","aria-modal","disabled","getHeightCSSVariable","div","desktopMaxWidthClassNames","s","m","l"],"mappings":"AAAA;;;;;AAEA,SAAiDA,WAAW,QAAQ,QAAQ;AAC5E,SAASC,UAAU,EAAEC,YAAY,EAAEC,IAAI,QAAQ,kBAAkB;AACjE,SAASC,UAAU,QAAQ,8BAA2B;AACtD,SAASC,+BAA+B,QAAQ,iDAA8C;AAC9F,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,uBAAuB,QAAQ,yCAAsC;AAC9E,SAASC,IAAI,EAAEC,UAAU,QAAQ,6BAA0B;AAC3D,SAASC,gBAAgB,QAAoC,+BAAsB;AACnF,SACEC,mCAAmC,EAGnCC,cAAc,QACT,2BAAkB;AAEzB,SAASC,aAAa,QAAQ,8BAA2B;AACzD,SAASC,iBAAiB,QAAQ,6CAA0C;AAC5E,SAASC,SAAS,QAAQ,4BAAyB;AACnD,SAASC,kBAAkB,QAAQ,8CAA2C;AAC9E,SAASC,WAAW,QAAQ,gCAA6B;AACzD,SACEC,gBAAgBC,mBAAmB,QAE9B,kCAA+B;AACtC,SAASC,gBAAgB,QAAQ,0CAAuC;AAIxE,MAAMC,4BAA4E;IAChFC,MAAM;IACNC,SAAS;IAETC,KAAK;IACLC,QAAQ;IAERC,OAAO;IACPC,MAAM;AACR;AASA;;;;CAIC,GACD,OAAO,MAAMC,oBAAoB;QAAC,EAChCC,IAAI,EACJC,MAAM,EACNC,MAAM,EACNC,MAAMC,eAAe,EACrBC,MAAM,EACNC,QAAQ,EACRC,SAAS,EACTC,KAAK,EACLC,SAAS,EACTC,iBAAiB,EACjBC,kBAAkB,EAClBtB,eAAeC,mBAAmB,EAClCsB,kBAAkB,EAClBC,kBAAkB,EAClBC,wBAAwB,EACxBC,eAAe,EACfC,eAAe,EACfC,YAAY,EACZC,4BAA4B,EAC5BC,MAAM,EACNC,QAAQ,EACRC,UAAU/C,IAAI,EACdgD,QAAQ,EAEe,WADpBC;QAvBHvB;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAtB;QACAuB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAM,EAAEE,yBAAyB,EAAE,GAAGvC;IACtC,MAAM,CAACwC,iBAAiB,EAAEC,GAAG,EAAEC,eAAe,EAAE,CAAC,GAAG9C,iBAAiCmB,MAAM;QACzF4B,cAAc;QACdC;YACEV,mBAAAA,6BAAAA;QACF;QACAW;YACEV,qBAAAA,+BAAAA;QACF;QACAW;YACET,qBAAAA,+BAAAA;QACF;IACF;IACA,MAAMU,SAASP,oBAAoB,cAAcA,oBAAoB;IACrE,MAAMQ,SAASR,oBAAoB;IACnC,MAAMS,WAAW,CAACjB,gBAAgBe;IAElC,MAAM,EAAEG,KAAK,EAAEC,SAAS,EAAE,GAAG5D;IAC7B,MAAM6D,qBAAqB,CAACD,aAAa,CAACnB,gBAAgBQ,oBAAoB;IAC9E,MAAM,EAAEO,QAAQM,cAAc,EAAE,GAAG5D,wBAAwB2D;IAE3D,MAAM,CAAC,EAAEE,YAAY,EAAEC,UAAU,EAAEC,gBAAgB,EAAEC,aAAa,EAAE,EAAEC,yBAAyB,GAC7F5D,eAAesD,oBAAoB;QACjCO,SAASN;QACT7B;QACAoC,kBAAkB;QAClBC,qBAAqB;QACrBpC;QACAqC;YACE1B,QAAQ;QACV;IACF;IACF,MAAM2B,gBAAgBV,iBAClB;QACE,0DAA0D;OACvDC,gBAELA;IACJ,MAAMU,iBAAiBxE,aAA6B+D,YAAYd;IAChE,MAAMwB,uBAAuBzE,aAA6BgE,kBAAkB9B;IAE5E,MAAMwC,mCAAmCjC,+BACrCpC,sCACAsE;IACJ,MAAM,CAACC,0BAA0BC,qBAAqB,GAAGC,uBACvDnB,YAAYhC,kBAAkB;IAGhC,MAAMoD,6BACJ,KAACnE;QACCoE,YAAYf;QACZgB,eAAa9C;QACb+C,SAAS3D;QACT4D,SACE1B,WACI,SAAS2B,oBAAoBC,KAAK;YAChCzC,QAAQ,iBAAiByC;QAC3B,IACAV;;IAIV,MAAMW,cACJ/C,mBAAmB,CAACoB,YAAY,qBAC9B,KAACjD;QACCuE,eAAa5C;QACb8C,SACE1B,WACI,SAAS8B,yBAAyBF,KAAK;YACrCzC,QAAQ,sBAAsByC;QAChC,IACAV;;IAIZ,MAAMa,mBAAmB9F,YACvB,CAAC2F;QACC,IAAI5B,YAAYtD,WAAWkF,WAAWnF,KAAKuF,MAAM,EAAE;YACjD7C,QAAQ;QACV;IACF,GACA;QAACa;QAAUb;KAAQ;IAGrBrC,cAAc,CAACiD;IAEf,qBACE,MAAC7C;QAAY6C,QAAQA;QAAQG,WAAWA;QAAW+B,WAAWF;;YAC3DT;0BACD,KAACtE,mDACKqC;gBACJ6C,WAAW,CAACrD;gBACZsD,MAAK;gBACLC,cAAW;gBACXC,UAAU,CAACvC,UAAUC;gBACrB1B,WAAWnC,WACTmC,kCAEA6B,wEACA,CAACA,aACEZ,CAAAA,qIAEmC,GACtC6B,0BACAlB,UAAU,aAAa;gBAEzB3B,OAAOjC,WAAWA,WAAW+E,sBAAsBkB,qBAAqBnE,UAAUG;0BAElF,cAAA,MAACiE,+CACK9B;oBACJjB,KAAKuB;oBACLoB,MAAK;oBACL7D,OAAOwC;oBACPzC,WAAWnC,sCAETgE,gFACA5C,yBAAyB,CAACiC,gBAAgB;oBAE5CE,iBAAiBA;;sCAEjB,MAAC8C;4BAAIlE,WAAWnC,sCAA4BgE;;gCACzC/D,aAAa4B,WAAWA;8CACzB,KAACV;oCACCkE,YAAYP;oCACZQ,eAAa7C;mCACTsC;8CAEH7C;;gCAEFjC,aAAa6B,WAAWA;;;wBAE1B6D;;;;;;AAKX,EAAE;AAEF,MAAMW,4BAA4B;IAChCC,CAAC;IACDC,CAAC;IACDC,CAAC;AACH;AAEA,SAAStB,uBACPnD,kBAAkD,GAAG;IAErD,IAAI,OAAOA,oBAAoB,UAAU;QACvC,OAAO;YAACsE,yBAAyB,CAACtE,gBAAgB;YAAEgD;SAAU;IAChE;IAEA,OAAO;QACLA;QACA,OAAOhD,oBAAoB,WACvB;YAAE,8CAA8C,GAAGA,gBAAgB,EAAE,CAAC;QAAC,IACvEgD;KACL;AACH;AAEA,SAASoB,qBAAqBnE,MAAwB;IACpD,OAAOA,WAAW+C,YACd;QACE,yCACE,OAAO/C,WAAW,WAAW,GAAGA,OAAO,EAAE,CAAC,GAAGA;IACjD,IACA+C;AACN"}

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

@@ -1 +1 @@
-{"version":3,"file":"ModalPageFooter.d.ts","sourceRoot":"","sources":["../../../src/components/ModalPageFooter/ModalPageFooter.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAK7D,MAAM,WAAW,oBAAqB,SAAQ,yBAAyB,CAAC,cAAc,CAAC;IACrF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,eAAe,uDAKzB,oBAAoB,4CAWtB,CAAC"}
+{"version":3,"file":"ModalPageFooter.d.ts","sourceRoot":"","sources":["../../../src/components/ModalPageFooter/ModalPageFooter.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAK7D,MAAM,WAAW,oBAAqB,SAAQ,yBAAyB,CAAC,cAAc,CAAC;IACrF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,eAAe,uDAKzB,oBAAoB,4CAetB,CAAC"}

package/dist/components/ModalPageFooter/ModalPageFooter.js

@@ -13,9 +13,9 @@ export const ModalPageFooter = (_param)=>{
         "noPadding",
         "children"
     ]);
-    const { sizeX } = useAdaptivityWithJSMediaQueries();
+    const { sizeX, isDesktop } = useAdaptivityWithJSMediaQueries();
     return /*#__PURE__*/ _jsxs(RootComponent, _object_spread_props(_object_spread({
-        baseClassName: classNames("vkuiModalPageFooter__host", !noPadding && "vkuiModalPageFooter__padded")
+        baseClassName: classNames("vkuiModalPageFooter__host", !noPadding && "vkuiModalPageFooter__padded", isDesktop ? "vkuiModalPageFooter__hostDesktop" : "vkuiModalPageFooter__hostMobile")
     }, restProps), {
         children: [
             !noSeparator && /*#__PURE__*/ _jsx(Separator, {

package/dist/components/ModalPageFooter/ModalPageFooter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ModalPageFooter/ModalPageFooter.tsx"],"sourcesContent":["'use client';\n\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Separator } from '../Separator/Separator';\nimport styles from './ModalPageFooter.module.css';\n\nexport interface ModalPageFooterProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  noSeparator?: boolean;\n  noPadding?: boolean;\n}\n\nexport const ModalPageFooter = ({\n  noSeparator = false,\n  noPadding = false,\n  children,\n  ...restProps\n}: ModalPageFooterProps) => {\n  const { sizeX } = useAdaptivityWithJSMediaQueries();\n  return (\n    <RootComponent\n      baseClassName={classNames(styles.host, !noPadding && styles.padded)}\n      {...restProps}\n    >\n      {!noSeparator && <Separator className={styles.Separator} padding={sizeX !== 'regular'} />}\n      {children}\n    </RootComponent>\n  );\n};\n"],"names":["classNames","useAdaptivityWithJSMediaQueries","RootComponent","Separator","ModalPageFooter","noSeparator","noPadding","children","restProps","sizeX","baseClassName","className","padding"],"mappings":"AAAA;;;;;AAEA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,iDAA8C;AAE9F,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,SAAS,QAAQ,4BAAyB;AAQnD,OAAO,MAAMC,kBAAkB;QAAC,EAC9BC,cAAc,KAAK,EACnBC,YAAY,KAAK,EACjBC,QAAQ,EAEa,WADlBC;QAHHH;QACAC;QACAC;;IAGA,MAAM,EAAEE,KAAK,EAAE,GAAGR;IAClB,qBACE,MAACC;QACCQ,eAAeV,wCAAwB,CAACM;OACpCE;;YAEH,CAACH,6BAAe,KAACF;gBAAUQ,SAAS;gBAAoBC,SAASH,UAAU;;YAC3EF;;;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/ModalPageFooter/ModalPageFooter.tsx"],"sourcesContent":["'use client';\n\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Separator } from '../Separator/Separator';\nimport styles from './ModalPageFooter.module.css';\n\nexport interface ModalPageFooterProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  noSeparator?: boolean;\n  noPadding?: boolean;\n}\n\nexport const ModalPageFooter = ({\n  noSeparator = false,\n  noPadding = false,\n  children,\n  ...restProps\n}: ModalPageFooterProps) => {\n  const { sizeX, isDesktop } = useAdaptivityWithJSMediaQueries();\n  return (\n    <RootComponent\n      baseClassName={classNames(\n        styles.host,\n        !noPadding && styles.padded,\n        isDesktop ? styles.hostDesktop : styles.hostMobile,\n      )}\n      {...restProps}\n    >\n      {!noSeparator && <Separator className={styles.Separator} padding={sizeX !== 'regular'} />}\n      {children}\n    </RootComponent>\n  );\n};\n"],"names":["classNames","useAdaptivityWithJSMediaQueries","RootComponent","Separator","ModalPageFooter","noSeparator","noPadding","children","restProps","sizeX","isDesktop","baseClassName","className","padding"],"mappings":"AAAA;;;;;AAEA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,iDAA8C;AAE9F,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,SAAS,QAAQ,4BAAyB;AAQnD,OAAO,MAAMC,kBAAkB;QAAC,EAC9BC,cAAc,KAAK,EACnBC,YAAY,KAAK,EACjBC,QAAQ,EAEa,WADlBC;QAHHH;QACAC;QACAC;;IAGA,MAAM,EAAEE,KAAK,EAAEC,SAAS,EAAE,GAAGT;IAC7B,qBACE,MAACC;QACCS,eAAeX,wCAEb,CAACM,4CACDI;OAEEF;;YAEH,CAACH,6BAAe,KAACF;gBAAUS,SAAS;gBAAoBC,SAASJ,UAAU;;YAC3EF;;;AAGP,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"file":"RichCell.d.ts","sourceRoot":"","sources":["../../../src/components/RichCell/RichCell.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAEpE,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAoB3D,KAAK,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;AAExC,MAAM,WAAW,aAAc,SAAQ,aAAa;IAClD;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;;;;;;;;OASG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAAC,GAAG;IAC/C,IAAI,EAAE,OAAO,YAAY,CAAC;CAqE3B,CAAC"}
+{"version":3,"file":"RichCell.d.ts","sourceRoot":"","sources":["../../../src/components/RichCell/RichCell.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAEpE,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AA0B3D,KAAK,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;AAExC,MAAM,WAAW,aAAc,SAAQ,aAAa;IAClD;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;;;;;;;;OASG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAAC,GAAG;IAC/C,IAAI,EAAE,OAAO,YAAY,CAAC;CAsE3B,CAAC"}