@vkontakte/vkui 6.1.2 → 6.2.0

package/dist/cssm/components/ActionSheet/ActionSheetDropdownSheet.js

@@ -13,7 +13,7 @@ toggleRef, className, ...restProps })=>{
     return /*#__PURE__*/ _jsx(FocusTrap, {
         ...restProps,
         onClick: stopPropagation,
-        className: classNames(styles['ActionSheet'], platform === 'ios' && styles['ActionSheet--ios'], closing && styles['ActionSheet--closing'], sizeY === 'compact' && styles['ActionSheet--sizeY-compact'], className),
+        className: classNames(styles['ActionSheet'], platform === 'ios' && styles['ActionSheet--ios'], closing ? styles['ActionSheet--closing'] : styles['ActionSheet--opening'], sizeY === 'compact' && styles['ActionSheet--sizeY-compact'], className),
         children: children
     });
 };

package/dist/cssm/components/ActionSheet/ActionSheetDropdownSheet.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheetDropdownSheet.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nconst stopPropagation: React.MouseEventHandler = (e) => e.stopPropagation();\n\nexport type ActionSheetDropdownProps = Omit<\n  SharedDropdownProps,\n  'popupDirection' | 'popupOffsetDistance' | 'placement'\n>;\n\nexport const ActionSheetDropdownSheet = ({\n  children,\n  closing,\n  // these 2 props are only omitted - ActionSheetDesktop compat\n  toggleRef,\n  className,\n  ...restProps\n}: SharedDropdownProps) => {\n  const { sizeY } = useAdaptivityWithJSMediaQueries();\n  const platform = usePlatform();\n\n  return (\n    <FocusTrap\n      {...restProps}\n      onClick={stopPropagation}\n      className={classNames(\n        styles['ActionSheet'],\n        platform === 'ios' && styles['ActionSheet--ios'],\n        closing && styles['ActionSheet--closing'],\n        sizeY === 'compact' && styles['ActionSheet--sizeY-compact'],\n        className,\n      )}\n    >\n      {children}\n    </FocusTrap>\n  );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","usePlatform","FocusTrap","styles","stopPropagation","e","ActionSheetDropdownSheet","children","closing","toggleRef","className","restProps","sizeY","platform","onClick"],"rangeMappings":";;;;;;;;;;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,8CAA8C;AAC9F,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,SAAS,QAAQ,yBAAyB;AAEnD,OAAOC,YAAY,2BAA2B;AAE9C,MAAMC,kBAA2C,CAACC,IAAMA,EAAED,eAAe;AAOzE,OAAO,MAAME,2BAA2B,CAAC,EACvCC,QAAQ,EACRC,OAAO,EACP,6DAA6D;AAC7DC,SAAS,EACTC,SAAS,EACT,GAAGC,WACiB;IACpB,MAAM,EAAEC,KAAK,EAAE,GAAGZ;IAClB,MAAMa,WAAWZ;IAEjB,qBACE,KAACC;QACE,GAAGS,SAAS;QACbG,SAASV;QACTM,WAAWX,WACTI,MAAM,CAAC,cAAc,EACrBU,aAAa,SAASV,MAAM,CAAC,mBAAmB,EAChDK,WAAWL,MAAM,CAAC,uBAAuB,EACzCS,UAAU,aAAaT,MAAM,CAAC,6BAA6B,EAC3DO;kBAGDH;;AAGP,EAAE"}
+{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheetDropdownSheet.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nconst stopPropagation: React.MouseEventHandler = (e) => e.stopPropagation();\n\nexport type ActionSheetDropdownProps = Omit<\n  SharedDropdownProps,\n  'popupDirection' | 'popupOffsetDistance' | 'placement'\n>;\n\nexport const ActionSheetDropdownSheet = ({\n  children,\n  closing,\n  // these 2 props are only omitted - ActionSheetDesktop compat\n  toggleRef,\n  className,\n  ...restProps\n}: SharedDropdownProps) => {\n  const { sizeY } = useAdaptivityWithJSMediaQueries();\n  const platform = usePlatform();\n\n  return (\n    <FocusTrap\n      {...restProps}\n      onClick={stopPropagation}\n      className={classNames(\n        styles['ActionSheet'],\n        platform === 'ios' && styles['ActionSheet--ios'],\n        closing ? styles['ActionSheet--closing'] : styles['ActionSheet--opening'],\n        sizeY === 'compact' && styles['ActionSheet--sizeY-compact'],\n        className,\n      )}\n    >\n      {children}\n    </FocusTrap>\n  );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","usePlatform","FocusTrap","styles","stopPropagation","e","ActionSheetDropdownSheet","children","closing","toggleRef","className","restProps","sizeY","platform","onClick"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,8CAA8C;AAC9F,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,SAAS,QAAQ,yBAAyB;AAEnD,OAAOC,YAAY,2BAA2B;AAE9C,MAAMC,kBAA2C,CAACC,IAAMA,EAAED,eAAe;AAOzE,OAAO,MAAME,2BAA2B,CAAC,EACvCC,QAAQ,EACRC,OAAO,EACP,6DAA6D;AAC7DC,SAAS,EACTC,SAAS,EACT,GAAGC,WACiB;IACpB,MAAM,EAAEC,KAAK,EAAE,GAAGZ;IAClB,MAAMa,WAAWZ;IAEjB,qBACE,KAACC;QACE,GAAGS,SAAS;QACbG,SAASV;QACTM,WAAWX,WACTI,MAAM,CAAC,cAAc,EACrBU,aAAa,SAASV,MAAM,CAAC,mBAAmB,EAChDK,UAAUL,MAAM,CAAC,uBAAuB,GAAGA,MAAM,CAAC,uBAAuB,EACzES,UAAU,aAAaT,MAAM,CAAC,6BAA6B,EAC3DO;kBAGDH;;AAGP,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ActionSheet/types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { PlacementWithAuto } from '../../lib/floating/types/common';\nimport { FocusTrapProps } from '../FocusTrap/FocusTrap';\n\nexport type ToggleRef = Element | null | undefined | React.RefObject<Element>;\n\nexport interface SharedDropdownProps extends FocusTrapProps {\n  closing: boolean;\n  /**\n   * Элемент, рядом с которым вылезает попап на десктопе.\n   * Лучше передавать RefObject c current.\n   */\n  toggleRef: ToggleRef;\n  /**\n   * Позиционирование всплывающего окна для десктопа.\n   * Компонент выберет наилучшее расположение сам, но можно задать приоритетное направление с помощью этого свойства\n   */\n  placement?: PlacementWithAuto;\n  /**\n   * Отступ, где заданное кол-во единиц равняется пикселям\n   * */\n  popupOffsetDistance?: number;\n}\n"],"names":["React"],"rangeMappings":"","mappings":"AAAA,YAAYA,WAAW,QAAQ"}
+{"version":3,"sources":["../../../../src/components/ActionSheet/types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { PlacementWithAuto } from '../../lib/floating/types/common';\nimport { FocusTrapProps } from '../FocusTrap/FocusTrap';\n\nexport type ToggleRef = Element | null | undefined | React.RefObject<Element>;\n\nexport interface SharedDropdownProps extends FocusTrapProps {\n  closing: boolean;\n  /**\n   * Элемент, рядом с которым вылезает попап на десктопе.\n   * Лучше передавать RefObject c current.\n   */\n  toggleRef: ToggleRef;\n  /**\n   * Позиционирование всплывающего окна для десктопа.\n   * Компонент выберет наилучшее расположение сам, но можно задать приоритетное направление с помощью этого свойства\n   */\n  placement?: PlacementWithAuto;\n  /**\n   * Отступ, где заданное кол-во единиц равняется пикселям\n   * */\n  popupOffsetDistance?: number;\n}\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ActionSheetItem/ActionSheetItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { ActionSheetContext, type ActionSheetContextType } from '../ActionSheet/ActionSheetContext';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Text } from '../Typography/Text/Text';\nimport { Title } from '../Typography/Title/Title';\nimport { Radio } from './subcomponents/Radio/Radio';\nimport styles from './ActionSheetItem.module.css';\n\nexport interface ActionSheetItemProps\n  extends React.HTMLAttributes<HTMLElement>,\n    React.AnchorHTMLAttributes<HTMLElement>,\n    Pick<React.InputHTMLAttributes<HTMLInputElement>, 'name' | 'checked' | 'value'> {\n  mode?: 'default' | 'destructive' | 'cancel';\n  before?: React.ReactNode;\n  after?: React.ReactNode;\n  meta?: React.ReactNode;\n  subtitle?: React.ReactNode;\n  /**\n   * По умолчанию клик на опцию вызывает переданную в `ActionSheet` функцию `onClose`, данное свойство\n   * позволяет отключить такое поведение\n   */\n  autoCloseDisabled?: boolean;\n  selectable?: boolean;\n  disabled?: boolean;\n  /**\n   * Все текстовые элементы при необходимости занимают несколько строк\n   */\n  multiline?: boolean;\n  /**\n   * По умолчанию onClick будет вызван после завершения анимации скрытия и после вызова onClose.\n   * Из этого следует, что в объекте события значения полей типа `currentTarget` будут не определены.\n   * Если вам нужен объект события именно на момент клика, используйте `onImmediateClick`.\n   */\n  onClick?: React.MouseEventHandler<HTMLElement>;\n  onImmediateClick?: React.MouseEventHandler<HTMLElement>;\n  /**\n   * Иконка для `checked` режима.\n   */\n  iconChecked?: React.ReactNode;\n  /**\n   * Позволяет отделить ActionItem от CancelItem для определении того,\n   * кто вызвал закрытие ActionSheet. Используется в ActionSheet.onClose()\n   */\n  isCancelItem?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ActionSheetItem\n */\nexport const ActionSheetItem = ({\n  children,\n  autoCloseDisabled = false,\n  mode = 'default',\n  meta,\n  subtitle,\n  before,\n  after,\n  selectable,\n  value,\n  name,\n  checked,\n  defaultChecked,\n  onChange,\n  onClick,\n  onImmediateClick,\n  multiline = false,\n  iconChecked,\n  className,\n  isCancelItem,\n  ...restProps\n}: ActionSheetItemProps) => {\n  const platform = usePlatform();\n  const { onItemClick = () => noop, mode: actionSheetMode } =\n    React.useContext<ActionSheetContextType<HTMLElement>>(ActionSheetContext);\n  const { sizeY } = useAdaptivityWithJSMediaQueries();\n\n  const Component: React.ElementType | undefined = selectable ? 'label' : undefined;\n\n  const isRich = subtitle || meta || selectable;\n  const isCentered = !isRich && !before && platform === 'ios';\n\n  return (\n    <Tappable\n      {...(Component && { Component })}\n      {...restProps}\n      onClick={\n        selectable\n          ? onClick\n          : onItemClick({\n              action: onClick,\n              immediateAction: onImmediateClick,\n              autoClose: !autoCloseDisabled,\n              isCancelItem: Boolean(isCancelItem),\n            })\n      }\n      activeMode={platform === 'ios' ? styles['ActionSheetItem--active'] : undefined}\n      className={classNames(\n        styles['ActionSheetItem'],\n        platform === 'ios' && styles['ActionSheetItem--ios'],\n        mode === 'cancel' && styles['ActionSheetItem--mode-cancel'],\n        mode === 'destructive' && styles['ActionSheetItem--mode-destructive'],\n        sizeY === 'compact' && styles['ActionSheetItem--sizeY-compact'],\n        isRich && styles['ActionSheetItem--rich'],\n        actionSheetMode === 'menu' && styles['ActionSheetItem--menu'],\n        selectable && styles['ActionSheetItem--selectable'],\n        className,\n      )}\n    >\n      {before && <div className={styles['ActionSheetItem__before']}>{before}</div>}\n      <div\n        className={classNames(\n          styles['ActionSheetItem__container'],\n          !multiline && styles['ActionSheetItem--ellipsis'],\n        )}\n      >\n        <div\n          className={classNames(\n            styles['ActionSheetItem__content'],\n            isCentered && styles['ActionSheetItem--centered'],\n          )}\n        >\n          {platform === 'ios' ? (\n            <Title\n              className={styles['ActionSheetItem__children']}\n              weight={mode === 'cancel' ? '2' : '3'}\n              level={isCentered ? '2' : '3'}\n            >\n              {children}\n            </Title>\n          ) : (\n            <Text className={styles['ActionSheetItem__children']}>{children}</Text>\n          )}\n          {meta && <Text className={styles['ActionSheetItem__meta']}>{meta}</Text>}\n        </div>\n        {subtitle && <Subhead className={styles['ActionSheetItem__subtitle']}>{subtitle}</Subhead>}\n      </div>\n      {(selectable || after) && (\n        <div className={styles['ActionSheetItem__after']}>\n          {after}\n          {selectable && (\n            <Radio\n              name={name}\n              value={value}\n              onChange={onChange}\n              onClick={onItemClick({\n                action: noop,\n                immediateAction: noop,\n                autoClose: !autoCloseDisabled,\n                isCancelItem: Boolean(isCancelItem),\n              })}\n              defaultChecked={defaultChecked}\n              checked={checked}\n              disabled={restProps.disabled}\n            >\n              {iconChecked}\n            </Radio>\n          )}\n        </div>\n      )}\n    </Tappable>\n  );\n};\n"],"names":["React","classNames","noop","useAdaptivityWithJSMediaQueries","usePlatform","ActionSheetContext","Tappable","Subhead","Text","Title","Radio","styles","ActionSheetItem","children","autoCloseDisabled","mode","meta","subtitle","before","after","selectable","value","name","checked","defaultChecked","onChange","onClick","onImmediateClick","multiline","iconChecked","className","isCancelItem","restProps","platform","onItemClick","actionSheetMode","useContext","sizeY","Component","undefined","isRich","isCentered","action","immediateAction","autoClose","Boolean","activeMode","div","weight","level","disabled"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../../src/components/ActionSheetItem/ActionSheetItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { ActionSheetContext, type ActionSheetContextType } from '../ActionSheet/ActionSheetContext';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Text } from '../Typography/Text/Text';\nimport { Title } from '../Typography/Title/Title';\nimport { Radio } from './subcomponents/Radio/Radio';\nimport styles from './ActionSheetItem.module.css';\n\nexport interface ActionSheetItemProps\n  extends React.HTMLAttributes<HTMLElement>,\n    React.AnchorHTMLAttributes<HTMLElement>,\n    Pick<React.InputHTMLAttributes<HTMLInputElement>, 'name' | 'checked' | 'value'> {\n  mode?: 'default' | 'destructive' | 'cancel';\n  before?: React.ReactNode;\n  after?: React.ReactNode;\n  meta?: React.ReactNode;\n  subtitle?: React.ReactNode;\n  /**\n   * По умолчанию клик на опцию вызывает переданную в `ActionSheet` функцию `onClose`, данное свойство\n   * позволяет отключить такое поведение\n   */\n  autoCloseDisabled?: boolean;\n  selectable?: boolean;\n  disabled?: boolean;\n  /**\n   * Все текстовые элементы при необходимости занимают несколько строк\n   */\n  multiline?: boolean;\n  /**\n   * По умолчанию onClick будет вызван после завершения анимации скрытия и после вызова onClose.\n   * Из этого следует, что в объекте события значения полей типа `currentTarget` будут не определены.\n   * Если вам нужен объект события именно на момент клика, используйте `onImmediateClick`.\n   */\n  onClick?: React.MouseEventHandler<HTMLElement>;\n  onImmediateClick?: React.MouseEventHandler<HTMLElement>;\n  /**\n   * Иконка для `checked` режима.\n   */\n  iconChecked?: React.ReactNode;\n  /**\n   * Позволяет отделить ActionItem от CancelItem для определении того,\n   * кто вызвал закрытие ActionSheet. Используется в ActionSheet.onClose()\n   */\n  isCancelItem?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ActionSheetItem\n */\nexport const ActionSheetItem = ({\n  children,\n  autoCloseDisabled = false,\n  mode = 'default',\n  meta,\n  subtitle,\n  before,\n  after,\n  selectable,\n  value,\n  name,\n  checked,\n  defaultChecked,\n  onChange,\n  onClick,\n  onImmediateClick,\n  multiline = false,\n  iconChecked,\n  className,\n  isCancelItem,\n  ...restProps\n}: ActionSheetItemProps) => {\n  const platform = usePlatform();\n  const { onItemClick = () => noop, mode: actionSheetMode } =\n    React.useContext<ActionSheetContextType<HTMLElement>>(ActionSheetContext);\n  const { sizeY } = useAdaptivityWithJSMediaQueries();\n\n  const Component: React.ElementType | undefined = selectable ? 'label' : undefined;\n\n  const isRich = subtitle || meta || selectable;\n  const isCentered = !isRich && !before && platform === 'ios';\n\n  return (\n    <Tappable\n      {...(Component && { Component })}\n      {...restProps}\n      onClick={\n        selectable\n          ? onClick\n          : onItemClick({\n              action: onClick,\n              immediateAction: onImmediateClick,\n              autoClose: !autoCloseDisabled,\n              isCancelItem: Boolean(isCancelItem),\n            })\n      }\n      activeMode={platform === 'ios' ? styles['ActionSheetItem--active'] : undefined}\n      className={classNames(\n        styles['ActionSheetItem'],\n        platform === 'ios' && styles['ActionSheetItem--ios'],\n        mode === 'cancel' && styles['ActionSheetItem--mode-cancel'],\n        mode === 'destructive' && styles['ActionSheetItem--mode-destructive'],\n        sizeY === 'compact' && styles['ActionSheetItem--sizeY-compact'],\n        isRich && styles['ActionSheetItem--rich'],\n        actionSheetMode === 'menu' && styles['ActionSheetItem--menu'],\n        selectable && styles['ActionSheetItem--selectable'],\n        className,\n      )}\n    >\n      {before && <div className={styles['ActionSheetItem__before']}>{before}</div>}\n      <div\n        className={classNames(\n          styles['ActionSheetItem__container'],\n          !multiline && styles['ActionSheetItem--ellipsis'],\n        )}\n      >\n        <div\n          className={classNames(\n            styles['ActionSheetItem__content'],\n            isCentered && styles['ActionSheetItem--centered'],\n          )}\n        >\n          {platform === 'ios' ? (\n            <Title\n              className={styles['ActionSheetItem__children']}\n              weight={mode === 'cancel' ? '2' : '3'}\n              level={isCentered ? '2' : '3'}\n            >\n              {children}\n            </Title>\n          ) : (\n            <Text className={styles['ActionSheetItem__children']}>{children}</Text>\n          )}\n          {meta && <Text className={styles['ActionSheetItem__meta']}>{meta}</Text>}\n        </div>\n        {subtitle && <Subhead className={styles['ActionSheetItem__subtitle']}>{subtitle}</Subhead>}\n      </div>\n      {(selectable || after) && (\n        <div className={styles['ActionSheetItem__after']}>\n          {after}\n          {selectable && (\n            <Radio\n              name={name}\n              value={value}\n              onChange={onChange}\n              onClick={onItemClick({\n                action: noop,\n                immediateAction: noop,\n                autoClose: !autoCloseDisabled,\n                isCancelItem: Boolean(isCancelItem),\n              })}\n              defaultChecked={defaultChecked}\n              checked={checked}\n              disabled={restProps.disabled}\n            >\n              {iconChecked}\n            </Radio>\n          )}\n        </div>\n      )}\n    </Tappable>\n  );\n};\n"],"names":["React","classNames","noop","useAdaptivityWithJSMediaQueries","usePlatform","ActionSheetContext","Tappable","Subhead","Text","Title","Radio","styles","ActionSheetItem","children","autoCloseDisabled","mode","meta","subtitle","before","after","selectable","value","name","checked","defaultChecked","onChange","onClick","onImmediateClick","multiline","iconChecked","className","isCancelItem","restProps","platform","onItemClick","actionSheetMode","useContext","sizeY","Component","undefined","isRich","isCentered","action","immediateAction","autoClose","Boolean","activeMode","div","weight","level","disabled"],"mappings":"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"}

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

@@ -139,7 +139,9 @@
   block-size: 100%;
   background-color: var(--vkui--color_background_modal);
   content: '';
-  transition: opacity 0.15s ease-out, background-color 0.15s ease-out;
+  transition:
+    opacity 0.15s ease-out,
+    background-color 0.15s ease-out;
 }
 
 .ActionSheetItem--ios::after {

package/dist/cssm/components/ActionSheetItem/subcomponents/Radio/Radio.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/components/ActionSheetItem/subcomponents/Radio/Radio.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon20CheckCircleOn, Icon24CheckCircleOn } from '@vkontakte/icons';\nimport { HasRef, HasRootRef } from '../../../../types';\nimport { AdaptiveIconRenderer } from '../../../AdaptiveIconRenderer/AdaptiveIconRenderer';\nimport { RootComponent } from '../../../RootComponent/RootComponent';\nimport { VisuallyHidden } from '../../../VisuallyHidden/VisuallyHidden';\nimport styles from './Radio.module.css';\n\nconst adaptiveIcon = (\n  <AdaptiveIconRenderer IconCompact={Icon20CheckCircleOn} IconRegular={Icon24CheckCircleOn} />\n);\n\ninterface ActionSheetItemCheckedProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLInputElement> {\n  /**\n   * Иконка для `checked` режима.\n   */\n  children?: React.ReactNode;\n}\n\nexport const Radio = ({\n  children = adaptiveIcon,\n  getRootRef,\n  getRef,\n  className,\n  style,\n  ...restProps\n}: ActionSheetItemCheckedProps) => {\n  return (\n    <RootComponent getRootRef={getRootRef} className={className} style={style}>\n      <VisuallyHidden\n        Component=\"input\"\n        getRootRef={getRef}\n        type=\"radio\"\n        className={styles['ActionSheetItemRadio__input']}\n        {...restProps}\n      />\n      {children}\n    </RootComponent>\n  );\n};\n"],"names":["React","Icon20CheckCircleOn","Icon24CheckCircleOn","AdaptiveIconRenderer","RootComponent","VisuallyHidden","styles","adaptiveIcon","IconCompact","IconRegular","Radio","children","getRootRef","getRef","className","style","restProps","Component","type"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,mBAAmB,EAAEC,mBAAmB,QAAQ,mBAAmB;AAE5E,SAASC,oBAAoB,QAAQ,qDAAqD;AAC1F,SAASC,aAAa,QAAQ,uCAAuC;AACrE,SAASC,cAAc,QAAQ,yCAAyC;AACxE,OAAOC,YAAY,qBAAqB;AAExC,MAAMC,6BACJ,KAACJ;IAAqBK,aAAaP;IAAqBQ,aAAaP;;AAavE,OAAO,MAAMQ,QAAQ,CAAC,EACpBC,WAAWJ,YAAY,EACvBK,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,KAAK,EACL,GAAGC,WACyB;IAC5B,qBACE,MAACZ;QAAcQ,YAAYA;QAAYE,WAAWA;QAAWC,OAAOA;;0BAClE,KAACV;gBACCY,WAAU;gBACVL,YAAYC;gBACZK,MAAK;gBACLJ,WAAWR,MAAM,CAAC,8BAA8B;gBAC/C,GAAGU,SAAS;;YAEdL;;;AAGP,EAAE"}
+{"version":3,"sources":["../../../../../../src/components/ActionSheetItem/subcomponents/Radio/Radio.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon20CheckCircleOn, Icon24CheckCircleOn } from '@vkontakte/icons';\nimport { HasRef, HasRootRef } from '../../../../types';\nimport { AdaptiveIconRenderer } from '../../../AdaptiveIconRenderer/AdaptiveIconRenderer';\nimport { RootComponent } from '../../../RootComponent/RootComponent';\nimport { VisuallyHidden } from '../../../VisuallyHidden/VisuallyHidden';\nimport styles from './Radio.module.css';\n\nconst adaptiveIcon = (\n  <AdaptiveIconRenderer IconCompact={Icon20CheckCircleOn} IconRegular={Icon24CheckCircleOn} />\n);\n\ninterface ActionSheetItemCheckedProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLInputElement> {\n  /**\n   * Иконка для `checked` режима.\n   */\n  children?: React.ReactNode;\n}\n\nexport const Radio = ({\n  children = adaptiveIcon,\n  getRootRef,\n  getRef,\n  className,\n  style,\n  ...restProps\n}: ActionSheetItemCheckedProps) => {\n  return (\n    <RootComponent getRootRef={getRootRef} className={className} style={style}>\n      <VisuallyHidden\n        Component=\"input\"\n        getRootRef={getRef}\n        type=\"radio\"\n        className={styles['ActionSheetItemRadio__input']}\n        {...restProps}\n      />\n      {children}\n    </RootComponent>\n  );\n};\n"],"names":["React","Icon20CheckCircleOn","Icon24CheckCircleOn","AdaptiveIconRenderer","RootComponent","VisuallyHidden","styles","adaptiveIcon","IconCompact","IconRegular","Radio","children","getRootRef","getRef","className","style","restProps","Component","type"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,mBAAmB,EAAEC,mBAAmB,QAAQ,mBAAmB;AAE5E,SAASC,oBAAoB,QAAQ,qDAAqD;AAC1F,SAASC,aAAa,QAAQ,uCAAuC;AACrE,SAASC,cAAc,QAAQ,yCAAyC;AACxE,OAAOC,YAAY,qBAAqB;AAExC,MAAMC,6BACJ,KAACJ;IAAqBK,aAAaP;IAAqBQ,aAAaP;;AAavE,OAAO,MAAMQ,QAAQ,CAAC,EACpBC,WAAWJ,YAAY,EACvBK,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,KAAK,EACL,GAAGC,WACyB;IAC5B,qBACE,MAACZ;QAAcQ,YAAYA;QAAYE,WAAWA;QAAWC,OAAOA;;0BAClE,KAACV;gBACCY,WAAU;gBACVL,YAAYC;gBACZK,MAAK;gBACLJ,WAAWR,MAAM,CAAC,8BAA8B;gBAC/C,GAAGU,SAAS;;YAEdL;;;AAGP,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/AdaptiveIconRenderer/AdaptiveIconRenderer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useAdaptivityConditionalRender } from '../../hooks/useAdaptivityConditionalRender';\n\nexport interface AdaptiveIconRendererProps {\n  IconCompact: React.ComponentType<{ className?: string }>;\n  IconRegular: React.ComponentType<{ className?: string }>;\n}\n\n/**\n * @since 5.4.0\n * @see https://vkcom.github.io/VKUI/#/AdaptiveIconRenderer\n */\nexport const AdaptiveIconRenderer = ({ IconCompact, IconRegular }: AdaptiveIconRendererProps) => {\n  const { sizeY } = useAdaptivityConditionalRender();\n\n  return (\n    <React.Fragment>\n      {sizeY.compact && <IconCompact className={sizeY.compact.className} />}\n      {sizeY.regular && <IconRegular className={sizeY.regular.className} />}\n    </React.Fragment>\n  );\n};\n"],"names":["React","useAdaptivityConditionalRender","AdaptiveIconRenderer","IconCompact","IconRegular","sizeY","Fragment","compact","className","regular"],"rangeMappings":";;;;;;;;;;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,8BAA8B,QAAQ,6CAA6C;AAO5F;;;CAGC,GACD,OAAO,MAAMC,uBAAuB,CAAC,EAAEC,WAAW,EAAEC,WAAW,EAA6B;IAC1F,MAAM,EAAEC,KAAK,EAAE,GAAGJ;IAElB,qBACE,MAACD,MAAMM,QAAQ;;YACZD,MAAME,OAAO,kBAAI,KAACJ;gBAAYK,WAAWH,MAAME,OAAO,CAACC,SAAS;;YAChEH,MAAMI,OAAO,kBAAI,KAACL;gBAAYI,WAAWH,MAAMI,OAAO,CAACD,SAAS;;;;AAGvE,EAAE"}
+{"version":3,"sources":["../../../../src/components/AdaptiveIconRenderer/AdaptiveIconRenderer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useAdaptivityConditionalRender } from '../../hooks/useAdaptivityConditionalRender';\n\nexport interface AdaptiveIconRendererProps {\n  IconCompact: React.ComponentType<{ className?: string }>;\n  IconRegular: React.ComponentType<{ className?: string }>;\n}\n\n/**\n * @since 5.4.0\n * @see https://vkcom.github.io/VKUI/#/AdaptiveIconRenderer\n */\nexport const AdaptiveIconRenderer = ({ IconCompact, IconRegular }: AdaptiveIconRendererProps) => {\n  const { sizeY } = useAdaptivityConditionalRender();\n\n  return (\n    <React.Fragment>\n      {sizeY.compact && <IconCompact className={sizeY.compact.className} />}\n      {sizeY.regular && <IconRegular className={sizeY.regular.className} />}\n    </React.Fragment>\n  );\n};\n"],"names":["React","useAdaptivityConditionalRender","AdaptiveIconRenderer","IconCompact","IconRegular","sizeY","Fragment","compact","className","regular"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,8BAA8B,QAAQ,6CAA6C;AAO5F;;;CAGC,GACD,OAAO,MAAMC,uBAAuB,CAAC,EAAEC,WAAW,EAAEC,WAAW,EAA6B;IAC1F,MAAM,EAAEC,KAAK,EAAE,GAAGJ;IAElB,qBACE,MAACD,MAAMM,QAAQ;;YACZD,MAAME,OAAO,kBAAI,KAACJ;gBAAYK,WAAWH,MAAME,OAAO,CAACC,SAAS;;YAChEH,MAAMI,OAAO,kBAAI,KAACL;gBAAYI,WAAWH,MAAMI,OAAO,CAACD,SAAS;;;;AAGvE,EAAE"}

package/dist/cssm/components/AdaptivityProvider/AdaptivityContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/AdaptivityProvider/AdaptivityContext.tsx"],"sourcesContent":["import * as React from 'react';\nimport { SizeTypeValues, ViewHeightType, ViewWidthType } from '../../lib/adaptivity';\n\nexport interface SizeProps {\n  sizeX?: SizeTypeValues;\n  sizeY?: SizeTypeValues;\n}\n\nexport interface AdaptivityProps extends SizeProps {\n  /**\n   * @ignore\n   */\n  viewWidth?: ViewWidthType;\n  /**\n   * @ignore\n   */\n  viewHeight?: ViewHeightType;\n  /**\n   * @ignore\n   */\n  hasPointer?: boolean;\n  /**\n   * @ignore\n   */\n  hasHover?: boolean;\n}\n\nexport const AdaptivityContext = React.createContext<AdaptivityProps>({});\n"],"names":["React","AdaptivityContext","createContext"],"rangeMappings":";","mappings":"AAAA,YAAYA,WAAW,QAAQ;AA2B/B,OAAO,MAAMC,kCAAoBD,MAAME,aAAa,CAAkB,CAAC,GAAG"}
+{"version":3,"sources":["../../../../src/components/AdaptivityProvider/AdaptivityContext.tsx"],"sourcesContent":["import * as React from 'react';\nimport { SizeTypeValues, ViewHeightType, ViewWidthType } from '../../lib/adaptivity';\n\nexport interface SizeProps {\n  sizeX?: SizeTypeValues;\n  sizeY?: SizeTypeValues;\n}\n\nexport interface AdaptivityProps extends SizeProps {\n  /**\n   * @ignore\n   */\n  viewWidth?: ViewWidthType;\n  /**\n   * @ignore\n   */\n  viewHeight?: ViewHeightType;\n  /**\n   * @ignore\n   */\n  hasPointer?: boolean;\n  /**\n   * @ignore\n   */\n  hasHover?: boolean;\n}\n\nexport const AdaptivityContext = React.createContext<AdaptivityProps>({});\n"],"names":["React","AdaptivityContext","createContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AA2B/B,OAAO,MAAMC,kCAAoBD,MAAME,aAAa,CAAkB,CAAC,GAAG"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/AdaptivityProvider/AdaptivityProvider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSizeX, isCompactByViewHeight, isCompactByViewWidth } from '../../lib/adaptivity';\nimport { HasChildren } from '../../types';\nimport { AdaptivityContext, type AdaptivityProps } from './AdaptivityContext';\n\nexport interface AdaptivityProviderProps extends AdaptivityProps, HasChildren {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/AdaptivityProvider\n */\nexport const AdaptivityProvider = ({\n  viewWidth,\n  viewHeight,\n  sizeX: sizeXProp,\n  sizeY: sizeYProp,\n  hasPointer,\n  hasHover,\n  children,\n}: AdaptivityProviderProps) => {\n  const adaptivity = React.useMemo(() => {\n    const nextProps: AdaptivityProps = {\n      viewWidth,\n      viewHeight,\n      sizeX: sizeXProp,\n      sizeY: sizeYProp,\n      hasPointer,\n      hasHover,\n    };\n    if (sizeXProp === undefined && viewWidth !== undefined) {\n      nextProps.sizeX = getSizeX(viewWidth);\n    }\n\n    if (sizeYProp === undefined) {\n      if (isCompactByViewWidth(viewWidth, hasPointer) || isCompactByViewHeight(viewHeight)) {\n        nextProps.sizeY = 'compact';\n      } else if (viewWidth !== undefined || viewHeight !== undefined) {\n        nextProps.sizeY = 'regular';\n      }\n    }\n\n    return nextProps;\n  }, [viewWidth, viewHeight, sizeXProp, sizeYProp, hasPointer, hasHover]);\n\n  return <AdaptivityContext.Provider value={adaptivity}>{children}</AdaptivityContext.Provider>;\n};\n"],"names":["React","getSizeX","isCompactByViewHeight","isCompactByViewWidth","AdaptivityContext","AdaptivityProvider","viewWidth","viewHeight","sizeX","sizeXProp","sizeY","sizeYProp","hasPointer","hasHover","children","adaptivity","useMemo","nextProps","undefined","Provider","value"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,QAAQ,EAAEC,qBAAqB,EAAEC,oBAAoB,QAAQ,uBAAuB;AAE7F,SAASC,iBAAiB,QAA8B,sBAAsB;AAI9E;;CAEC,GACD,OAAO,MAAMC,qBAAqB,CAAC,EACjCC,SAAS,EACTC,UAAU,EACVC,OAAOC,SAAS,EAChBC,OAAOC,SAAS,EAChBC,UAAU,EACVC,QAAQ,EACRC,QAAQ,EACgB;IACxB,MAAMC,aAAaf,MAAMgB,OAAO,CAAC;QAC/B,MAAMC,YAA6B;YACjCX;YACAC;YACAC,OAAOC;YACPC,OAAOC;YACPC;YACAC;QACF;QACA,IAAIJ,cAAcS,aAAaZ,cAAcY,WAAW;YACtDD,UAAUT,KAAK,GAAGP,SAASK;QAC7B;QAEA,IAAIK,cAAcO,WAAW;YAC3B,IAAIf,qBAAqBG,WAAWM,eAAeV,sBAAsBK,aAAa;gBACpFU,UAAUP,KAAK,GAAG;YACpB,OAAO,IAAIJ,cAAcY,aAAaX,eAAeW,WAAW;gBAC9DD,UAAUP,KAAK,GAAG;YACpB;QACF;QAEA,OAAOO;IACT,GAAG;QAACX;QAAWC;QAAYE;QAAWE;QAAWC;QAAYC;KAAS;IAEtE,qBAAO,KAACT,kBAAkBe,QAAQ;QAACC,OAAOL;kBAAaD;;AACzD,EAAE"}
+{"version":3,"sources":["../../../../src/components/AdaptivityProvider/AdaptivityProvider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSizeX, isCompactByViewHeight, isCompactByViewWidth } from '../../lib/adaptivity';\nimport { HasChildren } from '../../types';\nimport { AdaptivityContext, type AdaptivityProps } from './AdaptivityContext';\n\nexport interface AdaptivityProviderProps extends AdaptivityProps, HasChildren {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/AdaptivityProvider\n */\nexport const AdaptivityProvider = ({\n  viewWidth,\n  viewHeight,\n  sizeX: sizeXProp,\n  sizeY: sizeYProp,\n  hasPointer,\n  hasHover,\n  children,\n}: AdaptivityProviderProps) => {\n  const adaptivity = React.useMemo(() => {\n    const nextProps: AdaptivityProps = {\n      viewWidth,\n      viewHeight,\n      sizeX: sizeXProp,\n      sizeY: sizeYProp,\n      hasPointer,\n      hasHover,\n    };\n    if (sizeXProp === undefined && viewWidth !== undefined) {\n      nextProps.sizeX = getSizeX(viewWidth);\n    }\n\n    if (sizeYProp === undefined) {\n      if (isCompactByViewWidth(viewWidth, hasPointer) || isCompactByViewHeight(viewHeight)) {\n        nextProps.sizeY = 'compact';\n      } else if (viewWidth !== undefined || viewHeight !== undefined) {\n        nextProps.sizeY = 'regular';\n      }\n    }\n\n    return nextProps;\n  }, [viewWidth, viewHeight, sizeXProp, sizeYProp, hasPointer, hasHover]);\n\n  return <AdaptivityContext.Provider value={adaptivity}>{children}</AdaptivityContext.Provider>;\n};\n"],"names":["React","getSizeX","isCompactByViewHeight","isCompactByViewWidth","AdaptivityContext","AdaptivityProvider","viewWidth","viewHeight","sizeX","sizeXProp","sizeY","sizeYProp","hasPointer","hasHover","children","adaptivity","useMemo","nextProps","undefined","Provider","value"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,QAAQ,EAAEC,qBAAqB,EAAEC,oBAAoB,QAAQ,uBAAuB;AAE7F,SAASC,iBAAiB,QAA8B,sBAAsB;AAI9E;;CAEC,GACD,OAAO,MAAMC,qBAAqB,CAAC,EACjCC,SAAS,EACTC,UAAU,EACVC,OAAOC,SAAS,EAChBC,OAAOC,SAAS,EAChBC,UAAU,EACVC,QAAQ,EACRC,QAAQ,EACgB;IACxB,MAAMC,aAAaf,MAAMgB,OAAO,CAAC;QAC/B,MAAMC,YAA6B;YACjCX;YACAC;YACAC,OAAOC;YACPC,OAAOC;YACPC;YACAC;QACF;QACA,IAAIJ,cAAcS,aAAaZ,cAAcY,WAAW;YACtDD,UAAUT,KAAK,GAAGP,SAASK;QAC7B;QAEA,IAAIK,cAAcO,WAAW;YAC3B,IAAIf,qBAAqBG,WAAWM,eAAeV,sBAAsBK,aAAa;gBACpFU,UAAUP,KAAK,GAAG;YACpB,OAAO,IAAIJ,cAAcY,aAAaX,eAAeW,WAAW;gBAC9DD,UAAUP,KAAK,GAAG;YACpB;QACF;QAEA,OAAOO;IACT,GAAG;QAACX;QAAWC;QAAYE;QAAWE;QAAWC;QAAYC;KAAS;IAEtE,qBAAO,KAACT,kBAAkBe,QAAQ;QAACC,OAAOL;kBAAaD;;AACzD,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../../src/components/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,EAAE,SAAS,EAAE,wBAAwB,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEhG,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAK/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAKjD,KAAK,eAAe,GAAG,QAAQ,GAAG,aAAa,GAAG,SAAS,CAAC;AAE5D,MAAM,WAAW,oBACf,SAAQ,IAAI,CAAC,WAAW,EAAE,WAAW,CAAC,EACpC,wBAAwB,EACxB,gBAAgB;IAClB,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,YAAY,CAAA;KAAE,KAAK,IAAI,CAAC;IACnD;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,IAAI,EAAE,eAAe,CAAC;CACvB;AAED,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,CAAC,cAAc,CAAC;IAC/F,aAAa,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IAC1C,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,OAAO,CAAC,EAAE,oBAAoB,EAAE,CAAC;IACjC,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,KAAK,CAAC,SAAS,CAAC;IAC5D,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,EAAE,YAAY,CAAC;IACtB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;IACzC;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B;AAED;;GAEG;AACH,eAAO,MAAM,KAAK,8LAgBf,UAAU,4CAsHZ,CAAC"}
+{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../../src/components/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,EAAE,SAAS,EAAE,wBAAwB,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEhG,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAK/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAKjD,KAAK,eAAe,GAAG,QAAQ,GAAG,aAAa,GAAG,SAAS,CAAC;AAE5D,MAAM,WAAW,oBACf,SAAQ,IAAI,CAAC,WAAW,EAAE,WAAW,CAAC,EACpC,wBAAwB,EACxB,gBAAgB;IAClB,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,YAAY,CAAA;KAAE,KAAK,IAAI,CAAC;IACnD;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,IAAI,EAAE,eAAe,CAAC;CACvB;AAED,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,CAAC,cAAc,CAAC;IAC/F,aAAa,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IAC1C,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,OAAO,CAAC,EAAE,oBAAoB,EAAE,CAAC;IACjC,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,KAAK,CAAC,SAAS,CAAC;IAC5D,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,EAAE,YAAY,CAAC;IACtB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;IACzC;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B;AAED;;GAEG;AACH,eAAO,MAAM,KAAK,8LAgBf,UAAU,4CA8GZ,CAAC"}

package/dist/cssm/components/Alert/Alert.js

@@ -1,10 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { Icon20Cancel } from '@vkontakte/icons';
-import { classNames, hasReactNode } from '@vkontakte/vkjs';
+import { classNames, hasReactNode, noop } from '@vkontakte/vkjs';
 import { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';
 import { usePlatform } from '../../hooks/usePlatform';
-import { useWaitTransitionFinish } from '../../hooks/useWaitTransitionFinish';
+import { useCSSKeyframesAnimationController } from '../../lib/animation';
 import { stopPropagation } from '../../lib/utils';
 import { useScrollLock } from '../AppRoot/ScrollContext';
 import { FocusTrap } from '../FocusTrap/FocusTrap';
@@ -22,45 +22,34 @@ import styles from './Alert.module.css';
     const textId = `vkui-alert-${generatedId}-text`;
     const platform = usePlatform();
     const { isDesktop } = useAdaptivityWithJSMediaQueries();
-    const { waitTransitionFinish } = useWaitTransitionFinish();
     const [closing, setClosing] = React.useState(false);
+    const itemActionCallbackRef = React.useRef(noop);
+    const [animationState, animationHandlers] = useCSSKeyframesAnimationController(closing ? 'exit' : 'enter', {
+        onExited () {
+            onClose();
+            itemActionCallbackRef.current();
+            itemActionCallbackRef.current = noop;
+        }
+    });
     const isDismissButtonVisible = isDesktop && platform !== 'ios';
     const elementRef = React.useRef(null);
-    const timeout = platform === 'ios' ? 300 : 200;
     const close = React.useCallback(()=>{
         setClosing(true);
-        waitTransitionFinish(elementRef.current, (e)=>{
-            if (!e || e.propertyName === 'opacity') {
-                onClose();
-            }
-        }, timeout);
-    }, [
-        elementRef,
-        waitTransitionFinish,
-        onClose,
-        timeout
-    ]);
+    }, []);
     const onItemClick = React.useCallback((item)=>{
-        const { action, autoCloseDisabled = false } = item;
-        if (!autoCloseDisabled) {
-            setClosing(true);
-            waitTransitionFinish(elementRef.current, (e)=>{
-                if (!e || e.propertyName === 'opacity') {
-                    onClose();
-                    action && action();
-                }
-            }, timeout);
-        } else {
-            action && action({
+        const { action: itemAction, autoCloseDisabled = false } = item;
+        if (autoCloseDisabled) {
+            itemAction && itemAction({
                 close
             });
+        } else {
+            if (itemAction) {
+                itemActionCallbackRef.current = itemAction;
+            }
+            setClosing(true);
         }
     }, [
-        elementRef,
-        waitTransitionFinish,
-        onClose,
-        close,
-        timeout
+        close
     ]);
     useScrollLock();
     return /*#__PURE__*/ _jsx(PopoutWrapper, {
@@ -71,11 +60,12 @@ import styles from './Alert.module.css';
         getRootRef: getRootRef,
         children: /*#__PURE__*/ _jsxs(FocusTrap, {
             ...restProps,
+            ...animationHandlers,
             getRootRef: elementRef,
             onClick: stopPropagation,
             onClose: close,
-            timeout: timeout,
-            className: classNames(styles['Alert'], platform === 'ios' && styles['Alert--ios'], platform === 'vkcom' && styles['Alert--vkcom'], closing && styles['Alert--closing'], isDesktop && styles['Alert--desktop']),
+            autoFocus: animationState === 'entered',
+            className: classNames(styles['Alert'], platform === 'ios' && styles['Alert--ios'], platform === 'vkcom' && styles['Alert--vkcom'], closing ? styles['Alert--closing'] : styles['Alert--opening'], isDesktop && styles['Alert--desktop']),
             role: "alertdialog",
             "aria-modal": true,
             "aria-labelledby": headerId,

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Alert/Alert.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon20Cancel } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useWaitTransitionFinish } from '../../hooks/useWaitTransitionFinish';\nimport { stopPropagation } from '../../lib/utils';\nimport { AlignType, AnchorHTMLAttributesOnly, HasDataAttribute, HasRootRef } from '../../types';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { ButtonProps } from '../Button/Button';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { IconButton } from '../IconButton/IconButton';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { AlertActionProps } from './AlertAction';\nimport { AlertActions } from './AlertActions';\nimport { AlertHeader, AlertText } from './AlertTypography';\nimport styles from './Alert.module.css';\n\ntype AlertActionMode = 'cancel' | 'destructive' | 'default';\n\nexport interface AlertActionInterface\n  extends Pick<ButtonProps, 'Component'>,\n    AnchorHTMLAttributesOnly,\n    HasDataAttribute {\n  title: string;\n  /**\n   * Обработчик клика на опцию. Если свойство `autoCloseDisabled` включено,\n   * то в аргументы `action` передаётся объект с функцией close,\n   * вызвав которую можно закрыть `action` вручную.\n   */\n  action?: (args?: { close?: VoidFunction }) => void;\n  /**\n   * По умолчанию клик на опцию вызывает переданную в `Alert` функцию `onClose`, данное свойство\n   * позволяет отключить такое поведение\n   */\n  autoCloseDisabled?: boolean;\n  mode: AlertActionMode;\n}\n\nexport interface AlertProps extends React.HTMLAttributes<HTMLElement>, HasRootRef<HTMLDivElement> {\n  actionsLayout?: 'vertical' | 'horizontal';\n  actionsAlign?: AlignType;\n  actions?: AlertActionInterface[];\n  renderAction?: (props: AlertActionProps) => React.ReactNode;\n  header?: React.ReactNode;\n  text?: React.ReactNode;\n  onClose: VoidFunction;\n  /**\n   * Текст кнопки закрытия. Делает ее доступной для ассистивных технологий\n   */\n  dismissLabel?: string;\n  /**\n   * Расположение кнопки закрытия (внутри и вне `popout'a`)\n   * Доступно только в `compact`-режиме, не отображается на `iOS`\n   */\n  dismissButtonMode?: 'inside' | 'outside';\n  /**\n   * `data-testid` для кнопки закрытия\n   */\n  dismissButtonTestId?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Alert\n */\nexport const Alert = ({\n  actions = [],\n  actionsLayout = 'horizontal',\n  children,\n  className,\n  style,\n  text,\n  header,\n  onClose,\n  dismissLabel = 'Закрыть предупреждение',\n  renderAction,\n  actionsAlign,\n  dismissButtonMode = 'outside',\n  dismissButtonTestId,\n  getRootRef,\n  ...restProps\n}: AlertProps) => {\n  const generatedId = React.useId();\n\n  const headerId = `vkui-alert-${generatedId}-header`;\n  const textId = `vkui-alert-${generatedId}-text`;\n\n  const platform = usePlatform();\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const { waitTransitionFinish } = useWaitTransitionFinish();\n\n  const [closing, setClosing] = React.useState(false);\n  const isDismissButtonVisible = isDesktop && platform !== 'ios';\n\n  const elementRef = React.useRef<HTMLDivElement>(null);\n\n  const timeout = platform === 'ios' ? 300 : 200;\n\n  const close = React.useCallback(() => {\n    setClosing(true);\n    waitTransitionFinish(\n      elementRef.current,\n      (e?: TransitionEvent) => {\n        if (!e || e.propertyName === 'opacity') {\n          onClose();\n        }\n      },\n      timeout,\n    );\n  }, [elementRef, waitTransitionFinish, onClose, timeout]);\n\n  const onItemClick = React.useCallback(\n    (item: AlertActionInterface) => {\n      const { action, autoCloseDisabled = false } = item;\n\n      if (!autoCloseDisabled) {\n        setClosing(true);\n        waitTransitionFinish(\n          elementRef.current,\n          (e?: TransitionEvent) => {\n            if (!e || e.propertyName === 'opacity') {\n              onClose();\n              action && action();\n            }\n          },\n          timeout,\n        );\n      } else {\n        action && action({ close });\n      }\n    },\n    [elementRef, waitTransitionFinish, onClose, close, timeout],\n  );\n\n  useScrollLock();\n\n  return (\n    <PopoutWrapper\n      className={className}\n      closing={closing}\n      style={style}\n      onClick={close}\n      getRootRef={getRootRef}\n    >\n      <FocusTrap\n        {...restProps}\n        getRootRef={elementRef}\n        onClick={stopPropagation}\n        onClose={close}\n        timeout={timeout}\n        className={classNames(\n          styles['Alert'],\n          platform === 'ios' && styles['Alert--ios'],\n          platform === 'vkcom' && styles['Alert--vkcom'],\n          closing && styles['Alert--closing'],\n          isDesktop && styles['Alert--desktop'],\n        )}\n        role=\"alertdialog\"\n        aria-modal\n        aria-labelledby={headerId}\n        aria-describedby={textId}\n      >\n        <div\n          className={classNames(\n            styles['Alert__content'],\n            dismissButtonMode === 'inside' && styles['Alert__content--withButton'],\n          )}\n        >\n          {hasReactNode(header) && <AlertHeader id={headerId}>{header}</AlertHeader>}\n          {hasReactNode(text) && <AlertText id={textId}>{text}</AlertText>}\n          {children}\n          {isDismissButtonVisible && dismissButtonMode === 'inside' && (\n            <IconButton\n              label={dismissLabel}\n              className={classNames(styles['Alert__dismiss'], 'vkuiInternalAlert__dismiss')}\n              onClick={close}\n              hoverMode=\"opacity\"\n              activeMode=\"opacity\"\n              data-testid={dismissButtonTestId}\n            >\n              <Icon20Cancel />\n            </IconButton>\n          )}\n        </div>\n        <AlertActions\n          actions={actions}\n          actionsAlign={actionsAlign}\n          actionsLayout={actionsLayout}\n          renderAction={renderAction}\n          onItemClick={onItemClick}\n        />\n        {isDismissButtonVisible && dismissButtonMode === 'outside' && (\n          <ModalDismissButton onClick={close} data-testid={dismissButtonTestId}>\n            {dismissLabel}\n          </ModalDismissButton>\n        )}\n      </FocusTrap>\n    </PopoutWrapper>\n  );\n};\n"],"names":["React","Icon20Cancel","classNames","hasReactNode","useAdaptivityWithJSMediaQueries","usePlatform","useWaitTransitionFinish","stopPropagation","useScrollLock","FocusTrap","IconButton","ModalDismissButton","PopoutWrapper","AlertActions","AlertHeader","AlertText","styles","Alert","actions","actionsLayout","children","className","style","text","header","onClose","dismissLabel","renderAction","actionsAlign","dismissButtonMode","dismissButtonTestId","getRootRef","restProps","generatedId","useId","headerId","textId","platform","isDesktop","waitTransitionFinish","closing","setClosing","useState","isDismissButtonVisible","elementRef","useRef","timeout","close","useCallback","current","e","propertyName","onItemClick","item","action","autoCloseDisabled","onClick","role","aria-modal","aria-labelledby","aria-describedby","div","id","label","hoverMode","activeMode","data-testid"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../../src/components/Alert/Alert.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon20Cancel } from '@vkontakte/icons';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useCSSKeyframesAnimationController } from '../../lib/animation';\nimport { stopPropagation } from '../../lib/utils';\nimport { AlignType, AnchorHTMLAttributesOnly, HasDataAttribute, HasRootRef } from '../../types';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { ButtonProps } from '../Button/Button';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { IconButton } from '../IconButton/IconButton';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { AlertActionProps } from './AlertAction';\nimport { AlertActions } from './AlertActions';\nimport { AlertHeader, AlertText } from './AlertTypography';\nimport styles from './Alert.module.css';\n\ntype AlertActionMode = 'cancel' | 'destructive' | 'default';\n\nexport interface AlertActionInterface\n  extends Pick<ButtonProps, 'Component'>,\n    AnchorHTMLAttributesOnly,\n    HasDataAttribute {\n  title: string;\n  /**\n   * Обработчик клика на опцию. Если свойство `autoCloseDisabled` включено,\n   * то в аргументы `action` передаётся объект с функцией close,\n   * вызвав которую можно закрыть `action` вручную.\n   */\n  action?: (args?: { close?: VoidFunction }) => void;\n  /**\n   * По умолчанию клик на опцию вызывает переданную в `Alert` функцию `onClose`, данное свойство\n   * позволяет отключить такое поведение\n   */\n  autoCloseDisabled?: boolean;\n  mode: AlertActionMode;\n}\n\nexport interface AlertProps extends React.HTMLAttributes<HTMLElement>, HasRootRef<HTMLDivElement> {\n  actionsLayout?: 'vertical' | 'horizontal';\n  actionsAlign?: AlignType;\n  actions?: AlertActionInterface[];\n  renderAction?: (props: AlertActionProps) => React.ReactNode;\n  header?: React.ReactNode;\n  text?: React.ReactNode;\n  onClose: VoidFunction;\n  /**\n   * Текст кнопки закрытия. Делает ее доступной для ассистивных технологий\n   */\n  dismissLabel?: string;\n  /**\n   * Расположение кнопки закрытия (внутри и вне `popout'a`)\n   * Доступно только в `compact`-режиме, не отображается на `iOS`\n   */\n  dismissButtonMode?: 'inside' | 'outside';\n  /**\n   * `data-testid` для кнопки закрытия\n   */\n  dismissButtonTestId?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Alert\n */\nexport const Alert = ({\n  actions = [],\n  actionsLayout = 'horizontal',\n  children,\n  className,\n  style,\n  text,\n  header,\n  onClose,\n  dismissLabel = 'Закрыть предупреждение',\n  renderAction,\n  actionsAlign,\n  dismissButtonMode = 'outside',\n  dismissButtonTestId,\n  getRootRef,\n  ...restProps\n}: AlertProps) => {\n  const generatedId = React.useId();\n\n  const headerId = `vkui-alert-${generatedId}-header`;\n  const textId = `vkui-alert-${generatedId}-text`;\n\n  const platform = usePlatform();\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n\n  const [closing, setClosing] = React.useState(false);\n  const itemActionCallbackRef = React.useRef(noop);\n  const [animationState, animationHandlers] = useCSSKeyframesAnimationController(\n    closing ? 'exit' : 'enter',\n    {\n      onExited() {\n        onClose();\n        itemActionCallbackRef.current();\n        itemActionCallbackRef.current = noop;\n      },\n    },\n  );\n  const isDismissButtonVisible = isDesktop && platform !== 'ios';\n  const elementRef = React.useRef<HTMLDivElement>(null);\n\n  const close = React.useCallback(() => {\n    setClosing(true);\n  }, []);\n\n  const onItemClick = React.useCallback(\n    (item: AlertActionInterface) => {\n      const { action: itemAction, autoCloseDisabled = false } = item;\n\n      if (autoCloseDisabled) {\n        itemAction && itemAction({ close });\n      } else {\n        if (itemAction) {\n          itemActionCallbackRef.current = itemAction;\n        }\n        setClosing(true);\n      }\n    },\n    [close],\n  );\n\n  useScrollLock();\n\n  return (\n    <PopoutWrapper\n      className={className}\n      closing={closing}\n      style={style}\n      onClick={close}\n      getRootRef={getRootRef}\n    >\n      <FocusTrap\n        {...restProps}\n        {...animationHandlers}\n        getRootRef={elementRef}\n        onClick={stopPropagation}\n        onClose={close}\n        autoFocus={animationState === 'entered'}\n        className={classNames(\n          styles['Alert'],\n          platform === 'ios' && styles['Alert--ios'],\n          platform === 'vkcom' && styles['Alert--vkcom'],\n          closing ? styles['Alert--closing'] : styles['Alert--opening'],\n          isDesktop && styles['Alert--desktop'],\n        )}\n        role=\"alertdialog\"\n        aria-modal\n        aria-labelledby={headerId}\n        aria-describedby={textId}\n      >\n        <div\n          className={classNames(\n            styles['Alert__content'],\n            dismissButtonMode === 'inside' && styles['Alert__content--withButton'],\n          )}\n        >\n          {hasReactNode(header) && <AlertHeader id={headerId}>{header}</AlertHeader>}\n          {hasReactNode(text) && <AlertText id={textId}>{text}</AlertText>}\n          {children}\n          {isDismissButtonVisible && dismissButtonMode === 'inside' && (\n            <IconButton\n              label={dismissLabel}\n              className={classNames(styles['Alert__dismiss'], 'vkuiInternalAlert__dismiss')}\n              onClick={close}\n              hoverMode=\"opacity\"\n              activeMode=\"opacity\"\n              data-testid={dismissButtonTestId}\n            >\n              <Icon20Cancel />\n            </IconButton>\n          )}\n        </div>\n        <AlertActions\n          actions={actions}\n          actionsAlign={actionsAlign}\n          actionsLayout={actionsLayout}\n          renderAction={renderAction}\n          onItemClick={onItemClick}\n        />\n        {isDismissButtonVisible && dismissButtonMode === 'outside' && (\n          <ModalDismissButton onClick={close} data-testid={dismissButtonTestId}>\n            {dismissLabel}\n          </ModalDismissButton>\n        )}\n      </FocusTrap>\n    </PopoutWrapper>\n  );\n};\n"],"names":["React","Icon20Cancel","classNames","hasReactNode","noop","useAdaptivityWithJSMediaQueries","usePlatform","useCSSKeyframesAnimationController","stopPropagation","useScrollLock","FocusTrap","IconButton","ModalDismissButton","PopoutWrapper","AlertActions","AlertHeader","AlertText","styles","Alert","actions","actionsLayout","children","className","style","text","header","onClose","dismissLabel","renderAction","actionsAlign","dismissButtonMode","dismissButtonTestId","getRootRef","restProps","generatedId","useId","headerId","textId","platform","isDesktop","closing","setClosing","useState","itemActionCallbackRef","useRef","animationState","animationHandlers","onExited","current","isDismissButtonVisible","elementRef","close","useCallback","onItemClick","item","action","itemAction","autoCloseDisabled","onClick","autoFocus","role","aria-modal","aria-labelledby","aria-describedby","div","id","label","hoverMode","activeMode","data-testid"],"mappings":"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"}

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

@@ -1,7 +1,12 @@
 .Alert {
+  --vkui_internal--alert_animation_scale_initial: 0.95;
+
   -webkit-user-select: none;
+
      -moz-user-select: none;
+
       -ms-user-select: none;
+
           user-select: none;
   color: var(--vkui--color_text_primary);
   position: relative;
@@ -11,18 +16,21 @@
   margin-inline: 24px;
   box-shadow: var(--vkui--elevation4);
   border-radius: var(--vkui--size_border_radius_paper--regular);
-  animation: animation-android-alert-intro 0.2s var(--vkui--animation_easing_platform);
 }
 
 .Alert--desktop {
   inline-size: 100%;
 }
 
+.Alert--opening {
+  /* prettier-ignore */
+  animation: animation-alert-scale-up var(--vkui--animation_duration_m) var(--vkui--animation_easing_platform);
+}
+
 .Alert--closing {
-  transform: scale(0.95);
   opacity: 0;
-  transition: transform 0.2s var(--vkui--animation_easing_platform),
-    opacity 0.2s var(--vkui--animation_easing_platform);
+  /* prettier-ignore */
+  animation: animation-alert-scale-down var(--vkui--animation_duration_m) var(--vkui--animation_easing_platform);
 }
 
 .Alert::before {
@@ -109,17 +117,16 @@
  */
 
 .Alert--ios {
+  --vkui_internal--alert_animation_scale_initial: 1.05;
+
   inline-size: 270px;
   min-inline-size: 270px;
   overflow: hidden;
-  animation: animation-ios-alert-intro 0.3s var(--vkui--animation_easing_platform);
   box-shadow: none;
 }
 
 .Alert--ios.Alert--closing {
-  transform: none;
-  opacity: 0;
-  transition: opacity 0.3s var(--vkui--animation_easing_platform);
+  --vkui_internal--alert_animation_scale_initial: 1;
 }
 
 .Alert--ios .Alert__content {
@@ -261,7 +268,9 @@
  */
 
 .Alert--vkcom {
-  box-shadow: 0 0 2px rgba(0, 0, 0, 0.12), 0 0 96px rgba(0, 0, 0, 0.16);
+  box-shadow:
+    0 0 2px rgba(0, 0, 0, 0.12),
+    0 0 96px rgba(0, 0, 0, 0.16);
   inline-size: 400px;
 }
 
@@ -290,14 +299,17 @@
   inset-inline-end: 8px;
 }
 
-/**
- * Animations
- */
+@media screen and (prefers-reduced-motion: reduce) {
+  .Alert,
+  .Alert--ios {
+    --vkui_internal--alert_animation_scale_initial: 1;
+  }
+}
 
-@keyframes animation-ios-alert-intro {
+@keyframes animation-alert-scale-up {
   from {
     opacity: 0;
-    transform: scale(1.05);
+    transform: scale(var(--vkui_internal--alert_animation_scale_initial));
   }
 
   to {
@@ -306,14 +318,14 @@
   }
 }
 
-@keyframes animation-android-alert-intro {
+@keyframes animation-alert-scale-down {
   from {
-    opacity: 0;
-    transform: scale(0.95);
+    opacity: 1;
+    transform: scale(1);
   }
 
   to {
-    opacity: 1;
-    transform: scale(1);
+    opacity: 0;
+    transform: scale(var(--vkui_internal--alert_animation_scale_initial));
   }
 }

package/dist/cssm/components/Alert/AlertAction.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Alert/AlertAction.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { AnchorHTMLAttributesOnly } from '../../types';\nimport { Button, ButtonProps } from '../Button/Button';\nimport { Tappable } from '../Tappable/Tappable';\nimport { AlertActionInterface } from './Alert';\nimport styles from './Alert.module.css';\n\nexport interface AlertActionProps\n  extends Pick<AlertActionInterface, 'Component' | 'mode'>,\n    AnchorHTMLAttributesOnly {\n  children: string;\n  onClick: React.MouseEventHandler<HTMLElement>;\n}\n\nconst AlertActionIos = ({ mode, ...restProps }: AlertActionProps) => {\n  return (\n    <Tappable\n      Component={restProps.href ? 'a' : 'button'}\n      className={classNames(\n        styles['Alert__action'],\n        mode === 'destructive' && styles['Alert__action--mode-destructive'],\n        mode === 'cancel' && styles['Alert__action--mode-cancel'],\n      )}\n      {...restProps}\n    />\n  );\n};\n\nconst AlertActionBase = ({ mode, ...restProps }: AlertActionProps) => {\n  const platform = usePlatform();\n\n  let buttonMode: ButtonProps['mode'] = 'tertiary';\n\n  if (platform === 'vkcom') {\n    buttonMode = mode === 'cancel' ? 'secondary' : 'primary';\n  }\n\n  return (\n    <Button\n      className={classNames(\n        styles['Alert__button'],\n        mode === 'cancel' && styles['Alert__button--mode-cancel'],\n      )}\n      mode={buttonMode}\n      size=\"m\"\n      {...restProps}\n    />\n  );\n};\n\nexport const AlertAction = (props: AlertActionProps) => {\n  const platform = usePlatform();\n\n  if (platform === 'ios') {\n    return <AlertActionIos {...props} />;\n  }\n\n  return <AlertActionBase {...props} />;\n};\n"],"names":["React","classNames","usePlatform","Button","Tappable","styles","AlertActionIos","mode","restProps","Component","href","className","AlertActionBase","platform","buttonMode","size","AlertAction","props"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,0BAA0B;AAEtD,SAASC,MAAM,QAAqB,mBAAmB;AACvD,SAASC,QAAQ,QAAQ,uBAAuB;AAEhD,OAAOC,YAAY,qBAAqB;AASxC,MAAMC,iBAAiB,CAAC,EAAEC,IAAI,EAAE,GAAGC,WAA6B;IAC9D,qBACE,KAACJ;QACCK,WAAWD,UAAUE,IAAI,GAAG,MAAM;QAClCC,WAAWV,WACTI,MAAM,CAAC,gBAAgB,EACvBE,SAAS,iBAAiBF,MAAM,CAAC,kCAAkC,EACnEE,SAAS,YAAYF,MAAM,CAAC,6BAA6B;QAE1D,GAAGG,SAAS;;AAGnB;AAEA,MAAMI,kBAAkB,CAAC,EAAEL,IAAI,EAAE,GAAGC,WAA6B;IAC/D,MAAMK,WAAWX;IAEjB,IAAIY,aAAkC;IAEtC,IAAID,aAAa,SAAS;QACxBC,aAAaP,SAAS,WAAW,cAAc;IACjD;IAEA,qBACE,KAACJ;QACCQ,WAAWV,WACTI,MAAM,CAAC,gBAAgB,EACvBE,SAAS,YAAYF,MAAM,CAAC,6BAA6B;QAE3DE,MAAMO;QACNC,MAAK;QACJ,GAAGP,SAAS;;AAGnB;AAEA,OAAO,MAAMQ,cAAc,CAACC;IAC1B,MAAMJ,WAAWX;IAEjB,IAAIW,aAAa,OAAO;QACtB,qBAAO,KAACP;YAAgB,GAAGW,KAAK;;IAClC;IAEA,qBAAO,KAACL;QAAiB,GAAGK,KAAK;;AACnC,EAAE"}
+{"version":3,"sources":["../../../../src/components/Alert/AlertAction.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { AnchorHTMLAttributesOnly } from '../../types';\nimport { Button, ButtonProps } from '../Button/Button';\nimport { Tappable } from '../Tappable/Tappable';\nimport { AlertActionInterface } from './Alert';\nimport styles from './Alert.module.css';\n\nexport interface AlertActionProps\n  extends Pick<AlertActionInterface, 'Component' | 'mode'>,\n    AnchorHTMLAttributesOnly {\n  children: string;\n  onClick: React.MouseEventHandler<HTMLElement>;\n}\n\nconst AlertActionIos = ({ mode, ...restProps }: AlertActionProps) => {\n  return (\n    <Tappable\n      Component={restProps.href ? 'a' : 'button'}\n      className={classNames(\n        styles['Alert__action'],\n        mode === 'destructive' && styles['Alert__action--mode-destructive'],\n        mode === 'cancel' && styles['Alert__action--mode-cancel'],\n      )}\n      {...restProps}\n    />\n  );\n};\n\nconst AlertActionBase = ({ mode, ...restProps }: AlertActionProps) => {\n  const platform = usePlatform();\n\n  let buttonMode: ButtonProps['mode'] = 'tertiary';\n\n  if (platform === 'vkcom') {\n    buttonMode = mode === 'cancel' ? 'secondary' : 'primary';\n  }\n\n  return (\n    <Button\n      className={classNames(\n        styles['Alert__button'],\n        mode === 'cancel' && styles['Alert__button--mode-cancel'],\n      )}\n      mode={buttonMode}\n      size=\"m\"\n      {...restProps}\n    />\n  );\n};\n\nexport const AlertAction = (props: AlertActionProps) => {\n  const platform = usePlatform();\n\n  if (platform === 'ios') {\n    return <AlertActionIos {...props} />;\n  }\n\n  return <AlertActionBase {...props} />;\n};\n"],"names":["React","classNames","usePlatform","Button","Tappable","styles","AlertActionIos","mode","restProps","Component","href","className","AlertActionBase","platform","buttonMode","size","AlertAction","props"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,0BAA0B;AAEtD,SAASC,MAAM,QAAqB,mBAAmB;AACvD,SAASC,QAAQ,QAAQ,uBAAuB;AAEhD,OAAOC,YAAY,qBAAqB;AASxC,MAAMC,iBAAiB,CAAC,EAAEC,IAAI,EAAE,GAAGC,WAA6B;IAC9D,qBACE,KAACJ;QACCK,WAAWD,UAAUE,IAAI,GAAG,MAAM;QAClCC,WAAWV,WACTI,MAAM,CAAC,gBAAgB,EACvBE,SAAS,iBAAiBF,MAAM,CAAC,kCAAkC,EACnEE,SAAS,YAAYF,MAAM,CAAC,6BAA6B;QAE1D,GAAGG,SAAS;;AAGnB;AAEA,MAAMI,kBAAkB,CAAC,EAAEL,IAAI,EAAE,GAAGC,WAA6B;IAC/D,MAAMK,WAAWX;IAEjB,IAAIY,aAAkC;IAEtC,IAAID,aAAa,SAAS;QACxBC,aAAaP,SAAS,WAAW,cAAc;IACjD;IAEA,qBACE,KAACJ;QACCQ,WAAWV,WACTI,MAAM,CAAC,gBAAgB,EACvBE,SAAS,YAAYF,MAAM,CAAC,6BAA6B;QAE3DE,MAAMO;QACNC,MAAK;QACJ,GAAGP,SAAS;;AAGnB;AAEA,OAAO,MAAMQ,cAAc,CAACC;IAC1B,MAAMJ,WAAWX;IAEjB,IAAIW,aAAa,OAAO;QACtB,qBAAO,KAACP;YAAgB,GAAGW,KAAK;;IAClC;IAEA,qBAAO,KAACL;QAAiB,GAAGK,KAAK;;AACnC,EAAE"}

package/dist/cssm/components/Alert/AlertActions.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Alert/AlertActions.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { AlertActionInterface, AlertProps } from './Alert';\nimport { AlertAction } from './AlertAction';\nimport styles from './Alert.module.css';\n\nconst alignStyles = {\n  left: styles['Alert__actions--align-left'],\n  center: styles['Alert__actions--align-center'],\n  right: styles['Alert__actions--align-right'],\n};\n\nconst directionStyles = {\n  vertical: styles['Alert__actions--direction-vertical'],\n  horizontal: styles['Alert__actions--direction-horizontal'],\n};\n\ntype ItemClickHandler = (item: AlertActionInterface) => void;\ninterface AlertActionsProps\n  extends Pick<AlertProps, 'actions' | 'actionsAlign' | 'renderAction' | 'actionsLayout'> {\n  onItemClick: ItemClickHandler;\n}\nexport const AlertActions = ({\n  actions = [],\n  renderAction = (props) => <AlertAction {...props} />,\n  onItemClick,\n  actionsAlign,\n  actionsLayout,\n}: AlertActionsProps) => {\n  const platform = usePlatform();\n\n  const direction: AlertProps['actionsLayout'] =\n    platform === 'vkcom' ? 'horizontal' : actionsLayout;\n\n  return (\n    <div\n      className={classNames(\n        styles['Alert__actions'],\n        actionsAlign && alignStyles[actionsAlign],\n        direction && directionStyles[direction],\n      )}\n    >\n      {actions.map((action, i) => {\n        // Убираем\n        const { title: children, action: _, autoCloseDisabled, ...restProps } = action;\n\n        return (\n          <React.Fragment key={i}>\n            {renderAction({\n              children,\n              onClick: () => onItemClick(action),\n              ...restProps,\n            })}\n          </React.Fragment>\n        );\n      })}\n    </div>\n  );\n};\n"],"names":["React","classNames","usePlatform","AlertAction","styles","alignStyles","left","center","right","directionStyles","vertical","horizontal","AlertActions","actions","renderAction","props","onItemClick","actionsAlign","actionsLayout","platform","direction","div","className","map","action","i","title","children","_","autoCloseDisabled","restProps","Fragment","onClick"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,0BAA0B;AAEtD,SAASC,WAAW,QAAQ,gBAAgB;AAC5C,OAAOC,YAAY,qBAAqB;AAExC,MAAMC,cAAc;IAClBC,MAAMF,MAAM,CAAC,6BAA6B;IAC1CG,QAAQH,MAAM,CAAC,+BAA+B;IAC9CI,OAAOJ,MAAM,CAAC,8BAA8B;AAC9C;AAEA,MAAMK,kBAAkB;IACtBC,UAAUN,MAAM,CAAC,qCAAqC;IACtDO,YAAYP,MAAM,CAAC,uCAAuC;AAC5D;AAOA,OAAO,MAAMQ,eAAe,CAAC,EAC3BC,UAAU,EAAE,EACZC,eAAe,CAACC,sBAAU,KAACZ;QAAa,GAAGY,KAAK;MAAI,EACpDC,WAAW,EACXC,YAAY,EACZC,aAAa,EACK;IAClB,MAAMC,WAAWjB;IAEjB,MAAMkB,YACJD,aAAa,UAAU,eAAeD;IAExC,qBACE,KAACG;QACCC,WAAWrB,WACTG,MAAM,CAAC,iBAAiB,EACxBa,gBAAgBZ,WAAW,CAACY,aAAa,EACzCG,aAAaX,eAAe,CAACW,UAAU;kBAGxCP,QAAQU,GAAG,CAAC,CAACC,QAAQC;YACpB,UAAU;YACV,MAAM,EAAEC,OAAOC,QAAQ,EAAEH,QAAQI,CAAC,EAAEC,iBAAiB,EAAE,GAAGC,WAAW,GAAGN;YAExE,qBACE,KAACxB,MAAM+B,QAAQ;0BACZjB,aAAa;oBACZa;oBACAK,SAAS,IAAMhB,YAAYQ;oBAC3B,GAAGM,SAAS;gBACd;eALmBL;QAQzB;;AAGN,EAAE"}
+{"version":3,"sources":["../../../../src/components/Alert/AlertActions.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { AlertActionInterface, AlertProps } from './Alert';\nimport { AlertAction } from './AlertAction';\nimport styles from './Alert.module.css';\n\nconst alignStyles = {\n  left: styles['Alert__actions--align-left'],\n  center: styles['Alert__actions--align-center'],\n  right: styles['Alert__actions--align-right'],\n};\n\nconst directionStyles = {\n  vertical: styles['Alert__actions--direction-vertical'],\n  horizontal: styles['Alert__actions--direction-horizontal'],\n};\n\ntype ItemClickHandler = (item: AlertActionInterface) => void;\ninterface AlertActionsProps\n  extends Pick<AlertProps, 'actions' | 'actionsAlign' | 'renderAction' | 'actionsLayout'> {\n  onItemClick: ItemClickHandler;\n}\nexport const AlertActions = ({\n  actions = [],\n  renderAction = (props) => <AlertAction {...props} />,\n  onItemClick,\n  actionsAlign,\n  actionsLayout,\n}: AlertActionsProps) => {\n  const platform = usePlatform();\n\n  const direction: AlertProps['actionsLayout'] =\n    platform === 'vkcom' ? 'horizontal' : actionsLayout;\n\n  return (\n    <div\n      className={classNames(\n        styles['Alert__actions'],\n        actionsAlign && alignStyles[actionsAlign],\n        direction && directionStyles[direction],\n      )}\n    >\n      {actions.map((action, i) => {\n        // Убираем\n        const { title: children, action: _, autoCloseDisabled, ...restProps } = action;\n\n        return (\n          <React.Fragment key={i}>\n            {renderAction({\n              children,\n              onClick: () => onItemClick(action),\n              ...restProps,\n            })}\n          </React.Fragment>\n        );\n      })}\n    </div>\n  );\n};\n"],"names":["React","classNames","usePlatform","AlertAction","styles","alignStyles","left","center","right","directionStyles","vertical","horizontal","AlertActions","actions","renderAction","props","onItemClick","actionsAlign","actionsLayout","platform","direction","div","className","map","action","i","title","children","_","autoCloseDisabled","restProps","Fragment","onClick"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,0BAA0B;AAEtD,SAASC,WAAW,QAAQ,gBAAgB;AAC5C,OAAOC,YAAY,qBAAqB;AAExC,MAAMC,cAAc;IAClBC,MAAMF,MAAM,CAAC,6BAA6B;IAC1CG,QAAQH,MAAM,CAAC,+BAA+B;IAC9CI,OAAOJ,MAAM,CAAC,8BAA8B;AAC9C;AAEA,MAAMK,kBAAkB;IACtBC,UAAUN,MAAM,CAAC,qCAAqC;IACtDO,YAAYP,MAAM,CAAC,uCAAuC;AAC5D;AAOA,OAAO,MAAMQ,eAAe,CAAC,EAC3BC,UAAU,EAAE,EACZC,eAAe,CAACC,sBAAU,KAACZ;QAAa,GAAGY,KAAK;MAAI,EACpDC,WAAW,EACXC,YAAY,EACZC,aAAa,EACK;IAClB,MAAMC,WAAWjB;IAEjB,MAAMkB,YACJD,aAAa,UAAU,eAAeD;IAExC,qBACE,KAACG;QACCC,WAAWrB,WACTG,MAAM,CAAC,iBAAiB,EACxBa,gBAAgBZ,WAAW,CAACY,aAAa,EACzCG,aAAaX,eAAe,CAACW,UAAU;kBAGxCP,QAAQU,GAAG,CAAC,CAACC,QAAQC;YACpB,UAAU;YACV,MAAM,EAAEC,OAAOC,QAAQ,EAAEH,QAAQI,CAAC,EAAEC,iBAAiB,EAAE,GAAGC,WAAW,GAAGN;YAExE,qBACE,KAACxB,MAAM+B,QAAQ;0BACZjB,aAAa;oBACZa;oBACAK,SAAS,IAAMhB,YAAYQ;oBAC3B,GAAGM,SAAS;gBACd;eALmBL;QAQzB;;AAGN,EAAE"}

package/dist/cssm/components/Alert/AlertTypography.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Alert/AlertTypography.tsx"],"sourcesContent":["import { usePlatform } from '../../hooks/usePlatform';\nimport { HasChildren } from '../../types';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Text } from '../Typography/Text/Text';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './Alert.module.css';\n\ninterface AlertTypography extends HasChildren {\n  id: string;\n}\nexport const AlertHeader = (props: AlertTypography) => {\n  const platform = usePlatform();\n\n  switch (platform) {\n    case 'ios':\n      return <Title className={styles['Alert__header']} weight=\"1\" level=\"3\" {...props} />;\n    default:\n      return <Title className={styles['Alert__header']} weight=\"2\" level=\"2\" {...props} />;\n  }\n};\nexport const AlertText = (props: AlertTypography) => {\n  const platform = usePlatform();\n\n  switch (platform) {\n    case 'vkcom':\n      return <Footnote className={styles['Alert__text']} {...props} />;\n    case 'ios':\n      return <Caption className={styles['Alert__text']} {...props} />;\n    default:\n      return <Text Component=\"span\" className={styles['Alert__text']} weight=\"3\" {...props} />;\n  }\n};\n"],"names":["usePlatform","Caption","Footnote","Text","Title","styles","AlertHeader","props","platform","className","weight","level","AlertText","Component"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,SAASA,WAAW,QAAQ,0BAA0B;AAEtD,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,IAAI,QAAQ,0BAA0B;AAC/C,SAASC,KAAK,QAAQ,4BAA4B;AAClD,OAAOC,YAAY,qBAAqB;AAKxC,OAAO,MAAMC,cAAc,CAACC;IAC1B,MAAMC,WAAWR;IAEjB,OAAQQ;QACN,KAAK;YACH,qBAAO,KAACJ;gBAAMK,WAAWJ,MAAM,CAAC,gBAAgB;gBAAEK,QAAO;gBAAIC,OAAM;gBAAK,GAAGJ,KAAK;;QAClF;YACE,qBAAO,KAACH;gBAAMK,WAAWJ,MAAM,CAAC,gBAAgB;gBAAEK,QAAO;gBAAIC,OAAM;gBAAK,GAAGJ,KAAK;;IACpF;AACF,EAAE;AACF,OAAO,MAAMK,YAAY,CAACL;IACxB,MAAMC,WAAWR;IAEjB,OAAQQ;QACN,KAAK;YACH,qBAAO,KAACN;gBAASO,WAAWJ,MAAM,CAAC,cAAc;gBAAG,GAAGE,KAAK;;QAC9D,KAAK;YACH,qBAAO,KAACN;gBAAQQ,WAAWJ,MAAM,CAAC,cAAc;gBAAG,GAAGE,KAAK;;QAC7D;YACE,qBAAO,KAACJ;gBAAKU,WAAU;gBAAOJ,WAAWJ,MAAM,CAAC,cAAc;gBAAEK,QAAO;gBAAK,GAAGH,KAAK;;IACxF;AACF,EAAE"}
+{"version":3,"sources":["../../../../src/components/Alert/AlertTypography.tsx"],"sourcesContent":["import { usePlatform } from '../../hooks/usePlatform';\nimport { HasChildren } from '../../types';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Text } from '../Typography/Text/Text';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './Alert.module.css';\n\ninterface AlertTypography extends HasChildren {\n  id: string;\n}\nexport const AlertHeader = (props: AlertTypography) => {\n  const platform = usePlatform();\n\n  switch (platform) {\n    case 'ios':\n      return <Title className={styles['Alert__header']} weight=\"1\" level=\"3\" {...props} />;\n    default:\n      return <Title className={styles['Alert__header']} weight=\"2\" level=\"2\" {...props} />;\n  }\n};\nexport const AlertText = (props: AlertTypography) => {\n  const platform = usePlatform();\n\n  switch (platform) {\n    case 'vkcom':\n      return <Footnote className={styles['Alert__text']} {...props} />;\n    case 'ios':\n      return <Caption className={styles['Alert__text']} {...props} />;\n    default:\n      return <Text Component=\"span\" className={styles['Alert__text']} weight=\"3\" {...props} />;\n  }\n};\n"],"names":["usePlatform","Caption","Footnote","Text","Title","styles","AlertHeader","props","platform","className","weight","level","AlertText","Component"],"mappings":";AAAA,SAASA,WAAW,QAAQ,0BAA0B;AAEtD,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,IAAI,QAAQ,0BAA0B;AAC/C,SAASC,KAAK,QAAQ,4BAA4B;AAClD,OAAOC,YAAY,qBAAqB;AAKxC,OAAO,MAAMC,cAAc,CAACC;IAC1B,MAAMC,WAAWR;IAEjB,OAAQQ;QACN,KAAK;YACH,qBAAO,KAACJ;gBAAMK,WAAWJ,MAAM,CAAC,gBAAgB;gBAAEK,QAAO;gBAAIC,OAAM;gBAAK,GAAGJ,KAAK;;QAClF;YACE,qBAAO,KAACH;gBAAMK,WAAWJ,MAAM,CAAC,gBAAgB;gBAAEK,QAAO;gBAAIC,OAAM;gBAAK,GAAGJ,KAAK;;IACpF;AACF,EAAE;AACF,OAAO,MAAMK,YAAY,CAACL;IACxB,MAAMC,WAAWR;IAEjB,OAAQQ;QACN,KAAK;YACH,qBAAO,KAACN;gBAASO,WAAWJ,MAAM,CAAC,cAAc;gBAAG,GAAGE,KAAK;;QAC9D,KAAK;YACH,qBAAO,KAACN;gBAAQQ,WAAWJ,MAAM,CAAC,cAAc;gBAAG,GAAGE,KAAK;;QAC7D;YACE,qBAAO,KAACJ;gBAAKU,WAAU;gBAAOJ,WAAWJ,MAAM,CAAC,cAAc;gBAAEK,QAAO;gBAAK,GAAGH,KAAK;;IACxF;AACF,EAAE"}

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

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { AppRootLayout, AppRootMode, AppRootScroll, SafeAreaInsets } from './types';
+import type { AppRootLayout, AppRootMode, AppRootScroll, AppRootUserSelectMode, SafeAreaInsets } from './types';
 export interface AppRootProps extends React.HTMLAttributes<HTMLDivElement> {
     /** Режим встраивания */
     mode?: AppRootMode;
@@ -34,9 +34,21 @@ export interface AppRootProps extends React.HTMLAttributes<HTMLDivElement> {
      * [Panel](https://vkcom.github.io/VKUI/#/Panel) и [Group](https://vkcom.github.io/VKUI/#/Group).
      */
     layout?: AppRootLayout;
+    /**
+     * Задаёт режим выбора текста (выделения текста) для всего приложения.
+     * По умолчанию, если режим не задан, запрещает выбор текста в приложениях,
+     * запущенных в webview (по значению свойства `isWebView` из [ConfigProvider](https://vkcom.github.io/VKUI/#/ConfigProvider)).
+     *
+     * - `enabled-with-pointer` – разрешает выбор текста, если устройство ввода типа `pointer` (например, `мышь`), в остальных случаях запрещает;
+     * - `disabled` – запрещает выбор текста;
+     * - `enabled` – разрешает выбор текста.
+     *
+     * @since 6.2.0
+     */
+    userSelectMode?: AppRootUserSelectMode;
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/AppRoot
  */
-export declare const AppRoot: ({ children, mode, scroll, portalRoot: portalRootProp, disablePortal, disableParentTransformForPositionFixedElements, className, safeAreaInsets: safeAreaInsetsProp, layout, ...props }: AppRootProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AppRoot: ({ children, mode, scroll, portalRoot: portalRootProp, disablePortal, disableParentTransformForPositionFixedElements, className, safeAreaInsets: safeAreaInsetsProp, layout, userSelectMode, ...props }: AppRootProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=AppRoot.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"AppRoot.d.ts","sourceRoot":"","sources":["../../../../src/components/AppRoot/AppRoot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAgB/B,OAAO,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAGzF,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACxE,wBAAwB;IACxB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC;;OAEG;IACH,UAAU,CAAC,EAAE,WAAW,GAAG,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC;IAC/D;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;;;OAKG;IACH,8CAA8C,CAAC,EAAE,OAAO,CAAC;IACzD;;;OAGG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;CACxB;AAED;;GAEG;AACH,eAAO,MAAM,OAAO,2LAWjB,YAAY,4CAiJd,CAAC"}
+{"version":3,"file":"AppRoot.d.ts","sourceRoot":"","sources":["../../../../src/components/AppRoot/AppRoot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAkB/B,OAAO,KAAK,EACV,aAAa,EACb,WAAW,EACX,aAAa,EACb,qBAAqB,EACrB,cAAc,EACf,MAAM,SAAS,CAAC;AAGjB,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACxE,wBAAwB;IACxB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC;;OAEG;IACH,UAAU,CAAC,EAAE,WAAW,GAAG,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC;IAC/D;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;;;OAKG;IACH,8CAA8C,CAAC,EAAE,OAAO,CAAC;IACzD;;;OAGG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB;;;;;;;;;;OAUG;IACH,cAAc,CAAC,EAAE,qBAAqB,CAAC;CACxC;AAED;;GAEG;AACH,eAAO,MAAM,OAAO,2MAYjB,YAAY,4CAkJd,CAAC"}

package/dist/cssm/components/AppRoot/AppRoot.js

@@ -7,13 +7,14 @@ import { useObjectMemo } from '../../hooks/useObjectMemo';
 import { getDocumentBody } from '../../lib/dom';
 import { useTokensClassName } from '../../lib/tokens';
 import { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';
+import { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';
 import { AppRootContext } from './AppRootContext';
 import { ElementScrollController, GlobalScrollController } from './ScrollContext';
-import { extractPortalRootByProp, getClassNamesByMode, getParentElement, setSafeAreaInsets } from './helpers';
+import { extractPortalRootByProp, getClassNamesByMode, getParentElement, getUserSelectModeClassName, setSafeAreaInsets } from './helpers';
 import styles from './AppRoot.module.css';
 /**
  * @see https://vkcom.github.io/VKUI/#/AppRoot
- */ export const AppRoot = ({ children, mode = 'full', scroll = 'global', portalRoot: portalRootProp = null, disablePortal = false, disableParentTransformForPositionFixedElements, className, safeAreaInsets: safeAreaInsetsProp, layout, ...props })=>{
+ */ export const AppRoot = ({ children, mode = 'full', scroll = 'global', portalRoot: portalRootProp = null, disablePortal = false, disableParentTransformForPositionFixedElements, className, safeAreaInsets: safeAreaInsetsProp, layout, userSelectMode, ...props })=>{
     const { hasPointer, sizeX = 'none', sizeY = 'none' } = useAdaptivity();
     const tokensClassName = useTokensClassName();
     const safeAreaInsets = useObjectMemo(safeAreaInsetsProp);
@@ -121,9 +122,15 @@ import styles from './AppRoot.module.css';
             children: children
         })
     });
+    const { isWebView } = useConfigProvider();
+    const userSelectModeClassName = getUserSelectModeClassName({
+        userSelectMode,
+        isWebView,
+        hasPointer
+    });
     return mode === 'partial' ? content : /*#__PURE__*/ _jsx("div", {
         ref: appRootRef,
-        className: classNames(styles['AppRoot'], hasPointer === undefined ? styles['AppRoot--pointer-none'] : !hasPointer && styles['AppRoot--pointer-has-not'], className),
+        className: classNames(styles['AppRoot'], userSelectModeClassName, className),
         ...props,
         children: content
     });