@vkontakte/vkui 5.8.1 → 5.8.2

package/dist/cjs/components/ActionSheet/ActionSheet.js

@@ -110,14 +110,18 @@ var ActionSheet = function(_param) {
         onClose: onClose,
         className: isDesktop ? className : undefined,
         style: isDesktop ? style : undefined
-    }), (header || text) && /*#__PURE__*/ _react.createElement("header", {
+    }), /*#__PURE__*/ _react.createElement("div", {
+        className: "vkuiActionSheet__content-wrapper"
+    }, (header || text) && /*#__PURE__*/ _react.createElement("header", {
         className: "vkuiActionSheet__header"
     }, header && /*#__PURE__*/ _react.createElement(_Footnote.Footnote, {
         weight: "2",
         className: "vkuiActionSheet__title"
     }, header), text && /*#__PURE__*/ _react.createElement(_Footnote.Footnote, {
         className: "vkuiActionSheet__text"
-    }, text)), children, platform === _platform.Platform.IOS && !isDesktop && (iosCloseItem !== null && iosCloseItem !== void 0 ? iosCloseItem : /*#__PURE__*/ _react.createElement(_ActionSheetDefaultIosCloseItem.ActionSheetDefaultIosCloseItem, null))));
+    }, text)), children), platform === _platform.Platform.IOS && !isDesktop && /*#__PURE__*/ _react.createElement("div", {
+        className: "vkuiActionSheet__close-item-wrapper--ios"
+    }, iosCloseItem !== null && iosCloseItem !== void 0 ? iosCloseItem : /*#__PURE__*/ _react.createElement(_ActionSheetDefaultIosCloseItem.ActionSheetDefaultIosCloseItem, null))));
     if (isDesktop) {
         return actionSheet;
     }

package/dist/cjs/components/ActionSheet/ActionSheet.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheet.tsx"],"sourcesContent":["import * as React from 'react';\nimport { noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useObjectMemo } from '../../hooks/useObjectMemo';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { Platform } from '../../lib/platform';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { ActionSheetContext, ItemClickHandler } from './ActionSheetContext';\nimport { ActionSheetDefaultIosCloseItem } from './ActionSheetDefaultIosCloseItem';\nimport { ActionSheetDropdown } from './ActionSheetDropdown';\nimport { ActionSheetDropdownDesktop } from './ActionSheetDropdownDesktop';\nimport { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nconst warn = warnOnce('ActionSheet');\ntype CloseInitiators = 'action-item' | 'cancel-item' | 'other';\nexport interface ActionSheetOnCloseOptions {\n  closedBy: CloseInitiators;\n}\n\nexport interface ActionSheetProps\n  extends Pick<\n      SharedDropdownProps,\n      'toggleRef' | 'popupDirection' | 'popupOffsetDistance' | 'placement'\n    >,\n    React.HTMLAttributes<HTMLDivElement> {\n  header?: React.ReactNode;\n  text?: React.ReactNode;\n  /**\n   * Закрыть попап по клику снаружи.\n   */\n  onClose(options: ActionSheetOnCloseOptions): void;\n  /**\n   * Только мобильный iOS.\n   */\n  iosCloseItem?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ActionSheet\n */\nexport const ActionSheet = ({\n  children,\n  className,\n  header,\n  text,\n  style,\n  iosCloseItem,\n  popupDirection,\n  popupOffsetDistance,\n  placement,\n  ...restProps\n}: ActionSheetProps) => {\n  const platform = usePlatform();\n  const [closingBy, setClosingBy] = React.useState<undefined | CloseInitiators>(undefined);\n  const onClose = () => setClosingBy('other');\n  const _action = React.useRef(noop);\n\n  const afterClose = () => {\n    restProps.onClose({ closedBy: closingBy || 'other' });\n    _action.current();\n    _action.current = noop;\n  };\n\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n\n  useScrollLock(!isDesktop);\n\n  let timeout = platform === Platform.IOS ? 300 : 200;\n\n  if (isDesktop) {\n    timeout = 0;\n  }\n\n  const fallbackTransitionFinish = useTimeout(afterClose, timeout);\n  React.useEffect(() => {\n    if (closingBy) {\n      fallbackTransitionFinish.set();\n    } else {\n      fallbackTransitionFinish.clear();\n    }\n  }, [closingBy, fallbackTransitionFinish]);\n\n  const onItemClick = React.useCallback<ItemClickHandler>(\n    ({ action, immediateAction, autoClose, isCancelItem }) =>\n      (event) => {\n        event.persist();\n        immediateAction && immediateAction(event);\n        if (autoClose) {\n          _action.current = () => action && action(event);\n          setClosingBy(isCancelItem ? 'cancel-item' : 'action-item');\n        } else {\n          action && action(event);\n        }\n      },\n    [],\n  );\n  const contextValue = useObjectMemo({ onItemClick, isDesktop });\n\n  const DropdownComponent = isDesktop ? ActionSheetDropdownDesktop : ActionSheetDropdown;\n\n  if (process.env.NODE_ENV === 'development' && popupDirection) {\n    // TODO [>=6]: popupDirection\n    warn('Свойство \"popupDirection\" будет удалено в v6. Используйте свойство \"placement\"');\n  }\n\n  popupDirection = popupDirection !== undefined ? popupDirection : 'bottom';\n\n  const dropdownProps = isDesktop\n    ? Object.assign(restProps, { popupOffsetDistance, popupDirection, placement })\n    : restProps;\n\n  const actionSheet = (\n    <ActionSheetContext.Provider value={contextValue}>\n      <DropdownComponent\n        closing={Boolean(closingBy)}\n        timeout={timeout}\n        {...dropdownProps}\n        onClose={onClose}\n        className={isDesktop ? className : undefined}\n        style={isDesktop ? style : undefined}\n      >\n        {(header || text) && (\n          <header className={styles['ActionSheet__header']}>\n            {header && (\n              <Footnote weight=\"2\" className={styles['ActionSheet__title']}>\n                {header}\n              </Footnote>\n            )}\n            {text && <Footnote className={styles['ActionSheet__text']}>{text}</Footnote>}\n          </header>\n        )}\n        {children}\n        {platform === Platform.IOS &&\n          !isDesktop &&\n          (iosCloseItem ?? <ActionSheetDefaultIosCloseItem />)}\n      </DropdownComponent>\n    </ActionSheetContext.Provider>\n  );\n\n  if (isDesktop) {\n    return actionSheet;\n  }\n\n  return (\n    <PopoutWrapper\n      closing={Boolean(closingBy)}\n      alignY=\"bottom\"\n      className={className}\n      style={style}\n      onClick={onClose}\n      hasMask\n      fixed\n    >\n      {actionSheet}\n    </PopoutWrapper>\n  );\n};\n"],"names":["ActionSheet","warn","warnOnce","children","className","header","text","style","iosCloseItem","popupDirection","popupOffsetDistance","placement","restProps","platform","usePlatform","React","useState","undefined","closingBy","setClosingBy","onClose","_action","useRef","noop","afterClose","closedBy","current","isDesktop","useAdaptivityWithJSMediaQueries","useScrollLock","timeout","Platform","IOS","fallbackTransitionFinish","useTimeout","useEffect","set","clear","onItemClick","useCallback","action","immediateAction","autoClose","isCancelItem","event","persist","contextValue","useObjectMemo","DropdownComponent","ActionSheetDropdownDesktop","ActionSheetDropdown","process","env","NODE_ENV","dropdownProps","Object","assign","actionSheet","ActionSheetContext","Provider","value","closing","Boolean","Footnote","weight","ActionSheetDefaultIosCloseItem","PopoutWrapper","alignY","onClick","hasMask","fixed"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheet.tsx"],"sourcesContent":["import * as React from 'react';\nimport { noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useObjectMemo } from '../../hooks/useObjectMemo';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { Platform } from '../../lib/platform';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { ActionSheetContext, ItemClickHandler } from './ActionSheetContext';\nimport { ActionSheetDefaultIosCloseItem } from './ActionSheetDefaultIosCloseItem';\nimport { ActionSheetDropdown } from './ActionSheetDropdown';\nimport { ActionSheetDropdownDesktop } from './ActionSheetDropdownDesktop';\nimport { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nconst warn = warnOnce('ActionSheet');\ntype CloseInitiators = 'action-item' | 'cancel-item' | 'other';\nexport interface ActionSheetOnCloseOptions {\n  closedBy: CloseInitiators;\n}\n\nexport interface ActionSheetProps\n  extends Pick<\n      SharedDropdownProps,\n      'toggleRef' | 'popupDirection' | 'popupOffsetDistance' | 'placement'\n    >,\n    React.HTMLAttributes<HTMLDivElement> {\n  header?: React.ReactNode;\n  text?: React.ReactNode;\n  /**\n   * Закрыть попап по клику снаружи.\n   */\n  onClose(options: ActionSheetOnCloseOptions): void;\n  /**\n   * Только мобильный iOS.\n   */\n  iosCloseItem?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ActionSheet\n */\nexport const ActionSheet = ({\n  children,\n  className,\n  header,\n  text,\n  style,\n  iosCloseItem,\n  popupDirection,\n  popupOffsetDistance,\n  placement,\n  ...restProps\n}: ActionSheetProps) => {\n  const platform = usePlatform();\n  const [closingBy, setClosingBy] = React.useState<undefined | CloseInitiators>(undefined);\n  const onClose = () => setClosingBy('other');\n  const _action = React.useRef(noop);\n\n  const afterClose = () => {\n    restProps.onClose({ closedBy: closingBy || 'other' });\n    _action.current();\n    _action.current = noop;\n  };\n\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n\n  useScrollLock(!isDesktop);\n\n  let timeout = platform === Platform.IOS ? 300 : 200;\n\n  if (isDesktop) {\n    timeout = 0;\n  }\n\n  const fallbackTransitionFinish = useTimeout(afterClose, timeout);\n  React.useEffect(() => {\n    if (closingBy) {\n      fallbackTransitionFinish.set();\n    } else {\n      fallbackTransitionFinish.clear();\n    }\n  }, [closingBy, fallbackTransitionFinish]);\n\n  const onItemClick = React.useCallback<ItemClickHandler>(\n    ({ action, immediateAction, autoClose, isCancelItem }) =>\n      (event) => {\n        event.persist();\n        immediateAction && immediateAction(event);\n        if (autoClose) {\n          _action.current = () => action && action(event);\n          setClosingBy(isCancelItem ? 'cancel-item' : 'action-item');\n        } else {\n          action && action(event);\n        }\n      },\n    [],\n  );\n  const contextValue = useObjectMemo({ onItemClick, isDesktop });\n\n  const DropdownComponent = isDesktop ? ActionSheetDropdownDesktop : ActionSheetDropdown;\n\n  if (process.env.NODE_ENV === 'development' && popupDirection) {\n    // TODO [>=6]: popupDirection\n    warn('Свойство \"popupDirection\" будет удалено в v6. Используйте свойство \"placement\"');\n  }\n\n  popupDirection = popupDirection !== undefined ? popupDirection : 'bottom';\n\n  const dropdownProps = isDesktop\n    ? Object.assign(restProps, { popupOffsetDistance, popupDirection, placement })\n    : restProps;\n\n  const actionSheet = (\n    <ActionSheetContext.Provider value={contextValue}>\n      <DropdownComponent\n        closing={Boolean(closingBy)}\n        timeout={timeout}\n        {...dropdownProps}\n        onClose={onClose}\n        className={isDesktop ? className : undefined}\n        style={isDesktop ? style : undefined}\n      >\n        <div className={styles['ActionSheet__content-wrapper']}>\n          {(header || text) && (\n            <header className={styles['ActionSheet__header']}>\n              {header && (\n                <Footnote weight=\"2\" className={styles['ActionSheet__title']}>\n                  {header}\n                </Footnote>\n              )}\n              {text && <Footnote className={styles['ActionSheet__text']}>{text}</Footnote>}\n            </header>\n          )}\n          {children}\n        </div>\n        {platform === Platform.IOS && !isDesktop && (\n          <div className={styles['ActionSheet__close-item-wrapper--ios']}>\n            {iosCloseItem ?? <ActionSheetDefaultIosCloseItem />}\n          </div>\n        )}\n      </DropdownComponent>\n    </ActionSheetContext.Provider>\n  );\n\n  if (isDesktop) {\n    return actionSheet;\n  }\n\n  return (\n    <PopoutWrapper\n      closing={Boolean(closingBy)}\n      alignY=\"bottom\"\n      className={className}\n      style={style}\n      onClick={onClose}\n      hasMask\n      fixed\n    >\n      {actionSheet}\n    </PopoutWrapper>\n  );\n};\n"],"names":["ActionSheet","warn","warnOnce","children","className","header","text","style","iosCloseItem","popupDirection","popupOffsetDistance","placement","restProps","platform","usePlatform","React","useState","undefined","closingBy","setClosingBy","onClose","_action","useRef","noop","afterClose","closedBy","current","isDesktop","useAdaptivityWithJSMediaQueries","useScrollLock","timeout","Platform","IOS","fallbackTransitionFinish","useTimeout","useEffect","set","clear","onItemClick","useCallback","action","immediateAction","autoClose","isCancelItem","event","persist","contextValue","useObjectMemo","DropdownComponent","ActionSheetDropdownDesktop","ActionSheetDropdown","process","env","NODE_ENV","dropdownProps","Object","assign","actionSheet","ActionSheetContext","Provider","value","closing","Boolean","div","Footnote","weight","ActionSheetDefaultIosCloseItem","PopoutWrapper","alignY","onClick","hasMask","fixed"],"mappings":"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"}

package/dist/cjs/components/AspectRatio/AspectRatio.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+/// <reference types="react" />
 import { HTMLAttributesWithRootRef } from '../../types';
 export interface AspectRatioProps extends HTMLAttributesWithRootRef<HTMLDivElement> {
     className?: string;
@@ -6,7 +6,6 @@ export interface AspectRatioProps extends HTMLAttributesWithRootRef<HTMLDivEleme
      * По умолчанию, вложенный контент будет растягиваться и заполнять весь блок.
      */
     mode?: 'stretch' | 'none';
-    children: React.ReactNode;
     /**
      * Например 16 / 9, 4 / 3, 1920 / 1080
      */
@@ -15,8 +14,8 @@ export interface AspectRatioProps extends HTMLAttributesWithRootRef<HTMLDivEleme
 /**
  * `AspectRatio` позволяет поддерживать постоянное соотношение ширины и высоты.
  * Его можно использовать для отображения изображений, карт, видео и других медиафайлов.
- 
+
  * @since 5.5.0
  * @see https://vkcom.github.io/VKUI/#/AspectRatio
  */
-export declare function AspectRatio({ ratio, children, mode, style: styleProp, ...props }: AspectRatioProps): JSX.Element;
+export declare function AspectRatio({ ratio, mode, style: styleProp, ...props }: AspectRatioProps): JSX.Element;

package/dist/cjs/components/AspectRatio/AspectRatio.js

@@ -16,9 +16,8 @@ var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
 var _RootComponent = require("../RootComponent/RootComponent");
 function AspectRatio(_param) {
-    var ratio = _param.ratio, children = _param.children, _param_mode = _param.mode, mode = _param_mode === void 0 ? "stretch" : _param_mode, styleProp = _param.style, props = _object_without_properties._(_param, [
+    var ratio = _param.ratio, _param_mode = _param.mode, mode = _param_mode === void 0 ? "stretch" : _param_mode, styleProp = _param.style, props = _object_without_properties._(_param, [
         "ratio",
-        "children",
         "mode",
         "style"
     ]);

package/dist/cjs/components/AspectRatio/AspectRatio.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/AspectRatio/AspectRatio.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { CSSCustomProperties, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './AspectRatio.module.css';\n\nexport interface AspectRatioProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  className?: string;\n  /**\n   * По умолчанию, вложенный контент будет растягиваться и заполнять весь блок.\n   */\n  mode?: 'stretch' | 'none';\n  children: React.ReactNode;\n  /**\n   * Например 16 / 9, 4 / 3, 1920 / 1080\n   */\n  ratio: number;\n}\n\n/**\n * `AspectRatio` позволяет поддерживать постоянное соотношение ширины и высоты.\n * Его можно использовать для отображения изображений, карт, видео и других медиафайлов.\n \n * @since 5.5.0\n * @see https://vkcom.github.io/VKUI/#/AspectRatio\n */\nexport function AspectRatio({\n  ratio,\n  children,\n  mode = 'stretch',\n  style: styleProp,\n  ...props\n}: AspectRatioProps): JSX.Element {\n  const style: React.CSSProperties & CSSCustomProperties = {\n    ['--vkui_internal--aspect_ratio']: String(ratio),\n  };\n\n  return (\n    <RootComponent\n      baseClassName={classNames(\n        styles.AspectRatio,\n        mode === 'stretch' && styles['AspectRatio--mode-stretch'],\n      )}\n      style={{ ...styleProp, ...style }}\n      {...props}\n    />\n  );\n}\n"],"names":["AspectRatio","ratio","children","mode","style","styleProp","props","String","RootComponent","baseClassName","classNames"],"mappings":";;;;+BA0BgBA;;;eAAAA;;;;;;;+DA1BO;oBACI;6BAEG;AAuBvB,SAASA,YAAY;QAC1BC,QAD0B,OAC1BA,OACAC,WAF0B,OAE1BA,wBAF0B,OAG1BC,MAAAA,gCAAO,yBACPC,AAAOC,YAJmB,OAI1BD,OACGE,qCALuB;QAC1BL;QACAC;QACAC;QACAC;;IAGA,IAAMA,QACJ,uBAAC,iCAAkCG,OAAON;IAG5C,qBACE,qBAACO,4BAAa;QACZC,eAAeC,IAAAA,gBAAU,qBAEvBP,SAAS;QAEXC,OAAO,qBAAKC,WAAcD;OACtBE;AAGV"}
+{"version":3,"sources":["../../../../src/components/AspectRatio/AspectRatio.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { CSSCustomProperties, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './AspectRatio.module.css';\n\nexport interface AspectRatioProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  className?: string;\n  /**\n   * По умолчанию, вложенный контент будет растягиваться и заполнять весь блок.\n   */\n  mode?: 'stretch' | 'none';\n  /**\n   * Например 16 / 9, 4 / 3, 1920 / 1080\n   */\n  ratio: number;\n}\n\n/**\n * `AspectRatio` позволяет поддерживать постоянное соотношение ширины и высоты.\n * Его можно использовать для отображения изображений, карт, видео и других медиафайлов.\n\n * @since 5.5.0\n * @see https://vkcom.github.io/VKUI/#/AspectRatio\n */\nexport function AspectRatio({\n  ratio,\n  mode = 'stretch',\n  style: styleProp,\n  ...props\n}: AspectRatioProps): JSX.Element {\n  const style: React.CSSProperties & CSSCustomProperties = {\n    ['--vkui_internal--aspect_ratio']: String(ratio),\n  };\n\n  return (\n    <RootComponent\n      baseClassName={classNames(\n        styles.AspectRatio,\n        mode === 'stretch' && styles['AspectRatio--mode-stretch'],\n      )}\n      style={{ ...styleProp, ...style }}\n      {...props}\n    />\n  );\n}\n"],"names":["AspectRatio","ratio","mode","style","styleProp","props","String","RootComponent","baseClassName","classNames"],"mappings":";;;;+BAyBgBA;;;eAAAA;;;;;;;+DAzBO;oBACI;6BAEG;AAsBvB,SAASA,YAAY;QAC1BC,QAD0B,OAC1BA,qBAD0B,OAE1BC,MAAAA,gCAAO,yBACPC,AAAOC,YAHmB,OAG1BD,OACGE,qCAJuB;QAC1BJ;QACAC;QACAC;;IAGA,IAAMA,QACJ,uBAAC,iCAAkCG,OAAOL;IAG5C,qBACE,qBAACM,4BAAa;QACZC,eAAeC,IAAAA,gBAAU,qBAEvBP,SAAS;QAEXC,OAAO,qBAAKC,WAAcD;OACtBE;AAGV"}

package/dist/cjs/components/Banner/Banner.js

@@ -24,10 +24,6 @@ var _Headline = require("../Typography/Headline/Headline");
 var _Subhead = require("../Typography/Subhead/Subhead");
 var _Text = require("../Typography/Text/Text");
 var _Title = require("../Typography/Title/Title");
-var stylesSize = {
-    s: "vkuiBanner--size-s",
-    m: "vkuiBanner--size-m"
-};
 var Banner = function(_param) {
     var _param_mode = _param.mode, mode = _param_mode === void 0 ? "tint" : _param_mode, _param_imageTheme = _param.imageTheme, imageTheme = _param_imageTheme === void 0 ? "dark" : _param_imageTheme, _param_size = _param.size, size = _param_size === void 0 ? "s" : _param_size, before = _param.before, asideMode = _param.asideMode, header = _param.header, subheader = _param.subheader, text = _param.text, children = _param.children, background = _param.background, actions = _param.actions, onDismiss = _param.onDismiss, _param_dismissLabel = _param.dismissLabel, dismissLabel = _param_dismissLabel === void 0 ? "Скрыть" : _param_dismissLabel, noPadding = _param.noPadding, restProps = _object_without_properties._(_param, [
         "mode",
@@ -72,7 +68,7 @@ var Banner = function(_param) {
     return /*#__PURE__*/ _react.createElement(_RootComponent.RootComponent, _object_spread_props._(_object_spread._({
         Component: "section"
     }, restProps), {
-        baseClassName: (0, _vkjs.classNames)("vkuiBanner", !noPadding && "vkuiBanner--withPadding", platform === _platform.Platform.IOS && "vkuiBanner--ios", mode === "image" && "vkuiBanner--mode-image", stylesSize[size], mode === "image" && imageTheme === "dark" && "vkuiBanner--inverted")
+        baseClassName: (0, _vkjs.classNames)("vkuiBanner", !noPadding && "vkuiBanner--withPadding", platform === _platform.Platform.IOS && "vkuiBanner--ios", mode === "image" && "vkuiBanner--mode-image", size === "m" && "vkuiBanner--size-m", mode === "image" && imageTheme === "dark" && "vkuiBanner--inverted")
     }), asideMode === "expand" ? /*#__PURE__*/ _react.createElement(_Tappable.Tappable, {
         className: "vkuiBanner__in",
         activeMode: platform === _platform.Platform.IOS ? "opacity" : "background",

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Banner/Banner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Cancel, Icon24Chevron, Icon24Dismiss, Icon24DismissDark } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { IconButton } from '../IconButton/IconButton';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Text } from '../Typography/Text/Text';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './Banner.module.css';\n\nconst stylesSize = {\n  s: styles['Banner--size-s'],\n  m: styles['Banner--size-m'],\n};\n\nexport interface BannerProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Тип баннера.\n   */\n  mode?: 'tint' | 'image';\n  size?: 's' | 'm';\n  /**\n   * Тип действия в правой части баннера.\n   *\n   * - `dismiss` – отображается иконка крестика, при клике на неё сработает свойство `onDismiss`.\n   * - `expand` – отображается иконка шеврона, которая подразумевает, что при клике на баннер можно куда-то перейти.\n   */\n  asideMode?: 'dismiss' | 'expand';\n  /**\n   * Срабатывает при клике на иконку крестика при `asideMode=\"dismiss\"`.\n   */\n  onDismiss?: React.MouseEventHandler<HTMLButtonElement>;\n  /**\n   * `aria-label` для кнопки при `asideMode=\"dismiss\". Необходим, чтобы кнопка была доступной.\n   */\n  dismissLabel?: string;\n  /**\n   * Содержимое, отображаемое в левой части баннера.\n   */\n  before?: React.ReactNode;\n  /**\n   * Заголовок.\n   */\n  header?: React.ReactNode;\n  /**\n   * Подзаголовок.\n   */\n  subheader?: React.ReactNode;\n  /**\n   * Текст баннера.\n   */\n  text?: React.ReactNode;\n  /**\n   * При использовании `mode=\"image\"`.\n   *\n   * - `light` – в качестве фона используется светлое изображение, цвет текста в баннере будет тёмным.\n   * - `dark` – в качестве фона используется тёмное изображение, цвет текста будет светлым.\n   */\n  imageTheme?: 'light' | 'dark';\n  /**\n   * При использовании `mode=\"image\"`.\n   *\n   * Элемент, который нужно стилизовать цветом и/или фоном. Этот элемент будет растянут на 100% ширины и высоты баннера.\n   */\n  background?: React.ReactNode;\n  /**\n   * Кнопки-действия. Принимает [`Button`](https://vkcom.github.io/VKUI/#/Button).\n   *\n   * - В режиме `tint` или `image` со светлым фоном используйте только с параметрами:\n   *    - `mode=\"primary\"`\n   *    - `mode=\"secondary\"`\n   * - В режиме `image` с тёмным фоном используйте с параметрами:\n   *    - `appearance=\"overlay\"`.\n   *\n   * Для набора кнопок используйте [`ButtonGroup`](https://vkcom.github.io/VKUI/#/ButtonGroup) с параметрами:\n   *\n   * - `gap=\"m\" mode=\"horizontal\" stretched`\n   * - `gap=\"m\" mode=\"vertical\" stretched`\n   */\n  actions?: React.ReactNode;\n  /**\n   * Удаляет отступы у компонента\n   */\n  noPadding?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Banner\n */\nexport const Banner = ({\n  mode = 'tint',\n  imageTheme = 'dark',\n  size = 's',\n  before,\n  asideMode,\n  header,\n  subheader,\n  text,\n  children,\n  background,\n  actions,\n  onDismiss,\n  dismissLabel = 'Скрыть',\n  noPadding,\n  ...restProps\n}: BannerProps) => {\n  const platform = usePlatform();\n\n  const HeaderTypography = size === 'm' ? Title : Headline;\n  const SubheaderTypography = size === 'm' ? Text : Subhead;\n\n  const IconDismissIOS = mode === 'image' ? Icon24DismissDark : Icon24Dismiss;\n\n  const content = (\n    <>\n      {mode === 'image' && background && (\n        <div aria-hidden className={styles['Banner__bg']}>\n          {background}\n        </div>\n      )}\n\n      {before && <div className={styles['Banner__before']}>{before}</div>}\n\n      <div className={styles['Banner__content']}>\n        {hasReactNode(header) && (\n          <HeaderTypography Component=\"p\" weight=\"2\" level={size === 'm' ? '2' : '1'}>\n            {header}\n          </HeaderTypography>\n        )}\n        {hasReactNode(subheader) && (\n          <SubheaderTypography Component=\"p\" className={styles['Banner__subheader']}>\n            {subheader}\n          </SubheaderTypography>\n        )}\n        {hasReactNode(text) && (\n          <Text Component=\"p\" className={styles['Banner__text']}>\n            {text}\n          </Text>\n        )}\n        {hasReactNode(actions) && React.Children.count(actions) > 0 && (\n          <div className={styles['Banner__actions']}>{actions}</div>\n        )}\n      </div>\n    </>\n  );\n\n  return (\n    <RootComponent\n      Component=\"section\"\n      {...restProps}\n      baseClassName={classNames(\n        styles['Banner'],\n        !noPadding && styles['Banner--withPadding'],\n        platform === Platform.IOS && styles['Banner--ios'],\n        mode === 'image' && styles['Banner--mode-image'],\n        stylesSize[size],\n        mode === 'image' && imageTheme === 'dark' && styles['Banner--inverted'],\n      )}\n    >\n      {asideMode === 'expand' ? (\n        <Tappable\n          className={styles['Banner__in']}\n          activeMode={platform === Platform.IOS ? 'opacity' : 'background'}\n          role=\"button\"\n        >\n          {content}\n\n          <div className={styles['Banner__aside']}>\n            <Icon24Chevron className={styles['Banner__expand']} />\n          </div>\n        </Tappable>\n      ) : (\n        <div className={styles['Banner__in']}>\n          {content}\n\n          {asideMode === 'dismiss' && (\n            <div className={styles['Banner__aside']}>\n              <IconButton\n                aria-label={dismissLabel}\n                className={styles['Banner__dismiss']}\n                onClick={onDismiss}\n                hoverMode=\"opacity\"\n                hasActive={false}\n              >\n                {platform === Platform.IOS ? <IconDismissIOS /> : <Icon24Cancel />}\n              </IconButton>\n            </div>\n          )}\n        </div>\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["Banner","stylesSize","s","m","mode","imageTheme","size","before","asideMode","header","subheader","text","children","background","actions","onDismiss","dismissLabel","noPadding","restProps","platform","usePlatform","HeaderTypography","Title","Headline","SubheaderTypography","Text","Subhead","IconDismissIOS","Icon24DismissDark","Icon24Dismiss","content","div","aria-hidden","className","hasReactNode","Component","weight","level","React","Children","count","RootComponent","baseClassName","classNames","Platform","IOS","Tappable","activeMode","role","Icon24Chevron","IconButton","aria-label","onClick","hoverMode","hasActive","Icon24Cancel"],"mappings":";;;;+BA8FaA;;;eAAAA;;;;;;;+DA9FU;qBACuD;oBACrC;2BACb;wBACH;0BAEE;6BACG;wBACL;wBACA;uBACD;oBACH;qBACC;AAGtB,IAAMC,aAAa;IACjBC,CAAC;IACDC,CAAC;AACH;AA4EO,IAAMH,SAAS;6BACpBI,MAAAA,gCAAO,iDACPC,YAAAA,4CAAa,iDACbC,MAAAA,gCAAO,mBACPC,gBAAAA,QACAC,mBAAAA,WACAC,gBAAAA,QACAC,mBAAAA,WACAC,cAAAA,MACAC,kBAAAA,UACAC,oBAAAA,YACAC,iBAAAA,SACAC,mBAAAA,wCACAC,cAAAA,gDAAe,gCACfC,mBAAAA,WACGC;QAdHd;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,WAAWC,IAAAA,wBAAW;IAE5B,IAAMC,mBAAmBf,SAAS,MAAMgB,YAAK,GAAGC,kBAAQ;IACxD,IAAMC,sBAAsBlB,SAAS,MAAMmB,UAAI,GAAGC,gBAAO;IAEzD,IAAMC,iBAAiBvB,SAAS,UAAUwB,wBAAiB,GAAGC,oBAAa;IAE3E,IAAMC,wBACJ,4CACG1B,SAAS,WAAWS,4BACnB,qBAACkB;QAAIC,eAAAA;QAAYC,SAAS;OACvBpB,aAIJN,wBAAU,qBAACwB;QAAIE,SAAS;OAA6B1B,uBAEtD,qBAACwB;QAAIE,SAAS;OACXC,IAAAA,kBAAY,EAACzB,yBACZ,qBAACY;QAAiBc,WAAU;QAAIC,QAAO;QAAIC,OAAO/B,SAAS,MAAM,MAAM;OACpEG,SAGJyB,IAAAA,kBAAY,EAACxB,4BACZ,qBAACc;QAAoBW,WAAU;QAAIF,SAAS;OACzCvB,YAGJwB,IAAAA,kBAAY,EAACvB,uBACZ,qBAACc,UAAI;QAACU,WAAU;QAAIF,SAAS;OAC1BtB,OAGJuB,IAAAA,kBAAY,EAACpB,YAAYwB,OAAMC,QAAQ,CAACC,KAAK,CAAC1B,WAAW,mBACxD,qBAACiB;QAAIE,SAAS;OAA8BnB;IAMpD,qBACE,qBAAC2B,4BAAa;QACZN,WAAU;OACNjB;QACJwB,eAAeC,IAAAA,gBAAU,gBAEvB,CAAC1B,wCACDE,aAAayB,kBAAQ,CAACC,GAAG,uBACzBzC,SAAS,qCACTH,UAAU,CAACK,KAAK,EAChBF,SAAS,WAAWC,eAAe;QAGpCG,cAAc,yBACb,qBAACsC,kBAAQ;QACPb,SAAS;QACTc,YAAY5B,aAAayB,kBAAQ,CAACC,GAAG,GAAG,YAAY;QACpDG,MAAK;OAEJlB,uBAED,qBAACC;QAAIE,SAAS;qBACZ,qBAACgB,oBAAa;QAAChB,SAAS;yBAI5B,qBAACF;QAAIE,SAAS;OACXH,SAEAtB,cAAc,2BACb,qBAACuB;QAAIE,SAAS;qBACZ,qBAACiB,sBAAU;QACTC,cAAYnC;QACZiB,SAAS;QACTmB,SAASrC;QACTsC,WAAU;QACVC,WAAW;OAEVnC,aAAayB,kBAAQ,CAACC,GAAG,iBAAG,qBAAClB,sCAAoB,qBAAC4B,mBAAY;AAQ/E"}
+{"version":3,"sources":["../../../../src/components/Banner/Banner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Cancel, Icon24Chevron, Icon24Dismiss, Icon24DismissDark } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { IconButton } from '../IconButton/IconButton';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Text } from '../Typography/Text/Text';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './Banner.module.css';\n\nexport interface BannerProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Тип баннера.\n   */\n  mode?: 'tint' | 'image';\n  size?: 's' | 'm';\n  /**\n   * Тип действия в правой части баннера.\n   *\n   * - `dismiss` – отображается иконка крестика, при клике на неё сработает свойство `onDismiss`.\n   * - `expand` – отображается иконка шеврона, которая подразумевает, что при клике на баннер можно куда-то перейти.\n   */\n  asideMode?: 'dismiss' | 'expand';\n  /**\n   * Срабатывает при клике на иконку крестика при `asideMode=\"dismiss\"`.\n   */\n  onDismiss?: React.MouseEventHandler<HTMLButtonElement>;\n  /**\n   * `aria-label` для кнопки при `asideMode=\"dismiss\". Необходим, чтобы кнопка была доступной.\n   */\n  dismissLabel?: string;\n  /**\n   * Содержимое, отображаемое в левой части баннера.\n   */\n  before?: React.ReactNode;\n  /**\n   * Заголовок.\n   */\n  header?: React.ReactNode;\n  /**\n   * Подзаголовок.\n   */\n  subheader?: React.ReactNode;\n  /**\n   * Текст баннера.\n   */\n  text?: React.ReactNode;\n  /**\n   * При использовании `mode=\"image\"`.\n   *\n   * - `light` – в качестве фона используется светлое изображение, цвет текста в баннере будет тёмным.\n   * - `dark` – в качестве фона используется тёмное изображение, цвет текста будет светлым.\n   */\n  imageTheme?: 'light' | 'dark';\n  /**\n   * При использовании `mode=\"image\"`.\n   *\n   * Элемент, который нужно стилизовать цветом и/или фоном. Этот элемент будет растянут на 100% ширины и высоты баннера.\n   */\n  background?: React.ReactNode;\n  /**\n   * Кнопки-действия. Принимает [`Button`](https://vkcom.github.io/VKUI/#/Button).\n   *\n   * - В режиме `tint` или `image` со светлым фоном используйте только с параметрами:\n   *    - `mode=\"primary\"`\n   *    - `mode=\"secondary\"`\n   * - В режиме `image` с тёмным фоном используйте с параметрами:\n   *    - `appearance=\"overlay\"`.\n   *\n   * Для набора кнопок используйте [`ButtonGroup`](https://vkcom.github.io/VKUI/#/ButtonGroup) с параметрами:\n   *\n   * - `gap=\"m\" mode=\"horizontal\" stretched`\n   * - `gap=\"m\" mode=\"vertical\" stretched`\n   */\n  actions?: React.ReactNode;\n  /**\n   * Удаляет отступы у компонента\n   */\n  noPadding?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Banner\n */\nexport const Banner = ({\n  mode = 'tint',\n  imageTheme = 'dark',\n  size = 's',\n  before,\n  asideMode,\n  header,\n  subheader,\n  text,\n  children,\n  background,\n  actions,\n  onDismiss,\n  dismissLabel = 'Скрыть',\n  noPadding,\n  ...restProps\n}: BannerProps) => {\n  const platform = usePlatform();\n\n  const HeaderTypography = size === 'm' ? Title : Headline;\n  const SubheaderTypography = size === 'm' ? Text : Subhead;\n\n  const IconDismissIOS = mode === 'image' ? Icon24DismissDark : Icon24Dismiss;\n\n  const content = (\n    <>\n      {mode === 'image' && background && (\n        <div aria-hidden className={styles['Banner__bg']}>\n          {background}\n        </div>\n      )}\n\n      {before && <div className={styles['Banner__before']}>{before}</div>}\n\n      <div className={styles['Banner__content']}>\n        {hasReactNode(header) && (\n          <HeaderTypography Component=\"p\" weight=\"2\" level={size === 'm' ? '2' : '1'}>\n            {header}\n          </HeaderTypography>\n        )}\n        {hasReactNode(subheader) && (\n          <SubheaderTypography Component=\"p\" className={styles['Banner__subheader']}>\n            {subheader}\n          </SubheaderTypography>\n        )}\n        {hasReactNode(text) && (\n          <Text Component=\"p\" className={styles['Banner__text']}>\n            {text}\n          </Text>\n        )}\n        {hasReactNode(actions) && React.Children.count(actions) > 0 && (\n          <div className={styles['Banner__actions']}>{actions}</div>\n        )}\n      </div>\n    </>\n  );\n\n  return (\n    <RootComponent\n      Component=\"section\"\n      {...restProps}\n      baseClassName={classNames(\n        styles['Banner'],\n        !noPadding && styles['Banner--withPadding'],\n        platform === Platform.IOS && styles['Banner--ios'],\n        mode === 'image' && styles['Banner--mode-image'],\n        size === 'm' && styles['Banner--size-m'],\n        mode === 'image' && imageTheme === 'dark' && styles['Banner--inverted'],\n      )}\n    >\n      {asideMode === 'expand' ? (\n        <Tappable\n          className={styles['Banner__in']}\n          activeMode={platform === Platform.IOS ? 'opacity' : 'background'}\n          role=\"button\"\n        >\n          {content}\n\n          <div className={styles['Banner__aside']}>\n            <Icon24Chevron className={styles['Banner__expand']} />\n          </div>\n        </Tappable>\n      ) : (\n        <div className={styles['Banner__in']}>\n          {content}\n\n          {asideMode === 'dismiss' && (\n            <div className={styles['Banner__aside']}>\n              <IconButton\n                aria-label={dismissLabel}\n                className={styles['Banner__dismiss']}\n                onClick={onDismiss}\n                hoverMode=\"opacity\"\n                hasActive={false}\n              >\n                {platform === Platform.IOS ? <IconDismissIOS /> : <Icon24Cancel />}\n              </IconButton>\n            </div>\n          )}\n        </div>\n      )}\n    </RootComponent>\n  );\n};\n"],"names":["Banner","mode","imageTheme","size","before","asideMode","header","subheader","text","children","background","actions","onDismiss","dismissLabel","noPadding","restProps","platform","usePlatform","HeaderTypography","Title","Headline","SubheaderTypography","Text","Subhead","IconDismissIOS","Icon24DismissDark","Icon24Dismiss","content","div","aria-hidden","className","hasReactNode","Component","weight","level","React","Children","count","RootComponent","baseClassName","classNames","Platform","IOS","Tappable","activeMode","role","Icon24Chevron","IconButton","aria-label","onClick","hoverMode","hasActive","Icon24Cancel"],"mappings":";;;;+BAyFaA;;;eAAAA;;;;;;;+DAzFU;qBACuD;oBACrC;2BACb;wBACH;0BAEE;6BACG;wBACL;wBACA;uBACD;oBACH;qBACC;AA6Ef,IAAMA,SAAS;6BACpBC,MAAAA,gCAAO,iDACPC,YAAAA,4CAAa,iDACbC,MAAAA,gCAAO,mBACPC,gBAAAA,QACAC,mBAAAA,WACAC,gBAAAA,QACAC,mBAAAA,WACAC,cAAAA,MACAC,kBAAAA,UACAC,oBAAAA,YACAC,iBAAAA,SACAC,mBAAAA,wCACAC,cAAAA,gDAAe,gCACfC,mBAAAA,WACGC;QAdHd;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,WAAWC,IAAAA,wBAAW;IAE5B,IAAMC,mBAAmBf,SAAS,MAAMgB,YAAK,GAAGC,kBAAQ;IACxD,IAAMC,sBAAsBlB,SAAS,MAAMmB,UAAI,GAAGC,gBAAO;IAEzD,IAAMC,iBAAiBvB,SAAS,UAAUwB,wBAAiB,GAAGC,oBAAa;IAE3E,IAAMC,wBACJ,4CACG1B,SAAS,WAAWS,4BACnB,qBAACkB;QAAIC,eAAAA;QAAYC,SAAS;OACvBpB,aAIJN,wBAAU,qBAACwB;QAAIE,SAAS;OAA6B1B,uBAEtD,qBAACwB;QAAIE,SAAS;OACXC,IAAAA,kBAAY,EAACzB,yBACZ,qBAACY;QAAiBc,WAAU;QAAIC,QAAO;QAAIC,OAAO/B,SAAS,MAAM,MAAM;OACpEG,SAGJyB,IAAAA,kBAAY,EAACxB,4BACZ,qBAACc;QAAoBW,WAAU;QAAIF,SAAS;OACzCvB,YAGJwB,IAAAA,kBAAY,EAACvB,uBACZ,qBAACc,UAAI;QAACU,WAAU;QAAIF,SAAS;OAC1BtB,OAGJuB,IAAAA,kBAAY,EAACpB,YAAYwB,OAAMC,QAAQ,CAACC,KAAK,CAAC1B,WAAW,mBACxD,qBAACiB;QAAIE,SAAS;OAA8BnB;IAMpD,qBACE,qBAAC2B,4BAAa;QACZN,WAAU;OACNjB;QACJwB,eAAeC,IAAAA,gBAAU,gBAEvB,CAAC1B,wCACDE,aAAayB,kBAAQ,CAACC,GAAG,uBACzBzC,SAAS,qCACTE,SAAS,6BACTF,SAAS,WAAWC,eAAe;QAGpCG,cAAc,yBACb,qBAACsC,kBAAQ;QACPb,SAAS;QACTc,YAAY5B,aAAayB,kBAAQ,CAACC,GAAG,GAAG,YAAY;QACpDG,MAAK;OAEJlB,uBAED,qBAACC;QAAIE,SAAS;qBACZ,qBAACgB,oBAAa;QAAChB,SAAS;yBAI5B,qBAACF;QAAIE,SAAS;OACXH,SAEAtB,cAAc,2BACb,qBAACuB;QAAIE,SAAS;qBACZ,qBAACiB,sBAAU;QACTC,cAAYnC;QACZiB,SAAS;QACTmB,SAASrC;QACTsC,WAAU;QACVC,WAAW;OAEVnC,aAAayB,kBAAQ,CAACC,GAAG,iBAAG,qBAAClB,sCAAoB,qBAAC4B,mBAAY;AAQ/E"}

package/dist/cjs/components/Group/Group.js

@@ -81,7 +81,9 @@ var Group = function(_param) {
     }, restProps), {
         tabIndex: tabIndex,
         baseClassName: (0, _vkjs.classNames)("vkuiInternalGroup", "vkuiGroup", isInsideModal && "vkuiGroup--inside-modal", platform === _platform.Platform.IOS && "vkuiGroup--ios", sizeX !== _adaptivity.SizeType.REGULAR && sizeXClassNames[sizeX], mode && stylesMode[mode], stylesPadding[padding])
-    }), header, children, (0, _vkjs.hasReactNode)(description) && /*#__PURE__*/ _react.createElement(_Footnote.Footnote, {
+    }), (0, _vkjs.hasReactNode)(header) && /*#__PURE__*/ _react.createElement("div", {
+        className: "vkuiGroup__header"
+    }, header), children, (0, _vkjs.hasReactNode)(description) && /*#__PURE__*/ _react.createElement(_Footnote.Footnote, {
         className: "vkuiGroup__description"
     }, description)), separator !== "hide" && /*#__PURE__*/ _react.createElement(_react.Fragment, null, /*#__PURE__*/ _react.createElement(_Spacing.Spacing, {
         className: (0, _vkjs.classNames)("vkuiGroup__separator", "vkuiGroup__separator--spacing"),

package/dist/cjs/components/Group/Group.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Group/Group.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { AppRootContext } from '../AppRoot/AppRootContext';\nimport { ModalRootContext } from '../ModalRoot/ModalRootContext';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Separator } from '../Separator/Separator';\nimport { Spacing } from '../Spacing/Spacing';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './Group.module.css';\n\nconst sizeXClassNames = {\n  none: classNames(styles['Group--sizeX-none'], 'vkuiInternalGroup--sizeX-none'),\n  [SizeType.COMPACT]: styles['Group--sizeX-compact'],\n};\n\nconst stylesMode = {\n  none: classNames(styles['Group--mode-none'], 'vkuiInternalGroup--mode-none'),\n  plain: classNames(styles['Group--mode-plain'], 'vkuiInternalGroup--mode-plain'),\n  card: classNames(styles['Group--mode-card'], 'vkuiInternalGroup--mode-card'),\n};\n\nconst stylesPadding = {\n  s: styles['Group--padding-s'],\n  m: styles['Group--padding-m'],\n};\n\n/**\n * Вычисляем mode для Group.\n */\nfunction useGroupMode(\n  forcedMode: GroupProps['mode'],\n  sizeX: SizeType | 'none',\n  isInsideModal: boolean,\n): 'plain' | 'card' | 'none' {\n  const { layout } = React.useContext(AppRootContext);\n\n  if (forcedMode) {\n    return forcedMode;\n  }\n\n  if (isInsideModal) {\n    return 'plain';\n  }\n\n  if (layout) {\n    return layout;\n  }\n\n  if (sizeX !== 'none') {\n    return sizeX === SizeType.REGULAR ? 'card' : 'plain';\n  }\n\n  return 'none';\n}\n\nexport interface GroupProps extends HTMLAttributesWithRootRef<HTMLElement> {\n  header?: React.ReactNode;\n  description?: React.ReactNode;\n  /**\n    `show` - разделитель всегда показывается,\n    `hide` - разделитель всегда спрятан,\n    `auto` - разделитель рисуется автоматически между соседними группами.\n   */\n  separator?: 'show' | 'hide' | 'auto';\n  /**\n   * Режим отображения. Если установлен `card`, выглядит как карточка c\n   * обводкой и внешними отступами. Если `plain` — без отступов и обводки.\n   * По умолчанию режим отображения зависит от `sizeX` (`mode=card` при `sizeX=REGULAR` и `mode=plain` при `sizeX=COMPACT`)\n   * В модальных окнах по умолчанию `plain`.\n   */\n  mode?: 'plain' | 'card';\n  /**\n   * Отвечает за отступы вокруг контента в режиме `card`.\n   */\n  padding?: 's' | 'm';\n}\n\nconst warn = warnOnce('Group');\n/**\n * @see https://vkcom.github.io/VKUI/#/Group\n */\nexport const Group = ({\n  header,\n  description,\n  children,\n  separator = 'auto',\n  mode: modeProps,\n  padding = 'm',\n  tabIndex: tabIndexProp,\n  ...restProps\n}: GroupProps) => {\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const platform = usePlatform();\n  const { sizeX = 'none' } = useAdaptivity();\n\n  const mode = useGroupMode(modeProps, sizeX, isInsideModal);\n\n  const isTabPanel = restProps.role === 'tabpanel';\n\n  if (\n    process.env.NODE_ENV === 'development' &&\n    isTabPanel &&\n    (!restProps['aria-controls'] || !restProps['id'])\n  ) {\n    warn(\n      'При использовании роли \"tabpanel\" необходимо задать значение свойств \"aria-controls\" и \"id\"',\n    );\n  }\n\n  const tabIndex = isTabPanel && tabIndexProp === undefined ? 0 : tabIndexProp;\n\n  return (\n    <>\n      <RootComponent\n        Component=\"section\"\n        {...restProps}\n        tabIndex={tabIndex}\n        baseClassName={classNames(\n          'vkuiInternalGroup',\n          styles['Group'],\n          isInsideModal && styles['Group--inside-modal'],\n          platform === Platform.IOS && styles['Group--ios'],\n          sizeX !== SizeType.REGULAR && sizeXClassNames[sizeX],\n          mode && stylesMode[mode],\n          stylesPadding[padding],\n        )}\n      >\n        {header}\n        {children}\n        {hasReactNode(description) && (\n          <Footnote className={styles['Group__description']}>{description}</Footnote>\n        )}\n      </RootComponent>\n\n      {separator !== 'hide' && (\n        <React.Fragment>\n          <Spacing\n            className={classNames(styles['Group__separator'], styles['Group__separator--spacing'])}\n            size={16}\n          />\n          <Separator\n            className={classNames(\n              styles['Group__separator'],\n              styles['Group__separator--separator'],\n              separator === 'show' && styles['Group__separator--force'],\n            )}\n          />\n        </React.Fragment>\n      )}\n    </>\n  );\n};\n"],"names":["Group","sizeXClassNames","none","classNames","SizeType","COMPACT","stylesMode","plain","card","stylesPadding","s","m","useGroupMode","forcedMode","sizeX","isInsideModal","layout","React","useContext","AppRootContext","REGULAR","warn","warnOnce","header","description","children","separator","mode","modeProps","padding","tabIndex","tabIndexProp","restProps","ModalRootContext","platform","usePlatform","useAdaptivity","isTabPanel","role","process","env","NODE_ENV","undefined","RootComponent","Component","baseClassName","Platform","IOS","hasReactNode","Footnote","className","Fragment","Spacing","size","Separator"],"mappings":";;;;+BAuFaA;;;eAAAA;;;;;;;;+DAvFU;oBACkB;6BACX;2BACF;0BACH;wBACA;wBACA;8BAEM;gCACE;6BACH;yBACJ;uBACF;wBACC;AAGzB,IAAMC;IACJC,MAAMC,IAAAA,gBAAU,2BAA8B;GAC7CC,oBAAQ,CAACC,OAAO;AAGnB,IAAMC,aAAa;IACjBJ,MAAMC,IAAAA,gBAAU,0BAA6B;IAC7CI,OAAOJ,IAAAA,gBAAU,2BAA8B;IAC/CK,MAAML,IAAAA,gBAAU,0BAA6B;AAC/C;AAEA,IAAMM,gBAAgB;IACpBC,CAAC;IACDC,CAAC;AACH;AAEA;;CAEC,GACD,SAASC,aACPC,UAA8B,EAC9BC,KAAwB,EACxBC,aAAsB;IAEtB,IAAM,AAAEC,SAAWC,OAAMC,UAAU,CAACC,8BAAc,EAA1CH;IAER,IAAIH,YAAY;QACd,OAAOA;IACT;IAEA,IAAIE,eAAe;QACjB,OAAO;IACT;IAEA,IAAIC,QAAQ;QACV,OAAOA;IACT;IAEA,IAAIF,UAAU,QAAQ;QACpB,OAAOA,UAAUV,oBAAQ,CAACgB,OAAO,GAAG,SAAS;IAC/C;IAEA,OAAO;AACT;AAwBA,IAAMC,OAAOC,IAAAA,kBAAQ,EAAC;AAIf,IAAMtB,QAAQ;QACnBuB,gBAAAA,QACAC,qBAAAA,aACAC,kBAAAA,oCACAC,WAAAA,0CAAY,2BACZC,AAAMC,mBAAND,8BACAE,SAAAA,sCAAU,sBACVC,AAAUC,sBAAVD,UACGE;QAPHT;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;;IAGA,IAAM,AAAEf,gBAAkBE,OAAMC,UAAU,CAACe,kCAAgB,EAAnDlB;IACR,IAAMmB,WAAWC,IAAAA,wBAAW;IAC5B,IAA2BC,kBAAAA,IAAAA,4BAAa,4BAAbA,gBAAnBtB,OAAAA,0CAAQ;IAEhB,IAAMa,OAAOf,aAAagB,WAAWd,OAAOC;IAE5C,IAAMsB,aAAaL,UAAUM,IAAI,KAAK;IAEtC,IACEC,QAAQC,GAAG,CAACC,QAAQ,KAAK,iBACzBJ,cACC,CAAA,CAACL,SAAS,CAAC,gBAAgB,IAAI,CAACA,SAAS,CAAC,KAAK,AAAD,GAC/C;QACAX,KACE;IAEJ;IAEA,IAAMS,WAAWO,cAAcN,iBAAiBW,YAAY,IAAIX;IAEhE,qBACE,0DACE,qBAACY,4BAAa;QACZC,WAAU;OACNZ;QACJF,UAAUA;QACVe,eAAe1C,IAAAA,gBAAU,EACvB,kCAEAY,4CACAmB,aAAaY,kBAAQ,CAACC,GAAG,sBACzBjC,UAAUV,oBAAQ,CAACgB,OAAO,IAAInB,eAAe,CAACa,MAAM,EACpDa,QAAQrB,UAAU,CAACqB,KAAK,EACxBlB,aAAa,CAACoB,QAAQ;QAGvBN,QACAE,UACAuB,IAAAA,kBAAY,EAACxB,8BACZ,qBAACyB,kBAAQ;QAACC,SAAS;OAAiC1B,eAIvDE,cAAc,wBACb,qBAACT,OAAMkC,QAAQ,sBACb,qBAACC,gBAAO;QACNF,WAAW/C,IAAAA,gBAAU;QACrBkD,MAAM;sBAER,qBAACC,oBAAS;QACRJ,WAAW/C,IAAAA,gBAAU,6DAGnBuB,cAAc;;AAO5B"}
+{"version":3,"sources":["../../../../src/components/Group/Group.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { AppRootContext } from '../AppRoot/AppRootContext';\nimport { ModalRootContext } from '../ModalRoot/ModalRootContext';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Separator } from '../Separator/Separator';\nimport { Spacing } from '../Spacing/Spacing';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './Group.module.css';\n\nconst sizeXClassNames = {\n  none: classNames(styles['Group--sizeX-none'], 'vkuiInternalGroup--sizeX-none'),\n  [SizeType.COMPACT]: styles['Group--sizeX-compact'],\n};\n\nconst stylesMode = {\n  none: classNames(styles['Group--mode-none'], 'vkuiInternalGroup--mode-none'),\n  plain: classNames(styles['Group--mode-plain'], 'vkuiInternalGroup--mode-plain'),\n  card: classNames(styles['Group--mode-card'], 'vkuiInternalGroup--mode-card'),\n};\n\nconst stylesPadding = {\n  s: styles['Group--padding-s'],\n  m: styles['Group--padding-m'],\n};\n\n/**\n * Вычисляем mode для Group.\n */\nfunction useGroupMode(\n  forcedMode: GroupProps['mode'],\n  sizeX: SizeType | 'none',\n  isInsideModal: boolean,\n): 'plain' | 'card' | 'none' {\n  const { layout } = React.useContext(AppRootContext);\n\n  if (forcedMode) {\n    return forcedMode;\n  }\n\n  if (isInsideModal) {\n    return 'plain';\n  }\n\n  if (layout) {\n    return layout;\n  }\n\n  if (sizeX !== 'none') {\n    return sizeX === SizeType.REGULAR ? 'card' : 'plain';\n  }\n\n  return 'none';\n}\n\nexport interface GroupProps extends HTMLAttributesWithRootRef<HTMLElement> {\n  header?: React.ReactNode;\n  description?: React.ReactNode;\n  /**\n    `show` - разделитель всегда показывается,\n    `hide` - разделитель всегда спрятан,\n    `auto` - разделитель рисуется автоматически между соседними группами.\n   */\n  separator?: 'show' | 'hide' | 'auto';\n  /**\n   * Режим отображения. Если установлен `card`, выглядит как карточка c\n   * обводкой и внешними отступами. Если `plain` — без отступов и обводки.\n   * По умолчанию режим отображения зависит от `sizeX` (`mode=card` при `sizeX=REGULAR` и `mode=plain` при `sizeX=COMPACT`)\n   * В модальных окнах по умолчанию `plain`.\n   */\n  mode?: 'plain' | 'card';\n  /**\n   * Отвечает за отступы вокруг контента в режиме `card`.\n   */\n  padding?: 's' | 'm';\n}\n\nconst warn = warnOnce('Group');\n/**\n * @see https://vkcom.github.io/VKUI/#/Group\n */\nexport const Group = ({\n  header,\n  description,\n  children,\n  separator = 'auto',\n  mode: modeProps,\n  padding = 'm',\n  tabIndex: tabIndexProp,\n  ...restProps\n}: GroupProps) => {\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const platform = usePlatform();\n  const { sizeX = 'none' } = useAdaptivity();\n\n  const mode = useGroupMode(modeProps, sizeX, isInsideModal);\n\n  const isTabPanel = restProps.role === 'tabpanel';\n\n  if (\n    process.env.NODE_ENV === 'development' &&\n    isTabPanel &&\n    (!restProps['aria-controls'] || !restProps['id'])\n  ) {\n    warn(\n      'При использовании роли \"tabpanel\" необходимо задать значение свойств \"aria-controls\" и \"id\"',\n    );\n  }\n\n  const tabIndex = isTabPanel && tabIndexProp === undefined ? 0 : tabIndexProp;\n\n  return (\n    <>\n      <RootComponent\n        Component=\"section\"\n        {...restProps}\n        tabIndex={tabIndex}\n        baseClassName={classNames(\n          'vkuiInternalGroup',\n          styles['Group'],\n          isInsideModal && styles['Group--inside-modal'],\n          platform === Platform.IOS && styles['Group--ios'],\n          sizeX !== SizeType.REGULAR && sizeXClassNames[sizeX],\n          mode && stylesMode[mode],\n          stylesPadding[padding],\n        )}\n      >\n        {hasReactNode(header) && <div className={styles['Group__header']}>{header}</div>}\n        {children}\n        {hasReactNode(description) && (\n          <Footnote className={styles['Group__description']}>{description}</Footnote>\n        )}\n      </RootComponent>\n\n      {separator !== 'hide' && (\n        <React.Fragment>\n          <Spacing\n            className={classNames(styles['Group__separator'], styles['Group__separator--spacing'])}\n            size={16}\n          />\n          <Separator\n            className={classNames(\n              styles['Group__separator'],\n              styles['Group__separator--separator'],\n              separator === 'show' && styles['Group__separator--force'],\n            )}\n          />\n        </React.Fragment>\n      )}\n    </>\n  );\n};\n"],"names":["Group","sizeXClassNames","none","classNames","SizeType","COMPACT","stylesMode","plain","card","stylesPadding","s","m","useGroupMode","forcedMode","sizeX","isInsideModal","layout","React","useContext","AppRootContext","REGULAR","warn","warnOnce","header","description","children","separator","mode","modeProps","padding","tabIndex","tabIndexProp","restProps","ModalRootContext","platform","usePlatform","useAdaptivity","isTabPanel","role","process","env","NODE_ENV","undefined","RootComponent","Component","baseClassName","Platform","IOS","hasReactNode","div","className","Footnote","Fragment","Spacing","size","Separator"],"mappings":";;;;+BAuFaA;;;eAAAA;;;;;;;;+DAvFU;oBACkB;6BACX;2BACF;0BACH;wBACA;wBACA;8BAEM;gCACE;6BACH;yBACJ;uBACF;wBACC;AAGzB,IAAMC;IACJC,MAAMC,IAAAA,gBAAU,2BAA8B;GAC7CC,oBAAQ,CAACC,OAAO;AAGnB,IAAMC,aAAa;IACjBJ,MAAMC,IAAAA,gBAAU,0BAA6B;IAC7CI,OAAOJ,IAAAA,gBAAU,2BAA8B;IAC/CK,MAAML,IAAAA,gBAAU,0BAA6B;AAC/C;AAEA,IAAMM,gBAAgB;IACpBC,CAAC;IACDC,CAAC;AACH;AAEA;;CAEC,GACD,SAASC,aACPC,UAA8B,EAC9BC,KAAwB,EACxBC,aAAsB;IAEtB,IAAM,AAAEC,SAAWC,OAAMC,UAAU,CAACC,8BAAc,EAA1CH;IAER,IAAIH,YAAY;QACd,OAAOA;IACT;IAEA,IAAIE,eAAe;QACjB,OAAO;IACT;IAEA,IAAIC,QAAQ;QACV,OAAOA;IACT;IAEA,IAAIF,UAAU,QAAQ;QACpB,OAAOA,UAAUV,oBAAQ,CAACgB,OAAO,GAAG,SAAS;IAC/C;IAEA,OAAO;AACT;AAwBA,IAAMC,OAAOC,IAAAA,kBAAQ,EAAC;AAIf,IAAMtB,QAAQ;QACnBuB,gBAAAA,QACAC,qBAAAA,aACAC,kBAAAA,oCACAC,WAAAA,0CAAY,2BACZC,AAAMC,mBAAND,8BACAE,SAAAA,sCAAU,sBACVC,AAAUC,sBAAVD,UACGE;QAPHT;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;;IAGA,IAAM,AAAEf,gBAAkBE,OAAMC,UAAU,CAACe,kCAAgB,EAAnDlB;IACR,IAAMmB,WAAWC,IAAAA,wBAAW;IAC5B,IAA2BC,kBAAAA,IAAAA,4BAAa,4BAAbA,gBAAnBtB,OAAAA,0CAAQ;IAEhB,IAAMa,OAAOf,aAAagB,WAAWd,OAAOC;IAE5C,IAAMsB,aAAaL,UAAUM,IAAI,KAAK;IAEtC,IACEC,QAAQC,GAAG,CAACC,QAAQ,KAAK,iBACzBJ,cACC,CAAA,CAACL,SAAS,CAAC,gBAAgB,IAAI,CAACA,SAAS,CAAC,KAAK,AAAD,GAC/C;QACAX,KACE;IAEJ;IAEA,IAAMS,WAAWO,cAAcN,iBAAiBW,YAAY,IAAIX;IAEhE,qBACE,0DACE,qBAACY,4BAAa;QACZC,WAAU;OACNZ;QACJF,UAAUA;QACVe,eAAe1C,IAAAA,gBAAU,EACvB,kCAEAY,4CACAmB,aAAaY,kBAAQ,CAACC,GAAG,sBACzBjC,UAAUV,oBAAQ,CAACgB,OAAO,IAAInB,eAAe,CAACa,MAAM,EACpDa,QAAQrB,UAAU,CAACqB,KAAK,EACxBlB,aAAa,CAACoB,QAAQ;QAGvBmB,IAAAA,kBAAY,EAACzB,yBAAW,qBAAC0B;QAAIC,SAAS;OAA4B3B,SAClEE,UACAuB,IAAAA,kBAAY,EAACxB,8BACZ,qBAAC2B,kBAAQ;QAACD,SAAS;OAAiC1B,eAIvDE,cAAc,wBACb,qBAACT,OAAMmC,QAAQ,sBACb,qBAACC,gBAAO;QACNH,WAAW/C,IAAAA,gBAAU;QACrBmD,MAAM;sBAER,qBAACC,oBAAS;QACRL,WAAW/C,IAAAA,gBAAU,6DAGnBuB,cAAc;;AAO5B"}

package/dist/cjs/components/ImageBase/ImageBase.js

@@ -107,21 +107,6 @@ var ImageBase = function(_param) {
         imgRef,
         loaded
     ]);
-    var sizeClassName = function() {
-        switch(size){
-            case 28:
-                return "vkuiImageBase--size-28";
-            case 32:
-                return "vkuiImageBase--size-32";
-            case 40:
-                return "vkuiImageBase--size-40";
-            case 48:
-                return "vkuiImageBase--size-48";
-            case 72:
-                return "vkuiImageBase--size-72";
-        }
-        return null;
-    }();
     return /*#__PURE__*/ _react.createElement(_context.ImageBaseContext.Provider, {
         value: {
             size: size
@@ -131,7 +116,7 @@ var ImageBase = function(_param) {
             width: size,
             height: size
         }),
-        baseClassName: (0, _vkjs.classNames)("vkuiImageBase", sizeClassName, loaded && "vkuiImageBase--loaded"),
+        baseClassName: (0, _vkjs.classNames)("vkuiImageBase", loaded && "vkuiImageBase--loaded"),
         role: hasSrc ? "img" : "presentation",
         "aria-label": ariaLabel,
         onClick: onClick

package/dist/cjs/components/ImageBase/ImageBase.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ImageBase/ImageBase.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport type { HasRef, HasRootRef, LiteralUnion } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ImageBaseBadge, type ImageBaseBadgeProps } from './ImageBaseBadge/ImageBaseBadge';\nimport { ImageBaseOverlay, type ImageBaseOverlayProps } from './ImageBaseOverlay/ImageBaseOverlay';\nimport { ImageBaseContext } from './context';\nimport type { ImageBaseContextProps, ImageBaseExpectedIconProps, ImageBaseSize } from './types';\nimport { validateFallbackIcon, validateSize } from './validators';\nimport styles from './ImageBase.module.css';\n\nexport type {\n  ImageBaseSize,\n  ImageBaseExpectedIconProps,\n  ImageBaseBadgeProps,\n  ImageBaseOverlayProps,\n  ImageBaseContextProps,\n};\n\nexport {\n  getBadgeIconSizeByImageBaseSize,\n  getFallbackIconSizeByImageBaseSize,\n  getOverlayIconSizeByImageBaseSize,\n} from './helpers';\n\nexport { ImageBaseContext };\n\nexport interface ImageBaseProps\n  extends React.ImgHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLImageElement> {\n  /**\n   * Задаёт размер картинки.\n   *\n   * Используйте размеры заданные дизайн-системой `16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 72 | 80 | 88 | 96`.\n   *\n   * > ⚠️ Использование кастомного размера – это пограничный кейс.\n   */\n  size?: LiteralUnion<ImageBaseSize, number>;\n  /**\n   * Включает или отключает обводку.\n   */\n  withBorder?: boolean;\n  /**\n   * Фолбек на случай, если картинка не прогрузилась.\n   *\n   * > 📝 Нужный для `<ImageBase size={...} />` размер можно узнать из функции `getFallbackIconSizeByImageBaseSize()`.\n   *\n   * > Предпочтительней использовать иконки из `@vkontakte/icons`.\n   *\n   * > 📊️ Если вы хотите передать кастомную иконку, то следует именовать её по шаблону `Icon<size><name>`. Или же\n   * > чтобы в неё был передан параметр `width`. Тогда мы сможем выводить в консоль подсказку правильного ли размера вы\n   * > использовали иконку.\n   *\n   * > ⚠️ Может перекрывать `children`.\n   */\n  fallbackIcon?: React.ReactElement<ImageBaseExpectedIconProps>;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ImageBase\n */\nexport const ImageBase = ({\n  alt,\n  crossOrigin,\n  decoding,\n  loading,\n  referrerPolicy,\n  sizes,\n  src,\n  srcSet,\n  useMap,\n  getRef,\n  size = 24,\n  width,\n  height,\n  style,\n  withBorder = true,\n  'fallbackIcon': fallbackIconProp,\n  children,\n  'aria-label': ariaLabel,\n  onClick,\n  onLoad,\n  onError,\n  ...restProps\n}: ImageBaseProps) => {\n  const [loaded, setLoaded] = React.useState(false);\n  const [failed, setFailed] = React.useState(false);\n\n  const hasSrc = src || srcSet;\n  const needShowFallbackIcon = (failed || !hasSrc) && React.isValidElement(fallbackIconProp);\n\n  const fallbackIcon = needShowFallbackIcon ? fallbackIconProp : null;\n\n  if (process.env.NODE_ENV === 'development') {\n    validateSize(size);\n    if (fallbackIcon) {\n      validateFallbackIcon(size, { name: 'fallbackIcon', value: fallbackIcon });\n    }\n  }\n\n  const handleImageLoad = (event: React.SyntheticEvent<HTMLImageElement>) => {\n    if (loaded) {\n      return;\n    }\n\n    setLoaded(true);\n    setFailed(false);\n    onLoad?.(event);\n  };\n\n  const handleImageError = (event: React.SyntheticEvent<HTMLImageElement>) => {\n    setLoaded(false);\n    setFailed(true);\n    onError?.(event);\n  };\n\n  const imgRef = useExternRef(getRef);\n  const isOnLoadStatusCheckedRef = React.useRef(false);\n  React.useEffect(\n    function dispatchLoadEventForAlreadyLoadedResourceIfReactInitializedLater() {\n      if (isOnLoadStatusCheckedRef.current) {\n        return;\n      }\n      isOnLoadStatusCheckedRef.current = true;\n\n      if (imgRef.current && imgRef.current.complete && !loaded) {\n        const event = new Event('load');\n        imgRef.current.dispatchEvent(event);\n      }\n    },\n    [imgRef, loaded],\n  );\n\n  const sizeClassName = (() => {\n    switch (size) {\n      case 28:\n        return styles['ImageBase--size-28'];\n      case 32:\n        return styles['ImageBase--size-32'];\n      case 40:\n        return styles['ImageBase--size-40'];\n      case 48:\n        return styles['ImageBase--size-48'];\n      case 72:\n        return styles['ImageBase--size-72'];\n    }\n\n    return null;\n  })();\n\n  return (\n    <ImageBaseContext.Provider value={{ size }}>\n      <RootComponent\n        {...restProps}\n        style={{ ...style, width: size, height: size }}\n        baseClassName={classNames(\n          styles['ImageBase'],\n          sizeClassName,\n          loaded && styles['ImageBase--loaded'],\n        )}\n        role={hasSrc ? 'img' : 'presentation'}\n        aria-label={ariaLabel}\n        onClick={onClick}\n      >\n        {hasSrc && (\n          <img\n            ref={imgRef}\n            alt={alt}\n            className={styles['ImageBase__img']}\n            crossOrigin={crossOrigin}\n            decoding={decoding}\n            loading={loading}\n            referrerPolicy={referrerPolicy}\n            sizes={sizes}\n            src={src}\n            srcSet={srcSet}\n            useMap={useMap}\n            width={width}\n            height={height}\n            onLoad={handleImageLoad}\n            onError={handleImageError}\n          />\n        )}\n        {fallbackIcon && <div className={styles['ImageBase__fallback']}>{fallbackIcon}</div>}\n        {children}\n        {withBorder && <div aria-hidden className={styles['ImageBase__border']} />}\n      </RootComponent>\n    </ImageBaseContext.Provider>\n  );\n};\n\nImageBase.Badge = ImageBaseBadge;\n\nImageBase.Overlay = ImageBaseOverlay;\n"],"names":["getBadgeIconSizeByImageBaseSize","getFallbackIconSizeByImageBaseSize","getOverlayIconSizeByImageBaseSize","ImageBaseContext","ImageBase","alt","crossOrigin","decoding","loading","referrerPolicy","sizes","src","srcSet","useMap","getRef","size","width","height","style","withBorder","fallbackIconProp","children","ariaLabel","onClick","onLoad","onError","restProps","React","useState","loaded","setLoaded","failed","setFailed","hasSrc","needShowFallbackIcon","isValidElement","fallbackIcon","process","env","NODE_ENV","validateSize","validateFallbackIcon","name","value","handleImageLoad","event","handleImageError","imgRef","useExternRef","isOnLoadStatusCheckedRef","useRef","useEffect","dispatchLoadEventForAlreadyLoadedResourceIfReactInitializedLater","current","complete","Event","dispatchEvent","sizeClassName","Provider","RootComponent","baseClassName","classNames","role","aria-label","img","ref","className","div","aria-hidden","Badge","ImageBaseBadge","Overlay","ImageBaseOverlay"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/ImageBase/ImageBase.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport type { HasRef, HasRootRef, LiteralUnion } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ImageBaseBadge, type ImageBaseBadgeProps } from './ImageBaseBadge/ImageBaseBadge';\nimport { ImageBaseOverlay, type ImageBaseOverlayProps } from './ImageBaseOverlay/ImageBaseOverlay';\nimport { ImageBaseContext } from './context';\nimport type { ImageBaseContextProps, ImageBaseExpectedIconProps, ImageBaseSize } from './types';\nimport { validateFallbackIcon, validateSize } from './validators';\nimport styles from './ImageBase.module.css';\n\nexport type {\n  ImageBaseSize,\n  ImageBaseExpectedIconProps,\n  ImageBaseBadgeProps,\n  ImageBaseOverlayProps,\n  ImageBaseContextProps,\n};\n\nexport {\n  getBadgeIconSizeByImageBaseSize,\n  getFallbackIconSizeByImageBaseSize,\n  getOverlayIconSizeByImageBaseSize,\n} from './helpers';\n\nexport { ImageBaseContext };\n\nexport interface ImageBaseProps\n  extends React.ImgHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLImageElement> {\n  /**\n   * Задаёт размер картинки.\n   *\n   * Используйте размеры заданные дизайн-системой `16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 72 | 80 | 88 | 96`.\n   *\n   * > ⚠️ Использование кастомного размера – это пограничный кейс.\n   */\n  size?: LiteralUnion<ImageBaseSize, number>;\n  /**\n   * Включает или отключает обводку.\n   */\n  withBorder?: boolean;\n  /**\n   * Фолбек на случай, если картинка не прогрузилась.\n   *\n   * > 📝 Нужный для `<ImageBase size={...} />` размер можно узнать из функции `getFallbackIconSizeByImageBaseSize()`.\n   *\n   * > Предпочтительней использовать иконки из `@vkontakte/icons`.\n   *\n   * > 📊️ Если вы хотите передать кастомную иконку, то следует именовать её по шаблону `Icon<size><name>`. Или же\n   * > чтобы в неё был передан параметр `width`. Тогда мы сможем выводить в консоль подсказку правильного ли размера вы\n   * > использовали иконку.\n   *\n   * > ⚠️ Может перекрывать `children`.\n   */\n  fallbackIcon?: React.ReactElement<ImageBaseExpectedIconProps>;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ImageBase\n */\nexport const ImageBase = ({\n  alt,\n  crossOrigin,\n  decoding,\n  loading,\n  referrerPolicy,\n  sizes,\n  src,\n  srcSet,\n  useMap,\n  getRef,\n  size = 24,\n  width,\n  height,\n  style,\n  withBorder = true,\n  'fallbackIcon': fallbackIconProp,\n  children,\n  'aria-label': ariaLabel,\n  onClick,\n  onLoad,\n  onError,\n  ...restProps\n}: ImageBaseProps) => {\n  const [loaded, setLoaded] = React.useState(false);\n  const [failed, setFailed] = React.useState(false);\n\n  const hasSrc = src || srcSet;\n  const needShowFallbackIcon = (failed || !hasSrc) && React.isValidElement(fallbackIconProp);\n\n  const fallbackIcon = needShowFallbackIcon ? fallbackIconProp : null;\n\n  if (process.env.NODE_ENV === 'development') {\n    validateSize(size);\n    if (fallbackIcon) {\n      validateFallbackIcon(size, { name: 'fallbackIcon', value: fallbackIcon });\n    }\n  }\n\n  const handleImageLoad = (event: React.SyntheticEvent<HTMLImageElement>) => {\n    if (loaded) {\n      return;\n    }\n\n    setLoaded(true);\n    setFailed(false);\n    onLoad?.(event);\n  };\n\n  const handleImageError = (event: React.SyntheticEvent<HTMLImageElement>) => {\n    setLoaded(false);\n    setFailed(true);\n    onError?.(event);\n  };\n\n  const imgRef = useExternRef(getRef);\n  const isOnLoadStatusCheckedRef = React.useRef(false);\n  React.useEffect(\n    function dispatchLoadEventForAlreadyLoadedResourceIfReactInitializedLater() {\n      if (isOnLoadStatusCheckedRef.current) {\n        return;\n      }\n      isOnLoadStatusCheckedRef.current = true;\n\n      if (imgRef.current && imgRef.current.complete && !loaded) {\n        const event = new Event('load');\n        imgRef.current.dispatchEvent(event);\n      }\n    },\n    [imgRef, loaded],\n  );\n\n  return (\n    <ImageBaseContext.Provider value={{ size }}>\n      <RootComponent\n        {...restProps}\n        style={{ ...style, width: size, height: size }}\n        baseClassName={classNames(styles['ImageBase'], loaded && styles['ImageBase--loaded'])}\n        role={hasSrc ? 'img' : 'presentation'}\n        aria-label={ariaLabel}\n        onClick={onClick}\n      >\n        {hasSrc && (\n          <img\n            ref={imgRef}\n            alt={alt}\n            className={styles['ImageBase__img']}\n            crossOrigin={crossOrigin}\n            decoding={decoding}\n            loading={loading}\n            referrerPolicy={referrerPolicy}\n            sizes={sizes}\n            src={src}\n            srcSet={srcSet}\n            useMap={useMap}\n            width={width}\n            height={height}\n            onLoad={handleImageLoad}\n            onError={handleImageError}\n          />\n        )}\n        {fallbackIcon && <div className={styles['ImageBase__fallback']}>{fallbackIcon}</div>}\n        {children}\n        {withBorder && <div aria-hidden className={styles['ImageBase__border']} />}\n      </RootComponent>\n    </ImageBaseContext.Provider>\n  );\n};\n\nImageBase.Badge = ImageBaseBadge;\n\nImageBase.Overlay = ImageBaseOverlay;\n"],"names":["getBadgeIconSizeByImageBaseSize","getFallbackIconSizeByImageBaseSize","getOverlayIconSizeByImageBaseSize","ImageBaseContext","ImageBase","alt","crossOrigin","decoding","loading","referrerPolicy","sizes","src","srcSet","useMap","getRef","size","width","height","style","withBorder","fallbackIconProp","children","ariaLabel","onClick","onLoad","onError","restProps","React","useState","loaded","setLoaded","failed","setFailed","hasSrc","needShowFallbackIcon","isValidElement","fallbackIcon","process","env","NODE_ENV","validateSize","validateFallbackIcon","name","value","handleImageLoad","event","handleImageError","imgRef","useExternRef","isOnLoadStatusCheckedRef","useRef","useEffect","dispatchLoadEventForAlreadyLoadedResourceIfReactInitializedLater","current","complete","Event","dispatchEvent","Provider","RootComponent","baseClassName","classNames","role","aria-label","img","ref","className","div","aria-hidden","Badge","ImageBaseBadge","Overlay","ImageBaseOverlay"],"mappings":"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"}

package/dist/cjs/components/ModalRoot/ModalRoot.js

@@ -224,6 +224,7 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
                     if ((_enteringState = enteringState) === null || _enteringState === void 0 ? void 0 : _enteringState.innerElement) {
                         enteringState.innerElement.style.transitionDelay = this.props.delayEnter ? "".concat(this.timeout, "ms") : "";
                         this.animateTranslate(enteringState, enteringState.translateY);
+                        this.setMaskOpacity(enteringState, 1);
                     }
                 }
                 // focus restoration
@@ -552,6 +553,7 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
                         var _modalState_translateY = modalState.translateY, translateY = _modalState_translateY === void 0 ? 0 : _modalState_translateY, _modalState_translateYCurrent = modalState.translateYCurrent, translateYCurrent = _modalState_translateYCurrent === void 0 ? 0 : _modalState_translateYCurrent;
                         var opacity = forceOpacity === null ? 1 - (translateYCurrent - translateY) / (100 - translateY) || 0 : forceOpacity;
                         _this.maskElementRef.current.style.opacity = (0, _math.clamp)(opacity, 0, 100).toString();
+                        _this.maskElementRef.current.style.transitionDelay = opacity && _this.props.delayEnter ? "".concat(_this.timeout, "ms") : "";
                     }
                 });
             }

package/dist/cjs/components/ModalRoot/ModalRoot.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ModalRoot/ModalRoot.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { clamp } from '../../helpers/math';\nimport { withContext } from '../../hoc/withContext';\nimport { withPlatform } from '../../hoc/withPlatform';\nimport { DOMProps, withDOM } from '../../lib/dom';\nimport { getNavId } from '../../lib/getNavId';\nimport { Platform } from '../../lib/platform';\nimport { setTransformStyle } from '../../lib/styles';\nimport { transitionEvent } from '../../lib/supportEvents';\nimport { rubber } from '../../lib/touch';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ConfigProviderContext } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { Touch, TouchEvent } from '../Touch/Touch';\nimport TouchRootContext from '../Touch/TouchContext';\nimport { ModalRootContext, ModalRootContextInterface } from './ModalRootContext';\nimport { MODAL_PAGE_DEFAULT_PERCENT_HEIGHT } from './constants';\nimport { ModalRootWithDOMProps, ModalsStateEntry, ModalType, TranslateRange } from './types';\nimport { ModalTransitionProps, withModalManager } from './useModalManager';\nimport styles from './ModalRoot.module.css';\n\nconst warn = warnOnce('ModalRoot');\n\nfunction numberInRange(number: number, range: TranslateRange | undefined) {\n  if (!range) {\n    return false;\n  }\n  return number >= range[0] && number <= range[1];\n}\n\nfunction rangeTranslate(number: number) {\n  return clamp(number, 0, 98);\n}\n\ninterface ModalRootState {\n  touchDown?: boolean;\n  dragging?: boolean;\n  modalOpenedLog: string[];\n}\n\nclass ModalRootTouchComponent extends React.Component<\n  ModalRootWithDOMProps & DOMProps & ModalTransitionProps,\n  ModalRootState\n> {\n  constructor(props: ModalRootWithDOMProps & ModalTransitionProps) {\n    super(props);\n    this.state = {\n      touchDown: false,\n      dragging: false,\n      modalOpenedLog: [],\n    };\n\n    this.maskElementRef = React.createRef();\n\n    this.modalRootContext = {\n      updateModalHeight: this.updateModalHeight,\n      registerModal: ({ id, ...data }) => Object.assign(this.props.getModalState(id) ?? {}, data),\n      onClose: () => this.props.onExit(),\n      isInsideModal: true,\n    };\n\n    this.frameIds = {};\n  }\n\n  private documentScrolling = false;\n  private readonly maskElementRef: React.RefObject<HTMLDivElement>;\n  private readonly viewportRef = React.createRef<HTMLDivElement>();\n  private maskAnimationFrame: number | undefined = undefined;\n  private readonly modalRootContext: ModalRootContextInterface;\n  private readonly frameIds: {\n    [index: string]: number;\n  };\n  private restoreFocusTo: HTMLElement | undefined | null = undefined;\n\n  get timeout(): number {\n    return this.props.platform === Platform.IOS ? 400 : 320;\n  }\n\n  get document(): Document {\n    return this.props.document as Document;\n  }\n\n  get window(): Window {\n    return this.props.window as Window;\n  }\n\n  getModals() {\n    return React.Children.toArray(this.props.children) as React.ReactElement[];\n  }\n\n  componentDidMount() {\n    // Отслеживаем изменение размеров viewport\n    this.window?.addEventListener('resize', this.updateModalHeight, false);\n  }\n\n  componentWillUnmount() {\n    this.toggleDocumentScrolling(true);\n    this.window.removeEventListener('resize', this.updateModalHeight, false);\n  }\n\n  componentDidUpdate(prevProps: ModalRootWithDOMProps & ModalTransitionProps) {\n    // transition phase 2: animate exiting modal\n    if (this.props.exitingModal && this.props.exitingModal !== prevProps.exitingModal) {\n      this.closeModal(this.props.exitingModal);\n    }\n\n    // transition phase 3: animate entering modal\n    if (this.props.enteringModal && this.props.enteringModal !== prevProps.enteringModal) {\n      const { enteringModal } = this.props;\n      const enteringState = this.props.getModalState(enteringModal);\n      this.props.onEnter();\n      this.waitTransitionFinish(enteringState, () => {\n        if (enteringState?.innerElement) {\n          enteringState.innerElement.style.transitionDelay = '';\n        }\n        this.props.onEntered(enteringModal);\n      });\n\n      if (enteringState?.innerElement) {\n        enteringState.innerElement.style.transitionDelay = this.props.delayEnter\n          ? `${this.timeout}ms`\n          : '';\n        this.animateTranslate(enteringState, enteringState.translateY);\n      }\n    }\n\n    // focus restoration\n    if (this.props.activeModal && !prevProps.activeModal) {\n      this.restoreFocusTo = this.document.activeElement as HTMLElement;\n    }\n    if (!this.props.activeModal && !this.props.exitingModal && this.restoreFocusTo) {\n      this.restoreFocusTo.focus();\n      this.restoreFocusTo = null;\n    }\n\n    this.toggleDocumentScrolling(!this.props.activeModal && !this.props.exitingModal);\n  }\n\n  /* Отключает скролл документа */\n  toggleDocumentScrolling(enabled: boolean) {\n    if (this.documentScrolling === enabled) {\n      return;\n    }\n    this.documentScrolling = enabled;\n\n    if (enabled) {\n      // Здесь нужен последний аргумент с такими же параметрами, потому что\n      // некоторые браузеры на странных вендорах типа Meizu не удаляют обработчик.\n      // https://github.com/VKCOM/VKUI/issues/444\n      this.window.removeEventListener('touchmove', this.preventTouch, {\n        // @ts-expect-error: TS2769 В интерфейсе EventListenerOptions нет поля passive\n        passive: false,\n      });\n    } else {\n      this.window.addEventListener('touchmove', this.preventTouch, {\n        passive: false,\n      });\n    }\n  }\n\n  preventTouch = (event: any) => {\n    if (!event) {\n      return false;\n    }\n    while (event.originalEvent) {\n      event = event.originalEvent;\n    }\n    if (event.preventDefault) {\n      event.preventDefault();\n    }\n    return false;\n  };\n\n  checkPageContentHeight() {\n    const modalState = this.props.getModalState(this.props.activeModal);\n\n    if (modalState?.type === ModalType.PAGE && modalState?.modalElement) {\n      const prevModalState = { ...modalState };\n      initPageModal(modalState);\n      const currentModalState = { ...modalState };\n\n      let needAnimate = false;\n\n      if (prevModalState.expandable === currentModalState.expandable) {\n        if (prevModalState.translateYFrom !== currentModalState.translateYFrom) {\n          needAnimate = true;\n        }\n      } else {\n        needAnimate = true;\n      }\n\n      if (needAnimate) {\n        this.animateTranslate(modalState, modalState.translateY);\n      }\n    }\n  }\n\n  updateModalHeight = () => {\n    const modalState = this.props.getModalState(this.props.activeModal);\n\n    if (modalState && modalState.type === ModalType.PAGE) {\n      if (this.props.enteringModal) {\n        this.waitTransitionFinish(modalState, () => {\n          requestAnimationFrame(() => this.checkPageContentHeight());\n        });\n      } else {\n        requestAnimationFrame(() => this.checkPageContentHeight());\n      }\n    }\n  };\n\n  closeModal(id: string) {\n    // Сбрасываем состояния, которые могут помешать закрытию модального окна\n    this.setState({ touchDown: false });\n\n    const prevModalState = this.props.getModalState(id);\n\n    if (!prevModalState) {\n      id && warn(`closeActiveModal: модальное окно (страница) ${id} не существует`, 'error');\n      return;\n    }\n    if (!this.state.modalOpenedLog.length) {\n      this.setState((prevState) => ({\n        modalOpenedLog: [...prevState.modalOpenedLog, id],\n      }));\n    }\n    const nextModalState = this.props.getModalState(this.props.activeModal);\n    const nextIsPage = !!nextModalState && nextModalState.type === ModalType.PAGE;\n\n    const prevIsPage = !!prevModalState && prevModalState.type === ModalType.PAGE;\n    this.waitTransitionFinish(prevModalState, () => this.props.onExited(id));\n    const exitTranslate =\n      prevIsPage &&\n      nextIsPage &&\n      (prevModalState.translateY ?? 0) <= (nextModalState?.translateYFrom ?? 0) &&\n      !this.props.isBack\n        ? (nextModalState?.translateYFrom ?? 0) + 10\n        : 100;\n    this.animateTranslate(prevModalState, exitTranslate);\n\n    if (!nextModalState) {\n      // NOTE: was only for clean exit\n      this.setMaskOpacity(prevModalState, 0);\n      this.setState({ modalOpenedLog: [] });\n      prevModalState.translateY = undefined;\n    } else if (nextModalState.id && !this.state.modalOpenedLog.includes(nextModalState.id)) {\n      nextModalState.translateY = undefined;\n      this.setState((prevState) => ({\n        modalOpenedLog: [...prevState.modalOpenedLog, nextModalState.id!],\n      }));\n    }\n  }\n\n  onTouchMove = (e: TouchEvent) => {\n    if (this.props.exitingModal) {\n      return;\n    }\n    const modalState = this.props.getModalState(this.props.activeModal);\n    if (!modalState) {\n      return;\n    }\n\n    if (modalState.type === ModalType.PAGE) {\n      return this.onPageTouchMove(e, modalState);\n    }\n\n    if (modalState.type === ModalType.CARD) {\n      return this.onCardTouchMove(e, modalState);\n    }\n  };\n\n  onPageTouchMove(event: TouchEvent, modalState: ModalsStateEntry) {\n    const { shiftY, originalEvent } = event;\n    const target = originalEvent.target as HTMLElement;\n\n    if (!event.isY) {\n      if (this.viewportRef.current?.contains(target)) {\n        originalEvent.preventDefault();\n      }\n      return;\n    }\n\n    if (!modalState.innerElement?.contains(target)) {\n      return originalEvent.preventDefault();\n    }\n\n    originalEvent.stopPropagation();\n\n    const { expandable, contentScrolled, collapsed, expanded } = modalState;\n\n    if (!this.state.touchDown) {\n      modalState.touchStartContentScrollTop = modalState.contentElement?.scrollTop ?? 0;\n      this.setState({ touchDown: true });\n    }\n\n    if (contentScrolled) {\n      return;\n    }\n\n    if (modalState.touchMovePositive === null) {\n      modalState.touchMovePositive = shiftY > 0;\n    }\n\n    if (\n      !modalState.expandable ||\n      collapsed ||\n      (expanded && modalState.touchMovePositive && modalState.touchStartContentScrollTop === 0) ||\n      modalState.headerElement?.contains(target)\n    ) {\n      originalEvent.preventDefault();\n\n      if ((!expandable && shiftY < 0) || !this.window) {\n        return;\n      }\n\n      !this.state.dragging && this.setState({ dragging: true });\n\n      const shiftYPercent = (shiftY / this.window.innerHeight) * 100;\n      const shiftYCurrent = rubber(shiftYPercent, 72, 0.8, this.props.platform !== Platform.IOS);\n\n      modalState.touchShiftYPercent = shiftYPercent;\n      modalState.translateYCurrent = rangeTranslate((modalState.translateY ?? 0) + shiftYCurrent);\n\n      this.animateTranslate(modalState, modalState.translateYCurrent);\n      this.setMaskOpacity(modalState);\n    }\n  }\n\n  onCardTouchMove(event: TouchEvent, modalState: ModalsStateEntry) {\n    const { originalEvent, shiftY } = event;\n    const target = originalEvent.target as HTMLElement;\n    if (modalState.innerElement?.contains(target)) {\n      if (!this.state.touchDown) {\n        this.setState({ touchDown: true, dragging: true });\n      }\n\n      const shiftYPercent = (shiftY / modalState.innerElement.offsetHeight) * 100;\n      const shiftYCurrent = rubber(shiftYPercent, 72, 1.2, this.props.platform !== Platform.IOS);\n\n      modalState.touchShiftYPercent = shiftYPercent;\n      modalState.translateYCurrent = Math.max(0, (modalState.translateY ?? 0) + shiftYCurrent);\n\n      this.animateTranslate(modalState, modalState.translateYCurrent);\n      this.setMaskOpacity(modalState);\n    }\n  }\n\n  onTouchEnd = (e: TouchEvent) => {\n    const modalState = this.props.getModalState(this.props.activeModal);\n\n    if (modalState?.type === ModalType.PAGE) {\n      return this.onPageTouchEnd(e, modalState);\n    }\n\n    if (modalState?.type === ModalType.CARD) {\n      return this.onCardTouchEnd(e, modalState);\n    }\n  };\n\n  onPageTouchEnd(event: TouchEvent, modalState: ModalsStateEntry) {\n    const { startY, shiftY } = event;\n\n    modalState.contentScrolled = false;\n    modalState.touchMovePositive = null;\n\n    let setStateCallback;\n\n    if (this.state.dragging && this.window) {\n      const shiftYEndPercent = ((startY + shiftY) / this.window.innerHeight) * 100;\n\n      let translateY = modalState.translateYCurrent ?? 0;\n      const expectTranslateY =\n        (translateY / event.duration) *\n        240 *\n        0.6 *\n        ((modalState.touchShiftYPercent ?? 0) < 0 ? -1 : 1);\n      translateY = rangeTranslate(translateY + expectTranslateY);\n\n      if (modalState.settlingHeight !== 100) {\n        if (numberInRange(translateY, modalState.expandedRange)) {\n          translateY = modalState.expandedRange?.[0] ?? 0;\n        } else if (numberInRange(translateY, modalState.collapsedRange)) {\n          translateY = modalState.translateYFrom ?? 0;\n        } else if (numberInRange(translateY, modalState.hiddenRange)) {\n          translateY = 100;\n        } else {\n          translateY = modalState.translateYFrom ?? 0;\n        }\n      } else {\n        if (numberInRange(translateY, [0, 25])) {\n          translateY = 0;\n        } else {\n          translateY = 100;\n        }\n      }\n\n      if (translateY !== 100 && shiftYEndPercent >= 75) {\n        translateY = 100;\n      }\n\n      modalState.translateY = translateY;\n      modalState.translateYCurrent = translateY;\n      modalState.collapsed = translateY > 0 && translateY < shiftYEndPercent;\n      modalState.expanded = translateY === 0;\n      modalState.hidden = translateY === 100;\n\n      if (modalState.hidden) {\n        this.props.onExit();\n      }\n\n      setStateCallback = () => {\n        if (!modalState.hidden) {\n          this.animateTranslate(modalState, modalState.translateY);\n        }\n\n        this.setMaskOpacity(modalState);\n      };\n    }\n\n    this.setState(\n      {\n        touchDown: false,\n        dragging: false,\n      },\n      setStateCallback,\n    );\n  }\n\n  onCardTouchEnd({ duration }: TouchEvent, modalState: ModalsStateEntry) {\n    let setStateCallback;\n\n    if (this.state.dragging) {\n      let translateY = modalState.translateYCurrent ?? 0;\n\n      const expectTranslateY =\n        (translateY / duration) * 240 * 0.6 * ((modalState.touchShiftYPercent ?? 0) < 0 ? -1 : 1);\n      translateY = Math.max(0, translateY + expectTranslateY);\n\n      if (translateY >= 30) {\n        translateY = 100;\n      } else {\n        translateY = 0;\n      }\n\n      modalState.translateY = translateY;\n      modalState.hidden = translateY === 100;\n\n      if (modalState.hidden) {\n        this.props.onExit();\n      }\n\n      setStateCallback = () => {\n        if (!modalState.hidden) {\n          this.animateTranslate(modalState, modalState.translateY);\n        }\n\n        this.setMaskOpacity(modalState);\n      };\n    }\n\n    this.setState(\n      {\n        touchDown: false,\n        dragging: false,\n      },\n      setStateCallback,\n    );\n  }\n\n  onScroll = (e: React.SyntheticEvent) => {\n    const activeModal = this.props.activeModal;\n\n    const target = e.target as HTMLElement;\n\n    if (!activeModal) {\n      return;\n    }\n    const modalState = this.props.getModalState(activeModal);\n    if (modalState?.type === ModalType.PAGE && modalState?.contentElement?.contains(target)) {\n      modalState.contentScrolled = true;\n\n      if (modalState.contentScrollStopTimeout) {\n        clearTimeout(modalState.contentScrollStopTimeout);\n      }\n\n      modalState.contentScrollStopTimeout = setTimeout(() => {\n        if (modalState.contentScrolled) {\n          modalState.contentScrolled = false;\n        }\n      }, 250);\n    }\n  };\n\n  waitTransitionFinish(modalState: ModalsStateEntry | undefined, eventHandler: () => void) {\n    if (transitionEvent.supported) {\n      const onceHandler = () => {\n        modalState?.innerElement?.removeEventListener(transitionEvent.name as string, onceHandler);\n        eventHandler();\n      };\n\n      modalState?.innerElement?.addEventListener(transitionEvent.name as string, onceHandler);\n    } else {\n      setTimeout(eventHandler, this.timeout);\n    }\n  }\n\n  /**\n   * Анимирует сдвиг модалки\n   *\n   * @param {ModalsStateEntry} modalState\n   * @param {number} percent Процент сдвига: 0 – полностью открыта, 100 – полностью закрыта\n   */\n  animateTranslate(modalState: ModalsStateEntry, percent: number | undefined) {\n    const frameId = `animateTranslateFrame${modalState.id}`;\n\n    cancelAnimationFrame(this.frameIds[frameId]);\n\n    this.frameIds[frameId] = requestAnimationFrame(() => {\n      setTransformStyle(modalState.innerElement, `translate3d(0, ${percent}%, 0)`);\n    });\n  }\n\n  /* Устанавливает прозрачность для полупрозрачной подложки */\n  setMaskOpacity(modalState: ModalsStateEntry, forceOpacity: number | null = null) {\n    if (forceOpacity === null && this.props.history?.[0] !== modalState.id) {\n      return;\n    }\n    if (this.maskAnimationFrame) {\n      cancelAnimationFrame(this.maskAnimationFrame);\n    }\n    this.maskAnimationFrame = requestAnimationFrame(() => {\n      if (this.maskElementRef.current) {\n        const { translateY = 0, translateYCurrent = 0 } = modalState;\n\n        const opacity =\n          forceOpacity === null\n            ? 1 - (translateYCurrent - translateY) / (100 - translateY) || 0\n            : forceOpacity;\n        this.maskElementRef.current.style.opacity = clamp(opacity, 0, 100).toString();\n      }\n    });\n  }\n\n  render() {\n    const { activeModal, exitingModal, enteringModal } = this.props;\n    const { touchDown, dragging } = this.state;\n\n    if (!activeModal && !exitingModal) {\n      return null;\n    }\n\n    return (\n      <TouchRootContext.Provider value={true}>\n        <ModalRootContext.Provider value={this.modalRootContext}>\n          <Touch\n            className={classNames(\n              styles['ModalRoot'],\n              this.props.configProvider?.hasCustomPanelHeaderAfter &&\n                styles['ModalRoot--hasCustomPanelHeaderAfterSlot'],\n              touchDown &&\n                classNames(styles['ModalRoot--touched'], 'vkuiInternalModalRoot--touched'),\n              !!(enteringModal || exitingModal) &&\n                classNames(styles['ModalRoot--switching'], 'vkuiInternalModalRoot--switching'),\n            )}\n            onMove={this.onTouchMove}\n            onEnd={this.onTouchEnd}\n            onScroll={this.onScroll}\n          >\n            <div\n              className={styles['ModalRoot__mask']}\n              onClick={this.props.onExit}\n              ref={this.maskElementRef}\n            />\n            <div className={styles['ModalRoot__viewport']} ref={this.viewportRef}>\n              {this.getModals().map((Modal) => {\n                const modalId = getNavId(Modal.props, warn);\n                const _modalState = this.props.getModalState(modalId);\n                if ((modalId !== activeModal && modalId !== exitingModal) || !_modalState) {\n                  return null;\n                }\n                const modalState = { ..._modalState };\n\n                const isPage = modalState.type === ModalType.PAGE;\n                const key = `modal-${modalId}`;\n\n                return (\n                  <FocusTrap\n                    key={key}\n                    getRootRef={(e) => {\n                      const modalState = this.props.getModalState(modalId);\n                      if (modalState) {\n                        modalState.modalElement = e;\n                      }\n                    }}\n                    onClose={this.props.onExit}\n                    timeout={this.timeout}\n                    className={classNames(\n                      styles['ModalRoot__modal'],\n\n                      dragging && 'vkuiInternalModalRoot__modal--dragging',\n\n                      isPage && modalState.expandable && 'vkuiInternalModalRoot__modal--expandable',\n                      isPage && modalState.collapsed && 'vkuiInternalModalRoot__modal--collapsed',\n                    )}\n                    restoreFocus={false}\n                  >\n                    {Modal}\n                  </FocusTrap>\n                );\n              })}\n            </div>\n          </Touch>\n        </ModalRootContext.Provider>\n      </TouchRootContext.Provider>\n    );\n  }\n}\n\nexport const ModalRootTouch = withContext(\n  withPlatform(\n    withDOM<ModalRootWithDOMProps>(withModalManager(initModal)(ModalRootTouchComponent)),\n  ),\n  ConfigProviderContext,\n  'configProvider',\n);\n\n/**\n * Инициализирует модалку перед анимацией открытия\n */\nfunction initModal(modalState: ModalsStateEntry) {\n  switch (modalState.type) {\n    case ModalType.PAGE:\n      modalState.settlingHeight = modalState.settlingHeight || MODAL_PAGE_DEFAULT_PERCENT_HEIGHT;\n      return initPageModal(modalState);\n    case ModalType.CARD:\n      return initCardModal(modalState);\n    default:\n      process.env.NODE_ENV === 'development' &&\n        warn(`initActiveModal: modalState.type=\"${modalState.type}\" не поддерживается`, 'error');\n  }\n}\n\nfunction initPageModal(modalState: ModalsStateEntry) {\n  const { contentElement, bottomInset } = modalState;\n  const contentElementHeight = (contentElement?.firstElementChild as HTMLElement).offsetHeight;\n  const bottomInsetHeight = bottomInset?.offsetHeight || 0;\n  const contentHeight = contentElementHeight + bottomInsetHeight;\n  let prevTranslateY = modalState.translateY;\n\n  modalState.expandable =\n    contentHeight > (contentElement?.clientHeight ?? 0) ||\n    modalState.settlingHeight === 100 ||\n    modalState.expanded;\n\n  let collapsed = false;\n  let expanded = false;\n  let translateYFrom;\n  let translateY;\n  let expandedRange: TranslateRange;\n  let collapsedRange: TranslateRange;\n  let hiddenRange: TranslateRange;\n\n  if (modalState.expandable) {\n    translateYFrom = 100 - (modalState.settlingHeight ?? 0);\n\n    const shiftHalf = translateYFrom / 2;\n    const visiblePart = 100 - translateYFrom;\n\n    expandedRange = [0, shiftHalf];\n    collapsedRange = [shiftHalf, translateYFrom + visiblePart / 4];\n    hiddenRange = [translateYFrom + visiblePart / 4, 100];\n\n    collapsed = translateYFrom > 0;\n    expanded = translateYFrom <= 0;\n    translateY = translateYFrom;\n  } else {\n    const headerHeight = modalState.headerElement?.offsetHeight ?? 0;\n    const height = contentHeight + headerHeight;\n\n    translateYFrom =\n      100 - (height / (modalState.innerElement?.parentElement?.offsetHeight ?? 0)) * 100;\n    translateY = translateYFrom;\n\n    expandedRange = [translateY, translateY + 25];\n    collapsedRange = [translateY + 25, translateY + 25];\n    hiddenRange = [translateY + 25, translateY + 100];\n  }\n\n  // Если модалка может открываться на весь экран, и новый сдвиг больше предыдущего, то откроем её на весь экран\n  if (\n    (modalState.expandable && translateY > (prevTranslateY ?? 100)) ||\n    modalState.settlingHeight === 100\n  ) {\n    translateY = 0;\n  }\n\n  // Если модалка уже раскрыта обновляем состояния\n  if (translateY === 0) {\n    expanded = true;\n    collapsed = false;\n  }\n\n  modalState.expandedRange = expandedRange;\n  modalState.collapsedRange = collapsedRange;\n  modalState.hiddenRange = hiddenRange;\n  modalState.translateY = translateY;\n  modalState.translateYFrom = translateYFrom;\n  modalState.collapsed = collapsed;\n  modalState.expanded = expanded;\n}\n\nfunction initCardModal(modalState: ModalsStateEntry) {\n  modalState.translateY = 0;\n}\n"],"names":["ModalRootTouch","warn","warnOnce","numberInRange","number","range","rangeTranslate","clamp","ModalRootTouchComponent","props","documentScrolling","maskElementRef","viewportRef","React","createRef","maskAnimationFrame","undefined","modalRootContext","frameIds","restoreFocusTo","preventTouch","event","originalEvent","preventDefault","updateModalHeight","modalState","getModalState","activeModal","type","ModalType","PAGE","enteringModal","waitTransitionFinish","requestAnimationFrame","checkPageContentHeight","onTouchMove","e","exitingModal","onPageTouchMove","CARD","onCardTouchMove","onTouchEnd","onPageTouchEnd","onCardTouchEnd","onScroll","target","contentElement","contains","contentScrolled","contentScrollStopTimeout","clearTimeout","setTimeout","state","touchDown","dragging","modalOpenedLog","registerModal","id","data","Object","assign","onClose","onExit","isInsideModal","timeout","platform","Platform","IOS","document","window","getModals","Children","toArray","children","componentDidMount","addEventListener","componentWillUnmount","toggleDocumentScrolling","removeEventListener","componentDidUpdate","prevProps","closeModal","enteringState","onEnter","innerElement","style","transitionDelay","onEntered","delayEnter","animateTranslate","translateY","activeElement","focus","enabled","passive","modalElement","prevModalState","initPageModal","currentModalState","needAnimate","expandable","translateYFrom","nextModalState","setState","length","prevState","nextIsPage","prevIsPage","onExited","exitTranslate","isBack","setMaskOpacity","includes","shiftY","isY","current","stopPropagation","collapsed","expanded","touchStartContentScrollTop","scrollTop","touchMovePositive","headerElement","shiftYPercent","innerHeight","shiftYCurrent","rubber","touchShiftYPercent","translateYCurrent","offsetHeight","Math","max","startY","setStateCallback","shiftYEndPercent","expectTranslateY","duration","settlingHeight","expandedRange","collapsedRange","hiddenRange","hidden","eventHandler","transitionEvent","supported","onceHandler","name","percent","frameId","cancelAnimationFrame","setTransformStyle","forceOpacity","history","opacity","toString","render","TouchRootContext","Provider","value","ModalRootContext","Touch","className","classNames","configProvider","hasCustomPanelHeaderAfter","onMove","onEnd","div","onClick","ref","map","Modal","modalId","getNavId","_modalState","isPage","key","FocusTrap","getRootRef","restoreFocus","Component","withContext","withPlatform","withDOM","withModalManager","initModal","ConfigProviderContext","MODAL_PAGE_DEFAULT_PERCENT_HEIGHT","initCardModal","process","env","NODE_ENV","bottomInset","contentElementHeight","firstElementChild","bottomInsetHeight","contentHeight","prevTranslateY","clientHeight","shiftHalf","visiblePart","headerHeight","height","parentElement"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/ModalRoot/ModalRoot.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { clamp } from '../../helpers/math';\nimport { withContext } from '../../hoc/withContext';\nimport { withPlatform } from '../../hoc/withPlatform';\nimport { DOMProps, withDOM } from '../../lib/dom';\nimport { getNavId } from '../../lib/getNavId';\nimport { Platform } from '../../lib/platform';\nimport { setTransformStyle } from '../../lib/styles';\nimport { transitionEvent } from '../../lib/supportEvents';\nimport { rubber } from '../../lib/touch';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ConfigProviderContext } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { Touch, TouchEvent } from '../Touch/Touch';\nimport TouchRootContext from '../Touch/TouchContext';\nimport { ModalRootContext, ModalRootContextInterface } from './ModalRootContext';\nimport { MODAL_PAGE_DEFAULT_PERCENT_HEIGHT } from './constants';\nimport { ModalRootWithDOMProps, ModalsStateEntry, ModalType, TranslateRange } from './types';\nimport { ModalTransitionProps, withModalManager } from './useModalManager';\nimport styles from './ModalRoot.module.css';\n\nconst warn = warnOnce('ModalRoot');\n\nfunction numberInRange(number: number, range: TranslateRange | undefined) {\n  if (!range) {\n    return false;\n  }\n  return number >= range[0] && number <= range[1];\n}\n\nfunction rangeTranslate(number: number) {\n  return clamp(number, 0, 98);\n}\n\ninterface ModalRootState {\n  touchDown?: boolean;\n  dragging?: boolean;\n  modalOpenedLog: string[];\n}\n\nclass ModalRootTouchComponent extends React.Component<\n  ModalRootWithDOMProps & DOMProps & ModalTransitionProps,\n  ModalRootState\n> {\n  constructor(props: ModalRootWithDOMProps & ModalTransitionProps) {\n    super(props);\n    this.state = {\n      touchDown: false,\n      dragging: false,\n      modalOpenedLog: [],\n    };\n\n    this.maskElementRef = React.createRef();\n\n    this.modalRootContext = {\n      updateModalHeight: this.updateModalHeight,\n      registerModal: ({ id, ...data }) => Object.assign(this.props.getModalState(id) ?? {}, data),\n      onClose: () => this.props.onExit(),\n      isInsideModal: true,\n    };\n\n    this.frameIds = {};\n  }\n\n  private documentScrolling = false;\n  private readonly maskElementRef: React.RefObject<HTMLDivElement>;\n  private readonly viewportRef = React.createRef<HTMLDivElement>();\n  private maskAnimationFrame: number | undefined = undefined;\n  private readonly modalRootContext: ModalRootContextInterface;\n  private readonly frameIds: {\n    [index: string]: number;\n  };\n  private restoreFocusTo: HTMLElement | undefined | null = undefined;\n\n  get timeout(): number {\n    return this.props.platform === Platform.IOS ? 400 : 320;\n  }\n\n  get document(): Document {\n    return this.props.document as Document;\n  }\n\n  get window(): Window {\n    return this.props.window as Window;\n  }\n\n  getModals() {\n    return React.Children.toArray(this.props.children) as React.ReactElement[];\n  }\n\n  componentDidMount() {\n    // Отслеживаем изменение размеров viewport\n    this.window?.addEventListener('resize', this.updateModalHeight, false);\n  }\n\n  componentWillUnmount() {\n    this.toggleDocumentScrolling(true);\n    this.window.removeEventListener('resize', this.updateModalHeight, false);\n  }\n\n  componentDidUpdate(prevProps: ModalRootWithDOMProps & ModalTransitionProps) {\n    // transition phase 2: animate exiting modal\n    if (this.props.exitingModal && this.props.exitingModal !== prevProps.exitingModal) {\n      this.closeModal(this.props.exitingModal);\n    }\n\n    // transition phase 3: animate entering modal\n    if (this.props.enteringModal && this.props.enteringModal !== prevProps.enteringModal) {\n      const { enteringModal } = this.props;\n      const enteringState = this.props.getModalState(enteringModal);\n      this.props.onEnter();\n      this.waitTransitionFinish(enteringState, () => {\n        if (enteringState?.innerElement) {\n          enteringState.innerElement.style.transitionDelay = '';\n        }\n        this.props.onEntered(enteringModal);\n      });\n\n      if (enteringState?.innerElement) {\n        enteringState.innerElement.style.transitionDelay = this.props.delayEnter\n          ? `${this.timeout}ms`\n          : '';\n        this.animateTranslate(enteringState, enteringState.translateY);\n        this.setMaskOpacity(enteringState, 1);\n      }\n    }\n\n    // focus restoration\n    if (this.props.activeModal && !prevProps.activeModal) {\n      this.restoreFocusTo = this.document.activeElement as HTMLElement;\n    }\n    if (!this.props.activeModal && !this.props.exitingModal && this.restoreFocusTo) {\n      this.restoreFocusTo.focus();\n      this.restoreFocusTo = null;\n    }\n\n    this.toggleDocumentScrolling(!this.props.activeModal && !this.props.exitingModal);\n  }\n\n  /* Отключает скролл документа */\n  toggleDocumentScrolling(enabled: boolean) {\n    if (this.documentScrolling === enabled) {\n      return;\n    }\n    this.documentScrolling = enabled;\n\n    if (enabled) {\n      // Здесь нужен последний аргумент с такими же параметрами, потому что\n      // некоторые браузеры на странных вендорах типа Meizu не удаляют обработчик.\n      // https://github.com/VKCOM/VKUI/issues/444\n      this.window.removeEventListener('touchmove', this.preventTouch, {\n        // @ts-expect-error: TS2769 В интерфейсе EventListenerOptions нет поля passive\n        passive: false,\n      });\n    } else {\n      this.window.addEventListener('touchmove', this.preventTouch, {\n        passive: false,\n      });\n    }\n  }\n\n  preventTouch = (event: any) => {\n    if (!event) {\n      return false;\n    }\n    while (event.originalEvent) {\n      event = event.originalEvent;\n    }\n    if (event.preventDefault) {\n      event.preventDefault();\n    }\n    return false;\n  };\n\n  checkPageContentHeight() {\n    const modalState = this.props.getModalState(this.props.activeModal);\n\n    if (modalState?.type === ModalType.PAGE && modalState?.modalElement) {\n      const prevModalState = { ...modalState };\n      initPageModal(modalState);\n      const currentModalState = { ...modalState };\n\n      let needAnimate = false;\n\n      if (prevModalState.expandable === currentModalState.expandable) {\n        if (prevModalState.translateYFrom !== currentModalState.translateYFrom) {\n          needAnimate = true;\n        }\n      } else {\n        needAnimate = true;\n      }\n\n      if (needAnimate) {\n        this.animateTranslate(modalState, modalState.translateY);\n      }\n    }\n  }\n\n  updateModalHeight = () => {\n    const modalState = this.props.getModalState(this.props.activeModal);\n\n    if (modalState && modalState.type === ModalType.PAGE) {\n      if (this.props.enteringModal) {\n        this.waitTransitionFinish(modalState, () => {\n          requestAnimationFrame(() => this.checkPageContentHeight());\n        });\n      } else {\n        requestAnimationFrame(() => this.checkPageContentHeight());\n      }\n    }\n  };\n\n  closeModal(id: string) {\n    // Сбрасываем состояния, которые могут помешать закрытию модального окна\n    this.setState({ touchDown: false });\n\n    const prevModalState = this.props.getModalState(id);\n\n    if (!prevModalState) {\n      id && warn(`closeActiveModal: модальное окно (страница) ${id} не существует`, 'error');\n      return;\n    }\n    if (!this.state.modalOpenedLog.length) {\n      this.setState((prevState) => ({\n        modalOpenedLog: [...prevState.modalOpenedLog, id],\n      }));\n    }\n    const nextModalState = this.props.getModalState(this.props.activeModal);\n    const nextIsPage = !!nextModalState && nextModalState.type === ModalType.PAGE;\n\n    const prevIsPage = !!prevModalState && prevModalState.type === ModalType.PAGE;\n    this.waitTransitionFinish(prevModalState, () => this.props.onExited(id));\n    const exitTranslate =\n      prevIsPage &&\n      nextIsPage &&\n      (prevModalState.translateY ?? 0) <= (nextModalState?.translateYFrom ?? 0) &&\n      !this.props.isBack\n        ? (nextModalState?.translateYFrom ?? 0) + 10\n        : 100;\n    this.animateTranslate(prevModalState, exitTranslate);\n\n    if (!nextModalState) {\n      // NOTE: was only for clean exit\n      this.setMaskOpacity(prevModalState, 0);\n      this.setState({ modalOpenedLog: [] });\n      prevModalState.translateY = undefined;\n    } else if (nextModalState.id && !this.state.modalOpenedLog.includes(nextModalState.id)) {\n      nextModalState.translateY = undefined;\n      this.setState((prevState) => ({\n        modalOpenedLog: [...prevState.modalOpenedLog, nextModalState.id!],\n      }));\n    }\n  }\n\n  onTouchMove = (e: TouchEvent) => {\n    if (this.props.exitingModal) {\n      return;\n    }\n    const modalState = this.props.getModalState(this.props.activeModal);\n    if (!modalState) {\n      return;\n    }\n\n    if (modalState.type === ModalType.PAGE) {\n      return this.onPageTouchMove(e, modalState);\n    }\n\n    if (modalState.type === ModalType.CARD) {\n      return this.onCardTouchMove(e, modalState);\n    }\n  };\n\n  onPageTouchMove(event: TouchEvent, modalState: ModalsStateEntry) {\n    const { shiftY, originalEvent } = event;\n    const target = originalEvent.target as HTMLElement;\n\n    if (!event.isY) {\n      if (this.viewportRef.current?.contains(target)) {\n        originalEvent.preventDefault();\n      }\n      return;\n    }\n\n    if (!modalState.innerElement?.contains(target)) {\n      return originalEvent.preventDefault();\n    }\n\n    originalEvent.stopPropagation();\n\n    const { expandable, contentScrolled, collapsed, expanded } = modalState;\n\n    if (!this.state.touchDown) {\n      modalState.touchStartContentScrollTop = modalState.contentElement?.scrollTop ?? 0;\n      this.setState({ touchDown: true });\n    }\n\n    if (contentScrolled) {\n      return;\n    }\n\n    if (modalState.touchMovePositive === null) {\n      modalState.touchMovePositive = shiftY > 0;\n    }\n\n    if (\n      !modalState.expandable ||\n      collapsed ||\n      (expanded && modalState.touchMovePositive && modalState.touchStartContentScrollTop === 0) ||\n      modalState.headerElement?.contains(target)\n    ) {\n      originalEvent.preventDefault();\n\n      if ((!expandable && shiftY < 0) || !this.window) {\n        return;\n      }\n\n      !this.state.dragging && this.setState({ dragging: true });\n\n      const shiftYPercent = (shiftY / this.window.innerHeight) * 100;\n      const shiftYCurrent = rubber(shiftYPercent, 72, 0.8, this.props.platform !== Platform.IOS);\n\n      modalState.touchShiftYPercent = shiftYPercent;\n      modalState.translateYCurrent = rangeTranslate((modalState.translateY ?? 0) + shiftYCurrent);\n\n      this.animateTranslate(modalState, modalState.translateYCurrent);\n      this.setMaskOpacity(modalState);\n    }\n  }\n\n  onCardTouchMove(event: TouchEvent, modalState: ModalsStateEntry) {\n    const { originalEvent, shiftY } = event;\n    const target = originalEvent.target as HTMLElement;\n    if (modalState.innerElement?.contains(target)) {\n      if (!this.state.touchDown) {\n        this.setState({ touchDown: true, dragging: true });\n      }\n\n      const shiftYPercent = (shiftY / modalState.innerElement.offsetHeight) * 100;\n      const shiftYCurrent = rubber(shiftYPercent, 72, 1.2, this.props.platform !== Platform.IOS);\n\n      modalState.touchShiftYPercent = shiftYPercent;\n      modalState.translateYCurrent = Math.max(0, (modalState.translateY ?? 0) + shiftYCurrent);\n\n      this.animateTranslate(modalState, modalState.translateYCurrent);\n      this.setMaskOpacity(modalState);\n    }\n  }\n\n  onTouchEnd = (e: TouchEvent) => {\n    const modalState = this.props.getModalState(this.props.activeModal);\n\n    if (modalState?.type === ModalType.PAGE) {\n      return this.onPageTouchEnd(e, modalState);\n    }\n\n    if (modalState?.type === ModalType.CARD) {\n      return this.onCardTouchEnd(e, modalState);\n    }\n  };\n\n  onPageTouchEnd(event: TouchEvent, modalState: ModalsStateEntry) {\n    const { startY, shiftY } = event;\n\n    modalState.contentScrolled = false;\n    modalState.touchMovePositive = null;\n\n    let setStateCallback;\n\n    if (this.state.dragging && this.window) {\n      const shiftYEndPercent = ((startY + shiftY) / this.window.innerHeight) * 100;\n\n      let translateY = modalState.translateYCurrent ?? 0;\n      const expectTranslateY =\n        (translateY / event.duration) *\n        240 *\n        0.6 *\n        ((modalState.touchShiftYPercent ?? 0) < 0 ? -1 : 1);\n      translateY = rangeTranslate(translateY + expectTranslateY);\n\n      if (modalState.settlingHeight !== 100) {\n        if (numberInRange(translateY, modalState.expandedRange)) {\n          translateY = modalState.expandedRange?.[0] ?? 0;\n        } else if (numberInRange(translateY, modalState.collapsedRange)) {\n          translateY = modalState.translateYFrom ?? 0;\n        } else if (numberInRange(translateY, modalState.hiddenRange)) {\n          translateY = 100;\n        } else {\n          translateY = modalState.translateYFrom ?? 0;\n        }\n      } else {\n        if (numberInRange(translateY, [0, 25])) {\n          translateY = 0;\n        } else {\n          translateY = 100;\n        }\n      }\n\n      if (translateY !== 100 && shiftYEndPercent >= 75) {\n        translateY = 100;\n      }\n\n      modalState.translateY = translateY;\n      modalState.translateYCurrent = translateY;\n      modalState.collapsed = translateY > 0 && translateY < shiftYEndPercent;\n      modalState.expanded = translateY === 0;\n      modalState.hidden = translateY === 100;\n\n      if (modalState.hidden) {\n        this.props.onExit();\n      }\n\n      setStateCallback = () => {\n        if (!modalState.hidden) {\n          this.animateTranslate(modalState, modalState.translateY);\n        }\n\n        this.setMaskOpacity(modalState);\n      };\n    }\n\n    this.setState(\n      {\n        touchDown: false,\n        dragging: false,\n      },\n      setStateCallback,\n    );\n  }\n\n  onCardTouchEnd({ duration }: TouchEvent, modalState: ModalsStateEntry) {\n    let setStateCallback;\n\n    if (this.state.dragging) {\n      let translateY = modalState.translateYCurrent ?? 0;\n\n      const expectTranslateY =\n        (translateY / duration) * 240 * 0.6 * ((modalState.touchShiftYPercent ?? 0) < 0 ? -1 : 1);\n      translateY = Math.max(0, translateY + expectTranslateY);\n\n      if (translateY >= 30) {\n        translateY = 100;\n      } else {\n        translateY = 0;\n      }\n\n      modalState.translateY = translateY;\n      modalState.hidden = translateY === 100;\n\n      if (modalState.hidden) {\n        this.props.onExit();\n      }\n\n      setStateCallback = () => {\n        if (!modalState.hidden) {\n          this.animateTranslate(modalState, modalState.translateY);\n        }\n\n        this.setMaskOpacity(modalState);\n      };\n    }\n\n    this.setState(\n      {\n        touchDown: false,\n        dragging: false,\n      },\n      setStateCallback,\n    );\n  }\n\n  onScroll = (e: React.SyntheticEvent) => {\n    const activeModal = this.props.activeModal;\n\n    const target = e.target as HTMLElement;\n\n    if (!activeModal) {\n      return;\n    }\n    const modalState = this.props.getModalState(activeModal);\n    if (modalState?.type === ModalType.PAGE && modalState?.contentElement?.contains(target)) {\n      modalState.contentScrolled = true;\n\n      if (modalState.contentScrollStopTimeout) {\n        clearTimeout(modalState.contentScrollStopTimeout);\n      }\n\n      modalState.contentScrollStopTimeout = setTimeout(() => {\n        if (modalState.contentScrolled) {\n          modalState.contentScrolled = false;\n        }\n      }, 250);\n    }\n  };\n\n  waitTransitionFinish(modalState: ModalsStateEntry | undefined, eventHandler: () => void) {\n    if (transitionEvent.supported) {\n      const onceHandler = () => {\n        modalState?.innerElement?.removeEventListener(transitionEvent.name as string, onceHandler);\n        eventHandler();\n      };\n\n      modalState?.innerElement?.addEventListener(transitionEvent.name as string, onceHandler);\n    } else {\n      setTimeout(eventHandler, this.timeout);\n    }\n  }\n\n  /**\n   * Анимирует сдвиг модалки\n   *\n   * @param {ModalsStateEntry} modalState\n   * @param {number} percent Процент сдвига: 0 – полностью открыта, 100 – полностью закрыта\n   */\n  animateTranslate(modalState: ModalsStateEntry, percent: number | undefined) {\n    const frameId = `animateTranslateFrame${modalState.id}`;\n\n    cancelAnimationFrame(this.frameIds[frameId]);\n\n    this.frameIds[frameId] = requestAnimationFrame(() => {\n      setTransformStyle(modalState.innerElement, `translate3d(0, ${percent}%, 0)`);\n    });\n  }\n\n  /* Устанавливает прозрачность для полупрозрачной подложки */\n  setMaskOpacity(modalState: ModalsStateEntry, forceOpacity: number | null = null) {\n    if (forceOpacity === null && this.props.history?.[0] !== modalState.id) {\n      return;\n    }\n    if (this.maskAnimationFrame) {\n      cancelAnimationFrame(this.maskAnimationFrame);\n    }\n    this.maskAnimationFrame = requestAnimationFrame(() => {\n      if (this.maskElementRef.current) {\n        const { translateY = 0, translateYCurrent = 0 } = modalState;\n\n        const opacity =\n          forceOpacity === null\n            ? 1 - (translateYCurrent - translateY) / (100 - translateY) || 0\n            : forceOpacity;\n        this.maskElementRef.current.style.opacity = clamp(opacity, 0, 100).toString();\n        this.maskElementRef.current.style.transitionDelay =\n          opacity && this.props.delayEnter ? `${this.timeout}ms` : '';\n      }\n    });\n  }\n\n  render() {\n    const { activeModal, exitingModal, enteringModal } = this.props;\n    const { touchDown, dragging } = this.state;\n\n    if (!activeModal && !exitingModal) {\n      return null;\n    }\n\n    return (\n      <TouchRootContext.Provider value={true}>\n        <ModalRootContext.Provider value={this.modalRootContext}>\n          <Touch\n            className={classNames(\n              styles['ModalRoot'],\n              this.props.configProvider?.hasCustomPanelHeaderAfter &&\n                styles['ModalRoot--hasCustomPanelHeaderAfterSlot'],\n              touchDown &&\n                classNames(styles['ModalRoot--touched'], 'vkuiInternalModalRoot--touched'),\n              !!(enteringModal || exitingModal) &&\n                classNames(styles['ModalRoot--switching'], 'vkuiInternalModalRoot--switching'),\n            )}\n            onMove={this.onTouchMove}\n            onEnd={this.onTouchEnd}\n            onScroll={this.onScroll}\n          >\n            <div\n              className={styles['ModalRoot__mask']}\n              onClick={this.props.onExit}\n              ref={this.maskElementRef}\n            />\n            <div className={styles['ModalRoot__viewport']} ref={this.viewportRef}>\n              {this.getModals().map((Modal) => {\n                const modalId = getNavId(Modal.props, warn);\n                const _modalState = this.props.getModalState(modalId);\n                if ((modalId !== activeModal && modalId !== exitingModal) || !_modalState) {\n                  return null;\n                }\n                const modalState = { ..._modalState };\n\n                const isPage = modalState.type === ModalType.PAGE;\n                const key = `modal-${modalId}`;\n\n                return (\n                  <FocusTrap\n                    key={key}\n                    getRootRef={(e) => {\n                      const modalState = this.props.getModalState(modalId);\n                      if (modalState) {\n                        modalState.modalElement = e;\n                      }\n                    }}\n                    onClose={this.props.onExit}\n                    timeout={this.timeout}\n                    className={classNames(\n                      styles['ModalRoot__modal'],\n\n                      dragging && 'vkuiInternalModalRoot__modal--dragging',\n\n                      isPage && modalState.expandable && 'vkuiInternalModalRoot__modal--expandable',\n                      isPage && modalState.collapsed && 'vkuiInternalModalRoot__modal--collapsed',\n                    )}\n                    restoreFocus={false}\n                  >\n                    {Modal}\n                  </FocusTrap>\n                );\n              })}\n            </div>\n          </Touch>\n        </ModalRootContext.Provider>\n      </TouchRootContext.Provider>\n    );\n  }\n}\n\nexport const ModalRootTouch = withContext(\n  withPlatform(\n    withDOM<ModalRootWithDOMProps>(withModalManager(initModal)(ModalRootTouchComponent)),\n  ),\n  ConfigProviderContext,\n  'configProvider',\n);\n\n/**\n * Инициализирует модалку перед анимацией открытия\n */\nfunction initModal(modalState: ModalsStateEntry) {\n  switch (modalState.type) {\n    case ModalType.PAGE:\n      modalState.settlingHeight = modalState.settlingHeight || MODAL_PAGE_DEFAULT_PERCENT_HEIGHT;\n      return initPageModal(modalState);\n    case ModalType.CARD:\n      return initCardModal(modalState);\n    default:\n      process.env.NODE_ENV === 'development' &&\n        warn(`initActiveModal: modalState.type=\"${modalState.type}\" не поддерживается`, 'error');\n  }\n}\n\nfunction initPageModal(modalState: ModalsStateEntry) {\n  const { contentElement, bottomInset } = modalState;\n  const contentElementHeight = (contentElement?.firstElementChild as HTMLElement).offsetHeight;\n  const bottomInsetHeight = bottomInset?.offsetHeight || 0;\n  const contentHeight = contentElementHeight + bottomInsetHeight;\n  let prevTranslateY = modalState.translateY;\n\n  modalState.expandable =\n    contentHeight > (contentElement?.clientHeight ?? 0) ||\n    modalState.settlingHeight === 100 ||\n    modalState.expanded;\n\n  let collapsed = false;\n  let expanded = false;\n  let translateYFrom;\n  let translateY;\n  let expandedRange: TranslateRange;\n  let collapsedRange: TranslateRange;\n  let hiddenRange: TranslateRange;\n\n  if (modalState.expandable) {\n    translateYFrom = 100 - (modalState.settlingHeight ?? 0);\n\n    const shiftHalf = translateYFrom / 2;\n    const visiblePart = 100 - translateYFrom;\n\n    expandedRange = [0, shiftHalf];\n    collapsedRange = [shiftHalf, translateYFrom + visiblePart / 4];\n    hiddenRange = [translateYFrom + visiblePart / 4, 100];\n\n    collapsed = translateYFrom > 0;\n    expanded = translateYFrom <= 0;\n    translateY = translateYFrom;\n  } else {\n    const headerHeight = modalState.headerElement?.offsetHeight ?? 0;\n    const height = contentHeight + headerHeight;\n\n    translateYFrom =\n      100 - (height / (modalState.innerElement?.parentElement?.offsetHeight ?? 0)) * 100;\n    translateY = translateYFrom;\n\n    expandedRange = [translateY, translateY + 25];\n    collapsedRange = [translateY + 25, translateY + 25];\n    hiddenRange = [translateY + 25, translateY + 100];\n  }\n\n  // Если модалка может открываться на весь экран, и новый сдвиг больше предыдущего, то откроем её на весь экран\n  if (\n    (modalState.expandable && translateY > (prevTranslateY ?? 100)) ||\n    modalState.settlingHeight === 100\n  ) {\n    translateY = 0;\n  }\n\n  // Если модалка уже раскрыта обновляем состояния\n  if (translateY === 0) {\n    expanded = true;\n    collapsed = false;\n  }\n\n  modalState.expandedRange = expandedRange;\n  modalState.collapsedRange = collapsedRange;\n  modalState.hiddenRange = hiddenRange;\n  modalState.translateY = translateY;\n  modalState.translateYFrom = translateYFrom;\n  modalState.collapsed = collapsed;\n  modalState.expanded = expanded;\n}\n\nfunction initCardModal(modalState: ModalsStateEntry) {\n  modalState.translateY = 0;\n}\n"],"names":["ModalRootTouch","warn","warnOnce","numberInRange","number","range","rangeTranslate","clamp","ModalRootTouchComponent","props","documentScrolling","maskElementRef","viewportRef","React","createRef","maskAnimationFrame","undefined","modalRootContext","frameIds","restoreFocusTo","preventTouch","event","originalEvent","preventDefault","updateModalHeight","modalState","getModalState","activeModal","type","ModalType","PAGE","enteringModal","waitTransitionFinish","requestAnimationFrame","checkPageContentHeight","onTouchMove","e","exitingModal","onPageTouchMove","CARD","onCardTouchMove","onTouchEnd","onPageTouchEnd","onCardTouchEnd","onScroll","target","contentElement","contains","contentScrolled","contentScrollStopTimeout","clearTimeout","setTimeout","state","touchDown","dragging","modalOpenedLog","registerModal","id","data","Object","assign","onClose","onExit","isInsideModal","timeout","platform","Platform","IOS","document","window","getModals","Children","toArray","children","componentDidMount","addEventListener","componentWillUnmount","toggleDocumentScrolling","removeEventListener","componentDidUpdate","prevProps","closeModal","enteringState","onEnter","innerElement","style","transitionDelay","onEntered","delayEnter","animateTranslate","translateY","setMaskOpacity","activeElement","focus","enabled","passive","modalElement","prevModalState","initPageModal","currentModalState","needAnimate","expandable","translateYFrom","nextModalState","setState","length","prevState","nextIsPage","prevIsPage","onExited","exitTranslate","isBack","includes","shiftY","isY","current","stopPropagation","collapsed","expanded","touchStartContentScrollTop","scrollTop","touchMovePositive","headerElement","shiftYPercent","innerHeight","shiftYCurrent","rubber","touchShiftYPercent","translateYCurrent","offsetHeight","Math","max","startY","setStateCallback","shiftYEndPercent","expectTranslateY","duration","settlingHeight","expandedRange","collapsedRange","hiddenRange","hidden","eventHandler","transitionEvent","supported","onceHandler","name","percent","frameId","cancelAnimationFrame","setTransformStyle","forceOpacity","history","opacity","toString","render","TouchRootContext","Provider","value","ModalRootContext","Touch","className","classNames","configProvider","hasCustomPanelHeaderAfter","onMove","onEnd","div","onClick","ref","map","Modal","modalId","getNavId","_modalState","isPage","key","FocusTrap","getRootRef","restoreFocus","Component","withContext","withPlatform","withDOM","withModalManager","initModal","ConfigProviderContext","MODAL_PAGE_DEFAULT_PERCENT_HEIGHT","initCardModal","process","env","NODE_ENV","bottomInset","contentElementHeight","firstElementChild","bottomInsetHeight","contentHeight","prevTranslateY","clientHeight","shiftHalf","visiblePart","headerHeight","height","parentElement"],"mappings":"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"}