@vkontakte/vkui 4.23.0 → 4.24.0

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PanelHeaderSubmit/PanelHeaderSubmit.tsx"],"names":["PanelHeaderButton","Icon28DoneOutline","ANDROID","VKCOM","usePlatform","getTitleFromChildren","PanelHeaderSubmit","children","restProps","platform","defaultProps"],"mappings":";;;;AACA,SAASA,iBAAT;AACA,SAASC,iBAAT,QAAkC,kBAAlC;AACA,SAASC,OAAT,EAAkBC,KAAlB;AACA,SAASC,WAAT;AACA,SAASC,oBAAT;;AAEA,IAAMC,iBAAkE,GAAG,SAArEA,iBAAqE,OAG7C;AAAA,MAF5BC,QAE4B,QAF5BA,QAE4B;AAAA,MADzBC,SACyB;;AAC5B,MAAMC,QAAQ,GAAGL,WAAW,EAA5B;AAEA,SACE,oBAAC,iBAAD;AAAmB,kBAAYC,oBAAoB,CAACE,QAAD,CAAnD;AAA+D,IAAA,OAAO;AAAtE,KAA2EC,SAA3E,GACGC,QAAQ,KAAKP,OAAb,IAAwBO,QAAQ,KAAKN,KAArC,GACG,oBAAC,iBAAD,OADH,GAEGI,QAHN,CADF;AAQD,CAdD;;AAgBAD,iBAAiB,CAACI,YAAlB,GAAiC;AAC/BH,EAAAA,QAAQ,EAAE;AADqB,CAAjC;AAIA,eAAeD,iBAAf","sourcesContent":["import * as React from 'react';\nimport { PanelHeaderButton, PanelHeaderButtonProps } from '../PanelHeaderButton/PanelHeaderButton';\nimport { Icon28DoneOutline } from '@vkontakte/icons';\nimport { ANDROID, VKCOM } from '../../lib/platform';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { getTitleFromChildren } from '../../lib/utils';\n\nconst PanelHeaderSubmit: React.FunctionComponent<PanelHeaderButtonProps> = ({\n  children,\n  ...restProps\n}: PanelHeaderButtonProps) => {\n  const platform = usePlatform();\n\n  return (\n    <PanelHeaderButton aria-label={getTitleFromChildren(children)} primary {...restProps}>\n      {platform === ANDROID || platform === VKCOM\n        ? <Icon28DoneOutline />\n        : children\n      }\n    </PanelHeaderButton>\n  );\n};\n\nPanelHeaderSubmit.defaultProps = {\n  children: 'Готово',\n};\n\nexport default PanelHeaderSubmit;\n"],"file":"PanelHeaderSubmit.js"}
+{"version":3,"sources":["../../../src/components/PanelHeaderSubmit/PanelHeaderSubmit.tsx"],"names":["PanelHeaderButton","Icon28DoneOutline","ANDROID","VKCOM","usePlatform","getTitleFromChildren","PanelHeaderSubmit","children","restProps","platform","defaultProps"],"mappings":";;;;AACA,SACEA,iBADF;AAIA,SAASC,iBAAT,QAAkC,kBAAlC;AACA,SAASC,OAAT,EAAkBC,KAAlB;AACA,SAASC,WAAT;AACA,SAASC,oBAAT;;AAEA,IAAMC,iBAAkE,GAAG,SAArEA,iBAAqE,OAG7C;AAAA,MAF5BC,QAE4B,QAF5BA,QAE4B;AAAA,MADzBC,SACyB;;AAC5B,MAAMC,QAAQ,GAAGL,WAAW,EAA5B;AAEA,SACE,oBAAC,iBAAD;AACE,kBAAYC,oBAAoB,CAACE,QAAD,CADlC;AAEE,IAAA,OAAO;AAFT,KAGMC,SAHN,GAKGC,QAAQ,KAAKP,OAAb,IAAwBO,QAAQ,KAAKN,KAArC,GACC,oBAAC,iBAAD,OADD,GAGCI,QARJ,CADF;AAaD,CAnBD;;AAqBAD,iBAAiB,CAACI,YAAlB,GAAiC;AAC/BH,EAAAA,QAAQ,EAAE;AADqB,CAAjC;AAIA,eAAeD,iBAAf","sourcesContent":["import * as React from \"react\";\nimport {\n  PanelHeaderButton,\n  PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { Icon28DoneOutline } from \"@vkontakte/icons\";\nimport { ANDROID, VKCOM } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getTitleFromChildren } from \"../../lib/utils\";\n\nconst PanelHeaderSubmit: React.FunctionComponent<PanelHeaderButtonProps> = ({\n  children,\n  ...restProps\n}: PanelHeaderButtonProps) => {\n  const platform = usePlatform();\n\n  return (\n    <PanelHeaderButton\n      aria-label={getTitleFromChildren(children)}\n      primary\n      {...restProps}\n    >\n      {platform === ANDROID || platform === VKCOM ? (\n        <Icon28DoneOutline />\n      ) : (\n        children\n      )}\n    </PanelHeaderButton>\n  );\n};\n\nPanelHeaderSubmit.defaultProps = {\n  children: \"Готово\",\n};\n\nexport default PanelHeaderSubmit;\n"],"file":"PanelHeaderSubmit.js"}

package/dist/components/PanelSpinner/PanelSpinner.d.ts

@@ -1,5 +1,5 @@
-import * as React from 'react';
-import { SpinnerProps } from '../Spinner/Spinner';
+import * as React from "react";
+import { SpinnerProps } from "../Spinner/Spinner";
 export interface PanelSpinnerProps extends SpinnerProps {
     height?: number;
 }

package/dist/components/PanelSpinner/PanelSpinner.js

@@ -3,7 +3,7 @@ import _objectSpread from "@babel/runtime/helpers/objectSpread2";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["height", "style"];
 import { createScopedElement } from "../../lib/jsxRuntime";
-import * as React from 'react';
+import * as React from "react";
 import Spinner from "../Spinner/Spinner";
 
 var PanelSpinner = function PanelSpinner(_ref) {

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PanelSpinner/PanelSpinner.tsx"],"names":["React","Spinner","PanelSpinner","height","style","restProps","defaultProps","memo"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,OAAP;;AAMA,IAAMC,YAAwD,GAAG,SAA3DA,YAA2D,OAAwD;AAAA,MAArDC,MAAqD,QAArDA,MAAqD;AAAA,MAA7CC,KAA6C,QAA7CA,KAA6C;AAAA,MAAnCC,SAAmC;;AACvH,SACE,oBAAC,OAAD;AAAS,IAAA,IAAI,EAAC;AAAd,KAA4BA,SAA5B;AAAuC,IAAA,KAAK;AAAIF,MAAAA,MAAM,EAANA;AAAJ,OAAeC,KAAf;AAA5C,KADF;AAGD,CAJD;;AAMAF,YAAY,CAACI,YAAb,GAA4B;AAC1BH,EAAAA,MAAM,EAAE;AADkB,CAA5B;AAIA,4BAAeH,KAAK,CAACO,IAAN,CAAWL,YAAX,CAAf","sourcesContent":["import * as React from 'react';\nimport Spinner, { SpinnerProps } from '../Spinner/Spinner';\n\nexport interface PanelSpinnerProps extends SpinnerProps {\n  height?: number;\n}\n\nconst PanelSpinner: React.FunctionComponent<PanelSpinnerProps> = ({ height, style, ...restProps }: PanelSpinnerProps) => {\n  return (\n    <Spinner size=\"regular\" {...restProps} style={{ height, ...style }} />\n  );\n};\n\nPanelSpinner.defaultProps = {\n  height: 96,\n};\n\nexport default React.memo(PanelSpinner);\n"],"file":"PanelSpinner.js"}
+{"version":3,"sources":["../../../src/components/PanelSpinner/PanelSpinner.tsx"],"names":["React","Spinner","PanelSpinner","height","style","restProps","defaultProps","memo"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,OAAP;;AAMA,IAAMC,YAAwD,GAAG,SAA3DA,YAA2D,OAIxC;AAAA,MAHvBC,MAGuB,QAHvBA,MAGuB;AAAA,MAFvBC,KAEuB,QAFvBA,KAEuB;AAAA,MADpBC,SACoB;;AACvB,SAAO,oBAAC,OAAD;AAAS,IAAA,IAAI,EAAC;AAAd,KAA4BA,SAA5B;AAAuC,IAAA,KAAK;AAAIF,MAAAA,MAAM,EAANA;AAAJ,OAAeC,KAAf;AAA5C,KAAP;AACD,CAND;;AAQAF,YAAY,CAACI,YAAb,GAA4B;AAC1BH,EAAAA,MAAM,EAAE;AADkB,CAA5B;AAIA,4BAAeH,KAAK,CAACO,IAAN,CAAWL,YAAX,CAAf","sourcesContent":["import * as React from \"react\";\nimport Spinner, { SpinnerProps } from \"../Spinner/Spinner\";\n\nexport interface PanelSpinnerProps extends SpinnerProps {\n  height?: number;\n}\n\nconst PanelSpinner: React.FunctionComponent<PanelSpinnerProps> = ({\n  height,\n  style,\n  ...restProps\n}: PanelSpinnerProps) => {\n  return <Spinner size=\"regular\" {...restProps} style={{ height, ...style }} />;\n};\n\nPanelSpinner.defaultProps = {\n  height: 96,\n};\n\nexport default React.memo(PanelSpinner);\n"],"file":"PanelSpinner.js"}

package/dist/components/Placeholder/Placeholder.d.ts

@@ -1,6 +1,6 @@
-import * as React from 'react';
-import { HasRootRef } from '../../types';
-import './Placeholder.css';
+import * as React from "react";
+import { HasRootRef } from "../../types";
+import "./Placeholder.css";
 export interface PlaceholderProps extends React.HTMLAttributes<HTMLDivElement>, HasRootRef<HTMLDivElement> {
     /**
      * Иконка

package/dist/components/Placeholder/Placeholder.js

@@ -18,8 +18,8 @@ var Placeholder = function Placeholder(props) {
 
   return createScopedElement("div", _extends({}, restProps, {
     ref: getRootRef,
-    vkuiClass: classNames('Placeholder', {
-      'Placeholder--stretched': stretched
+    vkuiClass: classNames("Placeholder", {
+      "Placeholder--stretched": stretched
     })
   }), createScopedElement("div", {
     vkuiClass: "Placeholder__in"

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Placeholder/Placeholder.tsx"],"names":["classNames","hasReactNode","Title","Headline","Placeholder","props","icon","header","action","children","stretched","getRootRef","restProps"],"mappings":";;;;AACA,SAASA,UAAT;AACA,SAASC,YAAT;AACA,OAAOC,KAAP;AACA,OAAOC,QAAP;;AAuBA,IAAMC,WAAuC,GAAG,SAA1CA,WAA0C,CAACC,KAAD,EAA6B;AAC3E,MACEC,IADF,GAQID,KARJ,CACEC,IADF;AAAA,MAEEC,MAFF,GAQIF,KARJ,CAEEE,MAFF;AAAA,MAGEC,MAHF,GAQIH,KARJ,CAGEG,MAHF;AAAA,MAIEC,QAJF,GAQIJ,KARJ,CAIEI,QAJF;AAAA,MAKEC,SALF,GAQIL,KARJ,CAKEK,SALF;AAAA,MAMEC,UANF,GAQIN,KARJ,CAMEM,UANF;AAAA,MAOKC,SAPL,4BAQIP,KARJ;;AAUA,SACE,wCACMO,SADN;AAEE,IAAA,GAAG,EAAED,UAFP;AAGE,IAAA,SAAS,EAAEX,UAAU,CAAC,aAAD,EAAgB;AACnC,gCAA0BU;AADS,KAAhB;AAHvB,MAOE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGT,YAAY,CAACK,IAAD,CAAZ,IAAsB;AAAK,IAAA,SAAS,EAAC;AAAf,KAAoCA,IAApC,CADzB,EAEGL,YAAY,CAACM,MAAD,CAAZ,IAAwB,oBAAC,KAAD;AAAO,IAAA,KAAK,EAAC,GAAb;AAAiB,IAAA,MAAM,EAAC,QAAxB;AAAiC,IAAA,SAAS,EAAC;AAA3C,KAAkEA,MAAlE,CAF3B,EAGGN,YAAY,CAACQ,QAAD,CAAZ,IAA0B,oBAAC,QAAD;AAAU,IAAA,MAAM,EAAC,SAAjB;AAA2B,IAAA,SAAS,EAAC;AAArC,KAA0DA,QAA1D,CAH7B,EAIGR,YAAY,CAACO,MAAD,CAAZ,IAAwB;AAAK,IAAA,SAAS,EAAC;AAAf,KAAsCA,MAAtC,CAJ3B,CAPF,CADF;AAgBD,CA3BD;;AA6BA,eAAeJ,WAAf","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { hasReactNode } from '../../lib/utils';\nimport Title from '../Typography/Title/Title';\nimport Headline from '../Typography/Headline/Headline';\nimport { HasRootRef } from '../../types';\nimport './Placeholder.css';\n\nexport interface PlaceholderProps extends React.HTMLAttributes<HTMLDivElement>, 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\nconst Placeholder: React.FC<PlaceholderProps> = (props: PlaceholderProps) => {\n  const {\n    icon,\n    header,\n    action,\n    children,\n    stretched,\n    getRootRef,\n    ...restProps\n  } = props;\n\n  return (\n    <div\n      {...restProps}\n      ref={getRootRef}\n      vkuiClass={classNames('Placeholder', {\n        'Placeholder--stretched': stretched,\n      })}\n    >\n      <div vkuiClass=\"Placeholder__in\">\n        {hasReactNode(icon) && <div vkuiClass=\"Placeholder__icon\">{icon}</div>}\n        {hasReactNode(header) && <Title level=\"2\" weight=\"medium\" vkuiClass=\"Placeholder__header\">{header}</Title>}\n        {hasReactNode(children) && <Headline weight=\"regular\" vkuiClass=\"Placeholder__text\">{children}</Headline>}\n        {hasReactNode(action) && <div vkuiClass=\"Placeholder__action\">{action}</div>}\n      </div>\n    </div>\n  );\n};\n\nexport default Placeholder;\n"],"file":"Placeholder.js"}
+{"version":3,"sources":["../../../src/components/Placeholder/Placeholder.tsx"],"names":["classNames","hasReactNode","Title","Headline","Placeholder","props","icon","header","action","children","stretched","getRootRef","restProps"],"mappings":";;;;AACA,SAASA,UAAT;AACA,SAASC,YAAT;AACA,OAAOC,KAAP;AACA,OAAOC,QAAP;;AAyBA,IAAMC,WAAuC,GAAG,SAA1CA,WAA0C,CAACC,KAAD,EAA6B;AAC3E,MACEC,IADF,GAQID,KARJ,CACEC,IADF;AAAA,MAEEC,MAFF,GAQIF,KARJ,CAEEE,MAFF;AAAA,MAGEC,MAHF,GAQIH,KARJ,CAGEG,MAHF;AAAA,MAIEC,QAJF,GAQIJ,KARJ,CAIEI,QAJF;AAAA,MAKEC,SALF,GAQIL,KARJ,CAKEK,SALF;AAAA,MAMEC,UANF,GAQIN,KARJ,CAMEM,UANF;AAAA,MAOKC,SAPL,4BAQIP,KARJ;;AAUA,SACE,wCACMO,SADN;AAEE,IAAA,GAAG,EAAED,UAFP;AAGE,IAAA,SAAS,EAAEX,UAAU,CAAC,aAAD,EAAgB;AACnC,gCAA0BU;AADS,KAAhB;AAHvB,MAOE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGT,YAAY,CAACK,IAAD,CAAZ,IAAsB;AAAK,IAAA,SAAS,EAAC;AAAf,KAAoCA,IAApC,CADzB,EAEGL,YAAY,CAACM,MAAD,CAAZ,IACC,oBAAC,KAAD;AAAO,IAAA,KAAK,EAAC,GAAb;AAAiB,IAAA,MAAM,EAAC,QAAxB;AAAiC,IAAA,SAAS,EAAC;AAA3C,KACGA,MADH,CAHJ,EAOGN,YAAY,CAACQ,QAAD,CAAZ,IACC,oBAAC,QAAD;AAAU,IAAA,MAAM,EAAC,SAAjB;AAA2B,IAAA,SAAS,EAAC;AAArC,KACGA,QADH,CARJ,EAYGR,YAAY,CAACO,MAAD,CAAZ,IACC;AAAK,IAAA,SAAS,EAAC;AAAf,KAAsCA,MAAtC,CAbJ,CAPF,CADF;AA0BD,CArCD;;AAuCA,eAAeJ,WAAf","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport Title from \"../Typography/Title/Title\";\nimport Headline from \"../Typography/Headline/Headline\";\nimport { HasRootRef } from \"../../types\";\nimport \"./Placeholder.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\nconst Placeholder: React.FC<PlaceholderProps> = (props: PlaceholderProps) => {\n  const {\n    icon,\n    header,\n    action,\n    children,\n    stretched,\n    getRootRef,\n    ...restProps\n  } = props;\n\n  return (\n    <div\n      {...restProps}\n      ref={getRootRef}\n      vkuiClass={classNames(\"Placeholder\", {\n        \"Placeholder--stretched\": stretched,\n      })}\n    >\n      <div vkuiClass=\"Placeholder__in\">\n        {hasReactNode(icon) && <div vkuiClass=\"Placeholder__icon\">{icon}</div>}\n        {hasReactNode(header) && (\n          <Title level=\"2\" weight=\"medium\" vkuiClass=\"Placeholder__header\">\n            {header}\n          </Title>\n        )}\n        {hasReactNode(children) && (\n          <Headline weight=\"regular\" vkuiClass=\"Placeholder__text\">\n            {children}\n          </Headline>\n        )}\n        {hasReactNode(action) && (\n          <div vkuiClass=\"Placeholder__action\">{action}</div>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport default Placeholder;\n"],"file":"Placeholder.js"}

package/dist/components/PopoutRoot/PopoutRoot.d.ts

@@ -1,7 +1,7 @@
-import * as React from 'react';
-import { HasRootRef } from '../../types';
-import { AdaptivityProps } from '../../hoc/withAdaptivity';
-import './PopoutRoot.css';
+import * as React from "react";
+import { HasRootRef } from "../../types";
+import { AdaptivityProps } from "../../hoc/withAdaptivity";
+import "./PopoutRoot.css";
 export interface PopoutRootProps extends React.HTMLAttributes<HTMLDivElement>, AdaptivityProps, HasRootRef<HTMLDivElement> {
     popout?: React.ReactNode;
     modal?: React.ReactNode;

package/dist/components/PopoutRoot/PopoutRoot.js

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["popout", "modal", "viewWidth", "viewHeight", "hasMouse", "children", "getRootRef"];
 import { createScopedElement } from "../../lib/jsxRuntime";
-import * as React from 'react';
+import * as React from "react";
 import { withAdaptivity, ViewWidth, ViewHeight } from "../../hoc/withAdaptivity";
 import { AppRootPortal } from "../AppRoot/AppRootPortal";
 import { blurActiveElement, useDOM } from "../../lib/dom";
@@ -27,12 +27,12 @@ export var PopoutRootComponent = function PopoutRootComponent(props) {
     vkuiClass: "PopoutRoot",
     ref: getRootRef
   }), children, createScopedElement(AppRootPortal, null, !!popout && createScopedElement("div", {
-    vkuiClass: isDesktop ? 'PopoutRoot--absolute' : 'PopoutRoot__popout'
+    vkuiClass: isDesktop ? "PopoutRoot--absolute" : "PopoutRoot__popout"
   }, popout), !!modal && createScopedElement("div", {
     vkuiClass: "PopoutRoot__modal"
   }, modal)));
 };
-PopoutRootComponent.displayName = 'PopoutRoot';
+PopoutRootComponent.displayName = "PopoutRoot";
 export var PopoutRoot = withAdaptivity(PopoutRootComponent, {
   viewWidth: true,
   viewHeight: true,

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PopoutRoot/PopoutRoot.tsx"],"names":["React","withAdaptivity","ViewWidth","ViewHeight","AppRootPortal","blurActiveElement","useDOM","PopoutRootComponent","props","popout","modal","viewWidth","viewHeight","hasMouse","children","getRootRef","restProps","document","isDesktop","SMALL_TABLET","MEDIUM","useEffect","displayName","PopoutRoot"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,SAASC,cAAT,EAAyBC,SAAzB,EAAoCC,UAApC;AACA,SAASC,aAAT;AACA,SAASC,iBAAT,EAA4BC,MAA5B;AAQA,OAAO,IAAMC,mBAA8C,GAAG,SAAjDA,mBAAiD,CAACC,KAAD,EAA4B;AACxF,MAAQC,MAAR,GAA+FD,KAA/F,CAAQC,MAAR;AAAA,MAAgBC,KAAhB,GAA+FF,KAA/F,CAAgBE,KAAhB;AAAA,MAAuBC,SAAvB,GAA+FH,KAA/F,CAAuBG,SAAvB;AAAA,MAAkCC,UAAlC,GAA+FJ,KAA/F,CAAkCI,UAAlC;AAAA,MAA8CC,QAA9C,GAA+FL,KAA/F,CAA8CK,QAA9C;AAAA,MAAwDC,QAAxD,GAA+FN,KAA/F,CAAwDM,QAAxD;AAAA,MAAkEC,UAAlE,GAA+FP,KAA/F,CAAkEO,UAAlE;AAAA,MAAiFC,SAAjF,4BAA+FR,KAA/F;;AACA,gBAAqBF,MAAM,EAA3B;AAAA,MAAQW,QAAR,WAAQA,QAAR;;AAEA,MAAMC,SAAS,GAAGP,SAAS,IAAIT,SAAS,CAACiB,YAAvB,KAAwCN,QAAQ,IAAID,UAAU,IAAIT,UAAU,CAACiB,MAA7E,CAAlB;AAEApB,EAAAA,KAAK,CAACqB,SAAN,CAAgB,YAAM;AACpBZ,IAAAA,MAAM,IAAIJ,iBAAiB,CAACY,QAAD,CAA3B;AACD,GAFD,EAEG,CAAC,CAAC,CAACR,MAAH,CAFH;AAIA,SACE,wCACMO,SADN;AAEE,IAAA,SAAS,EAAC,YAFZ;AAGE,IAAA,GAAG,EAAED;AAHP,MAKGD,QALH,EAME,oBAAC,aAAD,QACG,CAAC,CAACL,MAAF,IAAY;AAAK,IAAA,SAAS,EAAES,SAAS,GAAG,sBAAH,GAA4B;AAArD,KAA4ET,MAA5E,CADf,EAEG,CAAC,CAACC,KAAF,IAAW;AAAK,IAAA,SAAS,EAAC;AAAf,KAAoCA,KAApC,CAFd,CANF,CADF;AAaD,CAvBM;AAyBPH,mBAAmB,CAACe,WAApB,GAAkC,YAAlC;AAEA,OAAO,IAAMC,UAAU,GAAGtB,cAAc,CAACM,mBAAD,EAAsB;AAC5DI,EAAAA,SAAS,EAAE,IADiD;AAE5DC,EAAAA,UAAU,EAAE,IAFgD;AAG5DC,EAAAA,QAAQ,EAAE;AAHkD,CAAtB,CAAjC","sourcesContent":["import * as React from 'react';\nimport { HasRootRef } from '../../types';\nimport { withAdaptivity, ViewWidth, ViewHeight, AdaptivityProps } from '../../hoc/withAdaptivity';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { blurActiveElement, useDOM } from '../../lib/dom';\nimport './PopoutRoot.css';\n\nexport interface PopoutRootProps extends React.HTMLAttributes<HTMLDivElement>, AdaptivityProps, HasRootRef<HTMLDivElement> {\n  popout?: React.ReactNode;\n  modal?: React.ReactNode;\n}\n\nexport const PopoutRootComponent: React.FC<PopoutRootProps> = (props: PopoutRootProps) => {\n  const { popout, modal, viewWidth, viewHeight, hasMouse, children, getRootRef, ...restProps } = props;\n  const { document } = useDOM();\n\n  const isDesktop = viewWidth >= ViewWidth.SMALL_TABLET && (hasMouse || viewHeight >= ViewHeight.MEDIUM);\n\n  React.useEffect(() => {\n    popout && blurActiveElement(document);\n  }, [!!popout]);\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass=\"PopoutRoot\"\n      ref={getRootRef}\n    >\n      {children}\n      <AppRootPortal>\n        {!!popout && <div vkuiClass={isDesktop ? 'PopoutRoot--absolute' : 'PopoutRoot__popout'}>{popout}</div>}\n        {!!modal && <div vkuiClass=\"PopoutRoot__modal\">{modal}</div>}\n      </AppRootPortal>\n    </div>\n  );\n};\n\nPopoutRootComponent.displayName = 'PopoutRoot';\n\nexport const PopoutRoot = withAdaptivity(PopoutRootComponent, {\n  viewWidth: true,\n  viewHeight: true,\n  hasMouse: true,\n});\n"],"file":"PopoutRoot.js"}
+{"version":3,"sources":["../../../src/components/PopoutRoot/PopoutRoot.tsx"],"names":["React","withAdaptivity","ViewWidth","ViewHeight","AppRootPortal","blurActiveElement","useDOM","PopoutRootComponent","props","popout","modal","viewWidth","viewHeight","hasMouse","children","getRootRef","restProps","document","isDesktop","SMALL_TABLET","MEDIUM","useEffect","displayName","PopoutRoot"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,SACEC,cADF,EAEEC,SAFF,EAGEC,UAHF;AAMA,SAASC,aAAT;AACA,SAASC,iBAAT,EAA4BC,MAA5B;AAWA,OAAO,IAAMC,mBAA8C,GAAG,SAAjDA,mBAAiD,CAC5DC,KAD4D,EAEzD;AACH,MACEC,MADF,GASID,KATJ,CACEC,MADF;AAAA,MAEEC,KAFF,GASIF,KATJ,CAEEE,KAFF;AAAA,MAGEC,SAHF,GASIH,KATJ,CAGEG,SAHF;AAAA,MAIEC,UAJF,GASIJ,KATJ,CAIEI,UAJF;AAAA,MAKEC,QALF,GASIL,KATJ,CAKEK,QALF;AAAA,MAMEC,QANF,GASIN,KATJ,CAMEM,QANF;AAAA,MAOEC,UAPF,GASIP,KATJ,CAOEO,UAPF;AAAA,MAQKC,SARL,4BASIR,KATJ;;AAUA,gBAAqBF,MAAM,EAA3B;AAAA,MAAQW,QAAR,WAAQA,QAAR;;AAEA,MAAMC,SAAS,GACbP,SAAS,IAAIT,SAAS,CAACiB,YAAvB,KACCN,QAAQ,IAAID,UAAU,IAAIT,UAAU,CAACiB,MADtC,CADF;AAIApB,EAAAA,KAAK,CAACqB,SAAN,CAAgB,YAAM;AACpBZ,IAAAA,MAAM,IAAIJ,iBAAiB,CAACY,QAAD,CAA3B;AACD,GAFD,EAEG,CAAC,CAAC,CAACR,MAAH,CAFH;AAIA,SACE,wCAASO,SAAT;AAAoB,IAAA,SAAS,EAAC,YAA9B;AAA2C,IAAA,GAAG,EAAED;AAAhD,MACGD,QADH,EAEE,oBAAC,aAAD,QACG,CAAC,CAACL,MAAF,IACC;AACE,IAAA,SAAS,EACPS,SAAS,GAAG,sBAAH,GAA4B;AAFzC,KAKGT,MALH,CAFJ,EAUG,CAAC,CAACC,KAAF,IAAW;AAAK,IAAA,SAAS,EAAC;AAAf,KAAoCA,KAApC,CAVd,CAFF,CADF;AAiBD,CAxCM;AA0CPH,mBAAmB,CAACe,WAApB,GAAkC,YAAlC;AAEA,OAAO,IAAMC,UAAU,GAAGtB,cAAc,CAACM,mBAAD,EAAsB;AAC5DI,EAAAA,SAAS,EAAE,IADiD;AAE5DC,EAAAA,UAAU,EAAE,IAFgD;AAG5DC,EAAAA,QAAQ,EAAE;AAHkD,CAAtB,CAAjC","sourcesContent":["import * as React from \"react\";\nimport { HasRootRef } from \"../../types\";\nimport {\n  withAdaptivity,\n  ViewWidth,\n  ViewHeight,\n  AdaptivityProps,\n} from \"../../hoc/withAdaptivity\";\nimport { AppRootPortal } from \"../AppRoot/AppRootPortal\";\nimport { blurActiveElement, useDOM } from \"../../lib/dom\";\nimport \"./PopoutRoot.css\";\n\nexport interface PopoutRootProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    AdaptivityProps,\n    HasRootRef<HTMLDivElement> {\n  popout?: React.ReactNode;\n  modal?: React.ReactNode;\n}\n\nexport const PopoutRootComponent: React.FC<PopoutRootProps> = (\n  props: PopoutRootProps\n) => {\n  const {\n    popout,\n    modal,\n    viewWidth,\n    viewHeight,\n    hasMouse,\n    children,\n    getRootRef,\n    ...restProps\n  } = props;\n  const { document } = useDOM();\n\n  const isDesktop =\n    viewWidth >= ViewWidth.SMALL_TABLET &&\n    (hasMouse || viewHeight >= ViewHeight.MEDIUM);\n\n  React.useEffect(() => {\n    popout && blurActiveElement(document);\n  }, [!!popout]);\n\n  return (\n    <div {...restProps} vkuiClass=\"PopoutRoot\" ref={getRootRef}>\n      {children}\n      <AppRootPortal>\n        {!!popout && (\n          <div\n            vkuiClass={\n              isDesktop ? \"PopoutRoot--absolute\" : \"PopoutRoot__popout\"\n            }\n          >\n            {popout}\n          </div>\n        )}\n        {!!modal && <div vkuiClass=\"PopoutRoot__modal\">{modal}</div>}\n      </AppRootPortal>\n    </div>\n  );\n};\n\nPopoutRootComponent.displayName = \"PopoutRoot\";\n\nexport const PopoutRoot = withAdaptivity(PopoutRootComponent, {\n  viewWidth: true,\n  viewHeight: true,\n  hasMouse: true,\n});\n"],"file":"PopoutRoot.js"}

package/dist/components/PopoutWrapper/PopoutWrapper.d.ts

@@ -1,10 +1,10 @@
-import * as React from 'react';
-import './PopoutWrapper.css';
+import * as React from "react";
+import "./PopoutWrapper.css";
 export interface PopoutWrapperProps extends React.HTMLAttributes<HTMLDivElement> {
     hasMask?: boolean;
     fixed?: boolean;
-    alignY?: 'top' | 'center' | 'bottom';
-    alignX?: 'left' | 'center' | 'right';
+    alignY?: "top" | "center" | "bottom";
+    alignX?: "left" | "center" | "right";
     closing?: boolean;
 }
 export declare const PopoutWrapper: React.FC<PopoutWrapperProps>;

package/dist/components/PopoutWrapper/PopoutWrapper.js

@@ -3,7 +3,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["alignY", "alignX", "closing", "hasMask", "fixed", "children", "onClick"];
 import { createScopedElement } from "../../lib/jsxRuntime";
-import * as React from 'react';
+import * as React from "react";
 import { getClassName } from "../../helpers/getClassName";
 import { classNames } from "../../lib/classNames";
 import { IOS } from "../../lib/platform";
@@ -13,9 +13,9 @@ import { useGlobalEventListener } from "../../hooks/useGlobalEventListener";
 import { useDOM } from "../../lib/dom";
 export var PopoutWrapper = function PopoutWrapper(_ref) {
   var _ref$alignY = _ref.alignY,
-      alignY = _ref$alignY === void 0 ? 'center' : _ref$alignY,
+      alignY = _ref$alignY === void 0 ? "center" : _ref$alignY,
       _ref$alignX = _ref.alignX,
-      alignX = _ref$alignX === void 0 ? 'center' : _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,
@@ -36,7 +36,7 @@ export var PopoutWrapper = function PopoutWrapper(_ref) {
   var elRef = React.useRef();
 
   var onFadeInEnd = function onFadeInEnd(e) {
-    if (!e || e.animationName === 'vkui-animation-full-fade-in') {
+    if (!e || e.animationName === "vkui-animation-full-fade-in") {
       setOpened(true);
     }
   };
@@ -49,18 +49,18 @@ export var PopoutWrapper = function PopoutWrapper(_ref) {
   var _useDOM = useDOM(),
       window = _useDOM.window;
 
-  useGlobalEventListener(window, 'touchmove', function (e) {
+  useGlobalEventListener(window, "touchmove", function (e) {
     return e.preventDefault();
   }, {
     passive: false
   });
-  var baseClassNames = getClassName('PopoutWrapper', platform);
+  var baseClassNames = getClassName("PopoutWrapper", platform);
   return createScopedElement("div", _extends({}, restProps, {
     vkuiClass: classNames(baseClassNames, "PopoutWrapper--v-".concat(alignY), "PopoutWrapper--h-".concat(alignX), {
-      'PopoutWrapper--closing': closing,
-      'PopoutWrapper--opened': opened,
-      'PopoutWrapper--fixed': fixed,
-      'PopoutWrapper--masked': hasMask
+      "PopoutWrapper--closing": closing,
+      "PopoutWrapper--opened": opened,
+      "PopoutWrapper--fixed": fixed,
+      "PopoutWrapper--masked": hasMask
     }),
     onAnimationEnd: opened ? null : onFadeInEnd,
     ref: elRef

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PopoutWrapper/PopoutWrapper.tsx"],"names":["React","getClassName","classNames","IOS","useTimeout","usePlatform","useGlobalEventListener","useDOM","PopoutWrapper","alignY","alignX","closing","hasMask","fixed","children","onClick","restProps","platform","useState","opened","setOpened","elRef","useRef","onFadeInEnd","e","animationName","animationFinishFallback","useEffect","set","window","preventDefault","passive","baseClassNames"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,YAAT;AACA,SAASC,UAAT;AACA,SAASC,GAAT;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AACA,SAASC,sBAAT;AACA,SAASC,MAAT;AAWA,OAAO,IAAMC,aAA2C,GAAG,SAA9CA,aAA8C,OASjC;AAAA,yBARxBC,MAQwB;AAAA,MARxBA,MAQwB,4BARf,QAQe;AAAA,yBAPxBC,MAOwB;AAAA,MAPxBA,MAOwB,4BAPf,QAOe;AAAA,0BANxBC,OAMwB;AAAA,MANxBA,OAMwB,6BANd,KAMc;AAAA,0BALxBC,OAKwB;AAAA,MALxBA,OAKwB,6BALd,IAKc;AAAA,wBAJxBC,KAIwB;AAAA,MAJxBA,KAIwB,2BAJhB,IAIgB;AAAA,MAHxBC,QAGwB,QAHxBA,QAGwB;AAAA,MAFxBC,OAEwB,QAFxBA,OAEwB;AAAA,MADrBC,SACqB;;AACxB,MAAMC,QAAQ,GAAGZ,WAAW,EAA5B;;AACA,wBAA4BL,KAAK,CAACkB,QAAN,CAAe,CAACN,OAAhB,CAA5B;AAAA;AAAA,MAAOO,MAAP;AAAA,MAAeC,SAAf;;AACA,MAAMC,KAAK,GAAGrB,KAAK,CAACsB,MAAN,EAAd;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,CAACC,CAAD,EAA8B;AAChD,QAAI,CAACA,CAAD,IAAMA,CAAC,CAACC,aAAF,KAAoB,6BAA9B,EAA6D;AAC3DL,MAAAA,SAAS,CAAC,IAAD,CAAT;AACD;AACF,GAJD;;AAKA,MAAMM,uBAAuB,GAAGtB,UAAU,CAACmB,WAAD,EAAcN,QAAQ,KAAKd,GAAb,GAAmB,GAAnB,GAAyB,GAAvC,CAA1C;AACAH,EAAAA,KAAK,CAAC2B,SAAN,CAAgB,YAAM;AACpB,KAACR,MAAD,IAAWO,uBAAuB,CAACE,GAAxB,EAAX;AACD,GAFD,EAEG,EAFH;;AAIA,gBAAmBrB,MAAM,EAAzB;AAAA,MAAQsB,MAAR,WAAQA,MAAR;;AACAvB,EAAAA,sBAAsB,CAACuB,MAAD,EAAS,WAAT,EAAsB,UAACL,CAAD;AAAA,WAAOA,CAAC,CAACM,cAAF,EAAP;AAAA,GAAtB,EAAiD;AAAEC,IAAAA,OAAO,EAAE;AAAX,GAAjD,CAAtB;AAEA,MAAMC,cAAc,GAAG/B,YAAY,CAAC,eAAD,EAAkBgB,QAAlB,CAAnC;AAEA,SACE,wCACMD,SADN;AAEE,IAAA,SAAS,EAAEd,UAAU,CAAC8B,cAAD,6BAAqCvB,MAArC,8BAAmEC,MAAnE,GAA6E;AAChG,gCAA0BC,OADsE;AAEhG,+BAAyBQ,MAFuE;AAGhG,8BAAwBN,KAHwE;AAIhG,+BAAyBD;AAJuE,KAA7E,CAFvB;AAQE,IAAA,cAAc,EAAEO,MAAM,GAAG,IAAH,GAAUI,WARlC;AASE,IAAA,GAAG,EAAEF;AATP,MAWE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE;AACE,IAAA,SAAS,EAAC,wBADZ;AAEE,IAAA,OAAO,EAAEN;AAFX,IADF,EAIE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGD,QADH,CAJF,CAXF,CADF;AAsBD,CAnDM","sourcesContent":["import * as React from 'react';\nimport { getClassName } from '../../helpers/getClassName';\nimport { classNames } from '../../lib/classNames';\nimport { IOS } from '../../lib/platform';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { useDOM } from '../../lib/dom';\nimport './PopoutWrapper.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\nexport const PopoutWrapper: React.FC<PopoutWrapperProps> = ({\n  alignY = 'center',\n  alignX = 'center',\n  closing = false,\n  hasMask = true,\n  fixed = true,\n  children,\n  onClick,\n  ...restProps\n}: PopoutWrapperProps) => {\n  const platform = usePlatform();\n  const [opened, setOpened] = React.useState(!hasMask);\n  const elRef = React.useRef<HTMLDivElement>();\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 === IOS ? 300 : 200);\n  React.useEffect(() => {\n    !opened && animationFinishFallback.set();\n  }, []);\n\n  const { window } = useDOM();\n  useGlobalEventListener(window, 'touchmove', (e) => e.preventDefault(), { passive: false });\n\n  const baseClassNames = getClassName('PopoutWrapper', platform);\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass={classNames(baseClassNames, `PopoutWrapper--v-${alignY}`, `PopoutWrapper--h-${alignX}`, {\n        'PopoutWrapper--closing': closing,\n        'PopoutWrapper--opened': opened,\n        'PopoutWrapper--fixed': fixed,\n        'PopoutWrapper--masked': hasMask,\n      })}\n      onAnimationEnd={opened ? null : onFadeInEnd}\n      ref={elRef}\n    >\n      <div vkuiClass=\"PopoutWrapper__container\">\n        <div\n          vkuiClass=\"PopoutWrapper__overlay\"\n          onClick={onClick} />\n        <div vkuiClass=\"PopoutWrapper__content\">\n          {children}\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"file":"PopoutWrapper.js"}
+{"version":3,"sources":["../../../src/components/PopoutWrapper/PopoutWrapper.tsx"],"names":["React","getClassName","classNames","IOS","useTimeout","usePlatform","useGlobalEventListener","useDOM","PopoutWrapper","alignY","alignX","closing","hasMask","fixed","children","onClick","restProps","platform","useState","opened","setOpened","elRef","useRef","onFadeInEnd","e","animationName","animationFinishFallback","useEffect","set","window","preventDefault","passive","baseClassNames"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,YAAT;AACA,SAASC,UAAT;AACA,SAASC,GAAT;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AACA,SAASC,sBAAT;AACA,SAASC,MAAT;AAYA,OAAO,IAAMC,aAA2C,GAAG,SAA9CA,aAA8C,OASjC;AAAA,yBARxBC,MAQwB;AAAA,MARxBA,MAQwB,4BARf,QAQe;AAAA,yBAPxBC,MAOwB;AAAA,MAPxBA,MAOwB,4BAPf,QAOe;AAAA,0BANxBC,OAMwB;AAAA,MANxBA,OAMwB,6BANd,KAMc;AAAA,0BALxBC,OAKwB;AAAA,MALxBA,OAKwB,6BALd,IAKc;AAAA,wBAJxBC,KAIwB;AAAA,MAJxBA,KAIwB,2BAJhB,IAIgB;AAAA,MAHxBC,QAGwB,QAHxBA,QAGwB;AAAA,MAFxBC,OAEwB,QAFxBA,OAEwB;AAAA,MADrBC,SACqB;;AACxB,MAAMC,QAAQ,GAAGZ,WAAW,EAA5B;;AACA,wBAA4BL,KAAK,CAACkB,QAAN,CAAe,CAACN,OAAhB,CAA5B;AAAA;AAAA,MAAOO,MAAP;AAAA,MAAeC,SAAf;;AACA,MAAMC,KAAK,GAAGrB,KAAK,CAACsB,MAAN,EAAd;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,CAACC,CAAD,EAA8B;AAChD,QAAI,CAACA,CAAD,IAAMA,CAAC,CAACC,aAAF,KAAoB,6BAA9B,EAA6D;AAC3DL,MAAAA,SAAS,CAAC,IAAD,CAAT;AACD;AACF,GAJD;;AAKA,MAAMM,uBAAuB,GAAGtB,UAAU,CACxCmB,WADwC,EAExCN,QAAQ,KAAKd,GAAb,GAAmB,GAAnB,GAAyB,GAFe,CAA1C;AAIAH,EAAAA,KAAK,CAAC2B,SAAN,CAAgB,YAAM;AACpB,KAACR,MAAD,IAAWO,uBAAuB,CAACE,GAAxB,EAAX;AACD,GAFD,EAEG,EAFH;;AAIA,gBAAmBrB,MAAM,EAAzB;AAAA,MAAQsB,MAAR,WAAQA,MAAR;;AACAvB,EAAAA,sBAAsB,CAACuB,MAAD,EAAS,WAAT,EAAsB,UAACL,CAAD;AAAA,WAAOA,CAAC,CAACM,cAAF,EAAP;AAAA,GAAtB,EAAiD;AACrEC,IAAAA,OAAO,EAAE;AAD4D,GAAjD,CAAtB;AAIA,MAAMC,cAAc,GAAG/B,YAAY,CAAC,eAAD,EAAkBgB,QAAlB,CAAnC;AAEA,SACE,wCACMD,SADN;AAEE,IAAA,SAAS,EAAEd,UAAU,CACnB8B,cADmB,6BAECvB,MAFD,8BAGCC,MAHD,GAInB;AACE,gCAA0BC,OAD5B;AAEE,+BAAyBQ,MAF3B;AAGE,8BAAwBN,KAH1B;AAIE,+BAAyBD;AAJ3B,KAJmB,CAFvB;AAaE,IAAA,cAAc,EAAEO,MAAM,GAAG,IAAH,GAAUI,WAblC;AAcE,IAAA,GAAG,EAAEF;AAdP,MAgBE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE;AAAK,IAAA,SAAS,EAAC,wBAAf;AAAwC,IAAA,OAAO,EAAEN;AAAjD,IADF,EAEE;AAAK,IAAA,SAAS,EAAC;AAAf,KAAyCD,QAAzC,CAFF,CAhBF,CADF;AAuBD,CAzDM","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { IOS } from \"../../lib/platform\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport { useDOM } from \"../../lib/dom\";\nimport \"./PopoutWrapper.css\";\n\nexport interface PopoutWrapperProps\n  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\nexport const PopoutWrapper: React.FC<PopoutWrapperProps> = ({\n  alignY = \"center\",\n  alignX = \"center\",\n  closing = false,\n  hasMask = true,\n  fixed = true,\n  children,\n  onClick,\n  ...restProps\n}: PopoutWrapperProps) => {\n  const platform = usePlatform();\n  const [opened, setOpened] = React.useState(!hasMask);\n  const elRef = React.useRef<HTMLDivElement>();\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(\n    onFadeInEnd,\n    platform === IOS ? 300 : 200\n  );\n  React.useEffect(() => {\n    !opened && animationFinishFallback.set();\n  }, []);\n\n  const { window } = useDOM();\n  useGlobalEventListener(window, \"touchmove\", (e) => e.preventDefault(), {\n    passive: false,\n  });\n\n  const baseClassNames = getClassName(\"PopoutWrapper\", platform);\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass={classNames(\n        baseClassNames,\n        `PopoutWrapper--v-${alignY}`,\n        `PopoutWrapper--h-${alignX}`,\n        {\n          \"PopoutWrapper--closing\": closing,\n          \"PopoutWrapper--opened\": opened,\n          \"PopoutWrapper--fixed\": fixed,\n          \"PopoutWrapper--masked\": hasMask,\n        }\n      )}\n      onAnimationEnd={opened ? null : onFadeInEnd}\n      ref={elRef}\n    >\n      <div vkuiClass=\"PopoutWrapper__container\">\n        <div vkuiClass=\"PopoutWrapper__overlay\" onClick={onClick} />\n        <div vkuiClass=\"PopoutWrapper__content\">{children}</div>\n      </div>\n    </div>\n  );\n};\n"],"file":"PopoutWrapper.js"}

package/dist/components/Popper/Popper.d.ts

@@ -1,7 +1,7 @@
-import * as React from 'react';
-import { HasRef } from '../../types';
-import './Popper.css';
-export declare type Placement = 'auto' | 'auto-start' | 'auto-end' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end' | 'top' | 'bottom' | 'left' | 'right';
+import * as React from "react";
+import { HasRef } from "../../types";
+import "./Popper.css";
+export declare type Placement = "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end" | "top" | "bottom" | "left" | "right";
 export interface PopperCommonProps extends React.HTMLAttributes<HTMLElement>, HasRef<HTMLElement> {
     /**
      * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства
@@ -17,6 +17,11 @@ export interface PopperCommonProps extends React.HTMLAttributes<HTMLElement>, Ha
     offsetDistance?: number;
     arrow?: boolean;
     arrowClassName?: string;
+    /**
+     * Выставлять ширину равной target элементу
+     */
+    sameWidth?: boolean;
+    forcePortal?: boolean;
     onPlacementChange?: (data: {
         placement?: Placement;
     }) => void;

package/dist/components/Popper/Popper.js

@@ -2,10 +2,10 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectSpread from "@babel/runtime/helpers/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["targetRef", "children", "getRef", "placement", "onPlacementChange", "arrow", "arrowClassName", "offsetDistance", "offsetSkidding", "style"];
+var _excluded = ["targetRef", "children", "getRef", "placement", "onPlacementChange", "arrow", "arrowClassName", "sameWidth", "offsetDistance", "offsetSkidding", "forcePortal", "style"];
 import { createScopedElement } from "../../lib/jsxRuntime";
-import * as React from 'react';
-import { usePopper } from 'react-popper';
+import * as React from "react";
+import { usePopper } from "react-popper";
 import { AppRootPortal } from "../AppRoot/AppRootPortal";
 import { usePlatform } from "../../hooks/usePlatform";
 import { getClassName } from "../../helpers/getClassName";
@@ -19,14 +19,17 @@ export var Popper = function Popper(_ref) {
       children = _ref.children,
       getRef = _ref.getRef,
       _ref$placement = _ref.placement,
-      placement = _ref$placement === void 0 ? 'bottom-start' : _ref$placement,
+      placement = _ref$placement === void 0 ? "bottom-start" : _ref$placement,
       onPlacementChange = _ref.onPlacementChange,
       arrow = _ref.arrow,
       arrowClassName = _ref.arrowClassName,
+      sameWidth = _ref.sameWidth,
       _ref$offsetDistance = _ref.offsetDistance,
       offsetDistance = _ref$offsetDistance === void 0 ? 8 : _ref$offsetDistance,
       _ref$offsetSkidding = _ref.offsetSkidding,
       offsetSkidding = _ref$offsetSkidding === void 0 ? 0 : _ref$offsetSkidding,
+      _ref$forcePortal = _ref.forcePortal,
+      forcePortal = _ref$forcePortal === void 0 ? true : _ref$forcePortal,
       compStyles = _ref.style,
       restProps = _objectWithoutProperties(_ref, _excluded);
 
@@ -42,25 +45,47 @@ export var Popper = function Popper(_ref) {
 
   var platform = usePlatform();
   var setExternalRef = useExternRef(getRef, setPopperNode);
-  var modifiers = [{
-    name: 'preventOverflow'
-  }, {
-    name: 'offset',
-    options: {
-      offset: [arrow ? offsetSkidding - smallTargetOffsetSkidding : offsetSkidding, arrow ? offsetDistance + ARROW_HEIGHT : offsetDistance]
-    }
-  }, {
-    name: 'flip'
-  }];
-
-  if (arrow) {
-    modifiers.push({
-      name: 'arrow',
+  var modifiers = React.useMemo(function () {
+    var modifiers = [{
+      name: "preventOverflow"
+    }, {
+      name: "offset",
       options: {
-        padding: ARROW_PADDING
+        offset: [arrow ? offsetSkidding - smallTargetOffsetSkidding : offsetSkidding, arrow ? offsetDistance + ARROW_HEIGHT : offsetDistance]
       }
-    });
-  }
+    }, {
+      name: "flip"
+    }];
+
+    if (arrow) {
+      modifiers.push({
+        name: "arrow",
+        options: {
+          padding: ARROW_PADDING
+        }
+      });
+    }
+
+    if (sameWidth) {
+      var _sameWidth = {
+        name: "sameWidth",
+        enabled: true,
+        phase: "beforeWrite",
+        requires: ["computeStyles"],
+        fn: function fn(_ref2) {
+          var state = _ref2.state;
+          state.styles.popper.width = "".concat(state.rects.reference.width, "px");
+        },
+        effect: function effect(_ref3) {
+          var state = _ref3.state;
+          state.elements.popper.style.width = "".concat(state.elements.reference.offsetWidth, "px");
+        }
+      };
+      modifiers.push(_sameWidth);
+    }
+
+    return modifiers;
+  }, [arrow, sameWidth, smallTargetOffsetSkidding, offsetSkidding, offsetDistance, ARROW_HEIGHT, ARROW_PADDING]);
 
   var _usePopper = usePopper(targetRef.current, popperNode, {
     placement: placement,
@@ -71,15 +96,15 @@ export var Popper = function Popper(_ref) {
       attributes = _usePopper.attributes;
 
   var resolvedPlacement = state === null || state === void 0 ? void 0 : state.placement;
-  var isEdgePlacement = !!resolvedPlacement && resolvedPlacement.includes('-'); // true, если поппер отрисован скраю
+  var isEdgePlacement = !!resolvedPlacement && resolvedPlacement.includes("-"); // true, если поппер отрисован скраю
   // Если поппер рисуется скраю, то нужно опционально сместить его в тех случаях, когда стрелка не дотягивается до
   // таргета из-за маленьких размеров последнего
 
   useIsomorphicLayoutEffect(function () {
     if (arrow && isEdgePlacement) {
-      var placementDirection = resolvedPlacement.startsWith('bottom') || resolvedPlacement.startsWith('top') ? 'vertical' : 'horizontal';
-      var arrowSize = placementDirection === 'vertical' ? ARROW_WIDTH : ARROW_HEIGHT;
-      var targetSize = placementDirection === 'vertical' ? targetRef.current.offsetWidth : targetRef.current.offsetHeight;
+      var placementDirection = resolvedPlacement.startsWith("bottom") || resolvedPlacement.startsWith("top") ? "vertical" : "horizontal";
+      var arrowSize = placementDirection === "vertical" ? ARROW_WIDTH : ARROW_HEIGHT;
+      var targetSize = placementDirection === "vertical" ? targetRef.current.offsetWidth : targetRef.current.offsetHeight;
 
       if (targetSize < arrowSize + 2 * ARROW_PADDING) {
         setSmallTargetOffsetSkidding(ARROW_PADDING + arrowSize / 2);
@@ -96,7 +121,7 @@ export var Popper = function Popper(_ref) {
     }
   }, [resolvedPlacement]);
   var dropdown = createScopedElement("div", _extends({}, restProps, attributes.popper, {
-    vkuiClass: getClassName('Popper', platform),
+    vkuiClass: getClassName("Popper", platform),
     ref: setExternalRef,
     style: _objectSpread(_objectSpread({}, compStyles), styles.popper)
   }), arrow && createScopedElement("div", _extends({}, attributes.arrow, {
@@ -120,7 +145,7 @@ export var Popper = function Popper(_ref) {
     vkuiClass: "Popper__content"
   }, children));
   return createScopedElement(AppRootPortal, {
-    forcePortal: true,
+    forcePortal: forcePortal,
     vkuiClass: "PopperPortal"
   }, dropdown);
 };

package/dist/components/Popper/Popper.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Popper/Popper.tsx"],"names":["React","usePopper","AppRootPortal","usePlatform","getClassName","useExternRef","useIsomorphicLayoutEffect","ARROW_PADDING","ARROW_WIDTH","ARROW_HEIGHT","Popper","targetRef","children","getRef","placement","onPlacementChange","arrow","arrowClassName","offsetDistance","offsetSkidding","compStyles","style","restProps","useState","popperNode","setPopperNode","smallTargetOffsetSkidding","setSmallTargetOffsetSkidding","platform","setExternalRef","modifiers","name","options","offset","push","padding","current","styles","state","attributes","resolvedPlacement","isEdgePlacement","includes","placementDirection","startsWith","arrowSize","targetSize","offsetWidth","offsetHeight","useEffect","dropdown","popper"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { usePopper } from 'react-popper';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { HasRef } from '../../types';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { getClassName } from '../../helpers/getClassName';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport './Popper.css';\n\nexport type Placement = 'auto' | 'auto-start' | 'auto-end' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' |\n'right-start' | 'right-end' | 'left-start' | 'left-end' | 'top' | 'bottom' | 'left' | 'right';\n\ntype Modifier = {\n  name: string;\n  options?: {\n    [index: string]: any;\n  };\n};\n\nexport interface PopperCommonProps extends React.HTMLAttributes<HTMLElement>, HasRef<HTMLElement> {\n  /**\n   * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства\n   */\n  placement?: Placement;\n  /**\n   * Отступ по вспомогательной оси\n   */\n  offsetSkidding?: number;\n  /**\n   * Отступ по главной оси\n   */\n  offsetDistance?: number;\n  arrow?: boolean;\n  arrowClassName?: string;\n  onPlacementChange?: (data: { placement?: Placement }) => void;\n}\n\nexport interface PopperProps extends PopperCommonProps {\n  targetRef?: React.RefObject<HTMLElement>;\n}\n\nconst ARROW_PADDING = 8;\nconst ARROW_WIDTH = 20;\nconst ARROW_HEIGHT = 8;\n\nexport const Popper: React.FC<PopperProps> = ({\n  targetRef,\n  children,\n  getRef,\n  placement = 'bottom-start',\n  onPlacementChange,\n  arrow,\n  arrowClassName,\n  offsetDistance = 8,\n  offsetSkidding = 0,\n  style: compStyles,\n  ...restProps\n}: PopperProps) => {\n  const [popperNode, setPopperNode] = React.useState(null);\n  const [smallTargetOffsetSkidding, setSmallTargetOffsetSkidding] = React.useState(0);\n  const platform = usePlatform();\n\n  const setExternalRef = useExternRef(getRef, setPopperNode);\n\n  const modifiers: Modifier[] = [{\n    name: 'preventOverflow',\n  }, {\n    name: 'offset',\n    options: {\n      offset: [\n        arrow ? offsetSkidding - smallTargetOffsetSkidding : offsetSkidding,\n        arrow ? offsetDistance + ARROW_HEIGHT : offsetDistance,\n      ],\n    },\n  }, {\n    name: 'flip',\n  }];\n\n  if (arrow) {\n    modifiers.push({\n      name: 'arrow',\n      options: {\n        padding: ARROW_PADDING,\n      },\n    });\n  }\n\n  const { styles, state, attributes } = usePopper(targetRef.current, popperNode, {\n    placement,\n    modifiers,\n  });\n\n  const resolvedPlacement = state?.placement;\n  const isEdgePlacement = !!resolvedPlacement && resolvedPlacement.includes('-'); // true, если поппер отрисован скраю\n\n  // Если поппер рисуется скраю, то нужно опционально сместить его в тех случаях, когда стрелка не дотягивается до\n  // таргета из-за маленьких размеров последнего\n  useIsomorphicLayoutEffect(() => {\n    if (arrow && isEdgePlacement) {\n      const placementDirection = resolvedPlacement.startsWith('bottom') || resolvedPlacement.startsWith('top') ? 'vertical' : 'horizontal';\n\n      const arrowSize = placementDirection === 'vertical' ? ARROW_WIDTH : ARROW_HEIGHT;\n      const targetSize = placementDirection === 'vertical' ? targetRef.current.offsetWidth : targetRef.current.offsetHeight;\n\n      if (targetSize < arrowSize + 2 * ARROW_PADDING) {\n        setSmallTargetOffsetSkidding(ARROW_PADDING + arrowSize / 2);\n      }\n    } else {\n      setSmallTargetOffsetSkidding(0);\n    }\n  }, [arrow, isEdgePlacement]);\n\n  React.useEffect(() => {\n    if (resolvedPlacement) {\n      onPlacementChange && onPlacementChange({ placement: resolvedPlacement });\n    }\n  }, [resolvedPlacement]);\n\n  const dropdown = (\n    <div\n      {...restProps}\n      {...attributes.popper}\n      vkuiClass={getClassName('Popper', platform)}\n      ref={setExternalRef}\n      style={{ ...compStyles, ...styles.popper }}\n    >\n      {arrow && (\n        <div\n          {...attributes.arrow}\n          vkuiClass=\"Popper__arrow\"\n          data-popper-arrow={true}\n          style={styles.arrow}\n        >\n          <svg vkuiClass=\"Popper__arrow-in\" className={arrowClassName} width=\"20\" height=\"8\" viewBox=\"0 0 20 8\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n            <path fillRule=\"evenodd\" clipRule=\"evenodd\" d=\"M10 0C13 0 15.9999 8 20 8H0C3.9749 8 7 0 10 0Z\" fill=\"currentColor\" />\n          </svg>\n        </div>\n      )}\n      <div vkuiClass=\"Popper__content\">\n        {children}\n      </div>\n    </div>\n  );\n\n  return <AppRootPortal forcePortal vkuiClass=\"PopperPortal\">{dropdown}</AppRootPortal>;\n};\n"],"file":"Popper.js"}
+{"version":3,"sources":["../../../src/components/Popper/Popper.tsx"],"names":["React","usePopper","AppRootPortal","usePlatform","getClassName","useExternRef","useIsomorphicLayoutEffect","ARROW_PADDING","ARROW_WIDTH","ARROW_HEIGHT","Popper","targetRef","children","getRef","placement","onPlacementChange","arrow","arrowClassName","sameWidth","offsetDistance","offsetSkidding","forcePortal","compStyles","style","restProps","useState","popperNode","setPopperNode","smallTargetOffsetSkidding","setSmallTargetOffsetSkidding","platform","setExternalRef","modifiers","useMemo","name","options","offset","push","padding","enabled","phase","requires","fn","state","styles","popper","width","rects","reference","effect","elements","offsetWidth","current","attributes","resolvedPlacement","isEdgePlacement","includes","placementDirection","startsWith","arrowSize","targetSize","offsetHeight","useEffect","dropdown"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { usePopper, Modifier } from \"react-popper\";\nimport { AppRootPortal } from \"../AppRoot/AppRootPortal\";\nimport { HasRef } from \"../../types\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport \"./Popper.css\";\n\nexport type Placement =\n  | \"auto\"\n  | \"auto-start\"\n  | \"auto-end\"\n  | \"top-start\"\n  | \"top-end\"\n  | \"bottom-start\"\n  | \"bottom-end\"\n  | \"right-start\"\n  | \"right-end\"\n  | \"left-start\"\n  | \"left-end\"\n  | \"top\"\n  | \"bottom\"\n  | \"left\"\n  | \"right\";\n\nexport interface PopperCommonProps\n  extends React.HTMLAttributes<HTMLElement>,\n    HasRef<HTMLElement> {\n  /**\n   * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства\n   */\n  placement?: Placement;\n  /**\n   * Отступ по вспомогательной оси\n   */\n  offsetSkidding?: number;\n  /**\n   * Отступ по главной оси\n   */\n  offsetDistance?: number;\n  arrow?: boolean;\n  arrowClassName?: string;\n  /**\n   * Выставлять ширину равной target элементу\n   */\n  sameWidth?: boolean;\n  forcePortal?: boolean;\n  onPlacementChange?: (data: { placement?: Placement }) => void;\n}\n\nexport interface PopperProps extends PopperCommonProps {\n  targetRef?: React.RefObject<HTMLElement>;\n}\n\nconst ARROW_PADDING = 8;\nconst ARROW_WIDTH = 20;\nconst ARROW_HEIGHT = 8;\n\nexport const Popper: React.FC<PopperProps> = ({\n  targetRef,\n  children,\n  getRef,\n  placement = \"bottom-start\",\n  onPlacementChange,\n  arrow,\n  arrowClassName,\n  sameWidth,\n  offsetDistance = 8,\n  offsetSkidding = 0,\n  forcePortal = true,\n  style: compStyles,\n  ...restProps\n}: PopperProps) => {\n  const [popperNode, setPopperNode] = React.useState(null);\n  const [smallTargetOffsetSkidding, setSmallTargetOffsetSkidding] =\n    React.useState(0);\n  const platform = usePlatform();\n\n  const setExternalRef = useExternRef(getRef, setPopperNode);\n\n  const modifiers = React.useMemo(() => {\n    const modifiers: Array<Modifier<string>> = [\n      {\n        name: \"preventOverflow\",\n      },\n      {\n        name: \"offset\",\n        options: {\n          offset: [\n            arrow ? offsetSkidding - smallTargetOffsetSkidding : offsetSkidding,\n            arrow ? offsetDistance + ARROW_HEIGHT : offsetDistance,\n          ],\n        },\n      },\n      {\n        name: \"flip\",\n      },\n    ];\n\n    if (arrow) {\n      modifiers.push({\n        name: \"arrow\",\n        options: {\n          padding: ARROW_PADDING,\n        },\n      });\n    }\n\n    if (sameWidth) {\n      const sameWidth: Modifier<string> = {\n        name: \"sameWidth\",\n        enabled: true,\n        phase: \"beforeWrite\",\n        requires: [\"computeStyles\"],\n        fn: ({ state }) => {\n          state.styles.popper.width = `${state.rects.reference.width}px`;\n        },\n        effect: ({ state }) => {\n          state.elements.popper.style.width = `${\n            (state.elements.reference as HTMLElement).offsetWidth\n          }px`;\n        },\n      };\n\n      modifiers.push(sameWidth);\n    }\n\n    return modifiers;\n  }, [\n    arrow,\n    sameWidth,\n    smallTargetOffsetSkidding,\n    offsetSkidding,\n    offsetDistance,\n    ARROW_HEIGHT,\n    ARROW_PADDING,\n  ]);\n\n  const { styles, state, attributes } = usePopper(\n    targetRef.current,\n    popperNode,\n    {\n      placement,\n      modifiers,\n    }\n  );\n\n  const resolvedPlacement = state?.placement;\n  const isEdgePlacement =\n    !!resolvedPlacement && resolvedPlacement.includes(\"-\"); // true, если поппер отрисован скраю\n\n  // Если поппер рисуется скраю, то нужно опционально сместить его в тех случаях, когда стрелка не дотягивается до\n  // таргета из-за маленьких размеров последнего\n  useIsomorphicLayoutEffect(() => {\n    if (arrow && isEdgePlacement) {\n      const placementDirection =\n        resolvedPlacement.startsWith(\"bottom\") ||\n        resolvedPlacement.startsWith(\"top\")\n          ? \"vertical\"\n          : \"horizontal\";\n\n      const arrowSize =\n        placementDirection === \"vertical\" ? ARROW_WIDTH : ARROW_HEIGHT;\n      const targetSize =\n        placementDirection === \"vertical\"\n          ? targetRef.current.offsetWidth\n          : targetRef.current.offsetHeight;\n\n      if (targetSize < arrowSize + 2 * ARROW_PADDING) {\n        setSmallTargetOffsetSkidding(ARROW_PADDING + arrowSize / 2);\n      }\n    } else {\n      setSmallTargetOffsetSkidding(0);\n    }\n  }, [arrow, isEdgePlacement]);\n\n  React.useEffect(() => {\n    if (resolvedPlacement) {\n      onPlacementChange && onPlacementChange({ placement: resolvedPlacement });\n    }\n  }, [resolvedPlacement]);\n\n  const dropdown = (\n    <div\n      {...restProps}\n      {...attributes.popper}\n      vkuiClass={getClassName(\"Popper\", platform)}\n      ref={setExternalRef}\n      style={{ ...compStyles, ...styles.popper }}\n    >\n      {arrow && (\n        <div\n          {...attributes.arrow}\n          vkuiClass=\"Popper__arrow\"\n          data-popper-arrow={true}\n          style={styles.arrow}\n        >\n          <svg\n            vkuiClass=\"Popper__arrow-in\"\n            className={arrowClassName}\n            width=\"20\"\n            height=\"8\"\n            viewBox=\"0 0 20 8\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <path\n              fillRule=\"evenodd\"\n              clipRule=\"evenodd\"\n              d=\"M10 0C13 0 15.9999 8 20 8H0C3.9749 8 7 0 10 0Z\"\n              fill=\"currentColor\"\n            />\n          </svg>\n        </div>\n      )}\n      <div vkuiClass=\"Popper__content\">{children}</div>\n    </div>\n  );\n\n  return (\n    <AppRootPortal forcePortal={forcePortal} vkuiClass=\"PopperPortal\">\n      {dropdown}\n    </AppRootPortal>\n  );\n};\n"],"file":"Popper.js"}

package/dist/components/Progress/Progress.d.ts

@@ -1,6 +1,6 @@
-import * as React from 'react';
-import { HasRootRef } from '../../types';
-import './Progress.css';
+import * as React from "react";
+import { HasRootRef } from "../../types";
+import "./Progress.css";
 export interface ProgressProps extends React.HTMLAttributes<HTMLDivElement>, HasRootRef<HTMLDivElement> {
     value?: number;
 }

package/dist/components/Progress/Progress.js

@@ -21,7 +21,7 @@ var Progress = function Progress(_ref) {
     "aria-valuemin": PROGRESS_MIN_VALUE,
     "aria-valuemax": PROGRESS_MAX_VALUE,
     ref: getRootRef,
-    vkuiClass: getClassName('Progress', platform)
+    vkuiClass: getClassName("Progress", platform)
   }), createScopedElement("div", {
     vkuiClass: "Progress__bg",
     "aria-hidden": "true"

package/dist/components/Progress/Progress.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Progress/Progress.tsx"],"names":["getClassName","usePlatform","PROGRESS_MIN_VALUE","PROGRESS_MAX_VALUE","Progress","value","getRootRef","restProps","platform","progress","Math","max","min","width","defaultProps"],"mappings":";;;;AACA,SAASA,YAAT;AAEA,SAASC,WAAT;AAOA,IAAMC,kBAAkB,GAAG,CAA3B;AACA,IAAMC,kBAAkB,GAAG,GAA3B;;AAEA,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,OAAwD;AAAA,MAArDC,KAAqD,QAArDA,KAAqD;AAAA,MAA9CC,UAA8C,QAA9CA,UAA8C;AAAA,MAA/BC,SAA+B;;AAChG,MAAMC,QAAQ,GAAGP,WAAW,EAA5B;AAEA,MAAMQ,QAAQ,GAAGC,IAAI,CAACC,GAAL,CAAST,kBAAT,EAA6BQ,IAAI,CAACE,GAAL,CAASP,KAAT,EAAgBF,kBAAhB,CAA7B,CAAjB;AAEA,SACE;AACE,qBAAeE;AADjB,KAEME,SAFN;AAGE,IAAA,IAAI,EAAC,aAHP;AAIE,qBAAeL,kBAJjB;AAKE,qBAAeC,kBALjB;AAME,IAAA,GAAG,EAAEG,UANP;AAOE,IAAA,SAAS,EAAEN,YAAY,CAAC,UAAD,EAAaQ,QAAb;AAPzB,MASE;AAAK,IAAA,SAAS,EAAC,cAAf;AAA8B,mBAAY;AAA1C,IATF,EAUE;AAAK,IAAA,SAAS,EAAC,cAAf;AAA8B,IAAA,KAAK,EAAE;AAAEK,MAAAA,KAAK,YAAKJ,QAAL;AAAP,KAArC;AAAgE,mBAAY;AAA5E,IAVF,CADF;AAcD,CAnBD;;AAqBAL,QAAQ,CAACU,YAAT,GAAwB;AACtBT,EAAAA,KAAK,EAAE;AADe,CAAxB;AAIA,eAAeD,QAAf","sourcesContent":["import * as React from 'react';\nimport { getClassName } from '../../helpers/getClassName';\nimport { HasRootRef } from '../../types';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport './Progress.css';\n\nexport interface ProgressProps extends React.HTMLAttributes<HTMLDivElement>, HasRootRef<HTMLDivElement> {\n  value?: number;\n}\n\nconst PROGRESS_MIN_VALUE = 0;\nconst PROGRESS_MAX_VALUE = 100;\n\nconst Progress: React.FC<ProgressProps> = ({ value, getRootRef, ...restProps }: ProgressProps) => {\n  const platform = usePlatform();\n\n  const progress = Math.max(PROGRESS_MIN_VALUE, Math.min(value, PROGRESS_MAX_VALUE));\n\n  return (\n    <div\n      aria-valuenow={value}\n      {...restProps}\n      role=\"progressbar\"\n      aria-valuemin={PROGRESS_MIN_VALUE}\n      aria-valuemax={PROGRESS_MAX_VALUE}\n      ref={getRootRef}\n      vkuiClass={getClassName('Progress', platform)}\n    >\n      <div vkuiClass=\"Progress__bg\" aria-hidden=\"true\" />\n      <div vkuiClass=\"Progress__in\" style={{ width: `${progress}%` }} aria-hidden=\"true\" />\n    </div>\n  );\n};\n\nProgress.defaultProps = {\n  value: 0,\n};\n\nexport default Progress;\n"],"file":"Progress.js"}
+{"version":3,"sources":["../../../src/components/Progress/Progress.tsx"],"names":["getClassName","usePlatform","PROGRESS_MIN_VALUE","PROGRESS_MAX_VALUE","Progress","value","getRootRef","restProps","platform","progress","Math","max","min","width","defaultProps"],"mappings":";;;;AACA,SAASA,YAAT;AAEA,SAASC,WAAT;AASA,IAAMC,kBAAkB,GAAG,CAA3B;AACA,IAAMC,kBAAkB,GAAG,GAA3B;;AAEA,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,OAIrB;AAAA,MAHnBC,KAGmB,QAHnBA,KAGmB;AAAA,MAFnBC,UAEmB,QAFnBA,UAEmB;AAAA,MADhBC,SACgB;;AACnB,MAAMC,QAAQ,GAAGP,WAAW,EAA5B;AAEA,MAAMQ,QAAQ,GAAGC,IAAI,CAACC,GAAL,CACfT,kBADe,EAEfQ,IAAI,CAACE,GAAL,CAASP,KAAT,EAAgBF,kBAAhB,CAFe,CAAjB;AAKA,SACE;AACE,qBAAeE;AADjB,KAEME,SAFN;AAGE,IAAA,IAAI,EAAC,aAHP;AAIE,qBAAeL,kBAJjB;AAKE,qBAAeC,kBALjB;AAME,IAAA,GAAG,EAAEG,UANP;AAOE,IAAA,SAAS,EAAEN,YAAY,CAAC,UAAD,EAAaQ,QAAb;AAPzB,MASE;AAAK,IAAA,SAAS,EAAC,cAAf;AAA8B,mBAAY;AAA1C,IATF,EAUE;AACE,IAAA,SAAS,EAAC,cADZ;AAEE,IAAA,KAAK,EAAE;AAAEK,MAAAA,KAAK,YAAKJ,QAAL;AAAP,KAFT;AAGE,mBAAY;AAHd,IAVF,CADF;AAkBD,CA9BD;;AAgCAL,QAAQ,CAACU,YAAT,GAAwB;AACtBT,EAAAA,KAAK,EAAE;AADe,CAAxB;AAIA,eAAeD,QAAf","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { HasRootRef } from \"../../types\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport \"./Progress.css\";\n\nexport interface ProgressProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  value?: number;\n}\n\nconst PROGRESS_MIN_VALUE = 0;\nconst PROGRESS_MAX_VALUE = 100;\n\nconst Progress: React.FC<ProgressProps> = ({\n  value,\n  getRootRef,\n  ...restProps\n}: ProgressProps) => {\n  const platform = usePlatform();\n\n  const progress = Math.max(\n    PROGRESS_MIN_VALUE,\n    Math.min(value, PROGRESS_MAX_VALUE)\n  );\n\n  return (\n    <div\n      aria-valuenow={value}\n      {...restProps}\n      role=\"progressbar\"\n      aria-valuemin={PROGRESS_MIN_VALUE}\n      aria-valuemax={PROGRESS_MAX_VALUE}\n      ref={getRootRef}\n      vkuiClass={getClassName(\"Progress\", platform)}\n    >\n      <div vkuiClass=\"Progress__bg\" aria-hidden=\"true\" />\n      <div\n        vkuiClass=\"Progress__in\"\n        style={{ width: `${progress}%` }}\n        aria-hidden=\"true\"\n      />\n    </div>\n  );\n};\n\nProgress.defaultProps = {\n  value: 0,\n};\n\nexport default Progress;\n"],"file":"Progress.js"}

package/dist/components/PromoBanner/PromoBanner.d.ts

@@ -1,6 +1,6 @@
-import * as React from 'react';
-import './PromoBanner.css';
-declare type StatsType = 'playbackStarted' | 'click';
+import * as React from "react";
+import "./PromoBanner.css";
+declare type StatsType = "playbackStarted" | "click";
 declare type BannerData = {
     title?: string;
     url_types?: string;

package/dist/components/PromoBanner/PromoBanner.js

@@ -5,8 +5,8 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["bannerData", "onClose"];
 import { createScopedElement } from "../../lib/jsxRuntime";
-import * as React from 'react';
-import { Icon24Dismiss } from '@vkontakte/icons';
+import * as React from "react";
+import { Icon24Dismiss } from "@vkontakte/icons";
 import Button from "../Button/Button";
 import SimpleCell from "../SimpleCell/SimpleCell";
 import Avatar from "../Avatar/Avatar";
@@ -24,7 +24,7 @@ var PromoBanner = function PromoBanner(props) {
 
   var ageRestrictions = bannerData.ageRestrictions != null ? parseInt(bannerData.ageRestrictions) : bannerData.ageRestriction;
 
-  var _React$useState = React.useState(''),
+  var _React$useState = React.useState(""),
       _React$useState2 = _slicedToArray(_React$useState, 2),
       currentPixel = _React$useState2[0],
       setCurrentPixel = _React$useState2[1];
@@ -35,7 +35,7 @@ var PromoBanner = function PromoBanner(props) {
     }, {}) : {};
   }, [bannerData.statistics]);
   var onClick = React.useCallback(function () {
-    return setCurrentPixel(statsPixels.click || '');
+    return setCurrentPixel(statsPixels.click || "");
   }, [statsPixels.click]);
   React.useEffect(function () {
     if (statsPixels.playbackStarted) {
@@ -43,14 +43,14 @@ var PromoBanner = function PromoBanner(props) {
     }
   }, [statsPixels.playbackStarted]);
   return createScopedElement("div", _extends({
-    vkuiClass: getClassName('PromoBanner', platform)
+    vkuiClass: getClassName("PromoBanner", platform)
   }, restProps), createScopedElement("div", {
     vkuiClass: "PromoBanner__head"
   }, createScopedElement(Caption, {
     weight: "regular",
     level: "1",
     vkuiClass: "PromoBanner__label"
-  }, bannerData.advertisingLabel || 'Advertisement'), ageRestrictions != null && createScopedElement(Caption, {
+  }, bannerData.advertisingLabel || "Advertisement"), ageRestrictions != null && createScopedElement(Caption, {
     weight: "regular",
     level: "1",
     vkuiClass: "PromoBanner__age"