@vkontakte/vkui 4.37.0 → 5.0.0

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

@@ -6,15 +6,15 @@ import { createScopedElement } from "../../lib/jsxRuntime";
 import * as React from "react";
 import { FixedLayout } from "../FixedLayout/FixedLayout";
 import { classNames } from "../../lib/classNames";
-import { ViewWidth } from "../AdaptivityProvider/AdaptivityContext";
 import { useAdaptivity } from "../../hooks/useAdaptivity";
 import { useDOM } from "../../lib/dom";
-import { IOS } from "../../lib/platform";
+import { Platform } from "../../lib/platform";
 import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect";
 import { useGlobalEventListener } from "../../hooks/useGlobalEventListener";
 import { useTimeout } from "../../hooks/useTimeout";
 import { usePlatform } from "../../hooks/usePlatform";
 import { useScrollLock } from "../AppRoot/ScrollContext";
+import { getSizeXClassName } from "../../helpers/getSizeXClassName";
 import "./PanelHeaderContext.css";
 
 /**
@@ -40,16 +40,15 @@ export var PanelHeaderContext = function PanelHeaderContext(_ref) {
   var closing = visible && !opened;
 
   var _useAdaptivity = useAdaptivity(),
-      viewWidth = _useAdaptivity.viewWidth;
+      sizeX = _useAdaptivity.sizeX;
 
-  var isDesktop = viewWidth >= ViewWidth.SMALL_TABLET;
   var elementRef = React.useRef(null);
   useIsomorphicLayoutEffect(function () {
     opened && setVisible(true);
   }, [opened]);
-  useScrollLock(!isDesktop && opened); // start closing on outer click
+  useScrollLock(platform !== Platform.VKCOM && opened); // start closing on outer click
 
-  useGlobalEventListener(document, "click", isDesktop && opened && !closing && function (event) {
+  useGlobalEventListener(document, "click", opened && !closing && function (event) {
     if (elementRef.current && !elementRef.current.contains(event.target)) {
       onClose();
     }
@@ -64,8 +63,7 @@ export var PanelHeaderContext = function PanelHeaderContext(_ref) {
     return closing ? animationFallback.set() : animationFallback.clear();
   }, [animationFallback, closing]);
   return createScopedElement(FixedLayout, _extends({}, restProps, {
-    vkuiClass: classNames("PanelHeaderContext", platform === IOS && "PanelHeaderContext--ios", opened && "PanelHeaderContext--opened", closing && "PanelHeaderContext--closing", isDesktop && "PanelHeaderContext--desktop", // TODO v5.0.0 поправить под новую адаптивность
-    (platform !== IOS || platform === IOS && isDesktop) && "PanelHeaderContext--rounded"),
+    vkuiClass: classNames("PanelHeaderContext", platform === Platform.IOS && "PanelHeaderContext--ios", opened && "PanelHeaderContext--opened", closing && "PanelHeaderContext--closing", getSizeXClassName("PanelHeaderContext", sizeX), "PanelHeaderContext--rounded"),
     vertical: "top"
   }), createScopedElement("div", {
     vkuiClass: "PanelHeaderContext__in",
@@ -73,8 +71,11 @@ export var PanelHeaderContext = function PanelHeaderContext(_ref) {
     onAnimationEnd: closing ? onAnimationEnd : undefined
   }, createScopedElement("div", {
     vkuiClass: "PanelHeaderContext__content"
-  }, visible && children)), !isDesktop && visible && createScopedElement("div", {
-    onClick: onClose,
+  }, visible && children)), visible && createScopedElement("div", {
+    onClick: function onClick(event) {
+      event.stopPropagation();
+      onClose();
+    },
     vkuiClass: "PanelHeaderContext__fade"
   }));
 };

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderContext.js","names":["React","FixedLayout","classNames","ViewWidth","useAdaptivity","useDOM","IOS","useIsomorphicLayoutEffect","useGlobalEventListener","useTimeout","usePlatform","useScrollLock","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","undefined"],"sources":["../../../../src/components/PanelHeaderContext/PanelHeaderContext.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { FixedLayout } from \"../FixedLayout/FixedLayout\";\nimport { classNames } from \"../../lib/classNames\";\nimport { ViewWidth } from \"../AdaptivityProvider/AdaptivityContext\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { useDOM } from \"../../lib/dom\";\nimport { IOS } from \"../../lib/platform\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useScrollLock } from \"../AppRoot/ScrollContext\";\nimport \"./PanelHeaderContext.css\";\n\nexport interface PanelHeaderContextProps\n  extends React.HTMLAttributes<HTMLDivElement> {\n  opened: boolean;\n  onClose: VoidFunction;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderContext\n */\nexport const PanelHeaderContext = ({\n  children,\n  onClose,\n  opened = false,\n  ...restProps\n}: PanelHeaderContextProps) => {\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>(null);\n\n  useIsomorphicLayoutEffect(() => {\n    opened && setVisible(true);\n  }, [opened]);\n\n  useScrollLock(!isDesktop && 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    [animationFallback, closing]\n  );\n\n  return (\n    <FixedLayout\n      {...restProps}\n      vkuiClass={classNames(\n        \"PanelHeaderContext\",\n        platform === IOS && \"PanelHeaderContext--ios\",\n        opened && \"PanelHeaderContext--opened\",\n        closing && \"PanelHeaderContext--closing\",\n        isDesktop && \"PanelHeaderContext--desktop\",\n        // TODO v5.0.0 поправить под новую адаптивность\n        (platform !== IOS || (platform === IOS && isDesktop)) &&\n          \"PanelHeaderContext--rounded\"\n      )}\n      vertical=\"top\"\n    >\n      <div\n        vkuiClass=\"PanelHeaderContext__in\"\n        ref={elementRef}\n        onAnimationEnd={closing ? onAnimationEnd : undefined}\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"],"mappings":"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"}
+{"version":3,"file":"PanelHeaderContext.js","names":["React","FixedLayout","classNames","useAdaptivity","useDOM","Platform","useIsomorphicLayoutEffect","useGlobalEventListener","useTimeout","usePlatform","useScrollLock","getSizeXClassName","PanelHeaderContext","children","onClose","opened","restProps","document","platform","useState","visible","setVisible","closing","sizeX","elementRef","useRef","VKCOM","event","current","contains","target","onAnimationEnd","animationFallback","useEffect","set","clear","IOS","undefined","stopPropagation"],"sources":["../../../../src/components/PanelHeaderContext/PanelHeaderContext.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { FixedLayout } from \"../FixedLayout/FixedLayout\";\nimport { classNames } from \"../../lib/classNames\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { useDOM } from \"../../lib/dom\";\nimport { Platform } from \"../../lib/platform\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useScrollLock } from \"../AppRoot/ScrollContext\";\nimport { getSizeXClassName } from \"../../helpers/getSizeXClassName\";\nimport \"./PanelHeaderContext.css\";\n\nexport interface PanelHeaderContextProps\n  extends React.HTMLAttributes<HTMLDivElement> {\n  opened: boolean;\n  onClose: VoidFunction;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderContext\n */\nexport const PanelHeaderContext = ({\n  children,\n  onClose,\n  opened = false,\n  ...restProps\n}: PanelHeaderContextProps) => {\n  const { document } = useDOM();\n  const platform = usePlatform();\n  const [visible, setVisible] = React.useState(opened);\n  const closing = visible && !opened;\n  const { sizeX } = useAdaptivity();\n  const elementRef = React.useRef<HTMLDivElement>(null);\n\n  useIsomorphicLayoutEffect(() => {\n    opened && setVisible(true);\n  }, [opened]);\n\n  useScrollLock(platform !== Platform.VKCOM && opened);\n\n  // start closing on outer click\n  useGlobalEventListener(\n    document,\n    \"click\",\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    [animationFallback, closing]\n  );\n\n  return (\n    <FixedLayout\n      {...restProps}\n      vkuiClass={classNames(\n        \"PanelHeaderContext\",\n        platform === Platform.IOS && \"PanelHeaderContext--ios\",\n        opened && \"PanelHeaderContext--opened\",\n        closing && \"PanelHeaderContext--closing\",\n        getSizeXClassName(\"PanelHeaderContext\", sizeX),\n        \"PanelHeaderContext--rounded\"\n      )}\n      vertical=\"top\"\n    >\n      <div\n        vkuiClass=\"PanelHeaderContext__in\"\n        ref={elementRef}\n        onAnimationEnd={closing ? onAnimationEnd : undefined}\n      >\n        <div vkuiClass=\"PanelHeaderContext__content\">{visible && children}</div>\n      </div>\n      {visible && (\n        <div\n          onClick={(event) => {\n            event.stopPropagation();\n            onClose();\n          }}\n          vkuiClass=\"PanelHeaderContext__fade\"\n        />\n      )}\n    </FixedLayout>\n  );\n};\n"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,WAAT;AACA,SAASC,UAAT;AACA,SAASC,aAAT;AACA,SAASC,MAAT;AACA,SAASC,QAAT;AACA,SAASC,yBAAT;AACA,SAASC,sBAAT;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AACA,SAASC,aAAT;AACA,SAASC,iBAAT;AACA;;AAQA;AACA;AACA;AACA,OAAO,IAAMC,kBAAkB,GAAG,SAArBA,kBAAqB,OAKH;EAAA,IAJ7BC,QAI6B,QAJ7BA,QAI6B;EAAA,IAH7BC,OAG6B,QAH7BA,OAG6B;EAAA,uBAF7BC,MAE6B;EAAA,IAF7BA,MAE6B,4BAFpB,KAEoB;EAAA,IAD1BC,SAC0B;;EAC7B,cAAqBZ,MAAM,EAA3B;EAAA,IAAQa,QAAR,WAAQA,QAAR;;EACA,IAAMC,QAAQ,GAAGT,WAAW,EAA5B;;EACA,sBAA8BT,KAAK,CAACmB,QAAN,CAAeJ,MAAf,CAA9B;EAAA;EAAA,IAAOK,OAAP;EAAA,IAAgBC,UAAhB;;EACA,IAAMC,OAAO,GAAGF,OAAO,IAAI,CAACL,MAA5B;;EACA,qBAAkBZ,aAAa,EAA/B;EAAA,IAAQoB,KAAR,kBAAQA,KAAR;;EACA,IAAMC,UAAU,GAAGxB,KAAK,CAACyB,MAAN,CAA6B,IAA7B,CAAnB;EAEAnB,yBAAyB,CAAC,YAAM;IAC9BS,MAAM,IAAIM,UAAU,CAAC,IAAD,CAApB;EACD,CAFwB,EAEtB,CAACN,MAAD,CAFsB,CAAzB;EAIAL,aAAa,CAACQ,QAAQ,KAAKb,QAAQ,CAACqB,KAAtB,IAA+BX,MAAhC,CAAb,CAZ6B,CAc7B;;EACAR,sBAAsB,CACpBU,QADoB,EAEpB,OAFoB,EAGpBF,MAAM,IACJ,CAACO,OADH,IAEG,UAACK,KAAD,EAAW;IACV,IACEH,UAAU,CAACI,OAAX,IACA,CAACJ,UAAU,CAACI,OAAX,CAAmBC,QAAnB,CAA4BF,KAAK,CAACG,MAAlC,CAFH,EAGE;MACAhB,OAAO;IACR;EACF,CAZiB,CAAtB,CAf6B,CA8B7B;;EACA,IAAMiB,cAAc,GAAG,SAAjBA,cAAiB;IAAA,OAAMV,UAAU,CAAC,KAAD,CAAhB;EAAA,CAAvB;;EACA,IAAMW,iBAAiB,GAAGxB,UAAU,CAACuB,cAAD,EAAiB,GAAjB,CAApC;EACA/B,KAAK,CAACiC,SAAN,CACE;IAAA,OAAOX,OAAO,GAAGU,iBAAiB,CAACE,GAAlB,EAAH,GAA6BF,iBAAiB,CAACG,KAAlB,EAA3C;EAAA,CADF,EAEE,CAACH,iBAAD,EAAoBV,OAApB,CAFF;EAKA,OACE,oBAAC,WAAD,eACMN,SADN;IAEE,SAAS,EAAEd,UAAU,CACnB,oBADmB,EAEnBgB,QAAQ,KAAKb,QAAQ,CAAC+B,GAAtB,IAA6B,yBAFV,EAGnBrB,MAAM,IAAI,4BAHS,EAInBO,OAAO,IAAI,6BAJQ,EAKnBX,iBAAiB,CAAC,oBAAD,EAAuBY,KAAvB,CALE,EAMnB,6BANmB,CAFvB;IAUE,QAAQ,EAAC;EAVX,IAYE;IACE,SAAS,EAAC,wBADZ;IAEE,GAAG,EAAEC,UAFP;IAGE,cAAc,EAAEF,OAAO,GAAGS,cAAH,GAAoBM;EAH7C,GAKE;IAAK,SAAS,EAAC;EAAf,GAA8CjB,OAAO,IAAIP,QAAzD,CALF,CAZF,EAmBGO,OAAO,IACN;IACE,OAAO,EAAE,iBAACO,KAAD,EAAW;MAClBA,KAAK,CAACW,eAAN;MACAxB,OAAO;IACR,CAJH;IAKE,SAAS,EAAC;EALZ,EApBJ,CADF;AA+BD,CA1EM"}

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

@@ -3,7 +3,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["isActive", "editLabel", "doneLabel"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import { PanelHeaderButton } from "../PanelHeaderButton/PanelHeaderButton";
-import { IOS } from "../../lib/platform";
+import { Platform } from "../../lib/platform";
 import { Icon28EditOutline, Icon28DoneOutline } from "@vkontakte/icons";
 import { usePlatform } from "../../hooks/usePlatform";
 
@@ -24,6 +24,6 @@ export var PanelHeaderEdit = function PanelHeaderEdit(_ref) {
   var platform = usePlatform();
   return createScopedElement(PanelHeaderButton, _extends({
     "aria-label": iOSText
-  }, restProps), platform === IOS ? iOSText : createScopedElement(AndroidIcon, null));
+  }, restProps), platform === Platform.IOS ? iOSText : createScopedElement(AndroidIcon, null));
 };
 //# sourceMappingURL=PanelHeaderEdit.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderEdit.js","names":["PanelHeaderButton","IOS","Icon28EditOutline","Icon28DoneOutline","usePlatform","PanelHeaderEdit","isActive","editLabel","doneLabel","restProps","iOSText","AndroidIcon","platform"],"sources":["../../../../src/components/PanelHeaderEdit/PanelHeaderEdit.tsx"],"sourcesContent":["import {\n  PanelHeaderButton,\n  PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { IOS } 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\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderEdit\n */\nexport const PanelHeaderEdit = ({\n  isActive = false,\n  editLabel = \"Редактировать\",\n  doneLabel = \"Готово\",\n  ...restProps\n}: PanelHeaderEditProps) => {\n  const iOSText = isActive ? doneLabel : editLabel;\n  const AndroidIcon = isActive ? Icon28DoneOutline : Icon28EditOutline;\n  const platform = usePlatform();\n\n  return (\n    <PanelHeaderButton aria-label={iOSText} {...restProps}>\n      {platform === IOS ? iOSText : <AndroidIcon />}\n    </PanelHeaderButton>\n  );\n};\n"],"mappings":";;;;AAAA,SACEA,iBADF;AAIA,SAASC,GAAT;AACA,SAASC,iBAAT,EAA4BC,iBAA5B,QAAqD,kBAArD;AACA,SAASC,WAAT;;AAiBA;AACA;AACA;AACA,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAkB,OAKH;EAAA,yBAJ1BC,QAI0B;EAAA,IAJ1BA,QAI0B,8BAJf,KAIe;EAAA,0BAH1BC,SAG0B;EAAA,IAH1BA,SAG0B,+BAHd,eAGc;EAAA,0BAF1BC,SAE0B;EAAA,IAF1BA,SAE0B,+BAFd,QAEc;EAAA,IADvBC,SACuB;;EAC1B,IAAMC,OAAO,GAAGJ,QAAQ,GAAGE,SAAH,GAAeD,SAAvC;EACA,IAAMI,WAAW,GAAGL,QAAQ,GAAGH,iBAAH,GAAuBD,iBAAnD;EACA,IAAMU,QAAQ,GAAGR,WAAW,EAA5B;EAEA,OACE,oBAAC,iBAAD;IAAmB,cAAYM;EAA/B,GAA4CD,SAA5C,GACGG,QAAQ,KAAKX,GAAb,GAAmBS,OAAnB,GAA6B,oBAAC,WAAD,OADhC,CADF;AAKD,CAfM"}
+{"version":3,"file":"PanelHeaderEdit.js","names":["PanelHeaderButton","Platform","Icon28EditOutline","Icon28DoneOutline","usePlatform","PanelHeaderEdit","isActive","editLabel","doneLabel","restProps","iOSText","AndroidIcon","platform","IOS"],"sources":["../../../../src/components/PanelHeaderEdit/PanelHeaderEdit.tsx"],"sourcesContent":["import {\n  PanelHeaderButton,\n  PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { Platform } 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\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderEdit\n */\nexport const PanelHeaderEdit = ({\n  isActive = false,\n  editLabel = \"Редактировать\",\n  doneLabel = \"Готово\",\n  ...restProps\n}: PanelHeaderEditProps) => {\n  const iOSText = isActive ? doneLabel : editLabel;\n  const AndroidIcon = isActive ? Icon28DoneOutline : Icon28EditOutline;\n  const platform = usePlatform();\n\n  return (\n    <PanelHeaderButton aria-label={iOSText} {...restProps}>\n      {platform === Platform.IOS ? iOSText : <AndroidIcon />}\n    </PanelHeaderButton>\n  );\n};\n"],"mappings":";;;;AAAA,SACEA,iBADF;AAIA,SAASC,QAAT;AACA,SAASC,iBAAT,EAA4BC,iBAA5B,QAAqD,kBAArD;AACA,SAASC,WAAT;;AAiBA;AACA;AACA;AACA,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAkB,OAKH;EAAA,yBAJ1BC,QAI0B;EAAA,IAJ1BA,QAI0B,8BAJf,KAIe;EAAA,0BAH1BC,SAG0B;EAAA,IAH1BA,SAG0B,+BAHd,eAGc;EAAA,0BAF1BC,SAE0B;EAAA,IAF1BA,SAE0B,+BAFd,QAEc;EAAA,IADvBC,SACuB;;EAC1B,IAAMC,OAAO,GAAGJ,QAAQ,GAAGE,SAAH,GAAeD,SAAvC;EACA,IAAMI,WAAW,GAAGL,QAAQ,GAAGH,iBAAH,GAAuBD,iBAAnD;EACA,IAAMU,QAAQ,GAAGR,WAAW,EAA5B;EAEA,OACE,oBAAC,iBAAD;IAAmB,cAAYM;EAA/B,GAA4CD,SAA5C,GACGG,QAAQ,KAAKX,QAAQ,CAACY,GAAtB,GAA4BH,OAA5B,GAAsC,oBAAC,WAAD,OADzC,CADF;AAKD,CAfM"}

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

@@ -4,7 +4,7 @@ var _excluded = ["children"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import { PanelHeaderButton } from "../PanelHeaderButton/PanelHeaderButton";
 import { Icon28DoneOutline } from "@vkontakte/icons";
-import { IOS } from "../../lib/platform";
+import { Platform } from "../../lib/platform";
 import { usePlatform } from "../../hooks/usePlatform";
 import { getTitleFromChildren } from "../../lib/utils";
 /**
@@ -20,6 +20,6 @@ export var PanelHeaderSubmit = function PanelHeaderSubmit(_ref) {
   return createScopedElement(PanelHeaderButton, _extends({
     "aria-label": getTitleFromChildren(children),
     primary: true
-  }, restProps), platform === IOS ? children : createScopedElement(Icon28DoneOutline, null));
+  }, restProps), platform === Platform.IOS ? children : createScopedElement(Icon28DoneOutline, null));
 };
 //# sourceMappingURL=PanelHeaderSubmit.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PanelHeaderSubmit.js","names":["PanelHeaderButton","Icon28DoneOutline","IOS","usePlatform","getTitleFromChildren","PanelHeaderSubmit","children","restProps","platform"],"sources":["../../../../src/components/PanelHeaderSubmit/PanelHeaderSubmit.tsx"],"sourcesContent":["import {\n  PanelHeaderButton,\n  PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { Icon28DoneOutline } from \"@vkontakte/icons\";\nimport { IOS } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getTitleFromChildren } from \"../../lib/utils\";\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderSubmit\n */\nexport const PanelHeaderSubmit = ({\n  children = \"Готово\",\n  ...restProps\n}: PanelHeaderButtonProps) => {\n  const platform = usePlatform();\n\n  return (\n    <PanelHeaderButton\n      aria-label={getTitleFromChildren(children)}\n      primary\n      {...restProps}\n    >\n      {platform === IOS ? children : <Icon28DoneOutline />}\n    </PanelHeaderButton>\n  );\n};\n"],"mappings":";;;;AAAA,SACEA,iBADF;AAIA,SAASC,iBAAT,QAAkC,kBAAlC;AACA,SAASC,GAAT;AACA,SAASC,WAAT;AACA,SAASC,oBAAT;AAEA;AACA;AACA;;AACA,OAAO,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,OAGH;EAAA,yBAF5BC,QAE4B;EAAA,IAF5BA,QAE4B,8BAFjB,QAEiB;EAAA,IADzBC,SACyB;;EAC5B,IAAMC,QAAQ,GAAGL,WAAW,EAA5B;EAEA,OACE,oBAAC,iBAAD;IACE,cAAYC,oBAAoB,CAACE,QAAD,CADlC;IAEE,OAAO;EAFT,GAGMC,SAHN,GAKGC,QAAQ,KAAKN,GAAb,GAAmBI,QAAnB,GAA8B,oBAAC,iBAAD,OALjC,CADF;AASD,CAfM"}
+{"version":3,"file":"PanelHeaderSubmit.js","names":["PanelHeaderButton","Icon28DoneOutline","Platform","usePlatform","getTitleFromChildren","PanelHeaderSubmit","children","restProps","platform","IOS"],"sources":["../../../../src/components/PanelHeaderSubmit/PanelHeaderSubmit.tsx"],"sourcesContent":["import {\n  PanelHeaderButton,\n  PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { Icon28DoneOutline } from \"@vkontakte/icons\";\nimport { Platform } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getTitleFromChildren } from \"../../lib/utils\";\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderSubmit\n */\nexport const PanelHeaderSubmit = ({\n  children = \"Готово\",\n  ...restProps\n}: PanelHeaderButtonProps) => {\n  const platform = usePlatform();\n\n  return (\n    <PanelHeaderButton\n      aria-label={getTitleFromChildren(children)}\n      primary\n      {...restProps}\n    >\n      {platform === Platform.IOS ? children : <Icon28DoneOutline />}\n    </PanelHeaderButton>\n  );\n};\n"],"mappings":";;;;AAAA,SACEA,iBADF;AAIA,SAASC,iBAAT,QAAkC,kBAAlC;AACA,SAASC,QAAT;AACA,SAASC,WAAT;AACA,SAASC,oBAAT;AAEA;AACA;AACA;;AACA,OAAO,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,OAGH;EAAA,yBAF5BC,QAE4B;EAAA,IAF5BA,QAE4B,8BAFjB,QAEiB;EAAA,IADzBC,SACyB;;EAC5B,IAAMC,QAAQ,GAAGL,WAAW,EAA5B;EAEA,OACE,oBAAC,iBAAD;IACE,cAAYC,oBAAoB,CAACE,QAAD,CADlC;IAEE,OAAO;EAFT,GAGMC,SAHN,GAKGC,QAAQ,KAAKN,QAAQ,CAACO,GAAtB,GAA4BH,QAA5B,GAAuC,oBAAC,iBAAD,OAL1C,CADF;AASD,CAfM"}

package/dist/cssm/components/Placeholder/Placeholder.css

@@ -1,3 +1 @@
-.vkuiPlaceholder{align-items:center;display:flex;justify-content:center}.vkuiPlaceholder--stretched{bottom:0;left:0;padding-bottom:inherit;padding-top:inherit;position:absolute;right:0;top:0;z-index:1}.vkuiPlaceholder__in{box-sizing:border-box;max-width:100%;padding:48px 32px;text-align:center}.vkuiPlaceholder__icon{color:#aeb7c2;color:var(
-    --placeholder_icon_foreground_secondary,var(--vkui--color_icon_secondary)
-  );display:inline-block;margin-bottom:12px;vertical-align:top}.vkuiPlaceholder__header{color:#000;color:var(--text_primary,var(--vkui--color_text_primary))}.vkuiPlaceholder__text{color:#818c99;color:var(--text_placeholder,var(--vkui--color_text_secondary))}.vkuiPlaceholder__header+.vkuiPlaceholder__text{margin-top:8px}.vkuiPlaceholder__action:not(:first-child){margin-top:16px}
+.vkuiPlaceholder{align-items:center;display:flex;justify-content:center}.vkuiPlaceholder--stretched{bottom:0;left:0;padding-bottom:inherit;padding-top:inherit;position:absolute;right:0;top:0;z-index:1}.vkuiPlaceholder__in{box-sizing:border-box;max-width:100%;padding:48px 32px;text-align:center}.vkuiPlaceholder__icon{color:var(--vkui--color_icon_secondary);display:inline-block;margin-bottom:12px;vertical-align:top}.vkuiPlaceholder__header{color:var(--vkui--color_text_primary)}.vkuiPlaceholder__text{color:var(--vkui--color_text_secondary)}.vkuiPlaceholder__header+.vkuiPlaceholder__text{margin-top:8px}.vkuiPlaceholder__action:not(:first-child){margin-top:16px}

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

@@ -1,13 +1,8 @@
 import * as React from "react";
 import { HasRootRef } from "../../types";
-import { AdaptivityContextInterface, AdaptivityProps } from "../AdaptivityProvider/AdaptivityContext";
 import "./PopoutRoot.css";
-export interface PopoutRootProps extends React.HTMLAttributes<HTMLDivElement>, AdaptivityProps, HasRootRef<HTMLDivElement> {
+export interface PopoutRootProps extends React.HTMLAttributes<HTMLDivElement>, HasRootRef<HTMLDivElement> {
     popout?: React.ReactNode;
     modal?: React.ReactNode;
 }
-export declare const PopoutRootComponent: {
-    ({ popout, modal, viewWidth, viewHeight, hasMouse, children, getRootRef, ...restProps }: PopoutRootProps & AdaptivityContextInterface): JSX.Element;
-    displayName: string;
-};
-export declare const PopoutRoot: React.FC<Pick<PopoutRootProps & AdaptivityContextInterface, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "translate" | "prefix" | "children" | "className" | "id" | "lang" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "popout" | "modal" | "getRootRef"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
+export declare const PopoutRoot: ({ popout, modal, children, getRootRef, ...restProps }: PopoutRootProps) => JSX.Element;

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

@@ -1,19 +1,15 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["popout", "modal", "viewWidth", "viewHeight", "hasMouse", "children", "getRootRef"];
+var _excluded = ["popout", "modal", "children", "getRootRef"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import * as React from "react";
-import { withAdaptivity } from "../../hoc/withAdaptivity";
 import { AppRootPortal } from "../AppRoot/AppRootPortal";
 import { blurActiveElement, useDOM } from "../../lib/dom";
-import { useAdaptivityIsDesktop } from "../../hooks/useAdaptivity";
+import { useAdaptivityWithMediaQueries } from "../../hooks/useAdaptivityWithMediaQueries";
 import "./PopoutRoot.css";
-export var PopoutRootComponent = function PopoutRootComponent(_ref) {
+export var PopoutRoot = function PopoutRoot(_ref) {
   var popout = _ref.popout,
       modal = _ref.modal,
-      viewWidth = _ref.viewWidth,
-      viewHeight = _ref.viewHeight,
-      hasMouse = _ref.hasMouse,
       children = _ref.children,
       getRootRef = _ref.getRootRef,
       restProps = _objectWithoutProperties(_ref, _excluded);
@@ -21,7 +17,9 @@ export var PopoutRootComponent = function PopoutRootComponent(_ref) {
   var _useDOM = useDOM(),
       document = _useDOM.document;
 
-  var isDesktop = useAdaptivityIsDesktop();
+  var _useAdaptivityWithMed = useAdaptivityWithMediaQueries(),
+      isDesktop = _useAdaptivityWithMed.isDesktop;
+
   React.useEffect(function () {
     popout && blurActiveElement(document);
   }, [document, popout]);
@@ -34,10 +32,4 @@ export var PopoutRootComponent = function PopoutRootComponent(_ref) {
     vkuiClass: "PopoutRoot__modal"
   }, modal)));
 };
-PopoutRootComponent.displayName = "PopoutRoot";
-export var PopoutRoot = withAdaptivity(PopoutRootComponent, {
-  viewWidth: true,
-  viewHeight: true,
-  hasMouse: true
-});
 //# sourceMappingURL=PopoutRoot.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PopoutRoot.js","names":["React","withAdaptivity","AppRootPortal","blurActiveElement","useDOM","useAdaptivityIsDesktop","PopoutRootComponent","popout","modal","viewWidth","viewHeight","hasMouse","children","getRootRef","restProps","document","isDesktop","useEffect","displayName","PopoutRoot"],"sources":["../../../../src/components/PopoutRoot/PopoutRoot.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { HasRootRef } from \"../../types\";\nimport { withAdaptivity } from \"../../hoc/withAdaptivity\";\nimport { AppRootPortal } from \"../AppRoot/AppRootPortal\";\nimport { blurActiveElement, useDOM } from \"../../lib/dom\";\nimport {\n  AdaptivityContextInterface,\n  AdaptivityProps,\n} from \"../AdaptivityProvider/AdaptivityContext\";\nimport { useAdaptivityIsDesktop } from \"../../hooks/useAdaptivity\";\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 = ({\n  popout,\n  modal,\n  viewWidth,\n  viewHeight,\n  hasMouse,\n  children,\n  getRootRef,\n  ...restProps\n}: PopoutRootProps & AdaptivityContextInterface) => {\n  const { document } = useDOM();\n\n  const isDesktop = useAdaptivityIsDesktop();\n\n  React.useEffect(() => {\n    popout && blurActiveElement(document);\n  }, [document, 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"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,SAASC,cAAT;AACA,SAASC,aAAT;AACA,SAASC,iBAAT,EAA4BC,MAA5B;AAKA,SAASC,sBAAT;AACA;AAUA,OAAO,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAsB,OASiB;EAAA,IARlDC,MAQkD,QARlDA,MAQkD;EAAA,IAPlDC,KAOkD,QAPlDA,KAOkD;EAAA,IANlDC,SAMkD,QANlDA,SAMkD;EAAA,IALlDC,UAKkD,QALlDA,UAKkD;EAAA,IAJlDC,QAIkD,QAJlDA,QAIkD;EAAA,IAHlDC,QAGkD,QAHlDA,QAGkD;EAAA,IAFlDC,UAEkD,QAFlDA,UAEkD;EAAA,IAD/CC,SAC+C;;EAClD,cAAqBV,MAAM,EAA3B;EAAA,IAAQW,QAAR,WAAQA,QAAR;;EAEA,IAAMC,SAAS,GAAGX,sBAAsB,EAAxC;EAEAL,KAAK,CAACiB,SAAN,CAAgB,YAAM;IACpBV,MAAM,IAAIJ,iBAAiB,CAACY,QAAD,CAA3B;EACD,CAFD,EAEG,CAACA,QAAD,EAAWR,MAAX,CAFH;EAIA,OACE,wCAASO,SAAT;IAAoB,SAAS,EAAC,YAA9B;IAA2C,GAAG,EAAED;EAAhD,IACGD,QADH,EAEE,oBAAC,aAAD,QACG,CAAC,CAACL,MAAF,IACC;IACE,SAAS,EACPS,SAAS,GAAG,sBAAH,GAA4B;EAFzC,GAKGT,MALH,CAFJ,EAUG,CAAC,CAACC,KAAF,IAAW;IAAK,SAAS,EAAC;EAAf,GAAoCA,KAApC,CAVd,CAFF,CADF;AAiBD,CAnCM;AAqCPF,mBAAmB,CAACY,WAApB,GAAkC,YAAlC;AAEA,OAAO,IAAMC,UAAU,GAAGlB,cAAc,CAACK,mBAAD,EAAsB;EAC5DG,SAAS,EAAE,IADiD;EAE5DC,UAAU,EAAE,IAFgD;EAG5DC,QAAQ,EAAE;AAHkD,CAAtB,CAAjC"}
+{"version":3,"file":"PopoutRoot.js","names":["React","AppRootPortal","blurActiveElement","useDOM","useAdaptivityWithMediaQueries","PopoutRoot","popout","modal","children","getRootRef","restProps","document","isDesktop","useEffect"],"sources":["../../../../src/components/PopoutRoot/PopoutRoot.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { HasRootRef } from \"../../types\";\nimport { AppRootPortal } from \"../AppRoot/AppRootPortal\";\nimport { blurActiveElement, useDOM } from \"../../lib/dom\";\nimport { useAdaptivityWithMediaQueries } from \"../../hooks/useAdaptivityWithMediaQueries\";\nimport \"./PopoutRoot.css\";\n\nexport interface PopoutRootProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  popout?: React.ReactNode;\n  modal?: React.ReactNode;\n}\n\nexport const PopoutRoot = ({\n  popout,\n  modal,\n  children,\n  getRootRef,\n  ...restProps\n}: PopoutRootProps) => {\n  const { document } = useDOM();\n\n  const { isDesktop } = useAdaptivityWithMediaQueries();\n\n  React.useEffect(() => {\n    popout && blurActiveElement(document);\n  }, [document, 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"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,SAASC,aAAT;AACA,SAASC,iBAAT,EAA4BC,MAA5B;AACA,SAASC,6BAAT;AACA;AASA,OAAO,IAAMC,UAAU,GAAG,SAAbA,UAAa,OAMH;EAAA,IALrBC,MAKqB,QALrBA,MAKqB;EAAA,IAJrBC,KAIqB,QAJrBA,KAIqB;EAAA,IAHrBC,QAGqB,QAHrBA,QAGqB;EAAA,IAFrBC,UAEqB,QAFrBA,UAEqB;EAAA,IADlBC,SACkB;;EACrB,cAAqBP,MAAM,EAA3B;EAAA,IAAQQ,QAAR,WAAQA,QAAR;;EAEA,4BAAsBP,6BAA6B,EAAnD;EAAA,IAAQQ,SAAR,yBAAQA,SAAR;;EAEAZ,KAAK,CAACa,SAAN,CAAgB,YAAM;IACpBP,MAAM,IAAIJ,iBAAiB,CAACS,QAAD,CAA3B;EACD,CAFD,EAEG,CAACA,QAAD,EAAWL,MAAX,CAFH;EAIA,OACE,wCAASI,SAAT;IAAoB,SAAS,EAAC,YAA9B;IAA2C,GAAG,EAAED;EAAhD,IACGD,QADH,EAEE,oBAAC,aAAD,QACG,CAAC,CAACF,MAAF,IACC;IACE,SAAS,EACPM,SAAS,GAAG,sBAAH,GAA4B;EAFzC,GAKGN,MALH,CAFJ,EAUG,CAAC,CAACC,KAAF,IAAW;IAAK,SAAS,EAAC;EAAf,GAAoCA,KAApC,CAVd,CAFF,CADF;AAiBD,CAhCM"}

package/dist/cssm/components/PopoutWrapper/PopoutWrapper.css

@@ -1 +1 @@
-.vkuiPopoutWrapper{box-sizing:border-box;height:100%;left:0;pointer-events:none;top:0;width:100%}.vkuiPopoutWrapper--opened{pointer-events:auto}.vkuiPopoutWrapper--closing{pointer-events:none}.vkuiPopoutWrapper--fixed{position:fixed}.vkuiPopoutWrapper__overlay{-webkit-animation:vkui-animation-full-fade-in .2s ease;animation:vkui-animation-full-fade-in .2s ease;-webkit-animation:vkui-animation-full-fade-in var(--vkui--animation_duration_m,.2s) ease;animation:vkui-animation-full-fade-in var(--vkui--animation_duration_m,.2s) ease;height:100%;left:0;opacity:1;position:fixed;top:0;width:100%}.vkuiPopoutWrapper--closing .vkuiPopoutWrapper__overlay{opacity:0;transition:opacity .2s cubic-bezier(.3,.3,.5,1);transition:opacity var(--vkui--animation_duration_m,.2s) var(--vkui--animation_easing_default,cubic-bezier(.3,.3,.5,1))}.vkuiPopoutWrapper--masked .vkuiPopoutWrapper__overlay{background:rgba(0,0,0,.4);background:var(--vkui--color_overlay_primary,rgba(0,0,0,.4))}.vkuiPopoutWrapper--fixed .vkuiPopoutWrapper__overlay{position:absolute}.vkuiPopoutWrapper__container{box-sizing:border-box;display:flex;height:100%;position:relative;width:100%}.vkuiPopoutWrapper__content{display:flex;justify-content:center;pointer-events:none;width:100%;z-index:2}.vkuiPopoutWrapper__content>*{pointer-events:auto}.vkuiPopoutWrapper--v-center .vkuiPopoutWrapper__container{align-items:center}.vkuiPopoutWrapper--v-bottom .vkuiPopoutWrapper__container{align-items:flex-end}.vkuiPopoutWrapper--v-top .vkuiPopoutWrapper__container{align-items:flex-start}.vkuiPopoutWrapper--h-center .vkuiPopoutWrapper__container{justify-content:center}.vkuiPopoutWrapper--h-left .vkuiPopoutWrapper__container{justify-content:flex-start}.vkuiPopoutWrapper--h-right .vkuiPopoutWrapper__container{justify-content:flex-end}@-webkit-keyframes vkui-animation-full-fade-in{0%{opacity:0}to{opacity:1}}@keyframes vkui-animation-full-fade-in{0%{opacity:0}to{opacity:1}}
+.vkuiPopoutWrapper{box-sizing:border-box;height:100%;left:0;pointer-events:none;top:0;width:100%}.vkuiPopoutWrapper--opened{pointer-events:auto}.vkuiPopoutWrapper--closing{pointer-events:none}.vkuiPopoutWrapper--fixed{position:fixed}.vkuiPopoutWrapper__overlay{animation:vkui-animation-full-fade-in var(--vkui--animation_duration_m) ease;height:100%;left:0;opacity:1;position:fixed;top:0;width:100%}.vkuiPopoutWrapper--closing .vkuiPopoutWrapper__overlay{opacity:0;transition:opacity var(--vkui--animation_duration_m) var(--vkui--animation_easing_default)}.vkuiPopoutWrapper--masked .vkuiPopoutWrapper__overlay{background:var(--vkui--color_overlay_primary)}.vkuiPopoutWrapper--fixed .vkuiPopoutWrapper__overlay{position:absolute}.vkuiPopoutWrapper__container{box-sizing:border-box;display:flex;height:100%;position:relative;width:100%}.vkuiPopoutWrapper__content{display:flex;justify-content:center;pointer-events:none;width:100%;z-index:2}.vkuiPopoutWrapper__content>*{pointer-events:auto}.vkuiPopoutWrapper--alignY-center .vkuiPopoutWrapper__container{align-items:center}.vkuiPopoutWrapper--alignY-bottom .vkuiPopoutWrapper__container{align-items:flex-end}.vkuiPopoutWrapper--alignY-top .vkuiPopoutWrapper__container{align-items:flex-start}.vkuiPopoutWrapper--alignX-center .vkuiPopoutWrapper__container{justify-content:center}.vkuiPopoutWrapper--alignX-left .vkuiPopoutWrapper__container{justify-content:flex-start}.vkuiPopoutWrapper--alignX-right .vkuiPopoutWrapper__container{justify-content:flex-end}@keyframes vkui-animation-full-fade-in{0%{opacity:0}to{opacity:1}}

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

@@ -5,7 +5,7 @@ var _excluded = ["alignY", "alignX", "closing", "hasMask", "fixed", "children",
 import { createScopedElement } from "../../lib/jsxRuntime";
 import * as React from "react";
 import { classNames } from "../../lib/classNames";
-import { IOS } from "../../lib/platform";
+import { Platform } from "../../lib/platform";
 import { useTimeout } from "../../hooks/useTimeout";
 import { usePlatform } from "../../hooks/usePlatform";
 import { useGlobalEventListener } from "../../hooks/useGlobalEventListener";
@@ -45,7 +45,7 @@ export var PopoutWrapper = function PopoutWrapper(_ref) {
     }
   };
 
-  var animationFinishFallback = useTimeout(onFadeInEnd, platform === IOS ? 300 : 200);
+  var animationFinishFallback = useTimeout(onFadeInEnd, platform === Platform.IOS ? 300 : 200);
   React.useEffect(function () {
     !opened && animationFinishFallback.set();
   }, [animationFinishFallback, opened]);
@@ -59,7 +59,7 @@ export var PopoutWrapper = function PopoutWrapper(_ref) {
     passive: false
   });
   return createScopedElement("div", _extends({}, restProps, {
-    vkuiClass: classNames("PopoutWrapper", "PopoutWrapper--v-".concat(alignY), "PopoutWrapper--h-".concat(alignX), closing && "PopoutWrapper--closing", opened && "PopoutWrapper--opened", fixed && "PopoutWrapper--fixed", hasMask && "PopoutWrapper--masked"),
+    vkuiClass: classNames("PopoutWrapper", "PopoutWrapper--alignY-".concat(alignY), "PopoutWrapper--alignX-".concat(alignX), closing && "PopoutWrapper--closing", opened && "PopoutWrapper--opened", fixed && "PopoutWrapper--fixed", hasMask && "PopoutWrapper--masked"),
     onAnimationEnd: opened ? undefined : onFadeInEnd,
     ref: elRef
   }), createScopedElement("div", {

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

@@ -1 +1 @@
-{"version":3,"file":"PopoutWrapper.js","names":["React","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","undefined"],"sources":["../../../../src/components/PopoutWrapper/PopoutWrapper.tsx"],"sourcesContent":["import * as React from \"react\";\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\n/**\n * @see https://vkcom.github.io/VKUI/#/PopoutWrapper\n */\nexport const PopoutWrapper = ({\n  alignY = \"center\",\n  alignX = \"center\",\n  closing = false,\n  hasMask = true,\n  fixed = true,\n  children,\n  onClick,\n  ...restProps\n}: PopoutWrapperProps) => {\n  const platform = usePlatform();\n  const [opened, setOpened] = React.useState(!hasMask);\n  const elRef = React.useRef<HTMLDivElement>(null);\n\n  const onFadeInEnd = (e?: React.AnimationEvent) => {\n    if (!e || e.animationName === \"vkui-animation-full-fade-in\") {\n      setOpened(true);\n    }\n  };\n  const animationFinishFallback = useTimeout(\n    onFadeInEnd,\n    platform === IOS ? 300 : 200\n  );\n  React.useEffect(() => {\n    !opened && animationFinishFallback.set();\n  }, [animationFinishFallback, opened]);\n\n  const { window } = useDOM();\n  useGlobalEventListener(window, \"touchmove\", (e) => e.preventDefault(), {\n    passive: false,\n  });\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass={classNames(\n        \"PopoutWrapper\",\n        `PopoutWrapper--v-${alignY}`,\n        `PopoutWrapper--h-${alignX}`,\n        closing && \"PopoutWrapper--closing\",\n        opened && \"PopoutWrapper--opened\",\n        fixed && \"PopoutWrapper--fixed\",\n        hasMask && \"PopoutWrapper--masked\"\n      )}\n      onAnimationEnd={opened ? undefined : 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"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,UAAT;AACA,SAASC,GAAT;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AACA,SAASC,sBAAT;AACA,SAASC,MAAT;AACA;;AAWA;AACA;AACA;AACA,OAAO,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,OASH;EAAA,uBARxBC,MAQwB;EAAA,IARxBA,MAQwB,4BARf,QAQe;EAAA,uBAPxBC,MAOwB;EAAA,IAPxBA,MAOwB,4BAPf,QAOe;EAAA,wBANxBC,OAMwB;EAAA,IANxBA,OAMwB,6BANd,KAMc;EAAA,wBALxBC,OAKwB;EAAA,IALxBA,OAKwB,6BALd,IAKc;EAAA,sBAJxBC,KAIwB;EAAA,IAJxBA,KAIwB,2BAJhB,IAIgB;EAAA,IAHxBC,QAGwB,QAHxBA,QAGwB;EAAA,IAFxBC,OAEwB,QAFxBA,OAEwB;EAAA,IADrBC,SACqB;;EACxB,IAAMC,QAAQ,GAAGZ,WAAW,EAA5B;;EACA,sBAA4BJ,KAAK,CAACiB,QAAN,CAAe,CAACN,OAAhB,CAA5B;EAAA;EAAA,IAAOO,MAAP;EAAA,IAAeC,SAAf;;EACA,IAAMC,KAAK,GAAGpB,KAAK,CAACqB,MAAN,CAA6B,IAA7B,CAAd;;EAEA,IAAMC,WAAW,GAAG,SAAdA,WAAc,CAACC,CAAD,EAA8B;IAChD,IAAI,CAACA,CAAD,IAAMA,CAAC,CAACC,aAAF,KAAoB,6BAA9B,EAA6D;MAC3DL,SAAS,CAAC,IAAD,CAAT;IACD;EACF,CAJD;;EAKA,IAAMM,uBAAuB,GAAGtB,UAAU,CACxCmB,WADwC,EAExCN,QAAQ,KAAKd,GAAb,GAAmB,GAAnB,GAAyB,GAFe,CAA1C;EAIAF,KAAK,CAAC0B,SAAN,CAAgB,YAAM;IACpB,CAACR,MAAD,IAAWO,uBAAuB,CAACE,GAAxB,EAAX;EACD,CAFD,EAEG,CAACF,uBAAD,EAA0BP,MAA1B,CAFH;;EAIA,cAAmBZ,MAAM,EAAzB;EAAA,IAAQsB,MAAR,WAAQA,MAAR;;EACAvB,sBAAsB,CAACuB,MAAD,EAAS,WAAT,EAAsB,UAACL,CAAD;IAAA,OAAOA,CAAC,CAACM,cAAF,EAAP;EAAA,CAAtB,EAAiD;IACrEC,OAAO,EAAE;EAD4D,CAAjD,CAAtB;EAIA,OACE,wCACMf,SADN;IAEE,SAAS,EAAEd,UAAU,CACnB,eADmB,6BAECO,MAFD,8BAGCC,MAHD,GAInBC,OAAO,IAAI,wBAJQ,EAKnBQ,MAAM,IAAI,uBALS,EAMnBN,KAAK,IAAI,sBANU,EAOnBD,OAAO,IAAI,uBAPQ,CAFvB;IAWE,cAAc,EAAEO,MAAM,GAAGa,SAAH,GAAeT,WAXvC;IAYE,GAAG,EAAEF;EAZP,IAcE;IAAK,SAAS,EAAC;EAAf,GACE;IAAK,SAAS,EAAC,wBAAf;IAAwC,OAAO,EAAEN;EAAjD,EADF,EAEE;IAAK,SAAS,EAAC;EAAf,GAAyCD,QAAzC,CAFF,CAdF,CADF;AAqBD,CArDM"}
+{"version":3,"file":"PopoutWrapper.js","names":["React","classNames","Platform","useTimeout","usePlatform","useGlobalEventListener","useDOM","PopoutWrapper","alignY","alignX","closing","hasMask","fixed","children","onClick","restProps","platform","useState","opened","setOpened","elRef","useRef","onFadeInEnd","e","animationName","animationFinishFallback","IOS","useEffect","set","window","preventDefault","passive","undefined"],"sources":["../../../../src/components/PopoutWrapper/PopoutWrapper.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { Platform } 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\n/**\n * @see https://vkcom.github.io/VKUI/#/PopoutWrapper\n */\nexport const PopoutWrapper = ({\n  alignY = \"center\",\n  alignX = \"center\",\n  closing = false,\n  hasMask = true,\n  fixed = true,\n  children,\n  onClick,\n  ...restProps\n}: PopoutWrapperProps) => {\n  const platform = usePlatform();\n  const [opened, setOpened] = React.useState(!hasMask);\n  const elRef = React.useRef<HTMLDivElement>(null);\n\n  const onFadeInEnd = (e?: React.AnimationEvent) => {\n    if (!e || e.animationName === \"vkui-animation-full-fade-in\") {\n      setOpened(true);\n    }\n  };\n  const animationFinishFallback = useTimeout(\n    onFadeInEnd,\n    platform === Platform.IOS ? 300 : 200\n  );\n  React.useEffect(() => {\n    !opened && animationFinishFallback.set();\n  }, [animationFinishFallback, opened]);\n\n  const { window } = useDOM();\n  useGlobalEventListener(window, \"touchmove\", (e) => e.preventDefault(), {\n    passive: false,\n  });\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass={classNames(\n        \"PopoutWrapper\",\n        `PopoutWrapper--alignY-${alignY}`,\n        `PopoutWrapper--alignX-${alignX}`,\n        closing && \"PopoutWrapper--closing\",\n        opened && \"PopoutWrapper--opened\",\n        fixed && \"PopoutWrapper--fixed\",\n        hasMask && \"PopoutWrapper--masked\"\n      )}\n      onAnimationEnd={opened ? undefined : 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"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,UAAT;AACA,SAASC,QAAT;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AACA,SAASC,sBAAT;AACA,SAASC,MAAT;AACA;;AAWA;AACA;AACA;AACA,OAAO,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,OASH;EAAA,uBARxBC,MAQwB;EAAA,IARxBA,MAQwB,4BARf,QAQe;EAAA,uBAPxBC,MAOwB;EAAA,IAPxBA,MAOwB,4BAPf,QAOe;EAAA,wBANxBC,OAMwB;EAAA,IANxBA,OAMwB,6BANd,KAMc;EAAA,wBALxBC,OAKwB;EAAA,IALxBA,OAKwB,6BALd,IAKc;EAAA,sBAJxBC,KAIwB;EAAA,IAJxBA,KAIwB,2BAJhB,IAIgB;EAAA,IAHxBC,QAGwB,QAHxBA,QAGwB;EAAA,IAFxBC,OAEwB,QAFxBA,OAEwB;EAAA,IADrBC,SACqB;;EACxB,IAAMC,QAAQ,GAAGZ,WAAW,EAA5B;;EACA,sBAA4BJ,KAAK,CAACiB,QAAN,CAAe,CAACN,OAAhB,CAA5B;EAAA;EAAA,IAAOO,MAAP;EAAA,IAAeC,SAAf;;EACA,IAAMC,KAAK,GAAGpB,KAAK,CAACqB,MAAN,CAA6B,IAA7B,CAAd;;EAEA,IAAMC,WAAW,GAAG,SAAdA,WAAc,CAACC,CAAD,EAA8B;IAChD,IAAI,CAACA,CAAD,IAAMA,CAAC,CAACC,aAAF,KAAoB,6BAA9B,EAA6D;MAC3DL,SAAS,CAAC,IAAD,CAAT;IACD;EACF,CAJD;;EAKA,IAAMM,uBAAuB,GAAGtB,UAAU,CACxCmB,WADwC,EAExCN,QAAQ,KAAKd,QAAQ,CAACwB,GAAtB,GAA4B,GAA5B,GAAkC,GAFM,CAA1C;EAIA1B,KAAK,CAAC2B,SAAN,CAAgB,YAAM;IACpB,CAACT,MAAD,IAAWO,uBAAuB,CAACG,GAAxB,EAAX;EACD,CAFD,EAEG,CAACH,uBAAD,EAA0BP,MAA1B,CAFH;;EAIA,cAAmBZ,MAAM,EAAzB;EAAA,IAAQuB,MAAR,WAAQA,MAAR;;EACAxB,sBAAsB,CAACwB,MAAD,EAAS,WAAT,EAAsB,UAACN,CAAD;IAAA,OAAOA,CAAC,CAACO,cAAF,EAAP;EAAA,CAAtB,EAAiD;IACrEC,OAAO,EAAE;EAD4D,CAAjD,CAAtB;EAIA,OACE,wCACMhB,SADN;IAEE,SAAS,EAAEd,UAAU,CACnB,eADmB,kCAEMO,MAFN,mCAGMC,MAHN,GAInBC,OAAO,IAAI,wBAJQ,EAKnBQ,MAAM,IAAI,uBALS,EAMnBN,KAAK,IAAI,sBANU,EAOnBD,OAAO,IAAI,uBAPQ,CAFvB;IAWE,cAAc,EAAEO,MAAM,GAAGc,SAAH,GAAeV,WAXvC;IAYE,GAAG,EAAEF;EAZP,IAcE;IAAK,SAAS,EAAC;EAAf,GACE;IAAK,SAAS,EAAC,wBAAf;IAAwC,OAAO,EAAEN;EAAjD,EADF,EAEE;IAAK,SAAS,EAAC;EAAf,GAAyCD,QAAzC,CAFF,CAdF,CADF;AAqBD,CArDM"}

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

@@ -0,0 +1,49 @@
+import * as React from "react";
+import { PopperCommonProps } from "../Popper/Popper";
+export interface PopoverProps extends Omit<PopperCommonProps, "arrow" | "arrowClassName"> {
+    /**
+     * Механика вызова всплывающего окна.
+     *
+     * - `"click"` – показывается/скрывается только при нажатии.
+     * - `"hover"` – помимо нажатия, будет показываться/скрывается при наведении/отведении мыши.
+     *
+     * > ⚠️`"hover"` на тач-устройствах будет работать как `"click"`, с одним лишь нюансом, что не будет закрываться
+     * > при повторном нажатии на целевой элемент. Для закрытия необходимо нажать на область вне целевого элемента
+     * > и выпадающего окна.
+     */
+    action?: "click" | "hover";
+    /**
+     * Если передан, то всплывающее окно будет показан/скрыт в зависимости от значения свойства.
+     */
+    shown?: boolean;
+    /**
+     * Количество миллисекунд, после которых произойдёт показ всплывающего окна.
+     *
+     * > Используется только для `action="hover"` при наведении/отведении мыши.
+     */
+    showDelay?: number;
+    /**
+     * Количество миллисекунд, после которых произойдёт скрытие всплывающего окна.
+     *
+     * > Используется только для `action="hover"` при наведении/отведении мыши.
+     */
+    hideDelay?: number;
+    /**
+     * Содержимое всплывающего окна.
+     */
+    content?: React.ReactNode;
+    /**
+     * Целевой элемент. Всплывающее окно появится возле него.
+     *
+     * > ⚠️ Если это пользовательский компонент, то он должен предоставлять параметры либо `getRootRef`, либо `ref` для получения ссылки на DOM-узел.
+     */
+    children?: React.ReactElement;
+    /**
+     * Вызывается при каждом изменении видимости всплывающего окна.
+     */
+    onShownChange?(shown: boolean): void;
+}
+/**
+ * @see https://vkcom.github.io/VKUI/#/Popover
+ */
+export declare const Popover: ({ action, shown: shownProp, showDelay, hideDelay, offsetDistance, content, children, style: styleProp, className, getRef, onShownChange, ...restProps }: PopoverProps) => JSX.Element;

package/dist/cssm/components/Popover/Popover.js

@@ -0,0 +1,154 @@
+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 = ["action", "shown", "showDelay", "hideDelay", "offsetDistance", "content", "children", "style", "className", "getRef", "onShownChange"];
+import { createScopedElement } from "../../lib/jsxRuntime";
+import * as React from "react";
+import { useDOM } from "../../lib/dom";
+import { classNamesString } from "../../lib/classNames";
+import { Popper } from "../Popper/Popper";
+import { FocusTrap } from "../FocusTrap/FocusTrap";
+import { useTimeout } from "../../hooks/useTimeout";
+import { useExternRef } from "../../hooks/useExternRef";
+import { useEventListener } from "../../hooks/useEventListener";
+import { useGlobalEventListener } from "../../hooks/useGlobalEventListener";
+import { usePatchChildrenRef } from "../../hooks/usePatchChildrenRef";
+
+require("./Popover.module.css");
+
+var styles = {
+  "Popover": "vkuiPopover",
+  "vkui-popper-fadein": "vkui-popper-fadein"
+};
+
+/**
+ * @see https://vkcom.github.io/VKUI/#/Popover
+ */
+export var Popover = function Popover(_ref) {
+  var _ref$action = _ref.action,
+      action = _ref$action === void 0 ? "click" : _ref$action,
+      shownProp = _ref.shown,
+      _ref$showDelay = _ref.showDelay,
+      showDelay = _ref$showDelay === void 0 ? 150 : _ref$showDelay,
+      _ref$hideDelay = _ref.hideDelay,
+      hideDelay = _ref$hideDelay === void 0 ? 150 : _ref$hideDelay,
+      _ref$offsetDistance = _ref.offsetDistance,
+      offsetDistance = _ref$offsetDistance === void 0 ? 8 : _ref$offsetDistance,
+      content = _ref.content,
+      children = _ref.children,
+      styleProp = _ref.style,
+      className = _ref.className,
+      getRef = _ref.getRef,
+      onShownChange = _ref.onShownChange,
+      restProps = _objectWithoutProperties(_ref, _excluded);
+
+  var _useDOM = useDOM(),
+      document = _useDOM.document;
+
+  var hoverable = action === "hover";
+  var hovered = React.useRef(false);
+
+  var _React$useState = React.useState(shownProp || false),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      computedShown = _React$useState2[0],
+      setComputedShown = _React$useState2[1];
+
+  var _React$useState3 = React.useState(null),
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      dropdownNode = _React$useState4[0],
+      setPopperNode = _React$useState4[1];
+
+  var shown = typeof shownProp === "boolean" ? shownProp : computedShown;
+  var patchedPopperRef = useExternRef(setPopperNode, getRef);
+
+  var _usePatchChildrenRef = usePatchChildrenRef(children),
+      _usePatchChildrenRef2 = _slicedToArray(_usePatchChildrenRef, 2),
+      childRef = _usePatchChildrenRef2[0],
+      child = _usePatchChildrenRef2[1];
+
+  var setShown = function setShown(value) {
+    if (typeof shownProp !== "boolean") {
+      setComputedShown(value);
+    }
+
+    typeof onShownChange === "function" && onShownChange(value);
+  };
+
+  var showTimeout = useTimeout(function () {
+    return setShown(true);
+  }, showDelay);
+  var hideTimeout = useTimeout(function () {
+    return setShown(false);
+  }, hideDelay);
+
+  var handleTargetEnter = function handleTargetEnter() {
+    hovered.current = true;
+    hideTimeout.clear();
+    showTimeout.set();
+  };
+
+  var handleTargetClick = function handleTargetClick() {
+    if (hovered.current && shown) {
+      return;
+    }
+
+    setShown(!shown);
+  };
+
+  var handleTargetLeave = function handleTargetLeave() {
+    hovered.current = false;
+    showTimeout.clear();
+    hideTimeout.set();
+  };
+
+  var handleContentKeyDownEscape = function handleContentKeyDownEscape() {
+    setShown(false);
+  };
+
+  var handleOutsideClick = function handleOutsideClick(e) {
+    var _childRef$current;
+
+    if (dropdownNode && !((_childRef$current = childRef.current) !== null && _childRef$current !== void 0 && _childRef$current.contains(e.target)) && !dropdownNode.contains(e.target)) {
+      setShown(false);
+    }
+  };
+
+  useGlobalEventListener(document, "click", handleOutsideClick);
+  var targetEnterListener = useEventListener("mouseenter", handleTargetEnter);
+  var targetClickEvent = useEventListener("click", handleTargetClick);
+  var targetLeaveListener = useEventListener("mouseleave", handleTargetLeave);
+  React.useEffect(function () {
+    if (!childRef.current) {
+      return;
+    }
+
+    targetClickEvent.add(childRef.current);
+
+    if (hoverable) {
+      targetEnterListener.add(childRef.current);
+      targetLeaveListener.add(childRef.current);
+    }
+  }, [childRef, hoverable, targetClickEvent, targetEnterListener, targetLeaveListener]);
+  return createScopedElement(React.Fragment, null, child, shown && createScopedElement(Popper, _extends({}, restProps, {
+    className: classNamesString(styles["Popover"], className),
+    targetRef: childRef,
+    getRef: patchedPopperRef,
+    offsetDistance: offsetDistance,
+    style: // Reason: Typescript ругается на CSS Custom Properties в объекте
+    // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+    _objectSpread(_objectSpread({}, styleProp), {}, {
+      "--popover-safe-zone-padding": "".concat(offsetDistance, "px")
+    }),
+    renderContent: function renderContent(_ref2) {
+      var className = _ref2.className;
+      return createScopedElement(FocusTrap, {
+        vkuiClass: className,
+        onClose: handleContentKeyDownEscape
+      }, content);
+    },
+    onMouseOver: hoverable ? hideTimeout.clear : undefined,
+    onMouseOut: hoverable ? handleTargetLeave : undefined
+  })));
+};
+//# sourceMappingURL=Popover.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Popover.js","names":["React","useDOM","classNamesString","Popper","FocusTrap","useTimeout","useExternRef","useEventListener","useGlobalEventListener","usePatchChildrenRef","Popover","action","shownProp","shown","showDelay","hideDelay","offsetDistance","content","children","styleProp","style","className","getRef","onShownChange","restProps","document","hoverable","hovered","useRef","useState","computedShown","setComputedShown","dropdownNode","setPopperNode","patchedPopperRef","childRef","child","setShown","value","showTimeout","hideTimeout","handleTargetEnter","current","clear","set","handleTargetClick","handleTargetLeave","handleContentKeyDownEscape","handleOutsideClick","e","contains","target","targetEnterListener","targetClickEvent","targetLeaveListener","useEffect","add","styles","undefined"],"sources":["../../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { useDOM } from \"../../lib/dom\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { PopperCommonProps, Popper } from \"../Popper/Popper\";\nimport { FocusTrap } from \"../FocusTrap/FocusTrap\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { useEventListener } from \"../../hooks/useEventListener\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport { usePatchChildrenRef } from \"../../hooks/usePatchChildrenRef\";\nimport styles from \"./Popover.module.css\";\n\nexport interface PopoverProps\n  extends Omit<PopperCommonProps, \"arrow\" | \"arrowClassName\"> {\n  /**\n   * Механика вызова всплывающего окна.\n   *\n   * - `\"click\"` – показывается/скрывается только при нажатии.\n   * - `\"hover\"` – помимо нажатия, будет показываться/скрывается при наведении/отведении мыши.\n   *\n   * > ⚠️`\"hover\"` на тач-устройствах будет работать как `\"click\"`, с одним лишь нюансом, что не будет закрываться\n   * > при повторном нажатии на целевой элемент. Для закрытия необходимо нажать на область вне целевого элемента\n   * > и выпадающего окна.\n   */\n  action?: \"click\" | \"hover\";\n  /**\n   * Если передан, то всплывающее окно будет показан/скрыт в зависимости от значения свойства.\n   */\n  shown?: boolean;\n  /**\n   * Количество миллисекунд, после которых произойдёт показ всплывающего окна.\n   *\n   * > Используется только для `action=\"hover\"` при наведении/отведении мыши.\n   */\n  showDelay?: number;\n  /**\n   * Количество миллисекунд, после которых произойдёт скрытие всплывающего окна.\n   *\n   * > Используется только для `action=\"hover\"` при наведении/отведении мыши.\n   */\n  hideDelay?: number;\n  /**\n   * Содержимое всплывающего окна.\n   */\n  content?: React.ReactNode;\n  /**\n   * Целевой элемент. Всплывающее окно появится возле него.\n   *\n   * > ⚠️ Если это пользовательский компонент, то он должен предоставлять параметры либо `getRootRef`, либо `ref` для получения ссылки на DOM-узел.\n   */\n  children?: React.ReactElement;\n  /**\n   * Вызывается при каждом изменении видимости всплывающего окна.\n   */\n  onShownChange?(shown: boolean): void;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Popover\n */\nexport const Popover = ({\n  action = \"click\",\n  shown: shownProp,\n  showDelay = 150,\n  hideDelay = 150,\n  offsetDistance = 8,\n  content,\n  children,\n  style: styleProp,\n  className,\n  getRef,\n  onShownChange,\n  ...restProps\n}: PopoverProps) => {\n  const { document } = useDOM();\n\n  const hoverable = action === \"hover\";\n  const hovered = React.useRef(false);\n  const [computedShown, setComputedShown] = React.useState(shownProp || false);\n  const [dropdownNode, setPopperNode] = React.useState<HTMLElement | null>(\n    null\n  );\n\n  const shown = typeof shownProp === \"boolean\" ? shownProp : computedShown;\n\n  const patchedPopperRef = useExternRef<HTMLDivElement>(setPopperNode, getRef);\n\n  const [childRef, child] = usePatchChildrenRef(children);\n\n  const setShown = (value: boolean) => {\n    if (typeof shownProp !== \"boolean\") {\n      setComputedShown(value);\n    }\n    typeof onShownChange === \"function\" && onShownChange(value);\n  };\n\n  const showTimeout = useTimeout(() => setShown(true), showDelay);\n\n  const hideTimeout = useTimeout(() => setShown(false), hideDelay);\n\n  const handleTargetEnter = () => {\n    hovered.current = true;\n    hideTimeout.clear();\n    showTimeout.set();\n  };\n\n  const handleTargetClick = () => {\n    if (hovered.current && shown) {\n      return;\n    }\n    setShown(!shown);\n  };\n\n  const handleTargetLeave = () => {\n    hovered.current = false;\n    showTimeout.clear();\n    hideTimeout.set();\n  };\n\n  const handleContentKeyDownEscape = () => {\n    setShown(false);\n  };\n\n  const handleOutsideClick = (e: MouseEvent) => {\n    if (\n      dropdownNode &&\n      !childRef.current?.contains(e.target as Node) &&\n      !dropdownNode.contains(e.target as Node)\n    ) {\n      setShown(false);\n    }\n  };\n\n  useGlobalEventListener(document, \"click\", handleOutsideClick);\n  const targetEnterListener = useEventListener(\"mouseenter\", handleTargetEnter);\n  const targetClickEvent = useEventListener(\"click\", handleTargetClick);\n  const targetLeaveListener = useEventListener(\"mouseleave\", handleTargetLeave);\n\n  React.useEffect(() => {\n    if (!childRef.current) {\n      return;\n    }\n\n    targetClickEvent.add(childRef.current);\n\n    if (hoverable) {\n      targetEnterListener.add(childRef.current);\n      targetLeaveListener.add(childRef.current);\n    }\n  }, [\n    childRef,\n    hoverable,\n    targetClickEvent,\n    targetEnterListener,\n    targetLeaveListener,\n  ]);\n\n  return (\n    <React.Fragment>\n      {child}\n      {shown && (\n        <Popper\n          {...restProps}\n          className={classNamesString(styles[\"Popover\"], className)}\n          targetRef={childRef}\n          getRef={patchedPopperRef}\n          offsetDistance={offsetDistance}\n          style={\n            // Reason: Typescript ругается на CSS Custom Properties в объекте\n            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n            {\n              ...styleProp,\n              \"--popover-safe-zone-padding\": `${offsetDistance}px`,\n            } as React.CSSProperties\n          }\n          renderContent={({ className }) => (\n            <FocusTrap\n              vkuiClass={className}\n              onClose={handleContentKeyDownEscape}\n            >\n              {content}\n            </FocusTrap>\n          )}\n          onMouseOver={hoverable ? hideTimeout.clear : undefined}\n          onMouseOut={hoverable ? handleTargetLeave : undefined}\n        />\n      )}\n    </React.Fragment>\n  );\n};\n"],"mappings":"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"}

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

@@ -0,0 +1 @@
+.vkuiPopover{animation:vkui-popper-fadein .2s ease;background:var(--vkui--color_background_modal);border-radius:var(--vkui--size_border_radius--regular);box-shadow:var(--vkui--elevation3);position:relative}.vkuiPopover:before{bottom:calc(-1 * 8px);bottom:calc(-1 * var(--popover-safe-zone-padding));content:"";left:calc(-1 * 8px);left:calc(-1 * var(--popover-safe-zone-padding));position:absolute;right:calc(-1 * 8px);right:calc(-1 * var(--popover-safe-zone-padding));top:calc(-1 * 8px);top:calc(-1 * var(--popover-safe-zone-padding));z-index:-1}

package/dist/cssm/components/PopperArrow/PopperArrow.css

@@ -1 +1 @@
-.vkuiPopperArrow__in{content:"";display:block;height:8px;width:20px}[data-popper-placement^=bottom] .vkuiPopperArrow{bottom:100%}[data-popper-placement^=top] .vkuiPopperArrow{top:100%}[data-popper-placement^=top] .vkuiPopperArrow__in{-webkit-transform:rotate(180deg);transform:rotate(180deg)}[data-popper-placement^=left] .vkuiPopperArrow{left:calc(100% - 6px)}[data-popper-placement^=left] .vkuiPopperArrow__in{-webkit-transform:rotate(90deg);transform:rotate(90deg)}[data-popper-placement^=right] .vkuiPopperArrow{right:calc(100% - 6px)}[data-popper-placement^=right] .vkuiPopperArrow__in{-webkit-transform:rotate(270deg);transform:rotate(270deg)}
+.vkuiPopperArrow__in{content:"";display:block;height:8px;width:20px}[data-popper-placement^=bottom] .vkuiPopperArrow{bottom:100%}[data-popper-placement^=top] .vkuiPopperArrow{top:100%}[data-popper-placement^=top] .vkuiPopperArrow__in{transform:rotate(180deg)}[data-popper-placement^=left] .vkuiPopperArrow{left:calc(100% - 6px)}[data-popper-placement^=left] .vkuiPopperArrow__in{transform:rotate(90deg)}[data-popper-placement^=right] .vkuiPopperArrow{right:calc(100% - 6px)}[data-popper-placement^=right] .vkuiPopperArrow__in{transform:rotate(270deg)}

package/dist/cssm/components/Progress/Progress.css

@@ -1 +1 @@
-.vkuiProgress{background:#e1e3e6;background:var(--loader_track_fill,var(--vkui--color_track_background));border-radius:1px;height:2px}.vkuiProgress__in{background:#2688eb;background:var(--accent,var(--vkui--color_stroke_accent));border-radius:inherit;height:100%;transition:width .2s ease}
+.vkuiProgress{background:var(--vkui--color_track_background);border-radius:1px;height:2px}.vkuiProgress__in{background:var(--vkui--color_stroke_accent);border-radius:inherit;height:100%;transition:width .2s ease}

package/dist/cssm/components/PromoBanner/PromoBanner.css

@@ -1,3 +1 @@
-.vkuiPromoBanner{background:#fff;background:var(--background_content,var(--vkui--color_background_content));box-sizing:border-box;color:#000;color:var(--text_primary,var(--vkui--color_text_primary));outline:1px solid rgba(0,0,0,.12);outline:var(--thin-border) solid var(--separator_alpha,var(--vkui--color_separator_primary_alpha));padding-bottom:10px;position:relative;width:100%}.vkuiPromoBanner__head{color:#818c99;color:var(--text_secondary,var(--vkui--color_text_secondary));display:flex;padding:14px 16px 10px;padding:14px var(--vkui--size_base_padding_horizontal--regular,16px) 10px}.vkuiPromoBanner__age{margin-left:6px}.vkuiPromoBanner__close{align-items:center;color:#99a2ad;color:var(
-    --placeholder_icon_foreground_primary,var(--vkui--color_icon_secondary)
-  );display:flex;height:48px;justify-content:center;position:absolute;right:0;top:0;width:48px}.vkuiPromoBanner__close:active{opacity:.7}.vkuiPromoBanner__pixels{display:none}
+.vkuiPromoBanner{background:var(--vkui--color_background_content);box-sizing:border-box;color:var(--vkui--color_text_primary);outline:1px solid var(--vkui--color_separator_primary_alpha);outline:var(--thin-border) solid var(--vkui--color_separator_primary_alpha);padding-bottom:10px;position:relative;width:100%}.vkuiPromoBanner__head{color:var(--vkui--color_text_secondary);display:flex;padding:14px var(--vkui--size_base_padding_horizontal--regular) 10px}.vkuiPromoBanner__age{margin-left:6px}.vkuiPromoBanner__close{align-items:center;color:var(--vkui--color_icon_secondary);display:flex;height:48px;justify-content:center;position:absolute;right:0;top:0;width:48px}.vkuiPromoBanner__close:active{opacity:.7}.vkuiPromoBanner__pixels{display:none}

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

@@ -25,8 +25,6 @@ declare type BannerData = {
     navigationType?: string;
     description?: string;
     ageRestrictions?: string;
-    /** @deprecated */
-    ageRestriction?: number;
 };
 export interface PromoBannerProps extends React.HTMLAttributes<HTMLDivElement> {
     /** Данные рекламного баннера, полученные из VKWebAppGetAds */