@vkontakte/vkui 5.2.4 → 5.3.1

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

@@ -1 +1 @@
-.vkuiPanelHeaderContext--closing,.vkuiPanelHeaderContext--opened{height:100%;width:100%}.vkuiPanelHeaderContext--sizeX-regular.vkuiPanelHeaderContext--closing,.vkuiPanelHeaderContext--sizeX-regular.vkuiPanelHeaderContext--opened{height:auto}@media (min-width:768px){.vkuiPanelHeaderContext--sizeX-none.vkuiPanelHeaderContext--closing,.vkuiPanelHeaderContext--sizeX-none.vkuiPanelHeaderContext--opened{height:auto}}.vkuiPanelHeaderContext__in{box-sizing:border-box;left:0;padding:8px;pointer-events:none;position:absolute;width:100%}.vkuiPanelHeaderContext__fade{background:rgba(0,0,0,.4);display:none;height:100%;left:0;position:absolute;top:0;width:100%}.vkuiPanelHeaderContext--sizeX-compact .vkuiPanelHeaderContext__fade{display:block}@media (max-width:767.9px){.vkuiPanelHeaderContext--sizeX-none .vkuiPanelHeaderContext__fade{display:block}}.vkuiPanelHeaderContext--opened .vkuiPanelHeaderContext__fade{animation:vkui-animation-panelheadercontext-fade-in .2s ease}.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__fade{animation:vkui-animation-panelheadercontext-fade-out .2s ease}.vkuiPanelHeaderContext--opened .vkuiPanelHeaderContext__in{animation:vkui-animation-panelheadercontext-translate-in .2s ease;pointer-events:auto}.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__in{animation:vkui-animation-panelheadercontext-translate-out .2s ease}.vkuiPanelHeaderContext .vkuiList{background:#fff;background:var(--vkui--color_background_content)}.vkuiPanelHeaderContext--ios .vkuiPanelHeaderContext__in{padding:0}.vkuiPanelHeaderContext--rounded:not(.vkuiPanelHeaderContext--ios) .vkuiList,.vkuiPanelHeaderContext--sizeX-regular.vkuiPanelHeaderContext--ios .vkuiPanelHeaderContext--rounded .vkuiList{border-radius:12px;overflow:hidden;padding:8px 0}@media (min-width:768px){.vkuiPanelHeaderContext--sizeX-none.vkuiPanelHeaderContext--ios .vkuiPanelHeaderContext--rounded .vkuiList{border-radius:12px;overflow:hidden;padding:8px 0}}.vkuiPanelHeaderContext--sizeX-regular .vkuiPanelHeaderContext__in{padding:12px 8px}.vkuiPanelHeaderContext--sizeX-regular .vkuiPanelHeaderContext__content{background:#fff;background:var(--vkui--color_background_content);border-radius:12px;box-shadow:0 0 4px rgba(0,0,0,.08),0 8px 8px rgba(0,0,0,.16);overflow:hidden}@media (min-width:768px){.vkuiPanelHeaderContext--sizeX-none .vkuiPanelHeaderContext__in{padding:12px 8px}.vkuiPanelHeaderContext--sizeX-none .vkuiPanelHeaderContext__content{background:#fff;background:var(--vkui--color_background_content);border-radius:12px;box-shadow:0 0 4px rgba(0,0,0,.08),0 8px 8px rgba(0,0,0,.16);overflow:hidden}}@keyframes vkui-animation-panelheadercontext-translate-in{0%{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes vkui-animation-panelheadercontext-translate-out{0%{transform:translateY(0)}to{transform:translateY(-100%)}}@keyframes vkui-animation-panelheadercontext-fade-in{0%{opacity:0}to{opacity:1}}@keyframes vkui-animation-panelheadercontext-fade-out{0%{opacity:1}to{opacity:0}}
+.vkuiPanelHeaderContext{z-index:4;z-index:var(--vkui_internal--z_index_panel_header_context)}.vkuiPanelHeaderContext--closing,.vkuiPanelHeaderContext--opened{height:100%;width:100%}.vkuiPanelHeaderContext--sizeX-regular.vkuiPanelHeaderContext--closing,.vkuiPanelHeaderContext--sizeX-regular.vkuiPanelHeaderContext--opened{height:auto}@media (min-width:768px){.vkuiPanelHeaderContext--sizeX-none.vkuiPanelHeaderContext--closing,.vkuiPanelHeaderContext--sizeX-none.vkuiPanelHeaderContext--opened{height:auto}}.vkuiPanelHeaderContext__in{box-sizing:border-box;left:0;padding:8px;pointer-events:none;position:absolute;width:100%}.vkuiPanelHeaderContext__fade{background:rgba(0,0,0,.4);display:none;height:100%;left:0;position:absolute;top:0;width:100%}.vkuiPanelHeaderContext--sizeX-compact .vkuiPanelHeaderContext__fade{display:block}@media (max-width:767.9px){.vkuiPanelHeaderContext--sizeX-none .vkuiPanelHeaderContext__fade{display:block}}.vkuiPanelHeaderContext--opened .vkuiPanelHeaderContext__fade{animation:vkui-animation-panelheadercontext-fade-in .2s ease}.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__fade{animation:vkui-animation-panelheadercontext-fade-out .2s ease}.vkuiPanelHeaderContext--opened .vkuiPanelHeaderContext__in{animation:vkui-animation-panelheadercontext-translate-in .2s ease;pointer-events:auto}.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__in{animation:vkui-animation-panelheadercontext-translate-out .2s ease}.vkuiPanelHeaderContext .vkuiList{background:#fff;background:var(--vkui--color_background_content)}.vkuiPanelHeaderContext--ios .vkuiPanelHeaderContext__in{padding:0}.vkuiPanelHeaderContext--rounded:not(.vkuiPanelHeaderContext--ios) .vkuiList,.vkuiPanelHeaderContext--sizeX-regular.vkuiPanelHeaderContext--ios .vkuiPanelHeaderContext--rounded .vkuiList{border-radius:12px;overflow:hidden;padding:8px 0}@media (min-width:768px){.vkuiPanelHeaderContext--sizeX-none.vkuiPanelHeaderContext--ios .vkuiPanelHeaderContext--rounded .vkuiList{border-radius:12px;overflow:hidden;padding:8px 0}}.vkuiPanelHeaderContext--sizeX-regular .vkuiPanelHeaderContext__in{padding:12px 8px}.vkuiPanelHeaderContext--sizeX-regular .vkuiPanelHeaderContext__content{background:#fff;background:var(--vkui--color_background_content);border-radius:12px;box-shadow:0 0 4px rgba(0,0,0,.08),0 8px 8px rgba(0,0,0,.16);overflow:hidden}@media (min-width:768px){.vkuiPanelHeaderContext--sizeX-none .vkuiPanelHeaderContext__in{padding:12px 8px}.vkuiPanelHeaderContext--sizeX-none .vkuiPanelHeaderContext__content{background:#fff;background:var(--vkui--color_background_content);border-radius:12px;box-shadow:0 0 4px rgba(0,0,0,.08),0 8px 8px rgba(0,0,0,.16);overflow:hidden}}@keyframes vkui-animation-panelheadercontext-translate-in{0%{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes vkui-animation-panelheadercontext-translate-out{0%{transform:translateY(0)}to{transform:translateY(-100%)}}@keyframes vkui-animation-panelheadercontext-fade-in{0%{opacity:0}to{opacity:1}}@keyframes vkui-animation-panelheadercontext-fade-out{0%{opacity:1}to{opacity:0}}

package/dist/cssm/components/PanelHeaderEdit/PanelHeaderEdit.js

@@ -1,6 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["isActive", "editLabel", "doneLabel"];
 import * as React from 'react';
 import { Icon28DoneOutline, Icon28EditOutline } from '@vkontakte/icons';
 import { usePlatform } from '../../hooks/usePlatform';
@@ -8,20 +5,14 @@ import { Platform } from '../../lib/platform';
 import { PanelHeaderButton } from '../PanelHeaderButton/PanelHeaderButton';
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeaderEdit
- */
-export var PanelHeaderEdit = function PanelHeaderEdit(_ref) {
-  var _ref$isActive = _ref.isActive,
-    isActive = _ref$isActive === void 0 ? false : _ref$isActive,
-    _ref$editLabel = _ref.editLabel,
-    editLabel = _ref$editLabel === void 0 ? 'Редактировать' : _ref$editLabel,
-    _ref$doneLabel = _ref.doneLabel,
-    doneLabel = _ref$doneLabel === void 0 ? 'Готово' : _ref$doneLabel,
-    restProps = _objectWithoutProperties(_ref, _excluded);
-  var iOSText = isActive ? doneLabel : editLabel;
-  var AndroidIcon = isActive ? Icon28DoneOutline : Icon28EditOutline;
-  var platform = usePlatform();
-  return /*#__PURE__*/React.createElement(PanelHeaderButton, _extends({
-    "aria-label": iOSText
-  }, restProps), platform === Platform.IOS ? iOSText : /*#__PURE__*/React.createElement(AndroidIcon, null));
+ */ export const PanelHeaderEdit = ({ isActive =false , editLabel ='Редактировать' , doneLabel ='Готово' , ...restProps })=>{
+    const iOSText = isActive ? doneLabel : editLabel;
+    const AndroidIcon = isActive ? Icon28DoneOutline : Icon28EditOutline;
+    const platform = usePlatform();
+    return /*#__PURE__*/ React.createElement(PanelHeaderButton, {
+        "aria-label": iOSText,
+        ...restProps
+    }, platform === Platform.IOS ? iOSText : /*#__PURE__*/ React.createElement(AndroidIcon, null));
 };
+
 //# sourceMappingURL=PanelHeaderEdit.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderEdit.js","names":["React","Icon28DoneOutline","Icon28EditOutline","usePlatform","Platform","PanelHeaderButton","PanelHeaderEdit","isActive","editLabel","doneLabel","restProps","iOSText","AndroidIcon","platform","IOS"],"sources":["../../../../src/components/PanelHeaderEdit/PanelHeaderEdit.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon28DoneOutline, Icon28EditOutline } from '@vkontakte/icons';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { PanelHeaderButton, PanelHeaderButtonProps } from '../PanelHeaderButton/PanelHeaderButton';\n\nexport interface PanelHeaderEditProps extends PanelHeaderButtonProps {\n  /**\n   * Включен ли режим редактирования\n   */\n  isActive?: boolean;\n  /**\n   * iOS only. Текст кнопки, когда режим редактирования не активен\n   */\n  editLabel?: string;\n  /**\n   * iOS only. Текст кнопки при активном режиме редактирования для выхода из него\n   */\n  doneLabel?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderEdit\n */\nexport const PanelHeaderEdit = ({\n  isActive = false,\n  editLabel = 'Редактировать',\n  doneLabel = 'Готово',\n  ...restProps\n}: PanelHeaderEditProps) => {\n  const iOSText = isActive ? doneLabel : editLabel;\n  const AndroidIcon = isActive ? Icon28DoneOutline : Icon28EditOutline;\n  const platform = usePlatform();\n\n  return (\n    <PanelHeaderButton aria-label={iOSText} {...restProps}>\n      {platform === Platform.IOS ? iOSText : <AndroidIcon />}\n    </PanelHeaderButton>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,iBAAiB,EAAEC,iBAAiB,QAAQ,kBAAkB;AACvE,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,QAAQ,QAAQ,oBAAoB;AAC7C,SAASC,iBAAiB,QAAgC,wCAAwC;AAiBlG;AACA;AACA;AACA,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAe,OAKA;EAAA,yBAJ1BC,QAAQ;IAARA,QAAQ,8BAAG,KAAK;IAAA,sBAChBC,SAAS;IAATA,SAAS,+BAAG,eAAe;IAAA,sBAC3BC,SAAS;IAATA,SAAS,+BAAG,QAAQ;IACjBC,SAAS;EAEZ,IAAMC,OAAO,GAAGJ,QAAQ,GAAGE,SAAS,GAAGD,SAAS;EAChD,IAAMI,WAAW,GAAGL,QAAQ,GAAGN,iBAAiB,GAAGC,iBAAiB;EACpE,IAAMW,QAAQ,GAAGV,WAAW,EAAE;EAE9B,oBACE,oBAAC,iBAAiB;IAAC,cAAYQ;EAAQ,GAAKD,SAAS,GAClDG,QAAQ,KAAKT,QAAQ,CAACU,GAAG,GAAGH,OAAO,gBAAG,oBAAC,WAAW,OAAG,CACpC;AAExB,CAAC"}
+{"version":3,"sources":["../../../../src/components/PanelHeaderEdit/PanelHeaderEdit.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon28DoneOutline, Icon28EditOutline } from '@vkontakte/icons';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { PanelHeaderButton, PanelHeaderButtonProps } from '../PanelHeaderButton/PanelHeaderButton';\n\nexport interface PanelHeaderEditProps extends PanelHeaderButtonProps {\n  /**\n   * Включен ли режим редактирования\n   */\n  isActive?: boolean;\n  /**\n   * iOS only. Текст кнопки, когда режим редактирования не активен\n   */\n  editLabel?: string;\n  /**\n   * iOS only. Текст кнопки при активном режиме редактирования для выхода из него\n   */\n  doneLabel?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderEdit\n */\nexport const PanelHeaderEdit = ({\n  isActive = false,\n  editLabel = 'Редактировать',\n  doneLabel = 'Готово',\n  ...restProps\n}: PanelHeaderEditProps) => {\n  const iOSText = isActive ? doneLabel : editLabel;\n  const AndroidIcon = isActive ? Icon28DoneOutline : Icon28EditOutline;\n  const platform = usePlatform();\n\n  return (\n    <PanelHeaderButton aria-label={iOSText} {...restProps}>\n      {platform === Platform.IOS ? iOSText : <AndroidIcon />}\n    </PanelHeaderButton>\n  );\n};\n"],"names":["React","Icon28DoneOutline","Icon28EditOutline","usePlatform","Platform","PanelHeaderButton","PanelHeaderEdit","isActive","editLabel","doneLabel","restProps","iOSText","AndroidIcon","platform","aria-label","IOS"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,iBAAiB,EAAEC,iBAAiB,QAAQ,mBAAmB;AACxE,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,iBAAiB,QAAgC,yCAAyC;AAiBnG;;CAEC,GACD,OAAO,MAAMC,kBAAkB,CAAC,EAC9BC,UAAW,KAAK,CAAA,EAChBC,WAAY,gBAAe,EAC3BC,WAAY,SAAQ,EACpB,GAAGC,WACkB,GAAK;IAC1B,MAAMC,UAAUJ,WAAWE,YAAYD,SAAS;IAChD,MAAMI,cAAcL,WAAWN,oBAAoBC,iBAAiB;IACpE,MAAMW,WAAWV;IAEjB,qBACE,oBAACE;QAAkBS,cAAYH;QAAU,GAAGD,SAAS;OAClDG,aAAaT,SAASW,GAAG,GAAGJ,wBAAU,oBAACC,kBAAc;AAG5D,EAAE"}

package/dist/cssm/components/PanelHeaderSubmit/PanelHeaderSubmit.js

@@ -1,24 +1,18 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["children"];
 import * as React from 'react';
 import { Icon28DoneOutline } from '@vkontakte/icons';
 import { usePlatform } from '../../hooks/usePlatform';
 import { Platform } from '../../lib/platform';
 import { getTitleFromChildren } from '../../lib/utils';
 import { PanelHeaderButton } from '../PanelHeaderButton/PanelHeaderButton';
-
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeaderSubmit
- */
-export var PanelHeaderSubmit = function PanelHeaderSubmit(_ref) {
-  var _ref$children = _ref.children,
-    children = _ref$children === void 0 ? 'Готово' : _ref$children,
-    restProps = _objectWithoutProperties(_ref, _excluded);
-  var platform = usePlatform();
-  return /*#__PURE__*/React.createElement(PanelHeaderButton, _extends({
-    "aria-label": getTitleFromChildren(children),
-    primary: true
-  }, restProps), platform === Platform.IOS ? children : /*#__PURE__*/React.createElement(Icon28DoneOutline, null));
+ */ export const PanelHeaderSubmit = ({ children ='Готово' , ...restProps })=>{
+    const platform = usePlatform();
+    return /*#__PURE__*/ React.createElement(PanelHeaderButton, {
+        "aria-label": getTitleFromChildren(children),
+        primary: true,
+        ...restProps
+    }, platform === Platform.IOS ? children : /*#__PURE__*/ React.createElement(Icon28DoneOutline, null));
 };
+
 //# sourceMappingURL=PanelHeaderSubmit.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderSubmit.js","names":["React","Icon28DoneOutline","usePlatform","Platform","getTitleFromChildren","PanelHeaderButton","PanelHeaderSubmit","children","restProps","platform","IOS"],"sources":["../../../../src/components/PanelHeaderSubmit/PanelHeaderSubmit.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon28DoneOutline } from '@vkontakte/icons';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { getTitleFromChildren } from '../../lib/utils';\nimport { PanelHeaderButton, PanelHeaderButtonProps } from '../PanelHeaderButton/PanelHeaderButton';\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderSubmit\n */\nexport const PanelHeaderSubmit = ({\n  children = 'Готово',\n  ...restProps\n}: PanelHeaderButtonProps) => {\n  const platform = usePlatform();\n\n  return (\n    <PanelHeaderButton aria-label={getTitleFromChildren(children)} primary {...restProps}>\n      {platform === Platform.IOS ? children : <Icon28DoneOutline />}\n    </PanelHeaderButton>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,iBAAiB,QAAQ,kBAAkB;AACpD,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,QAAQ,QAAQ,oBAAoB;AAC7C,SAASC,oBAAoB,QAAQ,iBAAiB;AACtD,SAASC,iBAAiB,QAAgC,wCAAwC;;AAElG;AACA;AACA;AACA,OAAO,IAAMC,iBAAiB,GAAG,SAApBA,iBAAiB,OAGA;EAAA,yBAF5BC,QAAQ;IAARA,QAAQ,8BAAG,QAAQ;IAChBC,SAAS;EAEZ,IAAMC,QAAQ,GAAGP,WAAW,EAAE;EAE9B,oBACE,oBAAC,iBAAiB;IAAC,cAAYE,oBAAoB,CAACG,QAAQ,CAAE;IAAC,OAAO;EAAA,GAAKC,SAAS,GACjFC,QAAQ,KAAKN,QAAQ,CAACO,GAAG,GAAGH,QAAQ,gBAAG,oBAAC,iBAAiB,OAAG,CAC3C;AAExB,CAAC"}
+{"version":3,"sources":["../../../../src/components/PanelHeaderSubmit/PanelHeaderSubmit.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon28DoneOutline } from '@vkontakte/icons';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { getTitleFromChildren } from '../../lib/utils';\nimport { PanelHeaderButton, PanelHeaderButtonProps } from '../PanelHeaderButton/PanelHeaderButton';\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderSubmit\n */\nexport const PanelHeaderSubmit = ({\n  children = 'Готово',\n  ...restProps\n}: PanelHeaderButtonProps) => {\n  const platform = usePlatform();\n\n  return (\n    <PanelHeaderButton aria-label={getTitleFromChildren(children)} primary {...restProps}>\n      {platform === Platform.IOS ? children : <Icon28DoneOutline />}\n    </PanelHeaderButton>\n  );\n};\n"],"names":["React","Icon28DoneOutline","usePlatform","Platform","getTitleFromChildren","PanelHeaderButton","PanelHeaderSubmit","children","restProps","platform","aria-label","primary","IOS"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,iBAAiB,QAAQ,mBAAmB;AACrD,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,oBAAoB,QAAQ,kBAAkB;AACvD,SAASC,iBAAiB,QAAgC,yCAAyC;AAEnG;;CAEC,GACD,OAAO,MAAMC,oBAAoB,CAAC,EAChCC,UAAW,SAAQ,EACnB,GAAGC,WACoB,GAAK;IAC5B,MAAMC,WAAWP;IAEjB,qBACE,oBAACG;QAAkBK,cAAYN,qBAAqBG;QAAWI,SAAAA,IAAO;QAAE,GAAGH,SAAS;OACjFC,aAAaN,SAASS,GAAG,GAAGL,yBAAW,oBAACN,wBAAoB;AAGnE,EAAE"}

package/dist/cssm/components/PanelSpinner/PanelSpinner.js

@@ -1,24 +1,15 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["height", "style"];
 import * as React from 'react';
 import { Spinner } from '../Spinner/Spinner';
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelSpinner
- */
-export var PanelSpinner = /*#__PURE__*/React.memo(function (_ref) {
-  var _ref$height = _ref.height,
-    height = _ref$height === void 0 ? 96 : _ref$height,
-    style = _ref.style,
-    restProps = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(Spinner, _extends({
-    size: "regular"
-  }, restProps, {
-    style: _objectSpread({
-      height: height
-    }, style)
-  }));
-});
+ */ export const PanelSpinner = /*#__PURE__*/ React.memo(({ height =96 , style , ...restProps })=>/*#__PURE__*/ React.createElement(Spinner, {
+        size: "regular",
+        ...restProps,
+        style: {
+            height,
+            ...style
+        }
+    }));
 PanelSpinner.displayName = 'PanelSpinner';
+
 //# sourceMappingURL=PanelSpinner.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PanelSpinner.js","names":["React","Spinner","PanelSpinner","memo","height","style","restProps","displayName"],"sources":["../../../../src/components/PanelSpinner/PanelSpinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Spinner, SpinnerProps } from '../Spinner/Spinner';\n\nexport interface PanelSpinnerProps extends SpinnerProps {\n  height?: number;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelSpinner\n */\nexport const PanelSpinner = React.memo(\n  ({ height = 96, style, ...restProps }: PanelSpinnerProps) => (\n    <Spinner size=\"regular\" {...restProps} style={{ height, ...style }} />\n  ),\n);\n\nPanelSpinner.displayName = 'PanelSpinner';\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,OAAO,QAAsB,oBAAoB;AAM1D;AACA;AACA;AACA,OAAO,IAAMC,YAAY,gBAAGF,KAAK,CAACG,IAAI,CACpC;EAAA,uBAAGC,MAAM;IAANA,MAAM,4BAAG,EAAE;IAAEC,KAAK,QAALA,KAAK;IAAKC,SAAS;EAAA,oBACjC,oBAAC,OAAO;IAAC,IAAI,EAAC;EAAS,GAAKA,SAAS;IAAE,KAAK;MAAIF,MAAM,EAANA;IAAM,GAAKC,KAAK;EAAG,GAAG;AAAA,CACvE,CACF;AAEDH,YAAY,CAACK,WAAW,GAAG,cAAc"}
+{"version":3,"sources":["../../../../src/components/PanelSpinner/PanelSpinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Spinner, SpinnerProps } from '../Spinner/Spinner';\n\nexport interface PanelSpinnerProps extends SpinnerProps {\n  height?: number;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelSpinner\n */\nexport const PanelSpinner = React.memo(\n  ({ height = 96, style, ...restProps }: PanelSpinnerProps) => (\n    <Spinner size=\"regular\" {...restProps} style={{ height, ...style }} />\n  ),\n);\n\nPanelSpinner.displayName = 'PanelSpinner';\n"],"names":["React","Spinner","PanelSpinner","memo","height","style","restProps","size","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,OAAO,QAAsB,qBAAqB;AAM3D;;CAEC,GACD,OAAO,MAAMC,6BAAeF,MAAMG,IAAI,CACpC,CAAC,EAAEC,QAAS,GAAE,EAAEC,MAAK,EAAE,GAAGC,WAA8B,iBACtD,oBAACL;QAAQM,MAAK;QAAW,GAAGD,SAAS;QAAED,OAAO;YAAED;YAAQ,GAAGC,KAAK;QAAC;QAEnE;AAEFH,aAAaM,WAAW,GAAG"}

package/dist/cssm/components/Placeholder/Placeholder.js

@@ -1,39 +1,27 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["icon", "header", "action", "children", "stretched", "getRootRef", "className"];
 import * as React from 'react';
 import { classNames, hasReactNode } from '@vkontakte/vkjs';
 import { Headline } from '../Typography/Headline/Headline';
 import { Title } from '../Typography/Title/Title';
-import "./Placeholder.module.css";
+import styles from './Placeholder.module.css';
 /**
  * @see https://vkcom.github.io/VKUI/#/Placeholder
- */
-export var Placeholder = function Placeholder(_ref) {
-  var icon = _ref.icon,
-    header = _ref.header,
-    action = _ref.action,
-    children = _ref.children,
-    stretched = _ref.stretched,
-    getRootRef = _ref.getRootRef,
-    className = _ref.className,
-    restProps = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
-    ref: getRootRef,
-    className: classNames("vkuiPlaceholder", stretched && "vkuiPlaceholder--stretched", className)
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "vkuiPlaceholder__in"
-  }, hasReactNode(icon) && /*#__PURE__*/React.createElement("div", {
-    className: "vkuiPlaceholder__icon"
-  }, icon), hasReactNode(header) && /*#__PURE__*/React.createElement(Title, {
-    level: "2",
-    weight: "2",
-    className: "vkuiPlaceholder__header"
-  }, header), hasReactNode(children) && /*#__PURE__*/React.createElement(Headline, {
-    weight: "3",
-    className: "vkuiPlaceholder__text"
-  }, children), hasReactNode(action) && /*#__PURE__*/React.createElement("div", {
-    className: "vkuiPlaceholder__action"
-  }, action)));
-};
+ */ export const Placeholder = ({ icon , header , action , children , stretched , getRootRef , className , ...restProps })=>/*#__PURE__*/ React.createElement("div", {
+        ...restProps,
+        ref: getRootRef,
+        className: classNames(styles['Placeholder'], stretched && styles['Placeholder--stretched'], className)
+    }, /*#__PURE__*/ React.createElement("div", {
+        className: styles['Placeholder__in']
+    }, hasReactNode(icon) && /*#__PURE__*/ React.createElement("div", {
+        className: styles['Placeholder__icon']
+    }, icon), hasReactNode(header) && /*#__PURE__*/ React.createElement(Title, {
+        level: "2",
+        weight: "2",
+        className: styles['Placeholder__header']
+    }, header), hasReactNode(children) && /*#__PURE__*/ React.createElement(Headline, {
+        weight: "3",
+        className: styles['Placeholder__text']
+    }, children), hasReactNode(action) && /*#__PURE__*/ React.createElement("div", {
+        className: styles['Placeholder__action']
+    }, action)));
+
 //# sourceMappingURL=Placeholder.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Placeholder.js","names":["React","classNames","hasReactNode","Headline","Title","Placeholder","icon","header","action","children","stretched","getRootRef","className","restProps"],"sources":["../../../../src/components/Placeholder/Placeholder.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { HasRootRef } from '../../types';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './Placeholder.module.css';\n\nexport interface PlaceholderProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Иконка\n   */\n  icon?: React.ReactNode;\n  /**\n   * Заголовок плейсхолдера\n   */\n  header?: React.ReactNode;\n  /**\n   * Кнопка действия\n   */\n  action?: React.ReactNode;\n  /**\n   * Растягивает плейсхолдер на весь экран, но в таком случае на экране должен быть только плейсхолдер\n   */\n  stretched?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Placeholder\n */\nexport const Placeholder = ({\n  icon,\n  header,\n  action,\n  children,\n  stretched,\n  getRootRef,\n  className,\n  ...restProps\n}: PlaceholderProps) => (\n  <div\n    {...restProps}\n    ref={getRootRef}\n    className={classNames(\n      styles['Placeholder'],\n      stretched && styles['Placeholder--stretched'],\n      className,\n    )}\n  >\n    <div className={styles['Placeholder__in']}>\n      {hasReactNode(icon) && <div className={styles['Placeholder__icon']}>{icon}</div>}\n      {hasReactNode(header) && (\n        <Title level=\"2\" weight=\"2\" className={styles['Placeholder__header']}>\n          {header}\n        </Title>\n      )}\n      {hasReactNode(children) && (\n        <Headline weight=\"3\" className={styles['Placeholder__text']}>\n          {children}\n        </Headline>\n      )}\n      {hasReactNode(action) && <div className={styles['Placeholder__action']}>{action}</div>}\n    </div>\n  </div>\n);\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAE1D,SAASC,QAAQ,QAAQ,iCAAiC;AAC1D,SAASC,KAAK,QAAQ,2BAA2B;AAAC;AAwBlD;AACA;AACA;AACA,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAW;EAAA,IACtBC,IAAI,QAAJA,IAAI;IACJC,MAAM,QAANA,MAAM;IACNC,MAAM,QAANA,MAAM;IACNC,QAAQ,QAARA,QAAQ;IACRC,SAAS,QAATA,SAAS;IACTC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACNC,SAAS;EAAA,oBAEZ,wCACMA,SAAS;IACb,GAAG,EAAEF,UAAW;IAChB,SAAS,EAAEV,UAAU,oBAEnBS,SAAS,gCAAoC,EAC7CE,SAAS;EACT,iBAEF;IAAK,SAAS;EAA4B,GACvCV,YAAY,CAACI,IAAI,CAAC,iBAAI;IAAK,SAAS;EAA8B,GAAEA,IAAI,CAAO,EAC/EJ,YAAY,CAACK,MAAM,CAAC,iBACnB,oBAAC,KAAK;IAAC,KAAK,EAAC,GAAG;IAAC,MAAM,EAAC,GAAG;IAAC,SAAS;EAAgC,GAClEA,MAAM,CAEV,EACAL,YAAY,CAACO,QAAQ,CAAC,iBACrB,oBAAC,QAAQ;IAAC,MAAM,EAAC,GAAG;IAAC,SAAS;EAA8B,GACzDA,QAAQ,CAEZ,EACAP,YAAY,CAACM,MAAM,CAAC,iBAAI;IAAK,SAAS;EAAgC,GAAEA,MAAM,CAAO,CAClF,CACF;AAAA,CACP"}
+{"version":3,"sources":["../../../../src/components/Placeholder/Placeholder.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { HasRootRef } from '../../types';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Title } from '../Typography/Title/Title';\nimport styles from './Placeholder.module.css';\n\nexport interface PlaceholderProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Иконка\n   */\n  icon?: React.ReactNode;\n  /**\n   * Заголовок плейсхолдера\n   */\n  header?: React.ReactNode;\n  /**\n   * Кнопка действия\n   */\n  action?: React.ReactNode;\n  /**\n   * Растягивает плейсхолдер на весь экран, но в таком случае на экране должен быть только плейсхолдер\n   */\n  stretched?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Placeholder\n */\nexport const Placeholder = ({\n  icon,\n  header,\n  action,\n  children,\n  stretched,\n  getRootRef,\n  className,\n  ...restProps\n}: PlaceholderProps) => (\n  <div\n    {...restProps}\n    ref={getRootRef}\n    className={classNames(\n      styles['Placeholder'],\n      stretched && styles['Placeholder--stretched'],\n      className,\n    )}\n  >\n    <div className={styles['Placeholder__in']}>\n      {hasReactNode(icon) && <div className={styles['Placeholder__icon']}>{icon}</div>}\n      {hasReactNode(header) && (\n        <Title level=\"2\" weight=\"2\" className={styles['Placeholder__header']}>\n          {header}\n        </Title>\n      )}\n      {hasReactNode(children) && (\n        <Headline weight=\"3\" className={styles['Placeholder__text']}>\n          {children}\n        </Headline>\n      )}\n      {hasReactNode(action) && <div className={styles['Placeholder__action']}>{action}</div>}\n    </div>\n  </div>\n);\n"],"names":["React","classNames","hasReactNode","Headline","Title","styles","Placeholder","icon","header","action","children","stretched","getRootRef","className","restProps","div","ref","level","weight"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAE3D,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,KAAK,QAAQ,4BAA4B;AAClD,OAAOC,YAAY,2BAA2B;AAuB9C;;CAEC,GACD,OAAO,MAAMC,cAAc,CAAC,EAC1BC,KAAI,EACJC,OAAM,EACNC,OAAM,EACNC,SAAQ,EACRC,UAAS,EACTC,WAAU,EACVC,UAAS,EACT,GAAGC,WACc,iBACjB,oBAACC;QACE,GAAGD,SAAS;QACbE,KAAKJ;QACLC,WAAWZ,WACTI,MAAM,CAAC,cAAc,EACrBM,aAAaN,MAAM,CAAC,yBAAyB,EAC7CQ;qBAGF,oBAACE;QAAIF,WAAWR,MAAM,CAAC,kBAAkB;OACtCH,aAAaK,uBAAS,oBAACQ;QAAIF,WAAWR,MAAM,CAAC,oBAAoB;OAAGE,OACpEL,aAAaM,yBACZ,oBAACJ;QAAMa,OAAM;QAAIC,QAAO;QAAIL,WAAWR,MAAM,CAAC,sBAAsB;OACjEG,SAGJN,aAAaQ,2BACZ,oBAACP;QAASe,QAAO;QAAIL,WAAWR,MAAM,CAAC,oBAAoB;OACxDK,WAGJR,aAAaO,yBAAW,oBAACM;QAAIF,WAAWR,MAAM,CAAC,sBAAsB;OAAGI,UAG7E"}

package/dist/cssm/components/PlatformProvider/PlatformProvider.js

@@ -7,16 +7,14 @@ import { ConfigProviderOverride } from '../ConfigProvider/ConfigProviderOverride
  *
  * @version 5.1.0
  * @see https://vkcom.github.io/VKUI/#/PlatformProvider
- */
-export function PlatformProvider(_ref) {
-  var value = _ref.value,
-    children = _ref.children;
-  var appearance = useAppearance();
-  return /*#__PURE__*/React.createElement(ConfigProviderOverride, {
-    platform: value
-  }, /*#__PURE__*/React.createElement(TokensClassProvider, {
-    platform: value,
-    appearance: appearance
-  }, children));
+ */ export function PlatformProvider({ value , children  }) {
+    const appearance = useAppearance();
+    return /*#__PURE__*/ React.createElement(ConfigProviderOverride, {
+        platform: value
+    }, /*#__PURE__*/ React.createElement(TokensClassProvider, {
+        platform: value,
+        appearance: appearance
+    }, children));
 }
+
 //# sourceMappingURL=PlatformProvider.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PlatformProvider.js","names":["React","useAppearance","TokensClassProvider","ConfigProviderOverride","PlatformProvider","value","children","appearance"],"sources":["../../../../src/components/PlatformProvider/PlatformProvider.tsx"],"sourcesContent":["import React from 'react';\nimport { useAppearance } from '../../hooks/useAppearance';\nimport { PlatformType } from '../../lib/platform';\nimport { TokensClassProvider } from '../../lib/tokensClassProvider';\nimport { ConfigProviderOverride } from '../ConfigProvider/ConfigProviderOverride';\n\nexport interface PlatformProviderProps {\n  /**\n   * Платформа\n   */\n  value: PlatformType;\n  children: React.ReactNode;\n}\n\n/**\n * Компонент, позволяющий переопределить платформу для части приложения\n *\n * @version 5.1.0\n * @see https://vkcom.github.io/VKUI/#/PlatformProvider\n */\nexport function PlatformProvider({ value, children }: PlatformProviderProps) {\n  const appearance = useAppearance();\n\n  return (\n    <ConfigProviderOverride platform={value}>\n      <TokensClassProvider platform={value} appearance={appearance}>\n        {children}\n      </TokensClassProvider>\n    </ConfigProviderOverride>\n  );\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,aAAa,QAAQ,2BAA2B;AAEzD,SAASC,mBAAmB,QAAQ,+BAA+B;AACnE,SAASC,sBAAsB,QAAQ,0CAA0C;AAUjF;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,gBAAgB,OAA6C;EAAA,IAA1CC,KAAK,QAALA,KAAK;IAAEC,QAAQ,QAARA,QAAQ;EAChD,IAAMC,UAAU,GAAGN,aAAa,EAAE;EAElC,oBACE,oBAAC,sBAAsB;IAAC,QAAQ,EAAEI;EAAM,gBACtC,oBAAC,mBAAmB;IAAC,QAAQ,EAAEA,KAAM;IAAC,UAAU,EAAEE;EAAW,GAC1DD,QAAQ,CACW,CACC;AAE7B"}
+{"version":3,"sources":["../../../../src/components/PlatformProvider/PlatformProvider.tsx"],"sourcesContent":["import React from 'react';\nimport { useAppearance } from '../../hooks/useAppearance';\nimport { PlatformType } from '../../lib/platform';\nimport { TokensClassProvider } from '../../lib/tokensClassProvider';\nimport { ConfigProviderOverride } from '../ConfigProvider/ConfigProviderOverride';\n\nexport interface PlatformProviderProps {\n  /**\n   * Платформа\n   */\n  value: PlatformType;\n  children: React.ReactNode;\n}\n\n/**\n * Компонент, позволяющий переопределить платформу для части приложения\n *\n * @version 5.1.0\n * @see https://vkcom.github.io/VKUI/#/PlatformProvider\n */\nexport function PlatformProvider({ value, children }: PlatformProviderProps) {\n  const appearance = useAppearance();\n\n  return (\n    <ConfigProviderOverride platform={value}>\n      <TokensClassProvider platform={value} appearance={appearance}>\n        {children}\n      </TokensClassProvider>\n    </ConfigProviderOverride>\n  );\n}\n"],"names":["React","useAppearance","TokensClassProvider","ConfigProviderOverride","PlatformProvider","value","children","appearance","platform"],"mappings":"AAAA,OAAOA,WAAW,QAAQ;AAC1B,SAASC,aAAa,QAAQ,4BAA4B;AAE1D,SAASC,mBAAmB,QAAQ,gCAAgC;AACpE,SAASC,sBAAsB,QAAQ,2CAA2C;AAUlF;;;;;CAKC,GACD,OAAO,SAASC,iBAAiB,EAAEC,MAAK,EAAEC,SAAQ,EAAyB,EAAE;IAC3E,MAAMC,aAAaN;IAEnB,qBACE,oBAACE;QAAuBK,UAAUH;qBAChC,oBAACH;QAAoBM,UAAUH;QAAOE,YAAYA;OAC/CD;AAIT,CAAC"}

package/dist/cssm/components/PopoutRoot/PopoutRoot.js

@@ -1,41 +1,33 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["popout", "modal", "children", "getRootRef", "className"];
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
 import { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';
 import { blurActiveElement, useDOM } from '../../lib/dom';
 import { AppRootPortal } from '../AppRoot/AppRootPortal';
-import "./PopoutRoot.module.css";
-var PopoutRootPopout = function PopoutRootPopout(_ref) {
-  var children = _ref.children;
-  var _useAdaptivityWithJSM = useAdaptivityWithJSMediaQueries(),
-    isDesktop = _useAdaptivityWithJSM.isDesktop;
-  return /*#__PURE__*/React.createElement("div", {
-    className: classNames("vkuiPopoutRoot__popout", isDesktop && "vkuiPopoutRoot__popout--absolute")
-  }, children);
+import styles from './PopoutRoot.module.css';
+const PopoutRootPopout = ({ children  })=>{
+    const { isDesktop  } = useAdaptivityWithJSMediaQueries();
+    return /*#__PURE__*/ React.createElement("div", {
+        className: classNames(styles['PopoutRoot__popout'], isDesktop && styles['PopoutRoot__popout--absolute'])
+    }, children);
 };
-var PopoutRootModal = function PopoutRootModal(_ref2) {
-  var children = _ref2.children;
-  return /*#__PURE__*/React.createElement("div", {
-    className: "vkuiPopoutRoot__modal"
-  }, children);
+const PopoutRootModal = ({ children  })=>{
+    return /*#__PURE__*/ React.createElement("div", {
+        className: styles['PopoutRoot__modal']
+    }, children);
 };
-export var PopoutRoot = function PopoutRoot(_ref3) {
-  var popout = _ref3.popout,
-    modal = _ref3.modal,
-    children = _ref3.children,
-    getRootRef = _ref3.getRootRef,
-    className = _ref3.className,
-    restProps = _objectWithoutProperties(_ref3, _excluded);
-  var _useDOM = useDOM(),
-    document = _useDOM.document;
-  React.useEffect(function () {
-    popout && blurActiveElement(document);
-  }, [document, popout]);
-  return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
-    className: classNames("vkuiPopoutRoot", className),
-    ref: getRootRef
-  }), children, /*#__PURE__*/React.createElement(AppRootPortal, null, !!popout && /*#__PURE__*/React.createElement(PopoutRootPopout, null, popout), !!modal && /*#__PURE__*/React.createElement(PopoutRootModal, null, modal)));
+export const PopoutRoot = ({ popout , modal , children , getRootRef , className , ...restProps })=>{
+    const { document  } = useDOM();
+    React.useEffect(()=>{
+        popout && blurActiveElement(document);
+    }, [
+        document,
+        popout
+    ]);
+    return /*#__PURE__*/ React.createElement("div", {
+        ...restProps,
+        className: classNames(styles['PopoutRoot'], className),
+        ref: getRootRef
+    }, children, /*#__PURE__*/ React.createElement(AppRootPortal, null, !!popout && /*#__PURE__*/ React.createElement(PopoutRootPopout, null, popout), !!modal && /*#__PURE__*/ React.createElement(PopoutRootModal, null, modal)));
 };
+
 //# sourceMappingURL=PopoutRoot.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PopoutRoot.js","names":["React","classNames","useAdaptivityWithJSMediaQueries","blurActiveElement","useDOM","AppRootPortal","PopoutRootPopout","children","isDesktop","PopoutRootModal","PopoutRoot","popout","modal","getRootRef","className","restProps","document","useEffect"],"sources":["../../../../src/components/PopoutRoot/PopoutRoot.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { blurActiveElement, useDOM } from '../../lib/dom';\nimport { HasRootRef } from '../../types';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport styles from './PopoutRoot.module.css';\n\ninterface PopoutRootPopoutProps {\n  children: React.ReactNode;\n}\n\nconst PopoutRootPopout = ({ children }: PopoutRootPopoutProps) => {\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n\n  return (\n    <div\n      className={classNames(\n        styles['PopoutRoot__popout'],\n        isDesktop && styles['PopoutRoot__popout--absolute'],\n      )}\n    >\n      {children}\n    </div>\n  );\n};\n\ninterface PopoutRootModalProps {\n  children: React.ReactNode;\n}\n\nconst PopoutRootModal = ({ children }: PopoutRootModalProps) => {\n  return <div className={styles['PopoutRoot__modal']}>{children}</div>;\n};\n\nexport interface PopoutRootProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  popout?: React.ReactNode;\n  modal?: React.ReactNode;\n}\n\nexport const PopoutRoot = ({\n  popout,\n  modal,\n  children,\n  getRootRef,\n  className,\n  ...restProps\n}: PopoutRootProps) => {\n  const { document } = useDOM();\n\n  React.useEffect(() => {\n    popout && blurActiveElement(document);\n  }, [document, popout]);\n\n  return (\n    <div {...restProps} className={classNames(styles['PopoutRoot'], className)} ref={getRootRef}>\n      {children}\n      <AppRootPortal>\n        {!!popout && <PopoutRootPopout>{popout}</PopoutRootPopout>}\n        {!!modal && <PopoutRootModal>{modal}</PopoutRootModal>}\n      </AppRootPortal>\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,iBAAiB,EAAEC,MAAM,QAAQ,eAAe;AAEzD,SAASC,aAAa,QAAQ,0BAA0B;AAAC;AAOzD,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAgB,OAA4C;EAAA,IAAtCC,QAAQ,QAARA,QAAQ;EAClC,4BAAsBL,+BAA+B,EAAE;IAA/CM,SAAS,yBAATA,SAAS;EAEjB,oBACE;IACE,SAAS,EAAEP,UAAU,2BAEnBO,SAAS,sCAA0C;EACnD,GAEDD,QAAQ,CACL;AAEV,CAAC;AAMD,IAAME,eAAe,GAAG,SAAlBA,eAAe,QAA2C;EAAA,IAArCF,QAAQ,SAARA,QAAQ;EACjC,oBAAO;IAAK,SAAS;EAA8B,GAAEA,QAAQ,CAAO;AACtE,CAAC;AASD,OAAO,IAAMG,UAAU,GAAG,SAAbA,UAAU,QAOA;EAAA,IANrBC,MAAM,SAANA,MAAM;IACNC,KAAK,SAALA,KAAK;IACLL,QAAQ,SAARA,QAAQ;IACRM,UAAU,SAAVA,UAAU;IACVC,SAAS,SAATA,SAAS;IACNC,SAAS;EAEZ,cAAqBX,MAAM,EAAE;IAArBY,QAAQ,WAARA,QAAQ;EAEhBhB,KAAK,CAACiB,SAAS,CAAC,YAAM;IACpBN,MAAM,IAAIR,iBAAiB,CAACa,QAAQ,CAAC;EACvC,CAAC,EAAE,CAACA,QAAQ,EAAEL,MAAM,CAAC,CAAC;EAEtB,oBACE,wCAASI,SAAS;IAAE,SAAS,EAAEd,UAAU,mBAAuBa,SAAS,CAAE;IAAC,GAAG,EAAED;EAAW,IACzFN,QAAQ,eACT,oBAAC,aAAa,QACX,CAAC,CAACI,MAAM,iBAAI,oBAAC,gBAAgB,QAAEA,MAAM,CAAoB,EACzD,CAAC,CAACC,KAAK,iBAAI,oBAAC,eAAe,QAAEA,KAAK,CAAmB,CACxC,CACZ;AAEV,CAAC"}
+{"version":3,"sources":["../../../../src/components/PopoutRoot/PopoutRoot.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { blurActiveElement, useDOM } from '../../lib/dom';\nimport { HasRootRef } from '../../types';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport styles from './PopoutRoot.module.css';\n\ninterface PopoutRootPopoutProps {\n  children: React.ReactNode;\n}\n\nconst PopoutRootPopout = ({ children }: PopoutRootPopoutProps) => {\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n\n  return (\n    <div\n      className={classNames(\n        styles['PopoutRoot__popout'],\n        isDesktop && styles['PopoutRoot__popout--absolute'],\n      )}\n    >\n      {children}\n    </div>\n  );\n};\n\ninterface PopoutRootModalProps {\n  children: React.ReactNode;\n}\n\nconst PopoutRootModal = ({ children }: PopoutRootModalProps) => {\n  return <div className={styles['PopoutRoot__modal']}>{children}</div>;\n};\n\nexport interface PopoutRootProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  popout?: React.ReactNode;\n  modal?: React.ReactNode;\n}\n\nexport const PopoutRoot = ({\n  popout,\n  modal,\n  children,\n  getRootRef,\n  className,\n  ...restProps\n}: PopoutRootProps) => {\n  const { document } = useDOM();\n\n  React.useEffect(() => {\n    popout && blurActiveElement(document);\n  }, [document, popout]);\n\n  return (\n    <div {...restProps} className={classNames(styles['PopoutRoot'], className)} ref={getRootRef}>\n      {children}\n      <AppRootPortal>\n        {!!popout && <PopoutRootPopout>{popout}</PopoutRootPopout>}\n        {!!modal && <PopoutRootModal>{modal}</PopoutRootModal>}\n      </AppRootPortal>\n    </div>\n  );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","blurActiveElement","useDOM","AppRootPortal","styles","PopoutRootPopout","children","isDesktop","div","className","PopoutRootModal","PopoutRoot","popout","modal","getRootRef","restProps","document","useEffect","ref"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,8CAA8C;AAC9F,SAASC,iBAAiB,EAAEC,MAAM,QAAQ,gBAAgB;AAE1D,SAASC,aAAa,QAAQ,2BAA2B;AACzD,OAAOC,YAAY,0BAA0B;AAM7C,MAAMC,mBAAmB,CAAC,EAAEC,SAAQ,EAAyB,GAAK;IAChE,MAAM,EAAEC,UAAS,EAAE,GAAGP;IAEtB,qBACE,oBAACQ;QACCC,WAAWV,WACTK,MAAM,CAAC,qBAAqB,EAC5BG,aAAaH,MAAM,CAAC,+BAA+B;OAGpDE;AAGP;AAMA,MAAMI,kBAAkB,CAAC,EAAEJ,SAAQ,EAAwB,GAAK;IAC9D,qBAAO,oBAACE;QAAIC,WAAWL,MAAM,CAAC,oBAAoB;OAAGE;AACvD;AASA,OAAO,MAAMK,aAAa,CAAC,EACzBC,OAAM,EACNC,MAAK,EACLP,SAAQ,EACRQ,WAAU,EACVL,UAAS,EACT,GAAGM,WACa,GAAK;IACrB,MAAM,EAAEC,SAAQ,EAAE,GAAGd;IAErBJ,MAAMmB,SAAS,CAAC,IAAM;QACpBL,UAAUX,kBAAkBe;IAC9B,GAAG;QAACA;QAAUJ;KAAO;IAErB,qBACE,oBAACJ;QAAK,GAAGO,SAAS;QAAEN,WAAWV,WAAWK,MAAM,CAAC,aAAa,EAAEK;QAAYS,KAAKJ;OAC9ER,wBACD,oBAACH,qBACE,CAAC,CAACS,wBAAU,oBAACP,wBAAkBO,SAC/B,CAAC,CAACC,uBAAS,oBAACH,uBAAiBG;AAItC,EAAE"}

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

@@ -1 +1 @@
-.vkuiPopoutRoot{height:100%;position:relative;width:100%}.vkuiPopoutRoot__popout{height:100%;left:0;position:fixed;top:0;width:100%;z-index:100;z-index:var(--vkui--z_index_popout)}.vkuiPopoutRoot__popout--absolute{position:absolute}.vkuiPopoutRoot__modal{height:100%;left:0;position:fixed;top:0;width:100%;z-index:99;z-index:var(--vkui--z_index_modal)}.vkuiPopoutRoot__modal:empty{display:none}
+.vkuiPopoutRoot{height:100%;position:relative;width:100%}.vkuiPopoutRoot__popout{height:100%;left:0;position:fixed;top:0;width:100%;z-index:100;z-index:var(--vkui--z_index_popout)}.vkuiPopoutRoot__popout--absolute{position:absolute}.vkuiPopoutRoot__modal{height:100%;left:0;position:fixed;top:0;width:100%;z-index:99;z-index:var(--vkui--z_index_modal)}.vkuiPopoutRoot__modal:empty,.vkuiPopoutRoot__popout:empty{display:none}

package/dist/cssm/components/PopoutWrapper/PopoutWrapper.js

@@ -1,7 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["alignY", "alignX", "closing", "hasMask", "fixed", "children", "onClick", "className"];
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
 import { useGlobalEventListener } from '../../hooks/useGlobalEventListener';
@@ -9,66 +5,50 @@ import { usePlatform } from '../../hooks/usePlatform';
 import { useTimeout } from '../../hooks/useTimeout';
 import { useDOM } from '../../lib/dom';
 import { Platform } from '../../lib/platform';
-import "./PopoutWrapper.module.css";
+import styles from './PopoutWrapper.module.css';
 /**
  * @see https://vkcom.github.io/VKUI/#/PopoutWrapper
- */
-export var PopoutWrapper = function PopoutWrapper(_ref) {
-  var _ref$alignY = _ref.alignY,
-    alignY = _ref$alignY === void 0 ? 'center' : _ref$alignY,
-    _ref$alignX = _ref.alignX,
-    alignX = _ref$alignX === void 0 ? 'center' : _ref$alignX,
-    _ref$closing = _ref.closing,
-    closing = _ref$closing === void 0 ? false : _ref$closing,
-    _ref$hasMask = _ref.hasMask,
-    hasMask = _ref$hasMask === void 0 ? true : _ref$hasMask,
-    _ref$fixed = _ref.fixed,
-    fixed = _ref$fixed === void 0 ? true : _ref$fixed,
-    children = _ref.children,
-    onClick = _ref.onClick,
-    className = _ref.className,
-    restProps = _objectWithoutProperties(_ref, _excluded);
-  var platform = usePlatform();
-  var _React$useState = React.useState(!hasMask),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    opened = _React$useState2[0],
-    setOpened = _React$useState2[1];
-  var elRef = React.useRef(null);
-  var onFadeInEnd = function onFadeInEnd(e) {
-    if (!e || e.animationName === 'vkui-animation-full-fade-in') {
-      setOpened(true);
-    }
-  };
-  var animationFinishFallback = useTimeout(onFadeInEnd, platform === Platform.IOS ? 300 : 200);
-  React.useEffect(function () {
-    !opened && animationFinishFallback.set();
-  }, [animationFinishFallback, opened]);
-  var _useDOM = useDOM(),
-    window = _useDOM.window;
-  useGlobalEventListener(window, 'touchmove', function (e) {
-    return e.preventDefault();
-  }, {
-    passive: false
-  });
-  return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
-    className: classNames("vkuiPopoutWrapper", styles["PopoutWrapper--alignY-".concat(alignY)], styles["PopoutWrapper--alignX-".concat(alignX)], closing && "vkuiPopoutWrapper--closing", opened && "vkuiPopoutWrapper--opened", fixed && "vkuiPopoutWrapper--fixed", hasMask && "vkuiPopoutWrapper--masked", className),
-    onAnimationEnd: opened ? undefined : onFadeInEnd,
-    ref: elRef
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "vkuiPopoutWrapper__container"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "vkuiPopoutWrapper__overlay",
-    onClick: onClick
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "vkuiPopoutWrapper__content"
-  }, children)));
-};
-var styles = {
-  "PopoutWrapper--alignY-center": "vkuiPopoutWrapper--alignY-center",
-  "PopoutWrapper--alignY-bottom": "vkuiPopoutWrapper--alignY-bottom",
-  "PopoutWrapper--alignY-top": "vkuiPopoutWrapper--alignY-top",
-  "PopoutWrapper--alignX-center": "vkuiPopoutWrapper--alignX-center",
-  "PopoutWrapper--alignX-left": "vkuiPopoutWrapper--alignX-left",
-  "PopoutWrapper--alignX-right": "vkuiPopoutWrapper--alignX-right"
+ */ export const PopoutWrapper = ({ alignY ='center' , alignX ='center' , closing =false , hasMask =true , fixed =true , children , onClick , className , ...restProps })=>{
+    const platform = usePlatform();
+    const [opened, setOpened] = React.useState(!hasMask);
+    const elRef = React.useRef(null);
+    const onFadeInEnd = (e)=>{
+        if (!e || e.animationName === 'vkui-animation-full-fade-in') {
+            setOpened(true);
+        }
+    };
+    const animationFinishFallback = useTimeout(onFadeInEnd, platform === Platform.IOS ? 300 : 200);
+    React.useEffect(()=>{
+        !opened && animationFinishFallback.set();
+    }, [
+        animationFinishFallback,
+        opened
+    ]);
+    const { window  } = useDOM();
+    useGlobalEventListener(window, 'touchmove', (e)=>e.preventDefault(), {
+        passive: false
+    });
+    return /*#__PURE__*/ React.createElement("div", {
+        ...restProps,
+        className: classNames(styles['PopoutWrapper'], {
+            center: styles['PopoutWrapper--alignY-center'],
+            top: styles['PopoutWrapper--alignY-top'],
+            bottom: styles['PopoutWrapper--alignY-bottom']
+        }[alignY], {
+            center: styles['PopoutWrapper--alignX-center'],
+            left: styles['PopoutWrapper--alignX-left'],
+            right: styles['PopoutWrapper--alignX-right']
+        }[alignX], closing && styles['PopoutWrapper--closing'], opened && styles['PopoutWrapper--opened'], fixed && styles['PopoutWrapper--fixed'], hasMask && styles['PopoutWrapper--masked'], className),
+        onAnimationEnd: opened ? undefined : onFadeInEnd,
+        ref: elRef
+    }, /*#__PURE__*/ React.createElement("div", {
+        className: styles['PopoutWrapper__container']
+    }, /*#__PURE__*/ React.createElement("div", {
+        className: styles['PopoutWrapper__overlay'],
+        onClick: onClick
+    }), /*#__PURE__*/ React.createElement("div", {
+        className: styles['PopoutWrapper__content']
+    }, children)));
 };
+
 //# sourceMappingURL=PopoutWrapper.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PopoutWrapper.js","names":["React","classNames","useGlobalEventListener","usePlatform","useTimeout","useDOM","Platform","PopoutWrapper","alignY","alignX","closing","hasMask","fixed","children","onClick","className","restProps","platform","useState","opened","setOpened","elRef","useRef","onFadeInEnd","e","animationName","animationFinishFallback","IOS","useEffect","set","window","preventDefault","passive","styles","undefined"],"sources":["../../../../src/components/PopoutWrapper/PopoutWrapper.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { useDOM } from '../../lib/dom';\nimport { Platform } from '../../lib/platform';\nimport styles from './PopoutWrapper.module.css';\n\nexport interface PopoutWrapperProps extends React.HTMLAttributes<HTMLDivElement> {\n  hasMask?: boolean;\n  fixed?: boolean;\n  alignY?: 'top' | 'center' | 'bottom';\n  alignX?: 'left' | 'center' | 'right';\n  closing?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PopoutWrapper\n */\nexport const PopoutWrapper = ({\n  alignY = 'center',\n  alignX = 'center',\n  closing = false,\n  hasMask = true,\n  fixed = true,\n  children,\n  onClick,\n  className,\n  ...restProps\n}: PopoutWrapperProps) => {\n  const platform = usePlatform();\n  const [opened, setOpened] = React.useState(!hasMask);\n  const elRef = React.useRef<HTMLDivElement>(null);\n\n  const onFadeInEnd = (e?: React.AnimationEvent) => {\n    if (!e || e.animationName === 'vkui-animation-full-fade-in') {\n      setOpened(true);\n    }\n  };\n  const animationFinishFallback = useTimeout(onFadeInEnd, platform === Platform.IOS ? 300 : 200);\n  React.useEffect(() => {\n    !opened && animationFinishFallback.set();\n  }, [animationFinishFallback, opened]);\n\n  const { window } = useDOM();\n  useGlobalEventListener(window, 'touchmove', (e) => e.preventDefault(), {\n    passive: false,\n  });\n\n  return (\n    <div\n      {...restProps}\n      className={classNames(\n        styles['PopoutWrapper'],\n        styles[`PopoutWrapper--alignY-${alignY}`],\n        styles[`PopoutWrapper--alignX-${alignX}`],\n        closing && styles['PopoutWrapper--closing'],\n        opened && styles['PopoutWrapper--opened'],\n        fixed && styles['PopoutWrapper--fixed'],\n        hasMask && styles['PopoutWrapper--masked'],\n        className,\n      )}\n      onAnimationEnd={opened ? undefined : onFadeInEnd}\n      ref={elRef}\n    >\n      <div className={styles['PopoutWrapper__container']}>\n        <div className={styles['PopoutWrapper__overlay']} onClick={onClick} />\n        <div className={styles['PopoutWrapper__content']}>{children}</div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,sBAAsB,QAAQ,oCAAoC;AAC3E,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,UAAU,QAAQ,wBAAwB;AACnD,SAASC,MAAM,QAAQ,eAAe;AACtC,SAASC,QAAQ,QAAQ,oBAAoB;AAAC;AAW9C;AACA;AACA;AACA,OAAO,IAAMC,aAAa,GAAG,SAAhBA,aAAa,OAUA;EAAA,uBATxBC,MAAM;IAANA,MAAM,4BAAG,QAAQ;IAAA,mBACjBC,MAAM;IAANA,MAAM,4BAAG,QAAQ;IAAA,oBACjBC,OAAO;IAAPA,OAAO,6BAAG,KAAK;IAAA,oBACfC,OAAO;IAAPA,OAAO,6BAAG,IAAI;IAAA,kBACdC,KAAK;IAALA,KAAK,2BAAG,IAAI;IACZC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IACPC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAGd,WAAW,EAAE;EAC9B,sBAA4BH,KAAK,CAACkB,QAAQ,CAAC,CAACP,OAAO,CAAC;IAAA;IAA7CQ,MAAM;IAAEC,SAAS;EACxB,IAAMC,KAAK,GAAGrB,KAAK,CAACsB,MAAM,CAAiB,IAAI,CAAC;EAEhD,IAAMC,WAAW,GAAG,SAAdA,WAAW,CAAIC,CAAwB,EAAK;IAChD,IAAI,CAACA,CAAC,IAAIA,CAAC,CAACC,aAAa,KAAK,6BAA6B,EAAE;MAC3DL,SAAS,CAAC,IAAI,CAAC;IACjB;EACF,CAAC;EACD,IAAMM,uBAAuB,GAAGtB,UAAU,CAACmB,WAAW,EAAEN,QAAQ,KAAKX,QAAQ,CAACqB,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;EAC9F3B,KAAK,CAAC4B,SAAS,CAAC,YAAM;IACpB,CAACT,MAAM,IAAIO,uBAAuB,CAACG,GAAG,EAAE;EAC1C,CAAC,EAAE,CAACH,uBAAuB,EAAEP,MAAM,CAAC,CAAC;EAErC,cAAmBd,MAAM,EAAE;IAAnByB,MAAM,WAANA,MAAM;EACd5B,sBAAsB,CAAC4B,MAAM,EAAE,WAAW,EAAE,UAACN,CAAC;IAAA,OAAKA,CAAC,CAACO,cAAc,EAAE;EAAA,GAAE;IACrEC,OAAO,EAAE;EACX,CAAC,CAAC;EAEF,oBACE,wCACMhB,SAAS;IACb,SAAS,EAAEf,UAAU,sBAEnBgC,MAAM,iCAA0BzB,MAAM,EAAG,EACzCyB,MAAM,iCAA0BxB,MAAM,EAAG,EACzCC,OAAO,gCAAoC,EAC3CS,MAAM,+BAAmC,EACzCP,KAAK,8BAAkC,EACvCD,OAAO,+BAAmC,EAC1CI,SAAS,CACT;IACF,cAAc,EAAEI,MAAM,GAAGe,SAAS,GAAGX,WAAY;IACjD,GAAG,EAAEF;EAAM,iBAEX;IAAK,SAAS;EAAqC,gBACjD;IAAK,SAAS,8BAAmC;IAAC,OAAO,EAAEP;EAAQ,EAAG,eACtE;IAAK,SAAS;EAAmC,GAAED,QAAQ,CAAO,CAC9D,CACF;AAEV,CAAC;AAAC;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA"}
+{"version":3,"sources":["../../../../src/components/PopoutWrapper/PopoutWrapper.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { useDOM } from '../../lib/dom';\nimport { Platform } from '../../lib/platform';\nimport styles from './PopoutWrapper.module.css';\n\nexport interface PopoutWrapperProps extends React.HTMLAttributes<HTMLDivElement> {\n  hasMask?: boolean;\n  fixed?: boolean;\n  alignY?: 'top' | 'center' | 'bottom';\n  alignX?: 'left' | 'center' | 'right';\n  closing?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PopoutWrapper\n */\nexport const PopoutWrapper = ({\n  alignY = 'center',\n  alignX = 'center',\n  closing = false,\n  hasMask = true,\n  fixed = true,\n  children,\n  onClick,\n  className,\n  ...restProps\n}: PopoutWrapperProps) => {\n  const platform = usePlatform();\n  const [opened, setOpened] = React.useState(!hasMask);\n  const elRef = React.useRef<HTMLDivElement>(null);\n\n  const onFadeInEnd = (e?: React.AnimationEvent) => {\n    if (!e || e.animationName === 'vkui-animation-full-fade-in') {\n      setOpened(true);\n    }\n  };\n  const animationFinishFallback = useTimeout(onFadeInEnd, platform === Platform.IOS ? 300 : 200);\n  React.useEffect(() => {\n    !opened && animationFinishFallback.set();\n  }, [animationFinishFallback, opened]);\n\n  const { window } = useDOM();\n  useGlobalEventListener(window, 'touchmove', (e) => e.preventDefault(), {\n    passive: false,\n  });\n\n  return (\n    <div\n      {...restProps}\n      className={classNames(\n        styles['PopoutWrapper'],\n        {\n          center: styles['PopoutWrapper--alignY-center'],\n          top: styles['PopoutWrapper--alignY-top'],\n          bottom: styles['PopoutWrapper--alignY-bottom'],\n        }[alignY],\n        {\n          center: styles['PopoutWrapper--alignX-center'],\n          left: styles['PopoutWrapper--alignX-left'],\n          right: styles['PopoutWrapper--alignX-right'],\n        }[alignX],\n        closing && styles['PopoutWrapper--closing'],\n        opened && styles['PopoutWrapper--opened'],\n        fixed && styles['PopoutWrapper--fixed'],\n        hasMask && styles['PopoutWrapper--masked'],\n        className,\n      )}\n      onAnimationEnd={opened ? undefined : onFadeInEnd}\n      ref={elRef}\n    >\n      <div className={styles['PopoutWrapper__container']}>\n        <div className={styles['PopoutWrapper__overlay']} onClick={onClick} />\n        <div className={styles['PopoutWrapper__content']}>{children}</div>\n      </div>\n    </div>\n  );\n};\n"],"names":["React","classNames","useGlobalEventListener","usePlatform","useTimeout","useDOM","Platform","styles","PopoutWrapper","alignY","alignX","closing","hasMask","fixed","children","onClick","className","restProps","platform","opened","setOpened","useState","elRef","useRef","onFadeInEnd","e","animationName","animationFinishFallback","IOS","useEffect","set","window","preventDefault","passive","div","center","top","bottom","left","right","onAnimationEnd","undefined","ref"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,sBAAsB,QAAQ,qCAAqC;AAC5E,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,UAAU,QAAQ,yBAAyB;AACpD,SAASC,MAAM,QAAQ,gBAAgB;AACvC,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,OAAOC,YAAY,6BAA6B;AAUhD;;CAEC,GACD,OAAO,MAAMC,gBAAgB,CAAC,EAC5BC,QAAS,SAAQ,EACjBC,QAAS,SAAQ,EACjBC,SAAU,KAAK,CAAA,EACfC,SAAU,IAAI,CAAA,EACdC,OAAQ,IAAI,CAAA,EACZC,SAAQ,EACRC,QAAO,EACPC,UAAS,EACT,GAAGC,WACgB,GAAK;IACxB,MAAMC,WAAWf;IACjB,MAAM,CAACgB,QAAQC,UAAU,GAAGpB,MAAMqB,QAAQ,CAAC,CAACT;IAC5C,MAAMU,QAAQtB,MAAMuB,MAAM,CAAiB,IAAI;IAE/C,MAAMC,cAAc,CAACC,IAA6B;QAChD,IAAI,CAACA,KAAKA,EAAEC,aAAa,KAAK,+BAA+B;YAC3DN,UAAU,IAAI;QAChB,CAAC;IACH;IACA,MAAMO,0BAA0BvB,WAAWoB,aAAaN,aAAaZ,SAASsB,GAAG,GAAG,MAAM,GAAG;IAC7F5B,MAAM6B,SAAS,CAAC,IAAM;QACpB,CAACV,UAAUQ,wBAAwBG,GAAG;IACxC,GAAG;QAACH;QAAyBR;KAAO;IAEpC,MAAM,EAAEY,OAAM,EAAE,GAAG1B;IACnBH,uBAAuB6B,QAAQ,aAAa,CAACN,IAAMA,EAAEO,cAAc,IAAI;QACrEC,SAAS,KAAK;IAChB;IAEA,qBACE,oBAACC;QACE,GAAGjB,SAAS;QACbD,WAAWf,WACTM,MAAM,CAAC,gBAAgB,EACvB;YACE4B,QAAQ5B,MAAM,CAAC,+BAA+B;YAC9C6B,KAAK7B,MAAM,CAAC,4BAA4B;YACxC8B,QAAQ9B,MAAM,CAAC,+BAA+B;QAChD,CAAC,CAACE,OAAO,EACT;YACE0B,QAAQ5B,MAAM,CAAC,+BAA+B;YAC9C+B,MAAM/B,MAAM,CAAC,6BAA6B;YAC1CgC,OAAOhC,MAAM,CAAC,8BAA8B;QAC9C,CAAC,CAACG,OAAO,EACTC,WAAWJ,MAAM,CAAC,yBAAyB,EAC3CY,UAAUZ,MAAM,CAAC,wBAAwB,EACzCM,SAASN,MAAM,CAAC,uBAAuB,EACvCK,WAAWL,MAAM,CAAC,wBAAwB,EAC1CS;QAEFwB,gBAAgBrB,SAASsB,YAAYjB,WAAW;QAChDkB,KAAKpB;qBAEL,oBAACY;QAAIlB,WAAWT,MAAM,CAAC,2BAA2B;qBAChD,oBAAC2B;QAAIlB,WAAWT,MAAM,CAAC,yBAAyB;QAAEQ,SAASA;sBAC3D,oBAACmB;QAAIlB,WAAWT,MAAM,CAAC,yBAAyB;OAAGO;AAI3D,EAAE"}