@vkontakte/vkui 5.2.4 → 5.3.1

package/dist/cssm/components/Link/Link.js

@@ -1,25 +1,18 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["hasVisited", "children", "className"];
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
 import { Tappable } from '../Tappable/Tappable';
-import "./Link.module.css";
+import styles from './Link.module.css';
 /**
  * @see https://vkcom.github.io/VKUI/#/Link
- */
-export var Link = function Link(_ref) {
-  var hasVisited = _ref.hasVisited,
-    children = _ref.children,
-    className = _ref.className,
-    restProps = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(Tappable, _extends({
-    Component: restProps.href ? 'a' : 'button'
-  }, restProps, {
-    className: classNames("vkuiLink", hasVisited && "vkuiLink--has-visited", className),
-    hasHover: false,
-    activeMode: "opacity",
-    focusVisibleMode: "vkuiLink--focus-visible"
-  }), children);
+ */ export const Link = ({ hasVisited , children , className , ...restProps })=>{
+    return /*#__PURE__*/ React.createElement(Tappable, {
+        Component: restProps.href ? 'a' : 'button',
+        ...restProps,
+        className: classNames(styles['Link'], hasVisited && styles['Link--has-visited'], className),
+        hasHover: false,
+        activeMode: "opacity",
+        focusVisibleMode: styles['Link--focus-visible']
+    }, children);
 };
+
 //# sourceMappingURL=Link.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Link.js","names":["React","classNames","Tappable","Link","hasVisited","children","className","restProps","href"],"sources":["../../../../src/components/Link/Link.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport styles from './Link.module.css';\n\nexport interface LinkProps extends TappableProps {\n  /**\n   * Включает состояние `visited`, которое позволяет пользователю понять посещал ли он ссылку или нет\n   */\n  hasVisited?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Link\n */\nexport const Link = ({ hasVisited, children, className, ...restProps }: LinkProps) => {\n  return (\n    <Tappable\n      Component={restProps.href ? 'a' : 'button'}\n      {...restProps}\n      className={classNames(styles['Link'], hasVisited && styles['Link--has-visited'], className)}\n      hasHover={false}\n      activeMode=\"opacity\"\n      focusVisibleMode={styles['Link--focus-visible']}\n    >\n      {children}\n    </Tappable>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,QAAQ,QAAuB,sBAAsB;AAAC;AAU/D;AACA;AACA;AACA,OAAO,IAAMC,IAAI,GAAG,SAAPA,IAAI,OAAqE;EAAA,IAA/DC,UAAU,QAAVA,UAAU;IAAEC,QAAQ,QAARA,QAAQ;IAAEC,SAAS,QAATA,SAAS;IAAKC,SAAS;EAClE,oBACE,oBAAC,QAAQ;IACP,SAAS,EAAEA,SAAS,CAACC,IAAI,GAAG,GAAG,GAAG;EAAS,GACvCD,SAAS;IACb,SAAS,EAAEN,UAAU,aAAiBG,UAAU,2BAA+B,EAAEE,SAAS,CAAE;IAC5F,QAAQ,EAAE,KAAM;IAChB,UAAU,EAAC,SAAS;IACpB,gBAAgB;EAAgC,IAE/CD,QAAQ,CACA;AAEf,CAAC"}
+{"version":3,"sources":["../../../../src/components/Link/Link.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport styles from './Link.module.css';\n\nexport interface LinkProps extends TappableProps {\n  /**\n   * Включает состояние `visited`, которое позволяет пользователю понять посещал ли он ссылку или нет\n   */\n  hasVisited?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Link\n */\nexport const Link = ({ hasVisited, children, className, ...restProps }: LinkProps) => {\n  return (\n    <Tappable\n      Component={restProps.href ? 'a' : 'button'}\n      {...restProps}\n      className={classNames(styles['Link'], hasVisited && styles['Link--has-visited'], className)}\n      hasHover={false}\n      activeMode=\"opacity\"\n      focusVisibleMode={styles['Link--focus-visible']}\n    >\n      {children}\n    </Tappable>\n  );\n};\n"],"names":["React","classNames","Tappable","styles","Link","hasVisited","children","className","restProps","Component","href","hasHover","activeMode","focusVisibleMode"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,QAAQ,QAAuB,uBAAuB;AAC/D,OAAOC,YAAY,oBAAoB;AASvC;;CAEC,GACD,OAAO,MAAMC,OAAO,CAAC,EAAEC,WAAU,EAAEC,SAAQ,EAAEC,UAAS,EAAE,GAAGC,WAAsB,GAAK;IACpF,qBACE,oBAACN;QACCO,WAAWD,UAAUE,IAAI,GAAG,MAAM,QAAQ;QACzC,GAAGF,SAAS;QACbD,WAAWN,WAAWE,MAAM,CAAC,OAAO,EAAEE,cAAcF,MAAM,CAAC,oBAAoB,EAAEI;QACjFI,UAAU,KAAK;QACfC,YAAW;QACXC,kBAAkBV,MAAM,CAAC,sBAAsB;OAE9CG;AAGP,EAAE"}

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

@@ -1,5 +1,5 @@
 import * as React from 'react';
-export declare type ListProps = React.HTMLAttributes<HTMLDivElement>;
+export type ListProps = React.HTMLAttributes<HTMLDivElement>;
 /**
  * @see https://vkcom.github.io/VKUI/#/List
  */

package/dist/cssm/components/List/List.js

@@ -1,32 +1,20 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["children", "className"];
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
 import { ListContext } from './ListContext';
-import "./List.module.css";
+import styles from './List.module.css';
 /**
  * @see https://vkcom.github.io/VKUI/#/List
- */
-export var List = function List(_ref) {
-  var children = _ref.children,
-    className = _ref.className,
-    restProps = _objectWithoutProperties(_ref, _excluded);
-  var _React$useState = React.useState(false),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    isDragging = _React$useState2[0],
-    toggleDrag = _React$useState2[1];
-  return /*#__PURE__*/React.createElement("div", _extends({
-    role: "list"
-  }, restProps, {
-    className: classNames("vkuiList", isDragging && "vkuiList--dragging", className)
-  }), /*#__PURE__*/React.createElement(ListContext.Provider, {
-    value: React.useMemo(function () {
-      return {
-        toggleDrag: toggleDrag
-      };
-    }, [])
-  }, children));
+ */ export const List = ({ children , className , ...restProps })=>{
+    const [isDragging, toggleDrag] = React.useState(false);
+    return /*#__PURE__*/ React.createElement("div", {
+        role: "list",
+        ...restProps,
+        className: classNames(styles['List'], isDragging && 'vkuiInternalList--dragging', className)
+    }, /*#__PURE__*/ React.createElement(ListContext.Provider, {
+        value: React.useMemo(()=>({
+                toggleDrag
+            }), [])
+    }, children));
 };
+
 //# sourceMappingURL=List.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"List.js","names":["React","classNames","ListContext","List","children","className","restProps","useState","isDragging","toggleDrag","useMemo"],"sources":["../../../../src/components/List/List.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ListContext } from './ListContext';\nimport styles from './List.module.css';\n\nexport type ListProps = React.HTMLAttributes<HTMLDivElement>;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/List\n */\nexport const List = ({ children, className, ...restProps }: ListProps) => {\n  const [isDragging, toggleDrag] = React.useState(false);\n\n  return (\n    <div\n      role=\"list\"\n      {...restProps}\n      className={classNames(styles['List'], isDragging && styles['List--dragging'], className)}\n    >\n      <ListContext.Provider value={React.useMemo(() => ({ toggleDrag }), [])}>\n        {children}\n      </ListContext.Provider>\n    </div>\n  );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,WAAW,QAAQ,eAAe;AAAC;AAK5C;AACA;AACA;AACA,OAAO,IAAMC,IAAI,GAAG,SAAPA,IAAI,OAAyD;EAAA,IAAnDC,QAAQ,QAARA,QAAQ;IAAEC,SAAS,QAATA,SAAS;IAAKC,SAAS;EACtD,sBAAiCN,KAAK,CAACO,QAAQ,CAAC,KAAK,CAAC;IAAA;IAA/CC,UAAU;IAAEC,UAAU;EAE7B,oBACE;IACE,IAAI,EAAC;EAAM,GACPH,SAAS;IACb,SAAS,EAAEL,UAAU,aAAiBO,UAAU,wBAA4B,EAAEH,SAAS;EAAE,iBAEzF,oBAAC,WAAW,CAAC,QAAQ;IAAC,KAAK,EAAEL,KAAK,CAACU,OAAO,CAAC;MAAA,OAAO;QAAED,UAAU,EAAVA;MAAW,CAAC;IAAA,CAAC,EAAE,EAAE;EAAE,GACpEL,QAAQ,CACY,CACnB;AAEV,CAAC"}
+{"version":3,"sources":["../../../../src/components/List/List.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ListContext } from './ListContext';\nimport styles from './List.module.css';\n\nexport type ListProps = React.HTMLAttributes<HTMLDivElement>;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/List\n */\nexport const List = ({ children, className, ...restProps }: ListProps) => {\n  const [isDragging, toggleDrag] = React.useState(false);\n\n  return (\n    <div\n      role=\"list\"\n      {...restProps}\n      className={classNames(styles['List'], isDragging && 'vkuiInternalList--dragging', className)}\n    >\n      <ListContext.Provider value={React.useMemo(() => ({ toggleDrag }), [])}>\n        {children}\n      </ListContext.Provider>\n    </div>\n  );\n};\n"],"names":["React","classNames","ListContext","styles","List","children","className","restProps","isDragging","toggleDrag","useState","div","role","Provider","value","useMemo"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,gBAAgB;AAC5C,OAAOC,YAAY,oBAAoB;AAIvC;;CAEC,GACD,OAAO,MAAMC,OAAO,CAAC,EAAEC,SAAQ,EAAEC,UAAS,EAAE,GAAGC,WAAsB,GAAK;IACxE,MAAM,CAACC,YAAYC,WAAW,GAAGT,MAAMU,QAAQ,CAAC,KAAK;IAErD,qBACE,oBAACC;QACCC,MAAK;QACJ,GAAGL,SAAS;QACbD,WAAWL,WAAWE,MAAM,CAAC,OAAO,EAAEK,cAAc,8BAA8BF;qBAElF,oBAACJ,YAAYW,QAAQ;QAACC,OAAOd,MAAMe,OAAO,CAAC,IAAO,CAAA;gBAAEN;YAAW,CAAA,GAAI,EAAE;OAClEJ;AAIT,EAAE"}

package/dist/cssm/components/List/ListContext.js

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { noop } from '@vkontakte/vkjs';
-export var ListContext = /*#__PURE__*/React.createContext({
-  toggleDrag: noop
+export const ListContext = React.createContext({
+    toggleDrag: noop
 });
+
 //# sourceMappingURL=ListContext.js.map

package/dist/cssm/components/List/ListContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListContext.js","names":["React","noop","ListContext","createContext","toggleDrag"],"sources":["../../../../src/components/List/ListContext.ts"],"sourcesContent":["import * as React from 'react';\nimport { noop } from '@vkontakte/vkjs';\n\nexport const ListContext = React.createContext({\n  toggleDrag: noop as (value: boolean) => void,\n});\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,IAAI,QAAQ,iBAAiB;AAEtC,OAAO,IAAMC,WAAW,gBAAGF,KAAK,CAACG,aAAa,CAAC;EAC7CC,UAAU,EAAEH;AACd,CAAC,CAAC"}
+{"version":3,"sources":["../../../../src/components/List/ListContext.ts"],"sourcesContent":["import * as React from 'react';\nimport { noop } from '@vkontakte/vkjs';\n\nexport const ListContext = React.createContext({\n  toggleDrag: noop as (value: boolean) => void,\n});\n"],"names":["React","noop","ListContext","createContext","toggleDrag"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,IAAI,QAAQ,kBAAkB;AAEvC,OAAO,MAAMC,cAAcF,MAAMG,aAAa,CAAC;IAC7CC,YAAYH;AACd,GAAG"}

package/dist/cssm/components/LocaleProvider/LocaleProvider.js

@@ -6,12 +6,10 @@ import { ConfigProviderOverride } from '../ConfigProvider/ConfigProviderOverride
  *
  * @version 5.0.0
  * @see https://vkcom.github.io/VKUI/#/LocaleProvider
- */
-export function LocaleProvider(_ref) {
-  var value = _ref.value,
-    children = _ref.children;
-  return /*#__PURE__*/React.createElement(ConfigProviderOverride, {
-    locale: value
-  }, children);
+ */ export function LocaleProvider({ value , children  }) {
+    return /*#__PURE__*/ React.createElement(ConfigProviderOverride, {
+        locale: value
+    }, children);
 }
+
 //# sourceMappingURL=LocaleProvider.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"LocaleProvider.js","names":["React","ConfigProviderOverride","LocaleProvider","value","children"],"sources":["../../../../src/components/LocaleProvider/LocaleProvider.tsx"],"sourcesContent":["import React from 'react';\nimport { ConfigProviderContextInterface } from '../ConfigProvider/ConfigProviderContext';\nimport { ConfigProviderOverride } from '../ConfigProvider/ConfigProviderOverride';\n\nexport interface LocaleProviderProps {\n  /**\n   * Строка с языковой меткой BCP 47\n   */\n  value: ConfigProviderContextInterface['locale'];\n  children: React.ReactNode;\n}\n\n/**\n * Компонент, прокидывающий локаль. Список можно найти в\n * [реестре языковых подмёток IANA](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)\n *\n * @version 5.0.0\n * @see https://vkcom.github.io/VKUI/#/LocaleProvider\n */\nexport function LocaleProvider({ value, children }: LocaleProviderProps) {\n  return <ConfigProviderOverride locale={value}>{children}</ConfigProviderOverride>;\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,sBAAsB,QAAQ,0CAA0C;AAUjF;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,cAAc,OAA2C;EAAA,IAAxCC,KAAK,QAALA,KAAK;IAAEC,QAAQ,QAARA,QAAQ;EAC9C,oBAAO,oBAAC,sBAAsB;IAAC,MAAM,EAAED;EAAM,GAAEC,QAAQ,CAA0B;AACnF"}
+{"version":3,"sources":["../../../../src/components/LocaleProvider/LocaleProvider.tsx"],"sourcesContent":["import React from 'react';\nimport { ConfigProviderContextInterface } from '../ConfigProvider/ConfigProviderContext';\nimport { ConfigProviderOverride } from '../ConfigProvider/ConfigProviderOverride';\n\nexport interface LocaleProviderProps {\n  /**\n   * Строка с языковой меткой BCP 47\n   */\n  value: ConfigProviderContextInterface['locale'];\n  children: React.ReactNode;\n}\n\n/**\n * Компонент, прокидывающий локаль. Список можно найти в\n * [реестре языковых подмёток IANA](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)\n *\n * @version 5.0.0\n * @see https://vkcom.github.io/VKUI/#/LocaleProvider\n */\nexport function LocaleProvider({ value, children }: LocaleProviderProps) {\n  return <ConfigProviderOverride locale={value}>{children}</ConfigProviderOverride>;\n}\n"],"names":["React","ConfigProviderOverride","LocaleProvider","value","children","locale"],"mappings":"AAAA,OAAOA,WAAW,QAAQ;AAE1B,SAASC,sBAAsB,QAAQ,2CAA2C;AAUlF;;;;;;CAMC,GACD,OAAO,SAASC,eAAe,EAAEC,MAAK,EAAEC,SAAQ,EAAuB,EAAE;IACvE,qBAAO,oBAACH;QAAuBI,QAAQF;OAAQC;AACjD,CAAC"}

package/dist/cssm/components/MiniInfoCell/MiniInfoCell.js

@@ -1,53 +1,40 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["before", "after", "children", "mode", "textWrap", "expandable", "className"];
 import * as React from 'react';
 import { Icon16Chevron } from '@vkontakte/icons';
 import { classNames, hasReactNode } from '@vkontakte/vkjs';
 import { Tappable } from '../Tappable/Tappable';
 import { Paragraph } from '../Typography/Paragraph/Paragraph';
-import "./MiniInfoCell.module.css";
+import styles from './MiniInfoCell.module.css';
 /**
  * @see https://vkcom.github.io/VKUI/#/MiniInfoCell
- */
-export var MiniInfoCell = function MiniInfoCell(_ref) {
-  var before = _ref.before,
-    after = _ref.after,
-    children = _ref.children,
-    _ref$mode = _ref.mode,
-    mode = _ref$mode === void 0 ? 'base' : _ref$mode,
-    _ref$textWrap = _ref.textWrap,
-    textWrap = _ref$textWrap === void 0 ? 'nowrap' : _ref$textWrap,
-    _ref$expandable = _ref.expandable,
-    expandable = _ref$expandable === void 0 ? false : _ref$expandable,
-    className = _ref.className,
-    restProps = _objectWithoutProperties(_ref, _excluded);
-  var cellClasses = classNames("vkuiMiniInfoCell", styles["MiniInfoCell--textWrap-".concat(textWrap)], mode !== 'base' && styles["MiniInfoCell--mode-".concat(mode)], className);
-  var cellContent = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
-    className: "vkuiMiniInfoCell__before"
-  }, before), /*#__PURE__*/React.createElement("div", {
-    className: "vkuiMiniInfoCell__middle"
-  }, /*#__PURE__*/React.createElement(Paragraph, {
-    className: "vkuiMiniInfoCell__content",
-    weight: mode === 'more' ? '2' : undefined
-  }, children), expandable && /*#__PURE__*/React.createElement(Icon16Chevron, null)), hasReactNode(after) && /*#__PURE__*/React.createElement("span", {
-    className: "vkuiMiniInfoCell__after"
-  }, after));
-  return restProps.onClick ? /*#__PURE__*/React.createElement(Tappable, _extends({
-    Component: "div",
-    role: "button"
-  }, restProps, {
-    className: cellClasses
-  }), cellContent) : /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
-    className: cellClasses
-  }), cellContent);
-};
-var styles = {
-  "MiniInfoCell--textWrap-short": "vkuiMiniInfoCell--textWrap-short",
-  "MiniInfoCell--textWrap-full": "vkuiMiniInfoCell--textWrap-full",
-  "MiniInfoCell--textWrap-nowrap": "vkuiMiniInfoCell--textWrap-nowrap",
-  "MiniInfoCell--mode-accent": "vkuiMiniInfoCell--mode-accent",
-  "MiniInfoCell--mode-add": "vkuiMiniInfoCell--mode-add",
-  "MiniInfoCell--mode-more": "vkuiMiniInfoCell--mode-more"
+ */ export const MiniInfoCell = ({ before , after , children , mode ='base' , textWrap ='nowrap' , expandable =false , className , ...restProps })=>{
+    const cellClasses = classNames(styles['MiniInfoCell'], {
+        nowrap: styles['MiniInfoCell--textWrap-nowrap'],
+        full: styles['MiniInfoCell--textWrap-full'],
+        short: styles['MiniInfoCell--textWrap-short']
+    }[textWrap], mode !== 'base' && ({
+        add: styles['MiniInfoCell--mode-add'],
+        accent: styles['MiniInfoCell--mode-accent'],
+        more: styles['MiniInfoCell--mode-more']
+    })[mode], className);
+    const cellContent = /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("span", {
+        className: styles['MiniInfoCell__before']
+    }, before), /*#__PURE__*/ React.createElement("div", {
+        className: styles['MiniInfoCell__middle']
+    }, /*#__PURE__*/ React.createElement(Paragraph, {
+        className: styles['MiniInfoCell__content'],
+        weight: mode === 'more' ? '2' : undefined
+    }, children), expandable && /*#__PURE__*/ React.createElement(Icon16Chevron, null)), hasReactNode(after) && /*#__PURE__*/ React.createElement("span", {
+        className: styles['MiniInfoCell__after']
+    }, after));
+    return restProps.onClick ? /*#__PURE__*/ React.createElement(Tappable, {
+        Component: "div",
+        role: "button",
+        ...restProps,
+        className: cellClasses
+    }, cellContent) : /*#__PURE__*/ React.createElement("div", {
+        ...restProps,
+        className: cellClasses
+    }, cellContent);
 };
+
 //# sourceMappingURL=MiniInfoCell.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"MiniInfoCell.js","names":["React","Icon16Chevron","classNames","hasReactNode","Tappable","Paragraph","MiniInfoCell","before","after","children","mode","textWrap","expandable","className","restProps","cellClasses","styles","cellContent","undefined","onClick"],"sources":["../../../../src/components/MiniInfoCell/MiniInfoCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Chevron } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Paragraph } from '../Typography/Paragraph/Paragraph';\nimport styles from './MiniInfoCell.module.css';\n\nexport interface MiniInfoCellProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Иконка слева.<br />\n   * Рекомендуется использовать иконки размера 20.\n   */\n  before: React.ReactNode;\n\n  /**\n   * Содержимое справа.<br />\n   * `<UsersStack size=\"s\" />` или `<Avatar size={24} />`\n   */\n  after?: React.ReactNode;\n\n  /**\n   * Тип ячейки:\n   *\n   * - `base` – базовая ячейка с серой иконкой и серым текстом.<br />\n   * В компонент можно передать `Link`, чтобы визуально сделать часть текста ссылкой.\n   * - `add` – тип ячейки, который показывает, что взаимодействие с ней должно вызывать действие добавления чего-то.\n   * - `more` – взаимодействие с такой ячейкой должно открывать какую-то подробную информацию.\n   */\n  mode?: 'base' | 'accent' | 'add' | 'more';\n\n  /**\n   * Тип отображения текста:\n   *\n   * - `nowrap` – в одну строку, текст не переносится и обрезается.\n   * - `short` – максимально отображается 3 строки, остальное обрезается.\n   * - `full` – текст отображается полностью.\n   */\n  textWrap?: 'nowrap' | 'short' | 'full';\n\n  /**\n   * Передавать `true`, если предполагается переход при клике по ячейке.\n   */\n  expandable?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/MiniInfoCell\n */\nexport const MiniInfoCell = ({\n  before,\n  after,\n  children,\n  mode = 'base',\n  textWrap = 'nowrap',\n  expandable = false,\n  className,\n  ...restProps\n}: MiniInfoCellProps) => {\n  const cellClasses = classNames(\n    styles['MiniInfoCell'],\n    styles[`MiniInfoCell--textWrap-${textWrap}`],\n    mode !== 'base' && styles[`MiniInfoCell--mode-${mode}`],\n    className,\n  );\n\n  const cellContent = (\n    <React.Fragment>\n      <span className={styles['MiniInfoCell__before']}>{before}</span>\n      <div className={styles['MiniInfoCell__middle']}>\n        <Paragraph\n          className={styles['MiniInfoCell__content']}\n          weight={mode === 'more' ? '2' : undefined}\n        >\n          {children}\n        </Paragraph>\n        {expandable && <Icon16Chevron />}\n      </div>\n      {hasReactNode(after) && <span className={styles['MiniInfoCell__after']}>{after}</span>}\n    </React.Fragment>\n  );\n\n  return restProps.onClick ? (\n    <Tappable Component=\"div\" role=\"button\" {...restProps} className={cellClasses}>\n      {cellContent}\n    </Tappable>\n  ) : (\n    <div {...restProps} className={cellClasses}>\n      {cellContent}\n    </div>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,aAAa,QAAQ,kBAAkB;AAChD,SAASC,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SAASC,QAAQ,QAAQ,sBAAsB;AAC/C,SAASC,SAAS,QAAQ,mCAAmC;AAAC;AAyC9D;AACA;AACA;AACA,OAAO,IAAMC,YAAY,GAAG,SAAfA,YAAY,OASA;EAAA,IARvBC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,QAAQ,QAARA,QAAQ;IAAA,iBACRC,IAAI;IAAJA,IAAI,0BAAG,MAAM;IAAA,qBACbC,QAAQ;IAARA,QAAQ,8BAAG,QAAQ;IAAA,uBACnBC,UAAU;IAAVA,UAAU,gCAAG,KAAK;IAClBC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,WAAW,GAAGb,UAAU,qBAE5Bc,MAAM,kCAA2BL,QAAQ,EAAG,EAC5CD,IAAI,KAAK,MAAM,IAAIM,MAAM,8BAAuBN,IAAI,EAAG,EACvDG,SAAS,CACV;EAED,IAAMI,WAAW,gBACf,oBAAC,KAAK,CAAC,QAAQ,qBACb;IAAM,SAAS;EAAiC,GAAEV,MAAM,CAAQ,eAChE;IAAK,SAAS;EAAiC,gBAC7C,oBAAC,SAAS;IACR,SAAS,6BAAkC;IAC3C,MAAM,EAAEG,IAAI,KAAK,MAAM,GAAG,GAAG,GAAGQ;EAAU,GAEzCT,QAAQ,CACC,EACXG,UAAU,iBAAI,oBAAC,aAAa,OAAG,CAC5B,EACLT,YAAY,CAACK,KAAK,CAAC,iBAAI;IAAM,SAAS;EAAgC,GAAEA,KAAK,CAAQ,CAEzF;EAED,OAAOM,SAAS,CAACK,OAAO,gBACtB,oBAAC,QAAQ;IAAC,SAAS,EAAC,KAAK;IAAC,IAAI,EAAC;EAAQ,GAAKL,SAAS;IAAE,SAAS,EAAEC;EAAY,IAC3EE,WAAW,CACH,gBAEX,wCAASH,SAAS;IAAE,SAAS,EAAEC;EAAY,IACxCE,WAAW,CAEf;AACH,CAAC;AAAC;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA"}
+{"version":3,"sources":["../../../../src/components/MiniInfoCell/MiniInfoCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Chevron } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Paragraph } from '../Typography/Paragraph/Paragraph';\nimport styles from './MiniInfoCell.module.css';\n\nexport interface MiniInfoCellProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Иконка слева.<br />\n   * Рекомендуется использовать иконки размера 20.\n   */\n  before: React.ReactNode;\n\n  /**\n   * Содержимое справа.<br />\n   * `<UsersStack size=\"s\" />` или `<Avatar size={24} />`\n   */\n  after?: React.ReactNode;\n\n  /**\n   * Тип ячейки:\n   *\n   * - `base` – базовая ячейка с серой иконкой и серым текстом.<br />\n   * В компонент можно передать `Link`, чтобы визуально сделать часть текста ссылкой.\n   * - `add` – тип ячейки, который показывает, что взаимодействие с ней должно вызывать действие добавления чего-то.\n   * - `more` – взаимодействие с такой ячейкой должно открывать какую-то подробную информацию.\n   */\n  mode?: 'base' | 'accent' | 'add' | 'more';\n\n  /**\n   * Тип отображения текста:\n   *\n   * - `nowrap` – в одну строку, текст не переносится и обрезается.\n   * - `short` – максимально отображается 3 строки, остальное обрезается.\n   * - `full` – текст отображается полностью.\n   */\n  textWrap?: 'nowrap' | 'short' | 'full';\n\n  /**\n   * Передавать `true`, если предполагается переход при клике по ячейке.\n   */\n  expandable?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/MiniInfoCell\n */\nexport const MiniInfoCell = ({\n  before,\n  after,\n  children,\n  mode = 'base',\n  textWrap = 'nowrap',\n  expandable = false,\n  className,\n  ...restProps\n}: MiniInfoCellProps) => {\n  const cellClasses = classNames(\n    styles['MiniInfoCell'],\n    {\n      nowrap: styles['MiniInfoCell--textWrap-nowrap'],\n      full: styles['MiniInfoCell--textWrap-full'],\n      short: styles['MiniInfoCell--textWrap-short'],\n    }[textWrap],\n    mode !== 'base' &&\n      {\n        add: styles['MiniInfoCell--mode-add'],\n        accent: styles['MiniInfoCell--mode-accent'],\n        more: styles['MiniInfoCell--mode-more'],\n      }[mode],\n    className,\n  );\n\n  const cellContent = (\n    <React.Fragment>\n      <span className={styles['MiniInfoCell__before']}>{before}</span>\n      <div className={styles['MiniInfoCell__middle']}>\n        <Paragraph\n          className={styles['MiniInfoCell__content']}\n          weight={mode === 'more' ? '2' : undefined}\n        >\n          {children}\n        </Paragraph>\n        {expandable && <Icon16Chevron />}\n      </div>\n      {hasReactNode(after) && <span className={styles['MiniInfoCell__after']}>{after}</span>}\n    </React.Fragment>\n  );\n\n  return restProps.onClick ? (\n    <Tappable Component=\"div\" role=\"button\" {...restProps} className={cellClasses}>\n      {cellContent}\n    </Tappable>\n  ) : (\n    <div {...restProps} className={cellClasses}>\n      {cellContent}\n    </div>\n  );\n};\n"],"names":["React","Icon16Chevron","classNames","hasReactNode","Tappable","Paragraph","styles","MiniInfoCell","before","after","children","mode","textWrap","expandable","className","restProps","cellClasses","nowrap","full","short","add","accent","more","cellContent","Fragment","span","div","weight","undefined","onClick","Component","role"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,QAAQ,mBAAmB;AACjD,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,SAAS,QAAQ,oCAAoC;AAC9D,OAAOC,YAAY,4BAA4B;AAwC/C;;CAEC,GACD,OAAO,MAAMC,eAAe,CAAC,EAC3BC,OAAM,EACNC,MAAK,EACLC,SAAQ,EACRC,MAAO,OAAM,EACbC,UAAW,SAAQ,EACnBC,YAAa,KAAK,CAAA,EAClBC,UAAS,EACT,GAAGC,WACe,GAAK;IACvB,MAAMC,cAAcd,WAClBI,MAAM,CAAC,eAAe,EACtB;QACEW,QAAQX,MAAM,CAAC,gCAAgC;QAC/CY,MAAMZ,MAAM,CAAC,8BAA8B;QAC3Ca,OAAOb,MAAM,CAAC,+BAA+B;IAC/C,CAAC,CAACM,SAAS,EACXD,SAAS,UACP,CAAA;QACES,KAAKd,MAAM,CAAC,yBAAyB;QACrCe,QAAQf,MAAM,CAAC,4BAA4B;QAC3CgB,MAAMhB,MAAM,CAAC,0BAA0B;IACzC,CAAA,CAAC,CAACK,KAAK,EACTG;IAGF,MAAMS,4BACJ,oBAACvB,MAAMwB,QAAQ,sBACb,oBAACC;QAAKX,WAAWR,MAAM,CAAC,uBAAuB;OAAGE,uBAClD,oBAACkB;QAAIZ,WAAWR,MAAM,CAAC,uBAAuB;qBAC5C,oBAACD;QACCS,WAAWR,MAAM,CAAC,wBAAwB;QAC1CqB,QAAQhB,SAAS,SAAS,MAAMiB,SAAS;OAExClB,WAEFG,4BAAc,oBAACZ,uBAEjBE,aAAaM,wBAAU,oBAACgB;QAAKX,WAAWR,MAAM,CAAC,sBAAsB;OAAGG;IAI7E,OAAOM,UAAUc,OAAO,iBACtB,oBAACzB;QAAS0B,WAAU;QAAMC,MAAK;QAAU,GAAGhB,SAAS;QAAED,WAAWE;OAC/DO,6BAGH,oBAACG;QAAK,GAAGX,SAAS;QAAED,WAAWE;OAC5BO,YAEJ;AACH,EAAE"}

package/dist/cssm/components/ModalCard/ModalCard.js

@@ -1,6 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["icon", "header", "subheader", "children", "actions", "onClose", "nav", "id", "className", "size"];
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
 import { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';
@@ -10,50 +7,37 @@ import { warnOnce } from '../../lib/warnOnce';
 import { ModalCardBase } from '../ModalCardBase/ModalCardBase';
 import { ModalRootContext, useModalRegistry } from '../ModalRoot/ModalRootContext';
 import { ModalType } from '../ModalRoot/types';
-import "./ModalCard.module.css";
-var platformClassNames = {
-  ios: "vkuiModalCard--ios",
-  android: "vkuiModalCard--android",
-  vkcom: "vkuiModalCard--vkcom"
+import styles from './ModalCard.module.css';
+const platformClassNames = {
+    ios: styles['ModalCard--ios'],
+    android: styles['ModalCard--android'],
+    vkcom: styles['ModalCard--vkcom']
 };
-var warn = warnOnce('ModalCard');
-
+const warn = warnOnce('ModalCard');
 /**
  * @see https://vkcom.github.io/VKUI/#/ModalCard
- */
-export var ModalCard = function ModalCard(_ref) {
-  var icon = _ref.icon,
-    header = _ref.header,
-    subheader = _ref.subheader,
-    children = _ref.children,
-    actions = _ref.actions,
-    onClose = _ref.onClose,
-    nav = _ref.nav,
-    id = _ref.id,
-    className = _ref.className,
-    size = _ref.size,
-    restProps = _objectWithoutProperties(_ref, _excluded);
-  var _useAdaptivityWithJSM = useAdaptivityWithJSMediaQueries(),
-    isDesktop = _useAdaptivityWithJSM.isDesktop;
-  var platform = usePlatform();
-  var modalContext = React.useContext(ModalRootContext);
-  var _useModalRegistry = useModalRegistry(getNavId({
-      nav: nav,
-      id: id
-    }, warn), ModalType.CARD),
-    refs = _useModalRegistry.refs;
-  return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
-    id: id,
-    className: classNames("vkuiModalCard", platformClassNames.hasOwnProperty(platform) ? platformClassNames[platform] : platformClassNames.android, isDesktop && "vkuiModalCard--desktop", className)
-  }), /*#__PURE__*/React.createElement(ModalCardBase, {
-    className: "vkuiModalCard__in",
-    getRootRef: refs.innerElement,
-    icon: icon,
-    header: header,
-    subheader: subheader,
-    actions: actions,
-    onClose: onClose || modalContext.onClose,
-    size: size
-  }, children));
+ */ export const ModalCard = ({ icon , header , subheader , children , actions , onClose , nav , id , className , size , ...restProps })=>{
+    const { isDesktop  } = useAdaptivityWithJSMediaQueries();
+    const platform = usePlatform();
+    const modalContext = React.useContext(ModalRootContext);
+    const { refs  } = useModalRegistry(getNavId({
+        nav,
+        id
+    }, warn), ModalType.CARD);
+    return /*#__PURE__*/ React.createElement("div", {
+        ...restProps,
+        id: id,
+        className: classNames(styles['ModalCard'], platformClassNames.hasOwnProperty(platform) ? platformClassNames[platform] : platformClassNames.android, isDesktop && styles['ModalCard--desktop'], className)
+    }, /*#__PURE__*/ React.createElement(ModalCardBase, {
+        className: styles['ModalCard__in'],
+        getRootRef: refs.innerElement,
+        icon: icon,
+        header: header,
+        subheader: subheader,
+        actions: actions,
+        onClose: onClose || modalContext.onClose,
+        size: size
+    }, children));
 };
+
 //# sourceMappingURL=ModalCard.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ModalCard.js","names":["React","classNames","useAdaptivityWithJSMediaQueries","usePlatform","getNavId","warnOnce","ModalCardBase","ModalRootContext","useModalRegistry","ModalType","platformClassNames","ios","android","vkcom","warn","ModalCard","icon","header","subheader","children","actions","onClose","nav","id","className","size","restProps","isDesktop","platform","modalContext","useContext","CARD","refs","hasOwnProperty","innerElement"],"sources":["../../../../src/components/ModalCard/ModalCard.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ModalCardBase, ModalCardBaseProps } from '../ModalCardBase/ModalCardBase';\nimport { ModalRootContext, useModalRegistry } from '../ModalRoot/ModalRootContext';\nimport { ModalType } from '../ModalRoot/types';\nimport styles from './ModalCard.module.css';\n\nconst platformClassNames = {\n  ios: styles['ModalCard--ios'],\n  android: styles['ModalCard--android'],\n  vkcom: styles['ModalCard--vkcom'],\n};\n\nexport interface ModalCardProps extends NavIdProps, ModalCardBaseProps {}\n\nconst warn = warnOnce('ModalCard');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalCard\n */\nexport const ModalCard = ({\n  icon,\n  header,\n  subheader,\n  children,\n  actions,\n  onClose,\n  nav,\n  id,\n  className,\n  size,\n  ...restProps\n}: ModalCardProps) => {\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const platform = usePlatform();\n\n  const modalContext = React.useContext(ModalRootContext);\n  const { refs } = useModalRegistry(getNavId({ nav, id }, warn), ModalType.CARD);\n\n  return (\n    <div\n      {...restProps}\n      id={id}\n      className={classNames(\n        styles['ModalCard'],\n        platformClassNames.hasOwnProperty(platform)\n          ? platformClassNames[platform]\n          : platformClassNames.android,\n        isDesktop && styles['ModalCard--desktop'],\n        className,\n      )}\n    >\n      <ModalCardBase\n        className={styles['ModalCard__in']}\n        getRootRef={refs.innerElement}\n        icon={icon}\n        header={header}\n        subheader={subheader}\n        actions={actions}\n        onClose={onClose || modalContext.onClose}\n        size={size}\n      >\n        {children}\n      </ModalCardBase>\n    </div>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,+BAA+B,QAAQ,6CAA6C;AAC7F,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,QAAQ,QAAoB,oBAAoB;AACzD,SAASC,QAAQ,QAAQ,oBAAoB;AAC7C,SAASC,aAAa,QAA4B,gCAAgC;AAClF,SAASC,gBAAgB,EAAEC,gBAAgB,QAAQ,+BAA+B;AAClF,SAASC,SAAS,QAAQ,oBAAoB;AAAC;AAG/C,IAAMC,kBAAkB,GAAG;EACzBC,GAAG,sBAA0B;EAC7BC,OAAO,0BAA8B;EACrCC,KAAK;AACP,CAAC;AAID,IAAMC,IAAI,GAAGT,QAAQ,CAAC,WAAW,CAAC;;AAElC;AACA;AACA;AACA,OAAO,IAAMU,SAAS,GAAG,SAAZA,SAAS,OAYA;EAAA,IAXpBC,IAAI,QAAJA,IAAI;IACJC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IACPC,OAAO,QAAPA,OAAO;IACPC,GAAG,QAAHA,GAAG;IACHC,EAAE,QAAFA,EAAE;IACFC,SAAS,QAATA,SAAS;IACTC,IAAI,QAAJA,IAAI;IACDC,SAAS;EAEZ,4BAAsBxB,+BAA+B,EAAE;IAA/CyB,SAAS,yBAATA,SAAS;EACjB,IAAMC,QAAQ,GAAGzB,WAAW,EAAE;EAE9B,IAAM0B,YAAY,GAAG7B,KAAK,CAAC8B,UAAU,CAACvB,gBAAgB,CAAC;EACvD,wBAAiBC,gBAAgB,CAACJ,QAAQ,CAAC;MAAEkB,GAAG,EAAHA,GAAG;MAAEC,EAAE,EAAFA;IAAG,CAAC,EAAET,IAAI,CAAC,EAAEL,SAAS,CAACsB,IAAI,CAAC;IAAtEC,IAAI,qBAAJA,IAAI;EAEZ,oBACE,wCACMN,SAAS;IACb,EAAE,EAAEH,EAAG;IACP,SAAS,EAAEtB,UAAU,kBAEnBS,kBAAkB,CAACuB,cAAc,CAACL,QAAQ,CAAC,GACvClB,kBAAkB,CAACkB,QAAQ,CAAC,GAC5BlB,kBAAkB,CAACE,OAAO,EAC9Be,SAAS,4BAAgC,EACzCH,SAAS;EACT,iBAEF,oBAAC,aAAa;IACZ,SAAS,qBAA0B;IACnC,UAAU,EAAEQ,IAAI,CAACE,YAAa;IAC9B,IAAI,EAAElB,IAAK;IACX,MAAM,EAAEC,MAAO;IACf,SAAS,EAAEC,SAAU;IACrB,OAAO,EAAEE,OAAQ;IACjB,OAAO,EAAEC,OAAO,IAAIQ,YAAY,CAACR,OAAQ;IACzC,IAAI,EAAEI;EAAK,GAEVN,QAAQ,CACK,CACZ;AAEV,CAAC"}
+{"version":3,"sources":["../../../../src/components/ModalCard/ModalCard.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ModalCardBase, ModalCardBaseProps } from '../ModalCardBase/ModalCardBase';\nimport { ModalRootContext, useModalRegistry } from '../ModalRoot/ModalRootContext';\nimport { ModalType } from '../ModalRoot/types';\nimport styles from './ModalCard.module.css';\n\nconst platformClassNames = {\n  ios: styles['ModalCard--ios'],\n  android: styles['ModalCard--android'],\n  vkcom: styles['ModalCard--vkcom'],\n};\n\nexport interface ModalCardProps extends NavIdProps, ModalCardBaseProps {}\n\nconst warn = warnOnce('ModalCard');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalCard\n */\nexport const ModalCard = ({\n  icon,\n  header,\n  subheader,\n  children,\n  actions,\n  onClose,\n  nav,\n  id,\n  className,\n  size,\n  ...restProps\n}: ModalCardProps) => {\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const platform = usePlatform();\n\n  const modalContext = React.useContext(ModalRootContext);\n  const { refs } = useModalRegistry(getNavId({ nav, id }, warn), ModalType.CARD);\n\n  return (\n    <div\n      {...restProps}\n      id={id}\n      className={classNames(\n        styles['ModalCard'],\n        platformClassNames.hasOwnProperty(platform)\n          ? platformClassNames[platform]\n          : platformClassNames.android,\n        isDesktop && styles['ModalCard--desktop'],\n        className,\n      )}\n    >\n      <ModalCardBase\n        className={styles['ModalCard__in']}\n        getRootRef={refs.innerElement}\n        icon={icon}\n        header={header}\n        subheader={subheader}\n        actions={actions}\n        onClose={onClose || modalContext.onClose}\n        size={size}\n      >\n        {children}\n      </ModalCardBase>\n    </div>\n  );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","usePlatform","getNavId","warnOnce","ModalCardBase","ModalRootContext","useModalRegistry","ModalType","styles","platformClassNames","ios","android","vkcom","warn","ModalCard","icon","header","subheader","children","actions","onClose","nav","id","className","size","restProps","isDesktop","platform","modalContext","useContext","refs","CARD","div","hasOwnProperty","getRootRef","innerElement"],"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,QAAoB,qBAAqB;AAC1D,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,aAAa,QAA4B,iCAAiC;AACnF,SAASC,gBAAgB,EAAEC,gBAAgB,QAAQ,gCAAgC;AACnF,SAASC,SAAS,QAAQ,qBAAqB;AAC/C,OAAOC,YAAY,yBAAyB;AAE5C,MAAMC,qBAAqB;IACzBC,KAAKF,MAAM,CAAC,iBAAiB;IAC7BG,SAASH,MAAM,CAAC,qBAAqB;IACrCI,OAAOJ,MAAM,CAAC,mBAAmB;AACnC;AAIA,MAAMK,OAAOV,SAAS;AAEtB;;CAEC,GACD,OAAO,MAAMW,YAAY,CAAC,EACxBC,KAAI,EACJC,OAAM,EACNC,UAAS,EACTC,SAAQ,EACRC,QAAO,EACPC,QAAO,EACPC,IAAG,EACHC,GAAE,EACFC,UAAS,EACTC,KAAI,EACJ,GAAGC,WACY,GAAK;IACpB,MAAM,EAAEC,UAAS,EAAE,GAAG1B;IACtB,MAAM2B,WAAW1B;IAEjB,MAAM2B,eAAe9B,MAAM+B,UAAU,CAACxB;IACtC,MAAM,EAAEyB,KAAI,EAAE,GAAGxB,iBAAiBJ,SAAS;QAAEmB;QAAKC;IAAG,GAAGT,OAAON,UAAUwB,IAAI;IAE7E,qBACE,oBAACC;QACE,GAAGP,SAAS;QACbH,IAAIA;QACJC,WAAWxB,WACTS,MAAM,CAAC,YAAY,EACnBC,mBAAmBwB,cAAc,CAACN,YAC9BlB,kBAAkB,CAACkB,SAAS,GAC5BlB,mBAAmBE,OAAO,EAC9Be,aAAalB,MAAM,CAAC,qBAAqB,EACzCe;qBAGF,oBAACnB;QACCmB,WAAWf,MAAM,CAAC,gBAAgB;QAClC0B,YAAYJ,KAAKK,YAAY;QAC7BpB,MAAMA;QACNC,QAAQA;QACRC,WAAWA;QACXE,SAASA;QACTC,SAASA,WAAWQ,aAAaR,OAAO;QACxCI,MAAMA;OAELN;AAIT,EAAE"}

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

@@ -1 +1 @@
-.vkuiModalCard{align-items:flex-end;box-sizing:border-box;display:flex;height:100%;left:0;padding:8px;position:absolute;top:0;width:100%}.vkuiModalCard__in{margin-left:auto;margin-right:auto;transform:translateY(calc(100% + 16px));transition:transform .34s cubic-bezier(.4,0,.2,1);transition:transform .34s var(--vkui--animation_easing_platform);width:100%}.vkuiModalCard--ios .vkuiModalCard__in{max-width:414px}.vkuiModalCard--android .vkuiModalCard__in{max-width:440px}.vkuiModalCard--vkcom .vkuiModalCard__in{max-width:400px}.vkuiModalCard--desktop{align-items:center}.vkuiModalCard--desktop .vkuiModalCard__in{opacity:0;transform:unset;transition:opacity .34s cubic-bezier(.4,0,.2,1);transition:opacity .34s var(--vkui--animation_easing_platform)}.vkuiModalRoot--touched .vkuiModalCard__in{transition:none}
+.vkuiModalCard{align-items:flex-end;box-sizing:border-box;display:flex;height:100%;left:0;padding:8px;position:absolute;top:0;width:100%}.vkuiModalCard__in{margin-left:auto;margin-right:auto;transform:translateY(calc(100% + 16px));transition:transform .34s cubic-bezier(.4,0,.2,1);transition:transform .34s var(--vkui--animation_easing_platform);width:100%}.vkuiModalCard--ios .vkuiModalCard__in{max-width:414px}.vkuiModalCard--android .vkuiModalCard__in{max-width:440px}.vkuiModalCard--vkcom .vkuiModalCard__in{max-width:400px}.vkuiModalCard--desktop{align-items:center}.vkuiModalCard--desktop .vkuiModalCard__in{opacity:0;transform:unset;transition:opacity .34s cubic-bezier(.4,0,.2,1);transition:opacity .34s var(--vkui--animation_easing_platform)}.vkuiInternalModalRoot--touched .vkuiModalCard__in{transition:none}

package/dist/cssm/components/ModalCardBase/ModalCardBase.js

@@ -1,7 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["getRootRef", "icon", "header", "subheader", "children", "actions", "onClose", "dismissLabel", "className", "style", "size"];
 import * as React from 'react';
 import { Icon24Dismiss } from '@vkontakte/icons';
 import { classNames, hasReactNode } from '@vkontakte/vkjs';
@@ -13,59 +9,47 @@ import { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';
 import { PanelHeaderButton } from '../PanelHeaderButton/PanelHeaderButton';
 import { Subhead } from '../Typography/Subhead/Subhead';
 import { Title } from '../Typography/Title/Title';
-import "./ModalCardBase.module.css";
-var platformClassNames = {
-  ios: "vkuiModalCardBase--ios",
-  android: "vkuiModalCardBase--android",
-  vkcom: "vkuiModalCardBase--vkcom"
+import styles from './ModalCardBase.module.css';
+const platformClassNames = {
+    ios: styles['ModalCardBase--ios'],
+    android: styles['ModalCardBase--android'],
+    vkcom: styles['ModalCardBase--vkcom']
 };
 /**
  * @see https://vkcom.github.io/VKUI/#/ModalCardBase
- */
-export var ModalCardBase = function ModalCardBase(_ref) {
-  var getRootRef = _ref.getRootRef,
-    icon = _ref.icon,
-    header = _ref.header,
-    subheader = _ref.subheader,
-    children = _ref.children,
-    actions = _ref.actions,
-    onClose = _ref.onClose,
-    _ref$dismissLabel = _ref.dismissLabel,
-    dismissLabel = _ref$dismissLabel === void 0 ? 'Скрыть' : _ref$dismissLabel,
-    className = _ref.className,
-    style = _ref.style,
-    sizeProp = _ref.size,
-    restProps = _objectWithoutProperties(_ref, _excluded);
-  var platform = usePlatform();
-  var _useAdaptivityWithJSM = useAdaptivityWithJSMediaQueries(),
-    isDesktop = _useAdaptivityWithJSM.isDesktop;
-  var isSoftwareKeyboardOpened = useKeyboard().isOpened;
-  var canShowCloseButtonIOS = platform === Platform.IOS && !isDesktop;
-  var size = isDesktop ? sizeProp : undefined;
-  return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
-    className: classNames("vkuiModalCardBase", platformClassNames.hasOwnProperty(platform) ? platformClassNames[platform] : platformClassNames.android, isDesktop && "vkuiModalCardBase--desktop", className),
-    ref: getRootRef,
-    style: _objectSpread(_objectSpread({}, style), {}, {
-      maxWidth: size
-    })
-  }), /*#__PURE__*/React.createElement("div", {
-    className: classNames("vkuiModalCardBase__container", isSoftwareKeyboardOpened && "vkuiModalCardBase__container--softwareKeyboardOpened")
-  }, hasReactNode(icon) && /*#__PURE__*/React.createElement("div", {
-    className: "vkuiModalCardBase__icon"
-  }, icon), hasReactNode(header) && /*#__PURE__*/React.createElement(Title, {
-    level: "2",
-    weight: "2",
-    className: "vkuiModalCardBase__header"
-  }, header), hasReactNode(subheader) && /*#__PURE__*/React.createElement(Subhead, {
-    className: "vkuiModalCardBase__subheader"
-  }, subheader), children, hasReactNode(actions) && /*#__PURE__*/React.createElement("div", {
-    className: "vkuiModalCardBase__actions"
-  }, actions), isDesktop && /*#__PURE__*/React.createElement(ModalDismissButton, {
-    onClick: onClose
-  }), canShowCloseButtonIOS && /*#__PURE__*/React.createElement(PanelHeaderButton, {
-    "aria-label": dismissLabel,
-    className: "vkuiModalCardBase__dismiss",
-    onClick: onClose
-  }, /*#__PURE__*/React.createElement(Icon24Dismiss, null))));
+ */ export const ModalCardBase = ({ getRootRef , icon , header , subheader , children , actions , onClose , dismissLabel ='Скрыть' , className , style , size: sizeProp , ...restProps })=>{
+    const platform = usePlatform();
+    const { isDesktop  } = useAdaptivityWithJSMediaQueries();
+    const isSoftwareKeyboardOpened = useKeyboard().isOpened;
+    const canShowCloseButtonIOS = platform === Platform.IOS && !isDesktop;
+    const size = isDesktop ? sizeProp : undefined;
+    return /*#__PURE__*/ React.createElement("div", {
+        ...restProps,
+        className: classNames('vkuiInternalModalCardBase', platformClassNames.hasOwnProperty(platform) ? platformClassNames[platform] : platformClassNames.android, isDesktop && styles['ModalCardBase--desktop'], className),
+        ref: getRootRef,
+        style: {
+            ...style,
+            maxWidth: size
+        }
+    }, /*#__PURE__*/ React.createElement("div", {
+        className: classNames(styles['ModalCardBase__container'], isSoftwareKeyboardOpened && styles['ModalCardBase__container--softwareKeyboardOpened'])
+    }, hasReactNode(icon) && /*#__PURE__*/ React.createElement("div", {
+        className: styles['ModalCardBase__icon']
+    }, icon), hasReactNode(header) && /*#__PURE__*/ React.createElement(Title, {
+        level: "2",
+        weight: "2",
+        className: classNames(styles['ModalCardBase__header'], 'vkuiInternalModalCardBase__header')
+    }, header), hasReactNode(subheader) && /*#__PURE__*/ React.createElement(Subhead, {
+        className: classNames(styles['ModalCardBase__subheader'], 'vkuiInternalModalCardBase__subheader')
+    }, subheader), children, hasReactNode(actions) && /*#__PURE__*/ React.createElement("div", {
+        className: styles['ModalCardBase__actions']
+    }, actions), isDesktop && /*#__PURE__*/ React.createElement(ModalDismissButton, {
+        onClick: onClose
+    }), canShowCloseButtonIOS && /*#__PURE__*/ React.createElement(PanelHeaderButton, {
+        "aria-label": dismissLabel,
+        className: styles['ModalCardBase__dismiss'],
+        onClick: onClose
+    }, /*#__PURE__*/ React.createElement(Icon24Dismiss, null))));
 };
+
 //# sourceMappingURL=ModalCardBase.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ModalCardBase.js","names":["React","Icon24Dismiss","classNames","hasReactNode","useAdaptivityWithJSMediaQueries","useKeyboard","usePlatform","Platform","ModalDismissButton","PanelHeaderButton","Subhead","Title","platformClassNames","ios","android","vkcom","ModalCardBase","getRootRef","icon","header","subheader","children","actions","onClose","dismissLabel","className","style","sizeProp","size","restProps","platform","isDesktop","isSoftwareKeyboardOpened","isOpened","canShowCloseButtonIOS","IOS","undefined","hasOwnProperty","maxWidth"],"sources":["../../../../src/components/ModalCardBase/ModalCardBase.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Dismiss } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useKeyboard } from '../../hooks/useKeyboard';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasRootRef } from '../../types';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { PanelHeaderButton } from '../PanelHeaderButton/PanelHeaderButton';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './ModalCardBase.module.css';\n\nconst platformClassNames = {\n  ios: styles['ModalCardBase--ios'],\n  android: styles['ModalCardBase--android'],\n  vkcom: styles['ModalCardBase--vkcom'],\n};\n\nexport interface ModalCardBaseProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Иконка.\n   *\n   * Может быть компонентом иконки, например, `<Icon56MoneyTransferOutline />`, или `<Avatar size={72} src=\"\" />`\n   */\n  icon?: React.ReactNode;\n\n  /**\n   * Заголовок карточки\n   */\n  header?: React.ReactNode;\n\n  /**\n   * Подзаголовок\n   */\n  subheader?: React.ReactNode;\n\n  /**\n   * Кнопки-действия. Принимает [`Button`](https://vkcom.github.io/VKUI/#/Button) с параметрами:\n   *\n   * - `size=\"l\" mode=\"primary\" stretched`\n   * - `size=\"l\" mode=\"secondary\" stretched`\n   *\n   * Для набора кнопок используйте [`ButtonGroup`](https://vkcom.github.io/VKUI/#/ButtonGroup) с параметрами:\n   *\n   * - `gap=\"s\" mode=\"horizontal\" stretched`\n   * - `gap=\"m\" mode=\"vertical\" stretched`\n   */\n  actions?: React.ReactNode;\n\n  onClose?: VoidFunction;\n\n  /**\n   * `aria-label` для кнопки закрытия. Необходим, чтобы кнопка была доступной.\n   */\n  dismissLabel?: string;\n\n  /**\n   * Задаёт контенту максимальную ширину для десктопной версии.\n   */\n  size?: number;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalCardBase\n */\nexport const ModalCardBase = ({\n  getRootRef,\n  icon,\n  header,\n  subheader,\n  children,\n  actions,\n  onClose,\n  dismissLabel = 'Скрыть',\n  className,\n  style,\n  size: sizeProp,\n  ...restProps\n}: ModalCardBaseProps) => {\n  const platform = usePlatform();\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const isSoftwareKeyboardOpened = useKeyboard().isOpened;\n\n  const canShowCloseButtonIOS = platform === Platform.IOS && !isDesktop;\n\n  const size = isDesktop ? sizeProp : undefined;\n\n  return (\n    <div\n      {...restProps}\n      className={classNames(\n        styles['ModalCardBase'],\n        platformClassNames.hasOwnProperty(platform)\n          ? platformClassNames[platform]\n          : platformClassNames.android,\n        isDesktop && styles['ModalCardBase--desktop'],\n        className,\n      )}\n      ref={getRootRef}\n      style={{\n        ...style,\n        maxWidth: size,\n      }}\n    >\n      <div\n        className={classNames(\n          styles['ModalCardBase__container'],\n          isSoftwareKeyboardOpened && styles['ModalCardBase__container--softwareKeyboardOpened'],\n        )}\n      >\n        {hasReactNode(icon) && <div className={styles['ModalCardBase__icon']}>{icon}</div>}\n        {hasReactNode(header) && (\n          <Title level=\"2\" weight=\"2\" className={styles['ModalCardBase__header']}>\n            {header}\n          </Title>\n        )}\n        {hasReactNode(subheader) && (\n          <Subhead className={styles['ModalCardBase__subheader']}>{subheader}</Subhead>\n        )}\n\n        {children}\n\n        {hasReactNode(actions) && <div className={styles['ModalCardBase__actions']}>{actions}</div>}\n\n        {isDesktop && <ModalDismissButton onClick={onClose} />}\n        {canShowCloseButtonIOS && (\n          <PanelHeaderButton\n            aria-label={dismissLabel}\n            className={styles['ModalCardBase__dismiss']}\n            onClick={onClose}\n          >\n            <Icon24Dismiss />\n          </PanelHeaderButton>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,aAAa,QAAQ,kBAAkB;AAChD,SAASC,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SAASC,+BAA+B,QAAQ,6CAA6C;AAC7F,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,QAAQ,QAAQ,oBAAoB;AAE7C,SAASC,kBAAkB,QAAQ,0CAA0C;AAC7E,SAASC,iBAAiB,QAAQ,wCAAwC;AAC1E,SAASC,OAAO,QAAQ,+BAA+B;AACvD,SAASC,KAAK,QAAQ,2BAA2B;AAAC;AAGlD,IAAMC,kBAAkB,GAAG;EACzBC,GAAG,0BAA8B;EACjCC,OAAO,8BAAkC;EACzCC,KAAK;AACP,CAAC;AAgDD;AACA;AACA;AACA,OAAO,IAAMC,aAAa,GAAG,SAAhBA,aAAa,OAaA;EAAA,IAZxBC,UAAU,QAAVA,UAAU;IACVC,IAAI,QAAJA,IAAI;IACJC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IACPC,OAAO,QAAPA,OAAO;IAAA,yBACPC,YAAY;IAAZA,YAAY,kCAAG,QAAQ;IACvBC,SAAS,QAATA,SAAS;IACTC,KAAK,QAALA,KAAK;IACCC,QAAQ,QAAdC,IAAI;IACDC,SAAS;EAEZ,IAAMC,QAAQ,GAAGxB,WAAW,EAAE;EAC9B,4BAAsBF,+BAA+B,EAAE;IAA/C2B,SAAS,yBAATA,SAAS;EACjB,IAAMC,wBAAwB,GAAG3B,WAAW,EAAE,CAAC4B,QAAQ;EAEvD,IAAMC,qBAAqB,GAAGJ,QAAQ,KAAKvB,QAAQ,CAAC4B,GAAG,IAAI,CAACJ,SAAS;EAErE,IAAMH,IAAI,GAAGG,SAAS,GAAGJ,QAAQ,GAAGS,SAAS;EAE7C,oBACE,wCACMP,SAAS;IACb,SAAS,EAAE3B,UAAU,sBAEnBU,kBAAkB,CAACyB,cAAc,CAACP,QAAQ,CAAC,GACvClB,kBAAkB,CAACkB,QAAQ,CAAC,GAC5BlB,kBAAkB,CAACE,OAAO,EAC9BiB,SAAS,gCAAoC,EAC7CN,SAAS,CACT;IACF,GAAG,EAAER,UAAW;IAChB,KAAK,kCACAS,KAAK;MACRY,QAAQ,EAAEV;IAAI;EACd,iBAEF;IACE,SAAS,EAAE1B,UAAU,iCAEnB8B,wBAAwB,0DAA8D;EACtF,GAED7B,YAAY,CAACe,IAAI,CAAC,iBAAI;IAAK,SAAS;EAAgC,GAAEA,IAAI,CAAO,EACjFf,YAAY,CAACgB,MAAM,CAAC,iBACnB,oBAAC,KAAK;IAAC,KAAK,EAAC,GAAG;IAAC,MAAM,EAAC,GAAG;IAAC,SAAS;EAAkC,GACpEA,MAAM,CAEV,EACAhB,YAAY,CAACiB,SAAS,CAAC,iBACtB,oBAAC,OAAO;IAAC,SAAS;EAAqC,GAAEA,SAAS,CACnE,EAEAC,QAAQ,EAERlB,YAAY,CAACmB,OAAO,CAAC,iBAAI;IAAK,SAAS;EAAmC,GAAEA,OAAO,CAAO,EAE1FS,SAAS,iBAAI,oBAAC,kBAAkB;IAAC,OAAO,EAAER;EAAQ,EAAG,EACrDW,qBAAqB,iBACpB,oBAAC,iBAAiB;IAChB,cAAYV,YAAa;IACzB,SAAS,8BAAmC;IAC5C,OAAO,EAAED;EAAQ,gBAEjB,oBAAC,aAAa,OAAG,CAEpB,CACG,CACF;AAEV,CAAC"}
+{"version":3,"sources":["../../../../src/components/ModalCardBase/ModalCardBase.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Dismiss } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useKeyboard } from '../../hooks/useKeyboard';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasRootRef } from '../../types';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { PanelHeaderButton } from '../PanelHeaderButton/PanelHeaderButton';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './ModalCardBase.module.css';\n\nconst platformClassNames = {\n  ios: styles['ModalCardBase--ios'],\n  android: styles['ModalCardBase--android'],\n  vkcom: styles['ModalCardBase--vkcom'],\n};\n\nexport interface ModalCardBaseProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Иконка.\n   *\n   * Может быть компонентом иконки, например, `<Icon56MoneyTransferOutline />`, или `<Avatar size={72} src=\"\" />`\n   */\n  icon?: React.ReactNode;\n\n  /**\n   * Заголовок карточки\n   */\n  header?: React.ReactNode;\n\n  /**\n   * Подзаголовок\n   */\n  subheader?: React.ReactNode;\n\n  /**\n   * Кнопки-действия. Принимает [`Button`](https://vkcom.github.io/VKUI/#/Button) с параметрами:\n   *\n   * - `size=\"l\" mode=\"primary\" stretched`\n   * - `size=\"l\" mode=\"secondary\" stretched`\n   *\n   * Для набора кнопок используйте [`ButtonGroup`](https://vkcom.github.io/VKUI/#/ButtonGroup) с параметрами:\n   *\n   * - `gap=\"s\" mode=\"horizontal\" stretched`\n   * - `gap=\"m\" mode=\"vertical\" stretched`\n   */\n  actions?: React.ReactNode;\n\n  onClose?: VoidFunction;\n\n  /**\n   * `aria-label` для кнопки закрытия. Необходим, чтобы кнопка была доступной.\n   */\n  dismissLabel?: string;\n\n  /**\n   * Задаёт контенту максимальную ширину для десктопной версии.\n   */\n  size?: number;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalCardBase\n */\nexport const ModalCardBase = ({\n  getRootRef,\n  icon,\n  header,\n  subheader,\n  children,\n  actions,\n  onClose,\n  dismissLabel = 'Скрыть',\n  className,\n  style,\n  size: sizeProp,\n  ...restProps\n}: ModalCardBaseProps) => {\n  const platform = usePlatform();\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const isSoftwareKeyboardOpened = useKeyboard().isOpened;\n\n  const canShowCloseButtonIOS = platform === Platform.IOS && !isDesktop;\n\n  const size = isDesktop ? sizeProp : undefined;\n\n  return (\n    <div\n      {...restProps}\n      className={classNames(\n        'vkuiInternalModalCardBase',\n        platformClassNames.hasOwnProperty(platform)\n          ? platformClassNames[platform]\n          : platformClassNames.android,\n        isDesktop && styles['ModalCardBase--desktop'],\n        className,\n      )}\n      ref={getRootRef}\n      style={{\n        ...style,\n        maxWidth: size,\n      }}\n    >\n      <div\n        className={classNames(\n          styles['ModalCardBase__container'],\n          isSoftwareKeyboardOpened && styles['ModalCardBase__container--softwareKeyboardOpened'],\n        )}\n      >\n        {hasReactNode(icon) && <div className={styles['ModalCardBase__icon']}>{icon}</div>}\n        {hasReactNode(header) && (\n          <Title\n            level=\"2\"\n            weight=\"2\"\n            className={classNames(\n              styles['ModalCardBase__header'],\n              'vkuiInternalModalCardBase__header',\n            )}\n          >\n            {header}\n          </Title>\n        )}\n        {hasReactNode(subheader) && (\n          <Subhead\n            className={classNames(\n              styles['ModalCardBase__subheader'],\n              'vkuiInternalModalCardBase__subheader',\n            )}\n          >\n            {subheader}\n          </Subhead>\n        )}\n\n        {children}\n\n        {hasReactNode(actions) && <div className={styles['ModalCardBase__actions']}>{actions}</div>}\n\n        {isDesktop && <ModalDismissButton onClick={onClose} />}\n        {canShowCloseButtonIOS && (\n          <PanelHeaderButton\n            aria-label={dismissLabel}\n            className={styles['ModalCardBase__dismiss']}\n            onClick={onClose}\n          >\n            <Icon24Dismiss />\n          </PanelHeaderButton>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["React","Icon24Dismiss","classNames","hasReactNode","useAdaptivityWithJSMediaQueries","useKeyboard","usePlatform","Platform","ModalDismissButton","PanelHeaderButton","Subhead","Title","styles","platformClassNames","ios","android","vkcom","ModalCardBase","getRootRef","icon","header","subheader","children","actions","onClose","dismissLabel","className","style","size","sizeProp","restProps","platform","isDesktop","isSoftwareKeyboardOpened","isOpened","canShowCloseButtonIOS","IOS","undefined","div","hasOwnProperty","ref","maxWidth","level","weight","onClick","aria-label"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,QAAQ,mBAAmB;AACjD,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,+BAA+B,QAAQ,8CAA8C;AAC9F,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,qBAAqB;AAE9C,SAASC,kBAAkB,QAAQ,2CAA2C;AAC9E,SAASC,iBAAiB,QAAQ,yCAAyC;AAC3E,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,KAAK,QAAQ,4BAA4B;AAClD,OAAOC,YAAY,6BAA6B;AAEhD,MAAMC,qBAAqB;IACzBC,KAAKF,MAAM,CAAC,qBAAqB;IACjCG,SAASH,MAAM,CAAC,yBAAyB;IACzCI,OAAOJ,MAAM,CAAC,uBAAuB;AACvC;AAgDA;;CAEC,GACD,OAAO,MAAMK,gBAAgB,CAAC,EAC5BC,WAAU,EACVC,KAAI,EACJC,OAAM,EACNC,UAAS,EACTC,SAAQ,EACRC,QAAO,EACPC,QAAO,EACPC,cAAe,SAAQ,EACvBC,UAAS,EACTC,MAAK,EACLC,MAAMC,SAAQ,EACd,GAAGC,WACgB,GAAK;IACxB,MAAMC,WAAWzB;IACjB,MAAM,EAAE0B,UAAS,EAAE,GAAG5B;IACtB,MAAM6B,2BAA2B5B,cAAc6B,QAAQ;IAEvD,MAAMC,wBAAwBJ,aAAaxB,SAAS6B,GAAG,IAAI,CAACJ;IAE5D,MAAMJ,OAAOI,YAAYH,WAAWQ,SAAS;IAE7C,qBACE,oBAACC;QACE,GAAGR,SAAS;QACbJ,WAAWxB,WACT,6BACAW,mBAAmB0B,cAAc,CAACR,YAC9BlB,kBAAkB,CAACkB,SAAS,GAC5BlB,mBAAmBE,OAAO,EAC9BiB,aAAapB,MAAM,CAAC,yBAAyB,EAC7Cc;QAEFc,KAAKtB;QACLS,OAAO;YACL,GAAGA,KAAK;YACRc,UAAUb;QACZ;qBAEA,oBAACU;QACCZ,WAAWxB,WACTU,MAAM,CAAC,2BAA2B,EAClCqB,4BAA4BrB,MAAM,CAAC,mDAAmD;OAGvFT,aAAagB,uBAAS,oBAACmB;QAAIZ,WAAWd,MAAM,CAAC,sBAAsB;OAAGO,OACtEhB,aAAaiB,yBACZ,oBAACT;QACC+B,OAAM;QACNC,QAAO;QACPjB,WAAWxB,WACTU,MAAM,CAAC,wBAAwB,EAC/B;OAGDQ,SAGJjB,aAAakB,4BACZ,oBAACX;QACCgB,WAAWxB,WACTU,MAAM,CAAC,2BAA2B,EAClC;OAGDS,YAIJC,UAEAnB,aAAaoB,0BAAY,oBAACe;QAAIZ,WAAWd,MAAM,CAAC,yBAAyB;OAAGW,UAE5ES,2BAAa,oBAACxB;QAAmBoC,SAASpB;QAC1CW,uCACC,oBAAC1B;QACCoC,cAAYpB;QACZC,WAAWd,MAAM,CAAC,yBAAyB;QAC3CgC,SAASpB;qBAET,oBAACvB;AAMb,EAAE"}

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

@@ -1 +1 @@
-.vkuiModalCardBase__container{background:#fff;background:var(--vkui--color_background_modal);border-radius:18px;box-shadow:0 0 2px rgba(0,0,0,.08),0 4px 16px rgba(0,0,0,.08);box-shadow:var(--vkui--elevation3);box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;margin-bottom:0;margin-bottom:var(--vkui_internal--safe_area_inset_bottom);padding:16px;pointer-events:auto;position:relative}.vkuiModalCardBase__container--softwareKeyboardOpened{margin-bottom:0}.vkuiModalCardBase__header,.vkuiModalCardBase__subheader{margin:0;padding:0 8px;text-align:center;word-break:break-word}.vkuiModalCardBase__header{color:#000;color:var(--vkui--color_text_primary)}.vkuiModalCardBase__subheader{color:#6d7885;color:var(--vkui--color_text_subhead)}.vkuiModalCardBase__header+.vkuiModalCardBase__subheader{margin-top:8px}.vkuiModalCardBase__icon{color:#2688eb;color:var(--vkui--color_icon_accent);margin:8px auto 16px}.vkuiModalCardBase__actions{display:flex;margin-top:16px}.vkuiModalCardBase .vkuiUsersStack+.vkuiModalCardBase__actions{margin-top:24px}.vkuiModalCardBase__header+.vkuiModalCardBase__actions,.vkuiModalCardBase__subheader+.vkuiModalCardBase__actions{margin-top:32px}.vkuiModalCardBase__dismiss{color:#99a2ad;color:var(--vkui--color_icon_secondary);height:48px;justify-content:center;position:absolute;right:4px;top:4px;width:48px}.vkuiModalCardBase--ios .vkuiModalCardBase__header:first-child{padding-left:36px;padding-right:36px}.vkuiModalCardBase--android .vkuiModalCardBase__container,.vkuiModalCardBase--vkcom .vkuiModalCardBase__container{border-radius:12px}.vkuiModalCardBase--desktop .vkuiModalCardBase__container{border-radius:8px}
+.vkuiModalCardBase__container{--vkui_internal--background:var(--vkui--color_background_modal);background:#fff;background:var(--vkui--color_background_modal);border-radius:18px;box-shadow:0 0 2px rgba(0,0,0,.08),0 4px 16px rgba(0,0,0,.08);box-shadow:var(--vkui--elevation3);box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;margin-bottom:0;margin-bottom:var(--vkui_internal--safe_area_inset_bottom);padding:16px;pointer-events:auto;position:relative}.vkuiModalCardBase__container--softwareKeyboardOpened{margin-bottom:0}.vkuiModalCardBase__header,.vkuiModalCardBase__subheader{margin:0;padding:0 8px;text-align:center;word-break:break-word}.vkuiModalCardBase__header{color:#000;color:var(--vkui--color_text_primary)}.vkuiModalCardBase__subheader{color:#6d7885;color:var(--vkui--color_text_subhead)}.vkuiModalCardBase__header+.vkuiModalCardBase__subheader{margin-top:8px}.vkuiModalCardBase__icon{color:#2688eb;color:var(--vkui--color_icon_accent);margin:8px auto 16px}.vkuiModalCardBase__actions{display:flex;margin-top:16px}.vkuiUsersStack+.vkuiModalCardBase__actions{margin-top:24px}.vkuiModalCardBase__header+.vkuiModalCardBase__actions,.vkuiModalCardBase__subheader+.vkuiModalCardBase__actions{margin-top:32px}.vkuiModalCardBase__dismiss{color:#99a2ad;color:var(--vkui--color_icon_secondary);height:48px;justify-content:center;position:absolute;right:4px;top:4px;width:48px}.vkuiModalCardBase--ios .vkuiModalCardBase__header:first-child{padding-left:36px;padding-right:36px}.vkuiModalCardBase--android .vkuiModalCardBase__container,.vkuiModalCardBase--vkcom .vkuiModalCardBase__container{border-radius:12px}.vkuiModalCardBase--desktop .vkuiModalCardBase__container{border-radius:8px}