@vkontakte/vkui 5.8.2 → 5.9.1

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

@@ -14,3 +14,4 @@ export declare const Accordion: {
     (props: AccordionProps): React.JSX.Element;
     Summary: ({ className, after, before, ExpandIcon, CollapseIcon, iconPosition, children, ...restProps }: import("./AccordionSummary").AccordionSummaryProps) => React.JSX.Element;
 };
+//# sourceMappingURL=Accordion.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAKzC,MAAM,MAAM,cAAc,GAAG,KAAK,CAAC,qBAAqB,CAAC,kBAAkB,CAAC,GAC1E,UAAU,CAAC,kBAAkB,CAAC,CAAC;AAEjC;;;;;;;;GAQG;AACH,eAAO,MAAM,SAAS;YAAW,cAAc;;CAE9C,CAAC"}

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

@@ -5,9 +5,11 @@
 .AccordionSummary__icon {
   color: var(--vkui--color_icon_secondary);
 }
+/* stylelint-disable-next-line selector-max-type -- Old code */
 .Accordion:not([open]) > summary .AccordionSummary__icon--collapse {
   display: none;
 }
+/* stylelint-disable-next-line selector-max-type -- Old code */
 .Accordion[open] > summary .AccordionSummary__icon--expand {
   display: none;
 }

package/dist/cssm/components/Accordion/AccordionSummary.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { SimpleCellProps } from '../SimpleCell/SimpleCell';
 export interface AccordionSummaryProps extends Omit<SimpleCellProps, 'expandable'> {
     /**
@@ -21,3 +21,4 @@ export interface AccordionSummaryProps extends Omit<SimpleCellProps, 'expandable
  * @see  https://vkcom.github.io/VKUI/#/Accordion
  */
 export declare const AccordionSummary: ({ className, after, before, ExpandIcon, CollapseIcon, iconPosition, children, ...restProps }: AccordionSummaryProps) => React.JSX.Element;
+//# sourceMappingURL=AccordionSummary.d.ts.map

package/dist/cssm/components/Accordion/AccordionSummary.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionSummary.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/AccordionSummary.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAc,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAGvE,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,eAAe,EAAE,YAAY,CAAC;IAChF;;OAEG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IAC/B;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IACjC;;OAEG;IACH,YAAY,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;CACnC;AAED;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,iGAS1B,qBAAqB,sBAyCvB,CAAC"}

package/dist/cssm/components/Accordion/AccordionSummary.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { Icon24ChevronDown, Icon24ChevronUp } from '@vkontakte/icons';
 import { classNames } from '@vkontakte/vkjs';
 import { SimpleCell } from '../SimpleCell/SimpleCell';

package/dist/cssm/components/Accordion/AccordionSummary.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Accordion/AccordionSummary.tsx"],"sourcesContent":["import React from 'react';\nimport { Icon24ChevronDown, Icon24ChevronUp } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { SimpleCell, SimpleCellProps } from '../SimpleCell/SimpleCell';\nimport styles from './Accordion.module.css';\n\nexport interface AccordionSummaryProps extends Omit<SimpleCellProps, 'expandable'> {\n  /**\n   * Иконка для раскрытия контента.\n   */\n  ExpandIcon?: React.ElementType;\n  /**\n   * Иконка для сворачивания контента.\n   */\n  CollapseIcon?: React.ElementType;\n  /**\n   * Позиция иконки.\n   */\n  iconPosition?: 'before' | 'after';\n}\n\n/**\n * Обертка над summary.\n *\n * @since 5.3.0\n * @see  https://vkcom.github.io/VKUI/#/Accordion\n */\nexport const AccordionSummary = ({\n  className,\n  after,\n  before,\n  ExpandIcon = Icon24ChevronDown,\n  CollapseIcon = Icon24ChevronUp,\n  iconPosition = 'after',\n  children,\n  ...restProps\n}: AccordionSummaryProps) => {\n  const accordionIcon = (\n    // Обертка нужна для правильной работы с отступами в SimpleCell\n    // Без обертки на AccordionSummary__icon--collapse не будет действовать правило `last-child`\n    <span className=\"vkuiIcon\">\n      <ExpandIcon\n        className={classNames(\n          styles['AccordionSummary__icon'],\n          styles['AccordionSummary__icon--expand'],\n        )}\n      />\n      <CollapseIcon\n        className={classNames(\n          styles['AccordionSummary__icon'],\n          styles['AccordionSummary__icon--collapse'],\n        )}\n      />\n    </span>\n  );\n\n  return (\n    <SimpleCell\n      className={classNames(styles['AccordionSummary'], className)}\n      Component=\"summary\"\n      before={\n        <>\n          {iconPosition === 'before' && accordionIcon}\n          {before}\n        </>\n      }\n      after={\n        <>\n          {after}\n          {iconPosition === 'after' && accordionIcon}\n        </>\n      }\n      {...restProps}\n    >\n      {children}\n    </SimpleCell>\n  );\n};\n"],"names":["React","Icon24ChevronDown","Icon24ChevronUp","classNames","SimpleCell","styles","AccordionSummary","className","after","before","ExpandIcon","CollapseIcon","iconPosition","children","restProps","accordionIcon","span","Component"],"mappings":"AAAA,OAAOA,WAAW,QAAQ;AAC1B,SAASC,iBAAiB,EAAEC,eAAe,QAAQ,mBAAmB;AACtE,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,UAAU,QAAyB,2BAA2B;AACvE,OAAOC,YAAY,yBAAyB;AAiB5C;;;;;CAKC,GACD,OAAO,MAAMC,mBAAmB,CAAC,EAC/BC,SAAS,EACTC,KAAK,EACLC,MAAM,EACNC,aAAaT,iBAAiB,EAC9BU,eAAeT,eAAe,EAC9BU,eAAe,OAAO,EACtBC,QAAQ,EACR,GAAGC,WACmB;IACtB,MAAMC,gBACJ,+DAA+D;IAC/D,4FAA4F;kBAC5F,oBAACC;QAAKT,WAAU;qBACd,oBAACG;QACCH,WAAWJ,WACTE,MAAM,CAAC,yBAAyB,EAChCA,MAAM,CAAC,iCAAiC;sBAG5C,oBAACM;QACCJ,WAAWJ,WACTE,MAAM,CAAC,yBAAyB,EAChCA,MAAM,CAAC,mCAAmC;;IAMlD,qBACE,oBAACD;QACCG,WAAWJ,WAAWE,MAAM,CAAC,mBAAmB,EAAEE;QAClDU,WAAU;QACVR,sBACE,0CACGG,iBAAiB,YAAYG,eAC7BN;QAGLD,qBACE,0CACGA,OACAI,iBAAiB,WAAWG;QAGhC,GAAGD,SAAS;OAEZD;AAGP,EAAE"}
+{"version":3,"sources":["../../../../src/components/Accordion/AccordionSummary.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24ChevronDown, Icon24ChevronUp } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { SimpleCell, SimpleCellProps } from '../SimpleCell/SimpleCell';\nimport styles from './Accordion.module.css';\n\nexport interface AccordionSummaryProps extends Omit<SimpleCellProps, 'expandable'> {\n  /**\n   * Иконка для раскрытия контента.\n   */\n  ExpandIcon?: React.ElementType;\n  /**\n   * Иконка для сворачивания контента.\n   */\n  CollapseIcon?: React.ElementType;\n  /**\n   * Позиция иконки.\n   */\n  iconPosition?: 'before' | 'after';\n}\n\n/**\n * Обертка над summary.\n *\n * @since 5.3.0\n * @see  https://vkcom.github.io/VKUI/#/Accordion\n */\nexport const AccordionSummary = ({\n  className,\n  after,\n  before,\n  ExpandIcon = Icon24ChevronDown,\n  CollapseIcon = Icon24ChevronUp,\n  iconPosition = 'after',\n  children,\n  ...restProps\n}: AccordionSummaryProps) => {\n  const accordionIcon = (\n    // Обертка нужна для правильной работы с отступами в SimpleCell\n    // Без обертки на AccordionSummary__icon--collapse не будет действовать правило `last-child`\n    <span className=\"vkuiIcon\">\n      <ExpandIcon\n        className={classNames(\n          styles['AccordionSummary__icon'],\n          styles['AccordionSummary__icon--expand'],\n        )}\n      />\n      <CollapseIcon\n        className={classNames(\n          styles['AccordionSummary__icon'],\n          styles['AccordionSummary__icon--collapse'],\n        )}\n      />\n    </span>\n  );\n\n  return (\n    <SimpleCell\n      className={classNames(styles['AccordionSummary'], className)}\n      Component=\"summary\"\n      before={\n        <>\n          {iconPosition === 'before' && accordionIcon}\n          {before}\n        </>\n      }\n      after={\n        <>\n          {after}\n          {iconPosition === 'after' && accordionIcon}\n        </>\n      }\n      {...restProps}\n    >\n      {children}\n    </SimpleCell>\n  );\n};\n"],"names":["React","Icon24ChevronDown","Icon24ChevronUp","classNames","SimpleCell","styles","AccordionSummary","className","after","before","ExpandIcon","CollapseIcon","iconPosition","children","restProps","accordionIcon","span","Component"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,iBAAiB,EAAEC,eAAe,QAAQ,mBAAmB;AACtE,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,UAAU,QAAyB,2BAA2B;AACvE,OAAOC,YAAY,yBAAyB;AAiB5C;;;;;CAKC,GACD,OAAO,MAAMC,mBAAmB,CAAC,EAC/BC,SAAS,EACTC,KAAK,EACLC,MAAM,EACNC,aAAaT,iBAAiB,EAC9BU,eAAeT,eAAe,EAC9BU,eAAe,OAAO,EACtBC,QAAQ,EACR,GAAGC,WACmB;IACtB,MAAMC,gBACJ,+DAA+D;IAC/D,4FAA4F;kBAC5F,oBAACC;QAAKT,WAAU;qBACd,oBAACG;QACCH,WAAWJ,WACTE,MAAM,CAAC,yBAAyB,EAChCA,MAAM,CAAC,iCAAiC;sBAG5C,oBAACM;QACCJ,WAAWJ,WACTE,MAAM,CAAC,yBAAyB,EAChCA,MAAM,CAAC,mCAAmC;;IAMlD,qBACE,oBAACD;QACCG,WAAWJ,WAAWE,MAAM,CAAC,mBAAmB,EAAEE;QAClDU,WAAU;QACVR,sBACE,0CACGG,iBAAiB,YAAYG,eAC7BN;QAGLD,qBACE,0CACGA,OACAI,iBAAiB,WAAWG;QAGhC,GAAGD,SAAS;OAEZD;AAGP,EAAE"}

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

@@ -15,9 +15,11 @@ export interface ActionSheetProps extends Pick<SharedDropdownProps, 'toggleRef'
      * Только мобильный iOS.
      */
     iosCloseItem?: React.ReactNode;
+    mode?: 'sheet' | 'menu';
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/ActionSheet
  */
-export declare const ActionSheet: ({ children, className, header, text, style, iosCloseItem, popupDirection, popupOffsetDistance, placement, ...restProps }: ActionSheetProps) => React.JSX.Element;
+export declare const ActionSheet: ({ children, className, header, text, style, iosCloseItem, popupDirection, popupOffsetDistance, placement, mode: modeProp, ...restProps }: ActionSheetProps) => React.JSX.Element;
 export {};
+//# sourceMappingURL=ActionSheet.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ActionSheet.d.ts","sourceRoot":"","sources":["../../../../src/components/ActionSheet/ActionSheet.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAe/B,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAI9C,KAAK,eAAe,GAAG,aAAa,GAAG,aAAa,GAAG,OAAO,CAAC;AAC/D,MAAM,WAAW,yBAAyB;IACxC,QAAQ,EAAE,eAAe,CAAC;CAC3B;AAED,MAAM,WAAW,gBACf,SAAQ,IAAI,CACR,mBAAmB,EACnB,WAAW,GAAG,gBAAgB,GAAG,qBAAqB,GAAG,WAAW,CACrE,EACD,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACtC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB;;OAEG;IACH,OAAO,CAAC,OAAO,EAAE,yBAAyB,GAAG,IAAI,CAAC;IAClD;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;CACzB;AAED;;GAEG;AACH,eAAO,MAAM,WAAW,6IAYrB,gBAAgB,sBA+GlB,CAAC"}

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

@@ -11,13 +11,13 @@ import { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';
 import { Footnote } from '../Typography/Footnote/Footnote';
 import { ActionSheetContext } from './ActionSheetContext';
 import { ActionSheetDefaultIosCloseItem } from './ActionSheetDefaultIosCloseItem';
-import { ActionSheetDropdown } from './ActionSheetDropdown';
-import { ActionSheetDropdownDesktop } from './ActionSheetDropdownDesktop';
+import { ActionSheetDropdownMenu } from './ActionSheetDropdownMenu';
+import { ActionSheetDropdownSheet } from './ActionSheetDropdownSheet';
 import styles from './ActionSheet.module.css';
 const warn = warnOnce('ActionSheet');
 /**
  * @see https://vkcom.github.io/VKUI/#/ActionSheet
- */ export const ActionSheet = ({ children, className, header, text, style, iosCloseItem, popupDirection, popupOffsetDistance, placement, ...restProps })=>{
+ */ export const ActionSheet = ({ children, className, header, text, style, iosCloseItem, popupDirection, popupOffsetDistance, placement, mode: modeProp, ...restProps })=>{
     const platform = usePlatform();
     const [closingBy, setClosingBy] = React.useState(undefined);
     const onClose = ()=>setClosingBy('other');
@@ -30,9 +30,10 @@ const warn = warnOnce('ActionSheet');
         _action.current = noop;
     };
     const { isDesktop } = useAdaptivityWithJSMediaQueries();
-    useScrollLock(!isDesktop);
+    const mode = modeProp ?? (isDesktop ? 'menu' : 'sheet');
+    useScrollLock(mode === 'sheet');
     let timeout = platform === Platform.IOS ? 300 : 200;
-    if (isDesktop) {
+    if (mode === 'menu') {
         timeout = 0;
     }
     const fallbackTransitionFinish = useTimeout(afterClose, timeout);
@@ -58,15 +59,15 @@ const warn = warnOnce('ActionSheet');
         }, []);
     const contextValue = useObjectMemo({
         onItemClick,
-        isDesktop
+        mode
     });
-    const DropdownComponent = isDesktop ? ActionSheetDropdownDesktop : ActionSheetDropdown;
+    const DropdownComponent = mode === 'menu' ? ActionSheetDropdownMenu : ActionSheetDropdownSheet;
     if (process.env.NODE_ENV === 'development' && popupDirection) {
         // TODO [>=6]: popupDirection
         warn('Свойство "popupDirection" будет удалено в v6. Используйте свойство "placement"');
     }
     popupDirection = popupDirection !== undefined ? popupDirection : 'bottom';
-    const dropdownProps = isDesktop ? Object.assign(restProps, {
+    const dropdownProps = mode === 'menu' ? Object.assign(restProps, {
         popupOffsetDistance,
         popupDirection,
         placement
@@ -78,8 +79,8 @@ const warn = warnOnce('ActionSheet');
         timeout: timeout,
         ...dropdownProps,
         onClose: onClose,
-        className: isDesktop ? className : undefined,
-        style: isDesktop ? style : undefined
+        className: mode === 'menu' ? className : undefined,
+        style: mode === 'menu' ? style : undefined
     }, /*#__PURE__*/ React.createElement("div", {
         className: styles['ActionSheet__content-wrapper']
     }, (header || text) && /*#__PURE__*/ React.createElement("header", {
@@ -89,10 +90,10 @@ const warn = warnOnce('ActionSheet');
         className: styles['ActionSheet__title']
     }, header), text && /*#__PURE__*/ React.createElement(Footnote, {
         className: styles['ActionSheet__text']
-    }, text)), children), platform === Platform.IOS && !isDesktop && /*#__PURE__*/ React.createElement("div", {
+    }, text)), children), platform === Platform.IOS && mode === 'sheet' && /*#__PURE__*/ React.createElement("div", {
         className: styles['ActionSheet__close-item-wrapper--ios']
     }, iosCloseItem ?? /*#__PURE__*/ React.createElement(ActionSheetDefaultIosCloseItem, null))));
-    if (isDesktop) {
+    if (mode === 'menu') {
         return actionSheet;
     }
     return /*#__PURE__*/ React.createElement(PopoutWrapper, {

package/dist/cssm/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        <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":["React","noop","useAdaptivityWithJSMediaQueries","useObjectMemo","usePlatform","useTimeout","Platform","warnOnce","useScrollLock","PopoutWrapper","Footnote","ActionSheetContext","ActionSheetDefaultIosCloseItem","ActionSheetDropdown","ActionSheetDropdownDesktop","styles","warn","ActionSheet","children","className","header","text","style","iosCloseItem","popupDirection","popupOffsetDistance","placement","restProps","platform","closingBy","setClosingBy","useState","undefined","onClose","_action","useRef","afterClose","closedBy","current","isDesktop","timeout","IOS","fallbackTransitionFinish","useEffect","set","clear","onItemClick","useCallback","action","immediateAction","autoClose","isCancelItem","event","persist","contextValue","DropdownComponent","process","env","NODE_ENV","dropdownProps","Object","assign","actionSheet","Provider","value","closing","Boolean","div","weight","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 { ActionSheetDropdownMenu } from './ActionSheetDropdownMenu';\nimport { ActionSheetDropdownSheet } from './ActionSheetDropdownSheet';\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  mode?: 'sheet' | 'menu';\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  mode: modeProp,\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  const mode = modeProp ?? (isDesktop ? 'menu' : 'sheet');\n\n  useScrollLock(mode === 'sheet');\n\n  let timeout = platform === Platform.IOS ? 300 : 200;\n\n  if (mode === 'menu') {\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, mode });\n\n  const DropdownComponent = mode === 'menu' ? ActionSheetDropdownMenu : ActionSheetDropdownSheet;\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 =\n    mode === 'menu'\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={mode === 'menu' ? className : undefined}\n        style={mode === 'menu' ? 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 && mode === 'sheet' && (\n          <div className={styles['ActionSheet__close-item-wrapper--ios']}>\n            {iosCloseItem ?? <ActionSheetDefaultIosCloseItem />}\n          </div>\n        )}\n      </DropdownComponent>\n    </ActionSheetContext.Provider>\n  );\n\n  if (mode === 'menu') {\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":["React","noop","useAdaptivityWithJSMediaQueries","useObjectMemo","usePlatform","useTimeout","Platform","warnOnce","useScrollLock","PopoutWrapper","Footnote","ActionSheetContext","ActionSheetDefaultIosCloseItem","ActionSheetDropdownMenu","ActionSheetDropdownSheet","styles","warn","ActionSheet","children","className","header","text","style","iosCloseItem","popupDirection","popupOffsetDistance","placement","mode","modeProp","restProps","platform","closingBy","setClosingBy","useState","undefined","onClose","_action","useRef","afterClose","closedBy","current","isDesktop","timeout","IOS","fallbackTransitionFinish","useEffect","set","clear","onItemClick","useCallback","action","immediateAction","autoClose","isCancelItem","event","persist","contextValue","DropdownComponent","process","env","NODE_ENV","dropdownProps","Object","assign","actionSheet","Provider","value","closing","Boolean","div","weight","alignY","onClick","hasMask","fixed"],"mappings":"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"}

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

@@ -92,7 +92,7 @@
  * Desktop version
  */
 
-.ActionSheet--desktop {
+.ActionSheet--menu {
   width: auto;
   height: auto;
   animation: none;
@@ -100,7 +100,7 @@
   max-width: 100%;
 }
 
-.ActionSheet--desktop.ActionSheet--ios .ActionSheet__content-wrapper {
+.ActionSheet--menu.ActionSheet--ios .ActionSheet__content-wrapper {
   border-radius: 14px;
   padding: 0;
 }

package/dist/cssm/components/ActionSheet/ActionSheetContext.d.ts

@@ -8,6 +8,7 @@ export type ItemClickHandler<T extends Element = Element> = (options: {
 }) => (event: React.MouseEvent) => void;
 export type ActionSheetContextType<T extends Element = Element> = {
     onItemClick?: ItemClickHandler<T>;
-    isDesktop?: boolean;
+    mode?: 'sheet' | 'menu';
 };
 export declare const ActionSheetContext: React.Context<ActionSheetContextType<any>>;
+//# sourceMappingURL=ActionSheetContext.d.ts.map

package/dist/cssm/components/ActionSheet/ActionSheetContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActionSheetContext.d.ts","sourceRoot":"","sources":["../../../../src/components/ActionSheet/ActionSheetContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,MAAM,UAAU,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;AAEjE,MAAM,MAAM,gBAAgB,CAAC,CAAC,SAAS,OAAO,GAAG,OAAO,IAAI,CAAC,OAAO,EAAE;IACpE,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC;IAClC,eAAe,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC;IAC3C,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;CACvB,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;AAExC,MAAM,MAAM,sBAAsB,CAAC,CAAC,SAAS,OAAO,GAAG,OAAO,IAAI;IAChE,WAAW,CAAC,EAAE,gBAAgB,CAAC,CAAC,CAAC,CAAC;IAClC,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;CACzB,CAAC;AAEF,eAAO,MAAM,kBAAkB,4CAAuD,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheetContext.ts"],"sourcesContent":["import * as React from 'react';\n\nexport type ActionType<T> = (event: React.MouseEvent<T>) => void;\n\nexport type ItemClickHandler<T extends Element = Element> = (options: {\n  action: ActionType<T> | undefined;\n  immediateAction: ActionType<T> | undefined;\n  autoClose: boolean;\n  isCancelItem: boolean;\n}) => (event: React.MouseEvent) => void;\n\nexport type ActionSheetContextType<T extends Element = Element> = {\n  onItemClick?: ItemClickHandler<T>;\n  isDesktop?: boolean;\n};\n\nexport const ActionSheetContext = React.createContext<ActionSheetContextType<any>>({});\n"],"names":["React","ActionSheetContext","createContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAgB/B,OAAO,MAAMC,qBAAqBD,MAAME,aAAa,CAA8B,CAAC,GAAG"}
+{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheetContext.ts"],"sourcesContent":["import * as React from 'react';\n\nexport type ActionType<T> = (event: React.MouseEvent<T>) => void;\n\nexport type ItemClickHandler<T extends Element = Element> = (options: {\n  action: ActionType<T> | undefined;\n  immediateAction: ActionType<T> | undefined;\n  autoClose: boolean;\n  isCancelItem: boolean;\n}) => (event: React.MouseEvent) => void;\n\nexport type ActionSheetContextType<T extends Element = Element> = {\n  onItemClick?: ItemClickHandler<T>;\n  mode?: 'sheet' | 'menu';\n};\n\nexport const ActionSheetContext = React.createContext<ActionSheetContextType<any>>({});\n"],"names":["React","ActionSheetContext","createContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAgB/B,OAAO,MAAMC,qBAAqBD,MAAME,aAAa,CAA8B,CAAC,GAAG"}

package/dist/cssm/components/ActionSheet/ActionSheetDefaultIosCloseItem.d.ts

@@ -1,3 +1,4 @@
 import * as React from 'react';
 import { ActionSheetItemProps } from '../ActionSheetItem/ActionSheetItem';
 export declare const ActionSheetDefaultIosCloseItem: (props: ActionSheetItemProps) => React.JSX.Element;
+//# sourceMappingURL=ActionSheetDefaultIosCloseItem.d.ts.map

package/dist/cssm/components/ActionSheet/ActionSheetDefaultIosCloseItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActionSheetDefaultIosCloseItem.d.ts","sourceRoot":"","sources":["../../../../src/components/ActionSheet/ActionSheetDefaultIosCloseItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAmB,oBAAoB,EAAE,MAAM,oCAAoC,CAAC;AAE3F,eAAO,MAAM,8BAA8B,UAAW,oBAAoB,sBAMzE,CAAC"}

package/dist/cssm/components/ActionSheet/ActionSheetDropdownMenu.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { SharedDropdownProps } from './types';
+export declare const ActionSheetDropdownMenu: ({ children, toggleRef, closing, popupDirection, onClose, className, style, popupOffsetDistance, placement: placementProp, ...restProps }: SharedDropdownProps) => React.JSX.Element;
+//# sourceMappingURL=ActionSheetDropdownMenu.d.ts.map

package/dist/cssm/components/ActionSheet/ActionSheetDropdownMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActionSheetDropdownMenu.d.ts","sourceRoot":"","sources":["../../../../src/components/ActionSheet/ActionSheetDropdownMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAQ9C,eAAO,MAAM,uBAAuB,6IAWjC,mBAAmB,sBAkErB,CAAC"}

package/dist/cssm/components/ActionSheet/{ActionSheetDropdownDesktop.js → ActionSheetDropdownMenu.js}

@@ -16,7 +16,7 @@ const warn = warnOnce('ActionSheet');
 function getEl(ref) {
     return ref && 'current' in ref ? ref.current : ref;
 }
-export const ActionSheetDropdownDesktop = ({ children, toggleRef, closing, popupDirection, onClose, className, style, popupOffsetDistance = 0, placement: placementProp, ...restProps })=>{
+export const ActionSheetDropdownMenu = ({ children, toggleRef, closing, popupDirection, onClose, className, style, popupOffsetDistance = 0, placement: placementProp, ...restProps })=>{
     const { document } = useDOM();
     const platform = usePlatform();
     const { sizeY } = useAdaptivityWithJSMediaQueries();
@@ -63,7 +63,7 @@ export const ActionSheetDropdownDesktop = ({ children, toggleRef, closing, popup
         targetRef: targetRef,
         offsetDistance: popupOffsetDistance,
         placement: placement,
-        className: classNames(styles['ActionSheet'], platform === Platform.IOS && styles['ActionSheet--ios'], styles['ActionSheet--desktop'], sizeY === SizeType.COMPACT && styles['ActionSheet--sizeY-compact'], className),
+        className: classNames(styles['ActionSheet'], platform === Platform.IOS && styles['ActionSheet--ios'], styles['ActionSheet--menu'], sizeY === SizeType.COMPACT && styles['ActionSheet--sizeY-compact'], className),
         style: style,
         getRef: elementRef,
         forcePortal: false
@@ -74,4 +74,4 @@ export const ActionSheetDropdownDesktop = ({ children, toggleRef, closing, popup
     }, children));
 };
 
-//# sourceMappingURL=ActionSheetDropdownDesktop.js.map
+//# sourceMappingURL=ActionSheetDropdownMenu.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheetDropdownMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useEffectDev } from '../../hooks/useEffectDev';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { useDOM } from '../../lib/dom';\nimport { isRefObject } from '../../lib/isRefObject';\nimport { Platform } from '../../lib/platform';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { Popper } from '../Popper/Popper';\nimport { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nconst warn = warnOnce('ActionSheet');\nfunction getEl(ref: SharedDropdownProps['toggleRef']): Element | null | undefined {\n  return ref && 'current' in ref ? ref.current : ref;\n}\n\nexport const ActionSheetDropdownMenu = ({\n  children,\n  toggleRef,\n  closing,\n  popupDirection,\n  onClose,\n  className,\n  style,\n  popupOffsetDistance = 0,\n  placement: placementProp,\n  ...restProps\n}: SharedDropdownProps) => {\n  const { document } = useDOM();\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivityWithJSMediaQueries();\n  const elementRef = React.useRef<HTMLDivElement | null>(null);\n\n  useEffectDev(() => {\n    const toggleEl = getEl(toggleRef);\n    if (!toggleEl) {\n      warn(`Свойство \"toggleRef\" не передано`, 'error');\n    }\n  }, [toggleRef]);\n\n  const isPopupDirectionTop = React.useMemo(\n    () =>\n      popupDirection === 'top' ||\n      (typeof popupDirection === 'function' && popupDirection(elementRef) === 'top'),\n    [popupDirection, elementRef],\n  );\n\n  const placement = placementProp ?? (isPopupDirectionTop ? 'top-end' : 'bottom-end');\n\n  const bodyClickListener = useEventListener('click', (e: MouseEvent) => {\n    const dropdownElement = elementRef?.current;\n    if (dropdownElement && !dropdownElement.contains(e.target as Node)) {\n      onClose?.();\n    }\n  });\n\n  React.useEffect(() => {\n    setTimeout(() => {\n      bodyClickListener.add(document!.body);\n    });\n  }, [bodyClickListener, document]);\n\n  const onClick = React.useCallback((e: React.MouseEvent<HTMLElement>) => e.stopPropagation(), []);\n\n  const targetRef = React.useMemo(() => {\n    if (isRefObject<SharedDropdownProps['toggleRef'], HTMLElement>(toggleRef)) {\n      return toggleRef;\n    }\n\n    return { current: toggleRef as HTMLElement };\n  }, [toggleRef]);\n\n  return (\n    <Popper\n      targetRef={targetRef}\n      offsetDistance={popupOffsetDistance}\n      placement={placement}\n      className={classNames(\n        styles['ActionSheet'],\n        platform === Platform.IOS && styles['ActionSheet--ios'],\n        styles['ActionSheet--menu'],\n        sizeY === SizeType.COMPACT && styles['ActionSheet--sizeY-compact'],\n        className,\n      )}\n      style={style}\n      getRef={elementRef}\n      forcePortal={false}\n    >\n      <FocusTrap onClose={onClose} {...restProps} onClick={onClick}>\n        {children}\n      </FocusTrap>\n    </Popper>\n  );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","useEffectDev","useEventListener","usePlatform","SizeType","useDOM","isRefObject","Platform","warnOnce","FocusTrap","Popper","styles","warn","getEl","ref","current","ActionSheetDropdownMenu","children","toggleRef","closing","popupDirection","onClose","className","style","popupOffsetDistance","placement","placementProp","restProps","document","platform","sizeY","elementRef","useRef","toggleEl","isPopupDirectionTop","useMemo","bodyClickListener","e","dropdownElement","contains","target","useEffect","setTimeout","add","body","onClick","useCallback","stopPropagation","targetRef","offsetDistance","IOS","COMPACT","getRef","forcePortal"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,8CAA8C;AAC9F,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,gBAAgB,QAAQ,+BAA+B;AAChE,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,MAAM,QAAQ,gBAAgB;AACvC,SAASC,WAAW,QAAQ,wBAAwB;AACpD,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,SAAS,QAAQ,yBAAyB;AACnD,SAASC,MAAM,QAAQ,mBAAmB;AAE1C,OAAOC,YAAY,2BAA2B;AAE9C,MAAMC,OAAOJ,SAAS;AACtB,SAASK,MAAMC,GAAqC;IAClD,OAAOA,OAAO,aAAaA,MAAMA,IAAIC,OAAO,GAAGD;AACjD;AAEA,OAAO,MAAME,0BAA0B,CAAC,EACtCC,QAAQ,EACRC,SAAS,EACTC,OAAO,EACPC,cAAc,EACdC,OAAO,EACPC,SAAS,EACTC,KAAK,EACLC,sBAAsB,CAAC,EACvBC,WAAWC,aAAa,EACxB,GAAGC,WACiB;IACpB,MAAM,EAAEC,QAAQ,EAAE,GAAGvB;IACrB,MAAMwB,WAAW1B;IACjB,MAAM,EAAE2B,KAAK,EAAE,GAAG9B;IAClB,MAAM+B,aAAajC,MAAMkC,MAAM,CAAwB;IAEvD/B,aAAa;QACX,MAAMgC,WAAWpB,MAAMK;QACvB,IAAI,CAACe,UAAU;YACbrB,KAAK,CAAC,gCAAgC,CAAC,EAAE;QAC3C;IACF,GAAG;QAACM;KAAU;IAEd,MAAMgB,sBAAsBpC,MAAMqC,OAAO,CACvC,IACEf,mBAAmB,SAClB,OAAOA,mBAAmB,cAAcA,eAAeW,gBAAgB,OAC1E;QAACX;QAAgBW;KAAW;IAG9B,MAAMN,YAAYC,iBAAkBQ,CAAAA,sBAAsB,YAAY,YAAW;IAEjF,MAAME,oBAAoBlC,iBAAiB,SAAS,CAACmC;QACnD,MAAMC,kBAAkBP,YAAYhB;QACpC,IAAIuB,mBAAmB,CAACA,gBAAgBC,QAAQ,CAACF,EAAEG,MAAM,GAAW;YAClEnB;QACF;IACF;IAEAvB,MAAM2C,SAAS,CAAC;QACdC,WAAW;YACTN,kBAAkBO,GAAG,CAACf,SAAUgB,IAAI;QACtC;IACF,GAAG;QAACR;QAAmBR;KAAS;IAEhC,MAAMiB,UAAU/C,MAAMgD,WAAW,CAAC,CAACT,IAAqCA,EAAEU,eAAe,IAAI,EAAE;IAE/F,MAAMC,YAAYlD,MAAMqC,OAAO,CAAC;QAC9B,IAAI7B,YAA2DY,YAAY;YACzE,OAAOA;QACT;QAEA,OAAO;YAAEH,SAASG;QAAyB;IAC7C,GAAG;QAACA;KAAU;IAEd,qBACE,oBAACR;QACCsC,WAAWA;QACXC,gBAAgBzB;QAChBC,WAAWA;QACXH,WAAWvB,WACTY,MAAM,CAAC,cAAc,EACrBkB,aAAatB,SAAS2C,GAAG,IAAIvC,MAAM,CAAC,mBAAmB,EACvDA,MAAM,CAAC,oBAAoB,EAC3BmB,UAAU1B,SAAS+C,OAAO,IAAIxC,MAAM,CAAC,6BAA6B,EAClEW;QAEFC,OAAOA;QACP6B,QAAQrB;QACRsB,aAAa;qBAEb,oBAAC5C;QAAUY,SAASA;QAAU,GAAGM,SAAS;QAAEkB,SAASA;OAClD5B;AAIT,EAAE"}

package/dist/cssm/components/ActionSheet/ActionSheetDropdownSheet.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+import { SharedDropdownProps } from './types';
+export type ActionSheetDropdownProps = Omit<SharedDropdownProps, 'popupDirection' | 'popupOffsetDistance' | 'placement'>;
+export declare const ActionSheetDropdownSheet: ({ children, closing, toggleRef, className, ...restProps }: SharedDropdownProps) => React.JSX.Element;
+//# sourceMappingURL=ActionSheetDropdownSheet.d.ts.map

package/dist/cssm/components/ActionSheet/ActionSheetDropdownSheet.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActionSheetDropdownSheet.d.ts","sourceRoot":"","sources":["../../../../src/components/ActionSheet/ActionSheetDropdownSheet.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAK9C,MAAM,MAAM,wBAAwB,GAAG,IAAI,CACzC,mBAAmB,EACnB,gBAAgB,GAAG,qBAAqB,GAAG,WAAW,CACvD,CAAC;AAEF,eAAO,MAAM,wBAAwB,8DAOlC,mBAAmB,sBAmBrB,CAAC"}

package/dist/cssm/components/ActionSheet/{ActionSheetDropdown.js → ActionSheetDropdownSheet.js}

@@ -7,7 +7,7 @@ import { Platform } from '../../lib/platform';
 import { FocusTrap } from '../FocusTrap/FocusTrap';
 import styles from './ActionSheet.module.css';
 const stopPropagation = (e)=>e.stopPropagation();
-export const ActionSheetDropdown = ({ children, closing, // these 2 props are only omitted - ActionSheetDesktop compat
+export const ActionSheetDropdownSheet = ({ children, closing, // these 2 props are only omitted - ActionSheetDesktop compat
 toggleRef, className, ...restProps })=>{
     const { sizeY } = useAdaptivityWithJSMediaQueries();
     const platform = usePlatform();
@@ -18,4 +18,4 @@ toggleRef, className, ...restProps })=>{
     }, children);
 };
 
-//# sourceMappingURL=ActionSheetDropdown.js.map
+//# sourceMappingURL=ActionSheetDropdownSheet.js.map

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

@@ -0,0 +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 { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\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 === Platform.IOS && styles['ActionSheet--ios'],\n        closing && styles['ActionSheet--closing'],\n        sizeY === SizeType.COMPACT && styles['ActionSheet--sizeY-compact'],\n        className,\n      )}\n    >\n      {children}\n    </FocusTrap>\n  );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","usePlatform","SizeType","Platform","FocusTrap","styles","stopPropagation","e","ActionSheetDropdownSheet","children","closing","toggleRef","className","restProps","sizeY","platform","onClick","IOS","COMPACT"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,8CAA8C;AAC9F,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,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,GAAGd;IAClB,MAAMe,WAAWd;IAEjB,qBACE,oBAACG;QACE,GAAGS,SAAS;QACbG,SAASV;QACTM,WAAWb,WACTM,MAAM,CAAC,cAAc,EACrBU,aAAaZ,SAASc,GAAG,IAAIZ,MAAM,CAAC,mBAAmB,EACvDK,WAAWL,MAAM,CAAC,uBAAuB,EACzCS,UAAUZ,SAASgB,OAAO,IAAIb,MAAM,CAAC,6BAA6B,EAClEO;OAGDH;AAGP,EAAE"}

package/dist/cssm/components/ActionSheet/types.d.ts

@@ -28,3 +28,4 @@ export interface SharedDropdownProps extends FocusTrapProps {
      * */
     popupOffsetDistance?: number;
 }
+//# sourceMappingURL=types.d.ts.map

package/dist/cssm/components/ActionSheet/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/ActionSheet/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExD,MAAM,MAAM,cAAc,GACtB,KAAK,GACL,QAAQ,GACR,CAAC,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,KAAK,KAAK,GAAG,QAAQ,CAAC,CAAC;AACnE,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,IAAI,GAAG,SAAS,GAAG,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;AAE9E,MAAM,WAAW,mBAAoB,SAAQ,cAAc;IACzD,OAAO,EAAE,OAAO,CAAC;IACjB;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;;OAKG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC;;;OAGG;IACH,SAAS,CAAC,EAAE,iBAAiB,CAAC;IAC9B;;SAEK;IACL,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B"}

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

@@ -2,6 +2,7 @@ import * as React from 'react';
 export interface ActionSheetItemProps extends React.HTMLAttributes<HTMLElement>, React.AnchorHTMLAttributes<HTMLElement>, Pick<React.InputHTMLAttributes<HTMLInputElement>, 'name' | 'checked' | 'value'> {
     mode?: 'default' | 'destructive' | 'cancel';
     before?: React.ReactNode;
+    after?: React.ReactNode;
     meta?: React.ReactNode;
     subtitle?: React.ReactNode;
     autoClose?: boolean;
@@ -31,5 +32,5 @@ export interface ActionSheetItemProps extends React.HTMLAttributes<HTMLElement>,
 /**
  * @see https://vkcom.github.io/VKUI/#/ActionSheetItem
  */
-declare const ActionSheetItem: ({ children, autoClose, mode, meta, subtitle, before, selectable, value, name, checked, defaultChecked, onChange, onClick, onImmediateClick, multiline, iconChecked: iconCheckedProp, className, isCancelItem, ...restProps }: ActionSheetItemProps) => React.JSX.Element;
-export { ActionSheetItem };
+export declare const ActionSheetItem: ({ children, autoClose, mode, meta, subtitle, before, after, selectable, value, name, checked, defaultChecked, onChange, onClick, onImmediateClick, multiline, iconChecked, className, isCancelItem, ...restProps }: ActionSheetItemProps) => React.JSX.Element;
+//# sourceMappingURL=ActionSheetItem.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ActionSheetItem.d.ts","sourceRoot":"","sources":["../../../../src/components/ActionSheetItem/ActionSheetItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAc/B,MAAM,WAAW,oBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EACvC,KAAK,CAAC,oBAAoB,CAAC,WAAW,CAAC,EACvC,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;IACjF,IAAI,CAAC,EAAE,SAAS,GAAG,aAAa,GAAG,QAAQ,CAAC;IAC5C,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;IAC/C,gBAAgB,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;IACxD;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED;;GAEG;AACH,eAAO,MAAM,eAAe,uNAqBzB,oBAAoB,sBA+FtB,CAAC"}

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

@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { Icon20CheckCircleOn, Icon24CheckCircleOn } from '@vkontakte/icons';
 import { classNames, noop } from '@vkontakte/vkjs';
 import { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';
 import { usePlatform } from '../../hooks/usePlatform';
@@ -10,14 +9,14 @@ import { Tappable } from '../Tappable/Tappable';
 import { Subhead } from '../Typography/Subhead/Subhead';
 import { Text } from '../Typography/Text/Text';
 import { Title } from '../Typography/Title/Title';
+import { Radio } from './subcomponents/Radio/Radio';
 import styles from './ActionSheetItem.module.css';
 /**
  * @see https://vkcom.github.io/VKUI/#/ActionSheetItem
- */ const ActionSheetItem = ({ children, autoClose, mode = 'default', meta, subtitle, before, selectable, value, name, checked, defaultChecked, onChange, onClick, onImmediateClick, multiline = false, iconChecked: iconCheckedProp, className, isCancelItem, ...restProps })=>{
+ */ export const ActionSheetItem = ({ children, autoClose, mode = 'default', meta, subtitle, before, after, selectable, value, name, checked, defaultChecked, onChange, onClick, onImmediateClick, multiline = false, iconChecked, className, isCancelItem, ...restProps })=>{
     const platform = usePlatform();
-    const { onItemClick = ()=>noop, isDesktop } = React.useContext(ActionSheetContext);
+    const { onItemClick = ()=>noop, mode: actionSheetMode } = React.useContext(ActionSheetContext);
     const { sizeY } = useAdaptivityWithJSMediaQueries();
-    const iconChecked = iconCheckedProp || (sizeY === SizeType.COMPACT ? /*#__PURE__*/ React.createElement(Icon20CheckCircleOn, null) : /*#__PURE__*/ React.createElement(Icon24CheckCircleOn, null));
     let Component = restProps.href ? 'a' : 'div';
     if (selectable) {
         Component = 'label';
@@ -34,7 +33,7 @@ import styles from './ActionSheetItem.module.css';
             isCancelItem: Boolean(isCancelItem)
         }),
         activeMode: platform === Platform.IOS ? styles['ActionSheetItem--active'] : undefined,
-        className: classNames(styles['ActionSheetItem'], platform === Platform.IOS && styles['ActionSheetItem--ios'], mode === 'cancel' && styles['ActionSheetItem--mode-cancel'], mode === 'destructive' && styles['ActionSheetItem--mode-destructive'], sizeY === SizeType.COMPACT && styles['ActionSheetItem--sizeY-compact'], isRich && styles['ActionSheetItem--rich'], isDesktop && styles['ActionSheetItem--desktop'], selectable && styles['ActionSheetItem--selectable'], className)
+        className: classNames(styles['ActionSheetItem'], platform === Platform.IOS && styles['ActionSheetItem--ios'], mode === 'cancel' && styles['ActionSheetItem--mode-cancel'], mode === 'destructive' && styles['ActionSheetItem--mode-destructive'], sizeY === SizeType.COMPACT && styles['ActionSheetItem--sizeY-compact'], isRich && styles['ActionSheetItem--rich'], actionSheetMode === 'menu' && styles['ActionSheetItem--menu'], selectable && styles['ActionSheetItem--selectable'], className)
     }, before && /*#__PURE__*/ React.createElement("div", {
         className: styles['ActionSheetItem__before']
     }, before), /*#__PURE__*/ React.createElement("div", {
@@ -51,11 +50,9 @@ import styles from './ActionSheetItem.module.css';
         className: styles['ActionSheetItem__meta']
     }, meta)), subtitle && /*#__PURE__*/ React.createElement(Subhead, {
         className: styles['ActionSheetItem__subtitle']
-    }, subtitle)), selectable && /*#__PURE__*/ React.createElement("div", {
+    }, subtitle)), (selectable || after) && /*#__PURE__*/ React.createElement("div", {
         className: styles['ActionSheetItem__after']
-    }, /*#__PURE__*/ React.createElement("input", {
-        type: "radio",
-        className: styles['ActionSheetItem__radio'],
+    }, after, selectable && /*#__PURE__*/ React.createElement(Radio, {
         name: name,
         value: value,
         onChange: onChange,
@@ -68,10 +65,7 @@ import styles from './ActionSheetItem.module.css';
         defaultChecked: defaultChecked,
         checked: checked,
         disabled: restProps.disabled
-    }), /*#__PURE__*/ React.createElement("div", {
-        className: styles['ActionSheetItem__marker']
     }, iconChecked)));
 };
-export { ActionSheetItem };
 
 //# sourceMappingURL=ActionSheetItem.js.map

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 { Icon20CheckCircleOn, Icon24CheckCircleOn } from '@vkontakte/icons';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\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 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  meta?: React.ReactNode;\n  subtitle?: React.ReactNode;\n  autoClose?: boolean;\n  selectable?: boolean;\n  disabled?: boolean;\n  /**\n   * Все текстовые элементы при необходимости занимают несколько строк\n   */\n  multiline?: boolean;\n  /**\n   * Если autoClose === true, 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 */\nconst ActionSheetItem = ({\n  children,\n  autoClose,\n  mode = 'default',\n  meta,\n  subtitle,\n  before,\n  selectable,\n  value,\n  name,\n  checked,\n  defaultChecked,\n  onChange,\n  onClick,\n  onImmediateClick,\n  multiline = false,\n  iconChecked: iconCheckedProp,\n  className,\n  isCancelItem,\n  ...restProps\n}: ActionSheetItemProps) => {\n  const platform = usePlatform();\n  const { onItemClick = () => noop, isDesktop } =\n    React.useContext<ActionSheetContextType<HTMLElement>>(ActionSheetContext);\n  const { sizeY } = useAdaptivityWithJSMediaQueries();\n\n  const iconChecked =\n    iconCheckedProp ||\n    (sizeY === SizeType.COMPACT ? <Icon20CheckCircleOn /> : <Icon24CheckCircleOn />);\n\n  let Component: React.ElementType = restProps.href ? 'a' : 'div';\n\n  if (selectable) {\n    Component = 'label';\n  }\n\n  const isRich = subtitle || meta || selectable;\n  const isCentered = !isRich && !before && platform === 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: Boolean(autoClose),\n              isCancelItem: Boolean(isCancelItem),\n            })\n      }\n      activeMode={platform === Platform.IOS ? styles['ActionSheetItem--active'] : undefined}\n      className={classNames(\n        styles['ActionSheetItem'],\n        platform === Platform.IOS && styles['ActionSheetItem--ios'],\n        mode === 'cancel' && styles['ActionSheetItem--mode-cancel'],\n        mode === 'destructive' && styles['ActionSheetItem--mode-destructive'],\n        sizeY === SizeType.COMPACT && styles['ActionSheetItem--sizeY-compact'],\n        isRich && styles['ActionSheetItem--rich'],\n        isDesktop && styles['ActionSheetItem--desktop'],\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 === 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 && (\n        <div className={styles['ActionSheetItem__after']}>\n          <input\n            type=\"radio\"\n            className={styles['ActionSheetItem__radio']}\n            name={name}\n            value={value}\n            onChange={onChange}\n            onClick={onItemClick({\n              action: noop,\n              immediateAction: noop,\n              autoClose: Boolean(autoClose),\n              isCancelItem: Boolean(isCancelItem),\n            })}\n            defaultChecked={defaultChecked}\n            checked={checked}\n            disabled={restProps.disabled}\n          />\n          <div className={styles['ActionSheetItem__marker']}>{iconChecked}</div>\n        </div>\n      )}\n    </Tappable>\n  );\n};\n\nexport { ActionSheetItem };\n"],"names":["React","Icon20CheckCircleOn","Icon24CheckCircleOn","classNames","noop","useAdaptivityWithJSMediaQueries","usePlatform","SizeType","Platform","ActionSheetContext","Tappable","Subhead","Text","Title","styles","ActionSheetItem","children","autoClose","mode","meta","subtitle","before","selectable","value","name","checked","defaultChecked","onChange","onClick","onImmediateClick","multiline","iconChecked","iconCheckedProp","className","isCancelItem","restProps","platform","onItemClick","isDesktop","useContext","sizeY","COMPACT","Component","href","isRich","isCentered","IOS","action","immediateAction","Boolean","activeMode","undefined","div","weight","level","input","type","disabled"],"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 { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\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  autoClose?: boolean;\n  selectable?: boolean;\n  disabled?: boolean;\n  /**\n   * Все текстовые элементы при необходимости занимают несколько строк\n   */\n  multiline?: boolean;\n  /**\n   * Если autoClose === true, 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  autoClose,\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  let Component: React.ElementType = restProps.href ? 'a' : 'div';\n\n  if (selectable) {\n    Component = 'label';\n  }\n\n  const isRich = subtitle || meta || selectable;\n  const isCentered = !isRich && !before && platform === 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: Boolean(autoClose),\n              isCancelItem: Boolean(isCancelItem),\n            })\n      }\n      activeMode={platform === Platform.IOS ? styles['ActionSheetItem--active'] : undefined}\n      className={classNames(\n        styles['ActionSheetItem'],\n        platform === Platform.IOS && styles['ActionSheetItem--ios'],\n        mode === 'cancel' && styles['ActionSheetItem--mode-cancel'],\n        mode === 'destructive' && styles['ActionSheetItem--mode-destructive'],\n        sizeY === SizeType.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 === 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: Boolean(autoClose),\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","SizeType","Platform","ActionSheetContext","Tappable","Subhead","Text","Title","Radio","styles","ActionSheetItem","children","autoClose","mode","meta","subtitle","before","after","selectable","value","name","checked","defaultChecked","onChange","onClick","onImmediateClick","multiline","iconChecked","className","isCancelItem","restProps","platform","onItemClick","actionSheetMode","useContext","sizeY","Component","href","isRich","isCentered","IOS","action","immediateAction","Boolean","activeMode","undefined","COMPACT","div","weight","level","disabled"],"mappings":"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"}

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

@@ -67,7 +67,7 @@
   margin-right: 16px;
 }
 
-.ActionSheetItem--desktop .ActionSheetItem__before {
+.ActionSheetItem--menu .ActionSheetItem__before {
   margin-right: 12px;
 }
 
@@ -84,21 +84,17 @@
   color: var(--vkui--color_icon_negative);
 }
 
-.ActionSheetItem__radio {
-  display: none;
-}
-
-.ActionSheetItem__marker {
-  display: none;
-  align-items: center;
-  justify-content: center;
-  background-color: transparent;
-  color: var(--vkui--color_icon_accent);
+.ActionSheetItem__after {
+  display: flex;
+  flex-direction: row;
   margin-left: 16px;
+  color: var(--vkui--color_icon_accent);
 }
 
-.ActionSheetItem__radio:checked ~ .ActionSheetItem__marker {
-  display: flex;
+/* stylelint-disable-next-line selector-max-universal -- gap 12px */
+
+.ActionSheetItem__after > *:not(:last-child) {
+  margin-right: 12px;
 }
 
 /**
@@ -187,7 +183,7 @@
  * Desktop
  */
 
-.ActionSheetItem--desktop {
+.ActionSheetItem--menu {
   width: auto;
   cursor: pointer;
 }

package/dist/cssm/components/ActionSheetItem/subcomponents/Radio/Radio.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { HasRef, HasRootRef } from '../../../../types';
+interface ActionSheetItemCheckedProps extends React.InputHTMLAttributes<HTMLInputElement>, HasRootRef<HTMLDivElement>, HasRef<HTMLInputElement> {
+    /**
+     * Иконка для `checked` режима.
+     */
+    children?: React.ReactNode;
+}
+export declare const Radio: ({ children, getRootRef, getRef, className, style, ...restProps }: ActionSheetItemCheckedProps) => React.JSX.Element;
+export {};
+//# sourceMappingURL=Radio.d.ts.map

package/dist/cssm/components/ActionSheetItem/subcomponents/Radio/Radio.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ActionSheetItem/subcomponents/Radio/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAUvD,UAAU,2BACR,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EACjD,UAAU,CAAC,cAAc,CAAC,EAC1B,MAAM,CAAC,gBAAgB,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,KAAK,qEAOf,2BAA2B,sBAa7B,CAAC"}

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

@@ -0,0 +1,25 @@
+import * as React from 'react';
+import { Icon20CheckCircleOn, Icon24CheckCircleOn } from '@vkontakte/icons';
+import { AdaptiveIconRenderer } from '../../../AdaptiveIconRenderer/AdaptiveIconRenderer';
+import { RootComponent } from '../../../RootComponent/RootComponent';
+import { VisuallyHidden } from '../../../VisuallyHidden/VisuallyHidden';
+import styles from './Radio.module.css';
+const adaptiveIcon = /*#__PURE__*/ React.createElement(AdaptiveIconRenderer, {
+    IconCompact: Icon20CheckCircleOn,
+    IconRegular: Icon24CheckCircleOn
+});
+export const Radio = ({ children = adaptiveIcon, getRootRef, getRef, className, style, ...restProps })=>{
+    return /*#__PURE__*/ React.createElement(RootComponent, {
+        getRootRef: getRootRef,
+        className: className,
+        style: style
+    }, /*#__PURE__*/ React.createElement(VisuallyHidden, {
+        Component: "input",
+        getRootRef: getRef,
+        type: "radio",
+        className: styles['ActionSheetItemRadio__input'],
+        ...restProps
+    }), children);
+};
+
+//# sourceMappingURL=Radio.js.map