@vkontakte/vkui 4.22.0 → 4.24.0

package/dist/cssm/components/PanelHeaderContent/PanelHeaderContent.js

@@ -9,29 +9,51 @@ import { usePlatform } from "../../hooks/usePlatform";
 import { hasReactNode } from "../../lib/utils";
 import Caption from "../Typography/Caption/Caption";
 import Headline from "../Typography/Headline/Headline";
-import { IOS } from "../../lib/platform";
+import { IOS, Platform } from "../../lib/platform";
+import Text from "../Typography/Text/Text";
 import "./PanelHeaderContent.css";
 
-var PanelHeaderContent = function PanelHeaderContent(_ref) {
-  var className = _ref.className,
-      style = _ref.style,
-      aside = _ref.aside,
-      status = _ref.status,
-      before = _ref.before,
-      children = _ref.children,
-      onClick = _ref.onClick,
-      restProps = _objectWithoutProperties(_ref, _excluded);
+var PanelHeaderChildren = function PanelHeaderChildren(_ref) {
+  var platform = _ref.platform,
+      hasStatus = _ref.hasStatus,
+      hasBefore = _ref.hasBefore,
+      children = _ref.children;
 
-  var InComponent = onClick ? Tappable : 'div';
+  if (platform === Platform.VKCOM) {
+    return createScopedElement(Text, {
+      Component: "div",
+      weight: "medium"
+    }, children);
+  }
+
+  return hasStatus || hasBefore ? createScopedElement(Headline, {
+    Component: "div",
+    weight: "medium"
+  }, children) : createScopedElement("div", {
+    vkuiClass: "PanelHeaderContent__children-in"
+  }, children);
+};
+
+var PanelHeaderContent = function PanelHeaderContent(_ref2) {
+  var className = _ref2.className,
+      style = _ref2.style,
+      aside = _ref2.aside,
+      status = _ref2.status,
+      before = _ref2.before,
+      children = _ref2.children,
+      onClick = _ref2.onClick,
+      restProps = _objectWithoutProperties(_ref2, _excluded);
+
+  var InComponent = onClick ? Tappable : "div";
   var rootProps = onClick ? {} : restProps;
   var platform = usePlatform();
   var inProps = onClick ? _objectSpread(_objectSpread({}, restProps), {}, {
     onClick: onClick,
     activeEffectDelay: 200,
     hasActive: platform === IOS,
-    activeMode: 'opacity'
+    activeMode: "opacity"
   }) : {};
-  var baseClassNames = getClassName('PanelHeaderContent', platform);
+  var baseClassNames = getClassName("PanelHeaderContent", platform);
   return createScopedElement("div", _extends({}, rootProps, {
     vkuiClass: baseClassNames,
     style: style,
@@ -46,14 +68,11 @@ var PanelHeaderContent = function PanelHeaderContent(_ref) {
     vkuiClass: "PanelHeaderContent__status"
   }, status), createScopedElement("div", {
     vkuiClass: "PanelHeaderContent__children"
-  }, hasReactNode(status) ? createScopedElement(Headline, {
-    Component: "span",
-    weight: "medium"
-  }, children) : createScopedElement("span", {
-    vkuiClass: "PanelHeaderContent__children-in"
-  }, children), hasReactNode(aside) && createScopedElement("div", {
-    vkuiClass: "PanelHeaderContent__aside"
-  }, aside)), hasReactNode(before) && createScopedElement("div", {
+  }, createScopedElement(PanelHeaderChildren, {
+    platform: platform,
+    hasStatus: hasReactNode(status),
+    hasBefore: hasReactNode(before)
+  }, children)), hasReactNode(before) && createScopedElement("div", {
     vkuiClass: "PanelHeaderContent__width"
   })));
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/PanelHeaderContent/PanelHeaderContent.tsx"],"names":["getClassName","Tappable","usePlatform","hasReactNode","Caption","Headline","IOS","PanelHeaderContent","className","style","aside","status","before","children","onClick","restProps","InComponent","rootProps","platform","inProps","activeEffectDelay","hasActive","activeMode","baseClassNames"],"mappings":";;;;;AACA,SAASA,YAAT;AACA,OAAOC,QAAP;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,OAAOC,OAAP;AACA,OAAOC,QAAP;AACA,SAASC,GAAT;AACA;;AAQA,IAAMC,kBAAoE,GAAG,SAAvEA,kBAAuE,OAS9C;AAAA,MAR7BC,SAQ6B,QAR7BA,SAQ6B;AAAA,MAP7BC,KAO6B,QAP7BA,KAO6B;AAAA,MAN7BC,KAM6B,QAN7BA,KAM6B;AAAA,MAL7BC,MAK6B,QAL7BA,MAK6B;AAAA,MAJ7BC,MAI6B,QAJ7BA,MAI6B;AAAA,MAH7BC,QAG6B,QAH7BA,QAG6B;AAAA,MAF7BC,OAE6B,QAF7BA,OAE6B;AAAA,MAD1BC,SAC0B;;AAC7B,MAAMC,WAAW,GAAGF,OAAO,GAAGb,QAAH,GAAc,KAAzC;AACA,MAAMgB,SAAS,GAAGH,OAAO,GAAG,EAAH,GAAQC,SAAjC;AACA,MAAMG,QAAQ,GAAGhB,WAAW,EAA5B;AACA,MAAMiB,OAAO,GAAGL,OAAO,mCAClBC,SADkB;AAErBD,IAAAA,OAAO,EAAPA,OAFqB;AAGrBM,IAAAA,iBAAiB,EAAE,GAHE;AAIrBC,IAAAA,SAAS,EAAEH,QAAQ,KAAKZ,GAJH;AAKrBgB,IAAAA,UAAU,EAAE;AALS,OAMnB,EANJ;AAOA,MAAMC,cAAc,GAAGvB,YAAY,CAAC,oBAAD,EAAuBkB,QAAvB,CAAnC;AAEA,SACE,wCAASD,SAAT;AAAoB,IAAA,SAAS,EAAEM,cAA/B;AAA+C,IAAA,KAAK,EAAEd,KAAtD;AAA6D,IAAA,SAAS,EAAED;AAAxE,MACGL,YAAY,CAACS,MAAD,CAAZ,IAAwB;AAAK,IAAA,SAAS,EAAC;AAAf,KAA6CA,MAA7C,CAD3B,EAEE,oBAAC,WAAD,eACMO,OADN;AAEE,IAAA,SAAS,EAAC;AAFZ,MAIGhB,YAAY,CAACQ,MAAD,CAAZ,IACC,oBAAC,OAAD;AAAS,IAAA,KAAK,EAAC,GAAf;AAAmB,IAAA,MAAM,EAAC,SAA1B;AAAoC,IAAA,SAAS,EAAC;AAA9C,KACGA,MADH,CALJ,EASE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGR,YAAY,CAACQ,MAAD,CAAZ,GACC,oBAAC,QAAD;AAAU,IAAA,SAAS,EAAC,MAApB;AAA2B,IAAA,MAAM,EAAC;AAAlC,KACGE,QADH,CADD,GAIG;AAAM,IAAA,SAAS,EAAC;AAAhB,KAAmDA,QAAnD,CALN,EAOGV,YAAY,CAACO,KAAD,CAAZ,IAAuB;AAAK,IAAA,SAAS,EAAC;AAAf,KAA4CA,KAA5C,CAP1B,CATF,EAkBGP,YAAY,CAACS,MAAD,CAAZ,IAAwB;AAAK,IAAA,SAAS,EAAC;AAAf,IAlB3B,CAFF,CADF;AAyBD,CA/CD;;AAiDA,eAAeL,kBAAf","sourcesContent":["import * as React from 'react';\nimport { getClassName } from '../../helpers/getClassName';\nimport Tappable from '../Tappable/Tappable';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { hasReactNode } from '../../lib/utils';\nimport Caption from '../Typography/Caption/Caption';\nimport Headline from '../Typography/Headline/Headline';\nimport { IOS } from '../../lib/platform';\nimport './PanelHeaderContent.css';\n\nexport interface PanelHeaderContentProps extends React.HTMLAttributes<HTMLDivElement> {\n  aside?: React.ReactNode;\n  before?: React.ReactNode;\n  status?: React.ReactNode;\n}\n\nconst PanelHeaderContent: React.FunctionComponent<PanelHeaderContentProps> = ({\n  className,\n  style,\n  aside,\n  status,\n  before,\n  children,\n  onClick,\n  ...restProps\n}: PanelHeaderContentProps) => {\n  const InComponent = onClick ? Tappable : 'div';\n  const rootProps = onClick ? {} : restProps;\n  const platform = usePlatform();\n  const inProps = onClick ? {\n    ...restProps,\n    onClick,\n    activeEffectDelay: 200,\n    hasActive: platform === IOS,\n    activeMode: 'opacity',\n  } : {};\n  const baseClassNames = getClassName('PanelHeaderContent', platform);\n\n  return (\n    <div {...rootProps} vkuiClass={baseClassNames} style={style} className={className}>\n      {hasReactNode(before) && <div vkuiClass=\"PanelHeaderContent__before\">{before}</div>}\n      <InComponent\n        {...inProps}\n        vkuiClass=\"PanelHeaderContent__in\"\n      >\n        {hasReactNode(status) &&\n          <Caption level=\"1\" weight=\"regular\" vkuiClass=\"PanelHeaderContent__status\">\n            {status}\n          </Caption>\n        }\n        <div vkuiClass=\"PanelHeaderContent__children\">\n          {hasReactNode(status) ?\n            <Headline Component=\"span\" weight=\"medium\">\n              {children}\n            </Headline>\n            : <span vkuiClass=\"PanelHeaderContent__children-in\">{children}</span>\n          }\n          {hasReactNode(aside) && <div vkuiClass=\"PanelHeaderContent__aside\">{aside}</div>}\n        </div>\n        {hasReactNode(before) && <div vkuiClass=\"PanelHeaderContent__width\" />}\n      </InComponent>\n    </div>\n  );\n};\n\nexport default PanelHeaderContent;\n"],"file":"PanelHeaderContent.js"}
+{"version":3,"sources":["../../../../src/components/PanelHeaderContent/PanelHeaderContent.tsx"],"names":["getClassName","Tappable","usePlatform","hasReactNode","Caption","Headline","IOS","Platform","Text","PanelHeaderChildren","platform","hasStatus","hasBefore","children","VKCOM","PanelHeaderContent","className","style","aside","status","before","onClick","restProps","InComponent","rootProps","inProps","activeEffectDelay","hasActive","activeMode","baseClassNames"],"mappings":";;;;;AACA,SAASA,YAAT;AACA,OAAOC,QAAP;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,OAAOC,OAAP;AACA,OAAOC,QAAP;AACA,SAASC,GAAT,EAAcC,QAAd;AACA,OAAOC,IAAP;AAEA;;AAcA,IAAMC,mBAAuD,GAAG,SAA1DA,mBAA0D,OAK1D;AAAA,MAJJC,QAII,QAJJA,QAII;AAAA,MAHJC,SAGI,QAHJA,SAGI;AAAA,MAFJC,SAEI,QAFJA,SAEI;AAAA,MADJC,QACI,QADJA,QACI;;AACJ,MAAIH,QAAQ,KAAKH,QAAQ,CAACO,KAA1B,EAAiC;AAC/B,WACE,oBAAC,IAAD;AAAM,MAAA,SAAS,EAAC,KAAhB;AAAsB,MAAA,MAAM,EAAC;AAA7B,OACGD,QADH,CADF;AAKD;;AAED,SAAOF,SAAS,IAAIC,SAAb,GACL,oBAAC,QAAD;AAAU,IAAA,SAAS,EAAC,KAApB;AAA0B,IAAA,MAAM,EAAC;AAAjC,KACGC,QADH,CADK,GAKL;AAAK,IAAA,SAAS,EAAC;AAAf,KAAkDA,QAAlD,CALF;AAOD,CArBD;;AAuBA,IAAME,kBAAoE,GAAG,SAAvEA,kBAAuE,QAS9C;AAAA,MAR7BC,SAQ6B,SAR7BA,SAQ6B;AAAA,MAP7BC,KAO6B,SAP7BA,KAO6B;AAAA,MAN7BC,KAM6B,SAN7BA,KAM6B;AAAA,MAL7BC,MAK6B,SAL7BA,MAK6B;AAAA,MAJ7BC,MAI6B,SAJ7BA,MAI6B;AAAA,MAH7BP,QAG6B,SAH7BA,QAG6B;AAAA,MAF7BQ,OAE6B,SAF7BA,OAE6B;AAAA,MAD1BC,SAC0B;;AAC7B,MAAMC,WAAW,GAAGF,OAAO,GAAGpB,QAAH,GAAc,KAAzC;AACA,MAAMuB,SAAS,GAAGH,OAAO,GAAG,EAAH,GAAQC,SAAjC;AACA,MAAMZ,QAAQ,GAAGR,WAAW,EAA5B;AACA,MAAMuB,OAAO,GAAGJ,OAAO,mCAEdC,SAFc;AAGjBD,IAAAA,OAAO,EAAPA,OAHiB;AAIjBK,IAAAA,iBAAiB,EAAE,GAJF;AAKjBC,IAAAA,SAAS,EAAEjB,QAAQ,KAAKJ,GALP;AAMjBsB,IAAAA,UAAU,EAAE;AANK,OAQnB,EARJ;AASA,MAAMC,cAAc,GAAG7B,YAAY,CAAC,oBAAD,EAAuBU,QAAvB,CAAnC;AAEA,SACE,wCACMc,SADN;AAEE,IAAA,SAAS,EAAEK,cAFb;AAGE,IAAA,KAAK,EAAEZ,KAHT;AAIE,IAAA,SAAS,EAAED;AAJb,MAMGb,YAAY,CAACiB,MAAD,CAAZ,IACC;AAAK,IAAA,SAAS,EAAC;AAAf,KAA6CA,MAA7C,CAPJ,EASE,oBAAC,WAAD,eAAiBK,OAAjB;AAA0B,IAAA,SAAS,EAAC;AAApC,MACGtB,YAAY,CAACgB,MAAD,CAAZ,IACC,oBAAC,OAAD;AACE,IAAA,KAAK,EAAC,GADR;AAEE,IAAA,MAAM,EAAC,SAFT;AAGE,IAAA,SAAS,EAAC;AAHZ,KAKGA,MALH,CAFJ,EAUE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE,oBAAC,mBAAD;AACE,IAAA,QAAQ,EAAET,QADZ;AAEE,IAAA,SAAS,EAAEP,YAAY,CAACgB,MAAD,CAFzB;AAGE,IAAA,SAAS,EAAEhB,YAAY,CAACiB,MAAD;AAHzB,KAKGP,QALH,CADF,CAVF,EAmBGV,YAAY,CAACiB,MAAD,CAAZ,IAAwB;AAAK,IAAA,SAAS,EAAC;AAAf,IAnB3B,CATF,CADF;AAiCD,CAzDD;;AA2DA,eAAeL,kBAAf","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport Tappable from \"../Tappable/Tappable\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport Caption from \"../Typography/Caption/Caption\";\nimport Headline from \"../Typography/Headline/Headline\";\nimport { IOS, Platform } from \"../../lib/platform\";\nimport Text from \"../Typography/Text/Text\";\nimport { HasPlatform } from \"../../types\";\nimport \"./PanelHeaderContent.css\";\n\nexport interface PanelHeaderContentProps\n  extends React.HTMLAttributes<HTMLDivElement> {\n  aside?: React.ReactNode;\n  before?: React.ReactNode;\n  status?: React.ReactNode;\n}\n\ninterface PanelHeaderChildrenProps extends HasPlatform {\n  hasStatus: boolean;\n  hasBefore: boolean;\n}\n\nconst PanelHeaderChildren: React.FC<PanelHeaderChildrenProps> = ({\n  platform,\n  hasStatus,\n  hasBefore,\n  children,\n}) => {\n  if (platform === Platform.VKCOM) {\n    return (\n      <Text Component=\"div\" weight=\"medium\">\n        {children}\n      </Text>\n    );\n  }\n\n  return hasStatus || hasBefore ? (\n    <Headline Component=\"div\" weight=\"medium\">\n      {children}\n    </Headline>\n  ) : (\n    <div vkuiClass=\"PanelHeaderContent__children-in\">{children}</div>\n  );\n};\n\nconst PanelHeaderContent: React.FunctionComponent<PanelHeaderContentProps> = ({\n  className,\n  style,\n  aside,\n  status,\n  before,\n  children,\n  onClick,\n  ...restProps\n}: PanelHeaderContentProps) => {\n  const InComponent = onClick ? Tappable : \"div\";\n  const rootProps = onClick ? {} : restProps;\n  const platform = usePlatform();\n  const inProps = onClick\n    ? {\n        ...restProps,\n        onClick,\n        activeEffectDelay: 200,\n        hasActive: platform === IOS,\n        activeMode: \"opacity\",\n      }\n    : {};\n  const baseClassNames = getClassName(\"PanelHeaderContent\", platform);\n\n  return (\n    <div\n      {...rootProps}\n      vkuiClass={baseClassNames}\n      style={style}\n      className={className}\n    >\n      {hasReactNode(before) && (\n        <div vkuiClass=\"PanelHeaderContent__before\">{before}</div>\n      )}\n      <InComponent {...inProps} vkuiClass=\"PanelHeaderContent__in\">\n        {hasReactNode(status) && (\n          <Caption\n            level=\"1\"\n            weight=\"regular\"\n            vkuiClass=\"PanelHeaderContent__status\"\n          >\n            {status}\n          </Caption>\n        )}\n        <div vkuiClass=\"PanelHeaderContent__children\">\n          <PanelHeaderChildren\n            platform={platform}\n            hasStatus={hasReactNode(status)}\n            hasBefore={hasReactNode(before)}\n          >\n            {children}\n          </PanelHeaderChildren>\n        </div>\n        {hasReactNode(before) && <div vkuiClass=\"PanelHeaderContent__width\" />}\n      </InComponent>\n    </div>\n  );\n};\n\nexport default PanelHeaderContent;\n"],"file":"PanelHeaderContent.js"}

package/dist/cssm/components/PanelHeaderContext/PanelHeaderContext.js

@@ -3,7 +3,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["children", "onClose", "opened"];
 import { createScopedElement } from "../../lib/jsxRuntime";
-import * as React from 'react';
+import * as React from "react";
 import FixedLayout from "../FixedLayout/FixedLayout";
 import { classNames } from "../../lib/classNames";
 import { getClassName } from "../../helpers/getClassName";
@@ -43,7 +43,7 @@ export var PanelHeaderContext = function PanelHeaderContext(_ref) {
     opened && setVisible(true);
   }, [opened]); // start closing on outer click
 
-  useGlobalEventListener(document, 'click', isDesktop && opened && !closing && function (event) {
+  useGlobalEventListener(document, "click", isDesktop && opened && !closing && function (event) {
     if (elementRef.current && !elementRef.current.contains(event.target)) {
       onClose();
     }
@@ -58,10 +58,10 @@ export var PanelHeaderContext = function PanelHeaderContext(_ref) {
     return closing ? animationFallback.set() : animationFallback.clear();
   }, [closing]);
   return createScopedElement(FixedLayout, _extends({}, restProps, {
-    vkuiClass: classNames(getClassName('PanelHeaderContext', platform), {
-      'PanelHeaderContext--opened': opened,
-      'PanelHeaderContext--closing': closing,
-      'PanelHeaderContext--desktop': isDesktop
+    vkuiClass: classNames(getClassName("PanelHeaderContext", platform), {
+      "PanelHeaderContext--opened": opened,
+      "PanelHeaderContext--closing": closing,
+      "PanelHeaderContext--desktop": isDesktop
     }),
     vertical: "top"
   }), createScopedElement("div", {

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/PanelHeaderContext/PanelHeaderContext.tsx"],"names":["React","FixedLayout","classNames","getClassName","ViewWidth","useAdaptivity","useDOM","useIsomorphicLayoutEffect","useGlobalEventListener","useTimeout","usePlatform","PanelHeaderContext","children","onClose","opened","restProps","document","platform","useState","visible","setVisible","closing","viewWidth","isDesktop","SMALL_TABLET","elementRef","useRef","event","current","contains","target","onAnimationEnd","animationFallback","useEffect","set","clear"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,WAAP;AACA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,SAASC,SAAT;AACA,SAASC,aAAT;AACA,SAASC,MAAT;AACA,SAASC,yBAAT;AACA,SAASC,sBAAT;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AACA;AAOA,OAAO,IAAMC,kBAAqD,GAAG,SAAxDA,kBAAwD,OAK/D;AAAA,MAJJC,QAII,QAJJA,QAII;AAAA,MAHJC,OAGI,QAHJA,OAGI;AAAA,yBAFJC,MAEI;AAAA,MAFJA,MAEI,4BAFK,KAEL;AAAA,MADDC,SACC;;AACJ,gBAAqBT,MAAM,EAA3B;AAAA,MAAQU,QAAR,WAAQA,QAAR;;AACA,MAAMC,QAAQ,GAAGP,WAAW,EAA5B;;AACA,wBAA8BV,KAAK,CAACkB,QAAN,CAAeJ,MAAf,CAA9B;AAAA;AAAA,MAAOK,OAAP;AAAA,MAAgBC,UAAhB;;AACA,MAAMC,OAAO,GAAGF,OAAO,IAAI,CAACL,MAA5B;;AACA,uBAAsBT,aAAa,EAAnC;AAAA,MAAQiB,SAAR,kBAAQA,SAAR;;AACA,MAAMC,SAAS,GAAGD,SAAS,IAAIlB,SAAS,CAACoB,YAAzC;AACA,MAAMC,UAAU,GAAGzB,KAAK,CAAC0B,MAAN,EAAnB;AAEAnB,EAAAA,yBAAyB,CAAC,YAAM;AAC9BO,IAAAA,MAAM,IAAIM,UAAU,CAAC,IAAD,CAApB;AACD,GAFwB,EAEtB,CAACN,MAAD,CAFsB,CAAzB,CATI,CAaJ;;AACAN,EAAAA,sBAAsB,CAACQ,QAAD,EAAW,OAAX,EAAoBO,SAAS,IAAIT,MAAb,IAAuB,CAACO,OAAxB,IAAoC,UAACM,KAAD,EAAW;AACvF,QAAIF,UAAU,CAACG,OAAX,IAAsB,CAACH,UAAU,CAACG,OAAX,CAAmBC,QAAnB,CAA4BF,KAAK,CAACG,MAAlC,CAA3B,EAA8E;AAC5EjB,MAAAA,OAAO;AACR;AACF,GAJqB,CAAtB,CAdI,CAoBJ;;AACA,MAAMkB,cAAc,GAAG,SAAjBA,cAAiB;AAAA,WAAMX,UAAU,CAAC,KAAD,CAAhB;AAAA,GAAvB;;AACA,MAAMY,iBAAiB,GAAGvB,UAAU,CAACsB,cAAD,EAAiB,GAAjB,CAApC;AACA/B,EAAAA,KAAK,CAACiC,SAAN,CAAgB;AAAA,WAAMZ,OAAO,GAAGW,iBAAiB,CAACE,GAAlB,EAAH,GAA6BF,iBAAiB,CAACG,KAAlB,EAA1C;AAAA,GAAhB,EAAqF,CAACd,OAAD,CAArF;AAEA,SACE,oBAAC,WAAD,eAAiBN,SAAjB;AAA4B,IAAA,SAAS,EAAEb,UAAU,CAACC,YAAY,CAAC,oBAAD,EAAuBc,QAAvB,CAAb,EAA+C;AAC9F,oCAA8BH,MADgE;AAE9F,qCAA+BO,OAF+D;AAG9F,qCAA+BE;AAH+D,KAA/C,CAAjD;AAII,IAAA,QAAQ,EAAC;AAJb,MAKE;AAAK,IAAA,SAAS,EAAC,wBAAf;AAAwC,IAAA,GAAG,EAAEE,UAA7C;AAAyD,IAAA,cAAc,EAAEJ,OAAO,GAAGU,cAAH,GAAoB;AAApG,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGZ,OAAO,IAAIP,QADd,CADF,CALF,EAUG,CAACW,SAAD,IAAcJ,OAAd,IAAyB;AAAK,IAAA,OAAO,EAAEN,OAAd;AAAuB,IAAA,SAAS,EAAC;AAAjC,IAV5B,CADF;AAcD,CA5CM","sourcesContent":["import * as React from 'react';\nimport FixedLayout from '../FixedLayout/FixedLayout';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport { ViewWidth } from '../AdaptivityProvider/AdaptivityContext';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport './PanelHeaderContext.css';\n\nexport interface PanelHeaderContextProps extends React.HTMLAttributes<HTMLDivElement> {\n  opened: boolean;\n  onClose: VoidFunction;\n}\n\nexport const PanelHeaderContext: React.FC<PanelHeaderContextProps> = ({\n  children,\n  onClose,\n  opened = false,\n  ...restProps\n}) => {\n  const { document } = useDOM();\n  const platform = usePlatform();\n  const [visible, setVisible] = React.useState(opened);\n  const closing = visible && !opened;\n  const { viewWidth } = useAdaptivity();\n  const isDesktop = viewWidth >= ViewWidth.SMALL_TABLET;\n  const elementRef = React.useRef<HTMLDivElement>();\n\n  useIsomorphicLayoutEffect(() => {\n    opened && setVisible(true);\n  }, [opened]);\n\n  // start closing on outer click\n  useGlobalEventListener(document, 'click', isDesktop && opened && !closing && ((event) => {\n    if (elementRef.current && !elementRef.current.contains(event.target as Node)) {\n      onClose();\n    }\n  }));\n\n  // fallback onAnimationEnd when animationend not supported\n  const onAnimationEnd = () => setVisible(false);\n  const animationFallback = useTimeout(onAnimationEnd, 200);\n  React.useEffect(() => closing ? animationFallback.set() : animationFallback.clear(), [closing]);\n\n  return (\n    <FixedLayout {...restProps} vkuiClass={classNames(getClassName('PanelHeaderContext', platform), {\n      'PanelHeaderContext--opened': opened,\n      'PanelHeaderContext--closing': closing,\n      'PanelHeaderContext--desktop': isDesktop,\n    })} vertical=\"top\">\n      <div vkuiClass=\"PanelHeaderContext__in\" ref={elementRef} onAnimationEnd={closing ? onAnimationEnd : null}>\n        <div vkuiClass=\"PanelHeaderContext__content\">\n          {visible && children}\n        </div>\n      </div>\n      {!isDesktop && visible && <div onClick={onClose} vkuiClass=\"PanelHeaderContext__fade\" />}\n    </FixedLayout>\n  );\n};\n"],"file":"PanelHeaderContext.js"}
+{"version":3,"sources":["../../../../src/components/PanelHeaderContext/PanelHeaderContext.tsx"],"names":["React","FixedLayout","classNames","getClassName","ViewWidth","useAdaptivity","useDOM","useIsomorphicLayoutEffect","useGlobalEventListener","useTimeout","usePlatform","PanelHeaderContext","children","onClose","opened","restProps","document","platform","useState","visible","setVisible","closing","viewWidth","isDesktop","SMALL_TABLET","elementRef","useRef","event","current","contains","target","onAnimationEnd","animationFallback","useEffect","set","clear"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,WAAP;AACA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,SAASC,SAAT;AACA,SAASC,aAAT;AACA,SAASC,MAAT;AACA,SAASC,yBAAT;AACA,SAASC,sBAAT;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AACA;AAQA,OAAO,IAAMC,kBAAqD,GAAG,SAAxDA,kBAAwD,OAK/D;AAAA,MAJJC,QAII,QAJJA,QAII;AAAA,MAHJC,OAGI,QAHJA,OAGI;AAAA,yBAFJC,MAEI;AAAA,MAFJA,MAEI,4BAFK,KAEL;AAAA,MADDC,SACC;;AACJ,gBAAqBT,MAAM,EAA3B;AAAA,MAAQU,QAAR,WAAQA,QAAR;;AACA,MAAMC,QAAQ,GAAGP,WAAW,EAA5B;;AACA,wBAA8BV,KAAK,CAACkB,QAAN,CAAeJ,MAAf,CAA9B;AAAA;AAAA,MAAOK,OAAP;AAAA,MAAgBC,UAAhB;;AACA,MAAMC,OAAO,GAAGF,OAAO,IAAI,CAACL,MAA5B;;AACA,uBAAsBT,aAAa,EAAnC;AAAA,MAAQiB,SAAR,kBAAQA,SAAR;;AACA,MAAMC,SAAS,GAAGD,SAAS,IAAIlB,SAAS,CAACoB,YAAzC;AACA,MAAMC,UAAU,GAAGzB,KAAK,CAAC0B,MAAN,EAAnB;AAEAnB,EAAAA,yBAAyB,CAAC,YAAM;AAC9BO,IAAAA,MAAM,IAAIM,UAAU,CAAC,IAAD,CAApB;AACD,GAFwB,EAEtB,CAACN,MAAD,CAFsB,CAAzB,CATI,CAaJ;;AACAN,EAAAA,sBAAsB,CACpBQ,QADoB,EAEpB,OAFoB,EAGpBO,SAAS,IACPT,MADF,IAEE,CAACO,OAFH,IAGG,UAACM,KAAD,EAAW;AACV,QACEF,UAAU,CAACG,OAAX,IACA,CAACH,UAAU,CAACG,OAAX,CAAmBC,QAAnB,CAA4BF,KAAK,CAACG,MAAlC,CAFH,EAGE;AACAjB,MAAAA,OAAO;AACR;AACF,GAbiB,CAAtB,CAdI,CA8BJ;;AACA,MAAMkB,cAAc,GAAG,SAAjBA,cAAiB;AAAA,WAAMX,UAAU,CAAC,KAAD,CAAhB;AAAA,GAAvB;;AACA,MAAMY,iBAAiB,GAAGvB,UAAU,CAACsB,cAAD,EAAiB,GAAjB,CAApC;AACA/B,EAAAA,KAAK,CAACiC,SAAN,CACE;AAAA,WAAOZ,OAAO,GAAGW,iBAAiB,CAACE,GAAlB,EAAH,GAA6BF,iBAAiB,CAACG,KAAlB,EAA3C;AAAA,GADF,EAEE,CAACd,OAAD,CAFF;AAKA,SACE,oBAAC,WAAD,eACMN,SADN;AAEE,IAAA,SAAS,EAAEb,UAAU,CAACC,YAAY,CAAC,oBAAD,EAAuBc,QAAvB,CAAb,EAA+C;AAClE,oCAA8BH,MADoC;AAElE,qCAA+BO,OAFmC;AAGlE,qCAA+BE;AAHmC,KAA/C,CAFvB;AAOE,IAAA,QAAQ,EAAC;AAPX,MASE;AACE,IAAA,SAAS,EAAC,wBADZ;AAEE,IAAA,GAAG,EAAEE,UAFP;AAGE,IAAA,cAAc,EAAEJ,OAAO,GAAGU,cAAH,GAAoB;AAH7C,KAKE;AAAK,IAAA,SAAS,EAAC;AAAf,KAA8CZ,OAAO,IAAIP,QAAzD,CALF,CATF,EAgBG,CAACW,SAAD,IAAcJ,OAAd,IACC;AAAK,IAAA,OAAO,EAAEN,OAAd;AAAuB,IAAA,SAAS,EAAC;AAAjC,IAjBJ,CADF;AAsBD,CAjEM","sourcesContent":["import * as React from \"react\";\nimport FixedLayout from \"../FixedLayout/FixedLayout\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { ViewWidth } from \"../AdaptivityProvider/AdaptivityContext\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { useDOM } from \"../../lib/dom\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport \"./PanelHeaderContext.css\";\n\nexport interface PanelHeaderContextProps\n  extends React.HTMLAttributes<HTMLDivElement> {\n  opened: boolean;\n  onClose: VoidFunction;\n}\n\nexport const PanelHeaderContext: React.FC<PanelHeaderContextProps> = ({\n  children,\n  onClose,\n  opened = false,\n  ...restProps\n}) => {\n  const { document } = useDOM();\n  const platform = usePlatform();\n  const [visible, setVisible] = React.useState(opened);\n  const closing = visible && !opened;\n  const { viewWidth } = useAdaptivity();\n  const isDesktop = viewWidth >= ViewWidth.SMALL_TABLET;\n  const elementRef = React.useRef<HTMLDivElement>();\n\n  useIsomorphicLayoutEffect(() => {\n    opened && setVisible(true);\n  }, [opened]);\n\n  // start closing on outer click\n  useGlobalEventListener(\n    document,\n    \"click\",\n    isDesktop &&\n      opened &&\n      !closing &&\n      ((event) => {\n        if (\n          elementRef.current &&\n          !elementRef.current.contains(event.target as Node)\n        ) {\n          onClose();\n        }\n      })\n  );\n\n  // fallback onAnimationEnd when animationend not supported\n  const onAnimationEnd = () => setVisible(false);\n  const animationFallback = useTimeout(onAnimationEnd, 200);\n  React.useEffect(\n    () => (closing ? animationFallback.set() : animationFallback.clear()),\n    [closing]\n  );\n\n  return (\n    <FixedLayout\n      {...restProps}\n      vkuiClass={classNames(getClassName(\"PanelHeaderContext\", platform), {\n        \"PanelHeaderContext--opened\": opened,\n        \"PanelHeaderContext--closing\": closing,\n        \"PanelHeaderContext--desktop\": isDesktop,\n      })}\n      vertical=\"top\"\n    >\n      <div\n        vkuiClass=\"PanelHeaderContext__in\"\n        ref={elementRef}\n        onAnimationEnd={closing ? onAnimationEnd : null}\n      >\n        <div vkuiClass=\"PanelHeaderContext__content\">{visible && children}</div>\n      </div>\n      {!isDesktop && visible && (\n        <div onClick={onClose} vkuiClass=\"PanelHeaderContext__fade\" />\n      )}\n    </FixedLayout>\n  );\n};\n"],"file":"PanelHeaderContext.js"}

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

@@ -4,7 +4,7 @@ var _excluded = ["isActive", "editLabel", "doneLabel"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import { PanelHeaderButton } from "../PanelHeaderButton/PanelHeaderButton";
 import { ANDROID, VKCOM } from "../../lib/platform";
-import { Icon28EditOutline, Icon28DoneOutline } from '@vkontakte/icons';
+import { Icon28EditOutline, Icon28DoneOutline } from "@vkontakte/icons";
 import { usePlatform } from "../../hooks/usePlatform";
 
 var PanelHeaderEdit = function PanelHeaderEdit(_ref) {
@@ -23,8 +23,8 @@ var PanelHeaderEdit = function PanelHeaderEdit(_ref) {
 
 PanelHeaderEdit.defaultProps = {
   isActive: false,
-  editLabel: 'Редактировать',
-  doneLabel: 'Готово'
+  editLabel: "Редактировать",
+  doneLabel: "Готово"
 };
 export default PanelHeaderEdit;
 //# sourceMappingURL=PanelHeaderEdit.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/PanelHeaderEdit/PanelHeaderEdit.tsx"],"names":["PanelHeaderButton","ANDROID","VKCOM","Icon28EditOutline","Icon28DoneOutline","usePlatform","PanelHeaderEdit","isActive","editLabel","doneLabel","restProps","iOSText","AndroidIcon","platform","defaultProps"],"mappings":";;;;AACA,SAASA,iBAAT;AACA,SAASC,OAAT,EAAkBC,KAAlB;AACA,SAASC,iBAAT,EAA4BC,iBAA5B,QAAqD,kBAArD;AACA,SAASC,WAAT;;AAiBA,IAAMC,eAA8D,GAAG,SAAjEA,eAAiE,OAK3C;AAAA,MAJ1BC,QAI0B,QAJ1BA,QAI0B;AAAA,MAH1BC,SAG0B,QAH1BA,SAG0B;AAAA,MAF1BC,SAE0B,QAF1BA,SAE0B;AAAA,MADvBC,SACuB;;AAC1B,MAAMC,OAAO,GAAGJ,QAAQ,GAAGE,SAAH,GAAeD,SAAvC;AACA,MAAMI,WAAW,GAAGL,QAAQ,GAAGH,iBAAH,GAAuBD,iBAAnD;AACA,MAAMU,QAAQ,GAAGR,WAAW,EAA5B;AAEA,SACE,oBAAC,iBAAD;AAAmB,kBAAYM;AAA/B,KAA4CD,SAA5C,GACGG,QAAQ,KAAKZ,OAAb,IAAwBY,QAAQ,KAAKX,KAArC,GACG,oBAAC,WAAD,OADH,GAEGS,OAHN,CADF;AAQD,CAlBD;;AAoBAL,eAAe,CAACQ,YAAhB,GAA+B;AAC7BP,EAAAA,QAAQ,EAAE,KADmB;AAE7BC,EAAAA,SAAS,EAAE,eAFkB;AAG7BC,EAAAA,SAAS,EAAE;AAHkB,CAA/B;AAMA,eAAeH,eAAf","sourcesContent":["import * as React from 'react';\nimport { PanelHeaderButton, PanelHeaderButtonProps } from '../PanelHeaderButton/PanelHeaderButton';\nimport { ANDROID, VKCOM } from '../../lib/platform';\nimport { Icon28EditOutline, Icon28DoneOutline } from '@vkontakte/icons';\nimport { usePlatform } from '../../hooks/usePlatform';\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\nconst PanelHeaderEdit: React.FunctionComponent<PanelHeaderEditProps> = ({\n  isActive,\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 === ANDROID || platform === VKCOM\n        ? <AndroidIcon />\n        : iOSText\n      }\n    </PanelHeaderButton>\n  );\n};\n\nPanelHeaderEdit.defaultProps = {\n  isActive: false,\n  editLabel: 'Редактировать',\n  doneLabel: 'Готово',\n};\n\nexport default PanelHeaderEdit;\n"],"file":"PanelHeaderEdit.js"}
+{"version":3,"sources":["../../../../src/components/PanelHeaderEdit/PanelHeaderEdit.tsx"],"names":["PanelHeaderButton","ANDROID","VKCOM","Icon28EditOutline","Icon28DoneOutline","usePlatform","PanelHeaderEdit","isActive","editLabel","doneLabel","restProps","iOSText","AndroidIcon","platform","defaultProps"],"mappings":";;;;AACA,SACEA,iBADF;AAIA,SAASC,OAAT,EAAkBC,KAAlB;AACA,SAASC,iBAAT,EAA4BC,iBAA5B,QAAqD,kBAArD;AACA,SAASC,WAAT;;AAiBA,IAAMC,eAA8D,GAAG,SAAjEA,eAAiE,OAK3C;AAAA,MAJ1BC,QAI0B,QAJ1BA,QAI0B;AAAA,MAH1BC,SAG0B,QAH1BA,SAG0B;AAAA,MAF1BC,SAE0B,QAF1BA,SAE0B;AAAA,MADvBC,SACuB;;AAC1B,MAAMC,OAAO,GAAGJ,QAAQ,GAAGE,SAAH,GAAeD,SAAvC;AACA,MAAMI,WAAW,GAAGL,QAAQ,GAAGH,iBAAH,GAAuBD,iBAAnD;AACA,MAAMU,QAAQ,GAAGR,WAAW,EAA5B;AAEA,SACE,oBAAC,iBAAD;AAAmB,kBAAYM;AAA/B,KAA4CD,SAA5C,GACGG,QAAQ,KAAKZ,OAAb,IAAwBY,QAAQ,KAAKX,KAArC,GAA6C,oBAAC,WAAD,OAA7C,GAA+DS,OADlE,CADF;AAKD,CAfD;;AAiBAL,eAAe,CAACQ,YAAhB,GAA+B;AAC7BP,EAAAA,QAAQ,EAAE,KADmB;AAE7BC,EAAAA,SAAS,EAAE,eAFkB;AAG7BC,EAAAA,SAAS,EAAE;AAHkB,CAA/B;AAMA,eAAeH,eAAf","sourcesContent":["import * as React from \"react\";\nimport {\n  PanelHeaderButton,\n  PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { ANDROID, VKCOM } from \"../../lib/platform\";\nimport { Icon28EditOutline, Icon28DoneOutline } from \"@vkontakte/icons\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\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\nconst PanelHeaderEdit: React.FunctionComponent<PanelHeaderEditProps> = ({\n  isActive,\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 === ANDROID || platform === VKCOM ? <AndroidIcon /> : iOSText}\n    </PanelHeaderButton>\n  );\n};\n\nPanelHeaderEdit.defaultProps = {\n  isActive: false,\n  editLabel: \"Редактировать\",\n  doneLabel: \"Готово\",\n};\n\nexport default PanelHeaderEdit;\n"],"file":"PanelHeaderEdit.js"}

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

@@ -3,7 +3,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["children"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import { PanelHeaderButton } from "../PanelHeaderButton/PanelHeaderButton";
-import { Icon28DoneOutline } from '@vkontakte/icons';
+import { Icon28DoneOutline } from "@vkontakte/icons";
 import { ANDROID, VKCOM } from "../../lib/platform";
 import { usePlatform } from "../../hooks/usePlatform";
 import { getTitleFromChildren } from "../../lib/utils";
@@ -20,7 +20,7 @@ var PanelHeaderSubmit = function PanelHeaderSubmit(_ref) {
 };
 
 PanelHeaderSubmit.defaultProps = {
-  children: 'Готово'
+  children: "Готово"
 };
 export default PanelHeaderSubmit;
 //# sourceMappingURL=PanelHeaderSubmit.js.map

package/dist/cssm/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/cssm/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/cssm/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/cssm/components/Placeholder/Placeholder.js

@@ -19,8 +19,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/cssm/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;AAEA;;AAqBA,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;AAEA;;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,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/cssm/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";
@@ -28,12 +28,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/cssm/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;AACA;AAOA,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;AACA;AAUA,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/cssm/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";
@@ -14,9 +14,9 @@ import { useDOM } from "../../lib/dom";
 import "./PopoutWrapper.css";
 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,
@@ -37,7 +37,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);
     }
   };
@@ -50,18 +50,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/cssm/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;AACA;AAUA,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;AACA;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,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/cssm/components/Popper/Popper.css

@@ -0,0 +1 @@
+.vkuiPopperPortal{position:relative;z-index:100}.vkuiPopper__arrow-in{content:"";display:block;width:20px;height:8px}[data-popper-placement^=bottom] .vkuiPopper__arrow{bottom:100%}[data-popper-placement^=top] .vkuiPopper__arrow{top:100%}[data-popper-placement^=top] .vkuiPopper__arrow-in{-webkit-transform:rotate(180deg);transform:rotate(180deg)}[data-popper-placement^=left] .vkuiPopper__arrow{left:calc(100% - 6px)}[data-popper-placement^=left] .vkuiPopper__arrow-in{-webkit-transform:rotate(90deg);transform:rotate(90deg)}[data-popper-placement^=right] .vkuiPopper__arrow{right:calc(100% - 6px)}[data-popper-placement^=right] .vkuiPopper__arrow-in{-webkit-transform:rotate(270deg);transform:rotate(270deg)}

package/dist/cssm/components/Popper/Popper.js

@@ -0,0 +1,153 @@
+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", "sameWidth", "offsetDistance", "offsetSkidding", "forcePortal", "style"];
+import { createScopedElement } from "../../lib/jsxRuntime";
+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";
+import { useExternRef } from "../../hooks/useExternRef";
+import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect";
+import "./Popper.css";
+var ARROW_PADDING = 8;
+var ARROW_WIDTH = 20;
+var ARROW_HEIGHT = 8;
+export var Popper = function Popper(_ref) {
+  var targetRef = _ref.targetRef,
+      children = _ref.children,
+      getRef = _ref.getRef,
+      _ref$placement = _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);
+
+  var _React$useState = React.useState(null),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      popperNode = _React$useState2[0],
+      setPopperNode = _React$useState2[1];
+
+  var _React$useState3 = React.useState(0),
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      smallTargetOffsetSkidding = _React$useState4[0],
+      setSmallTargetOffsetSkidding = _React$useState4[1];
+
+  var platform = usePlatform();
+  var setExternalRef = useExternRef(getRef, setPopperNode);
+  var modifiers = React.useMemo(function () {
+    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",
+        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,
+    modifiers: modifiers
+  }),
+      styles = _usePopper.styles,
+      state = _usePopper.state,
+      attributes = _usePopper.attributes;
+
+  var resolvedPlacement = state === null || state === void 0 ? void 0 : state.placement;
+  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;
+
+      if (targetSize < arrowSize + 2 * ARROW_PADDING) {
+        setSmallTargetOffsetSkidding(ARROW_PADDING + arrowSize / 2);
+      }
+    } else {
+      setSmallTargetOffsetSkidding(0);
+    }
+  }, [arrow, isEdgePlacement]);
+  React.useEffect(function () {
+    if (resolvedPlacement) {
+      onPlacementChange && onPlacementChange({
+        placement: resolvedPlacement
+      });
+    }
+  }, [resolvedPlacement]);
+  var dropdown = createScopedElement("div", _extends({}, restProps, attributes.popper, {
+    vkuiClass: getClassName("Popper", platform),
+    ref: setExternalRef,
+    style: _objectSpread(_objectSpread({}, compStyles), styles.popper)
+  }), arrow && createScopedElement("div", _extends({}, attributes.arrow, {
+    vkuiClass: "Popper__arrow",
+    "data-popper-arrow": true,
+    style: styles.arrow
+  }), createScopedElement("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"
+  }, createScopedElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M10 0C13 0 15.9999 8 20 8H0C3.9749 8 7 0 10 0Z",
+    fill: "currentColor"
+  }))), createScopedElement("div", {
+    vkuiClass: "Popper__content"
+  }, children));
+  return createScopedElement(AppRootPortal, {
+    forcePortal: forcePortal,
+    vkuiClass: "PopperPortal"
+  }, dropdown);
+};
+//# sourceMappingURL=Popper.js.map