@vkontakte/vkui 4.30.0 → 4.31.0

package/dist/components/PanelHeader/PanelHeader.js

@@ -18,7 +18,8 @@ import ModalRootContext from "../ModalRoot/ModalRootContext";
 var PanelHeaderIn = function PanelHeaderIn(_ref) {
   var children = _ref.children,
       left = _ref.left,
-      right = _ref.right;
+      right = _ref.right,
+      separator = _ref.separator;
 
   var _React$useContext = React.useContext(ConfigProviderContext),
       webviewType = _React$useContext.webviewType;
@@ -27,7 +28,7 @@ var PanelHeaderIn = function PanelHeaderIn(_ref) {
       isInsideModal = _React$useContext2.isInsideModal;
 
   var platform = usePlatform();
-  return createScopedElement(TooltipContainer, {
+  return createScopedElement(React.Fragment, null, createScopedElement(TooltipContainer, {
     fixed: true,
     vkuiClass: "PanelHeader__in"
   }, createScopedElement("div", {
@@ -40,7 +41,9 @@ var PanelHeaderIn = function PanelHeaderIn(_ref) {
     vkuiClass: "PanelHeader__content-in"
   }, children)), createScopedElement("div", {
     vkuiClass: "PanelHeader__right"
-  }, (webviewType === WebviewType.INTERNAL || isInsideModal) && right));
+  }, (webviewType === WebviewType.INTERNAL || isInsideModal) && right)), separator && platform === VKCOM && createScopedElement(Separator, {
+    wide: true
+  }));
 };
 
 var PanelHeader = function PanelHeader(props) {
@@ -85,9 +88,8 @@ var PanelHeader = function PanelHeader(props) {
     vkuiClass: "PanelHeader__fixed",
     vertical: "top",
     getRootRef: getRef
-  }, createScopedElement(PanelHeaderIn, props)) : createScopedElement(PanelHeaderIn, props), separator && visor && createScopedElement(Separator, {
-    expanded: sizeX === SizeType.REGULAR && platform !== VKCOM,
-    wide: platform === VKCOM
+  }, createScopedElement(PanelHeaderIn, props)) : createScopedElement(PanelHeaderIn, props), separator && visor && platform !== VKCOM && createScopedElement(Separator, {
+    expanded: sizeX === SizeType.REGULAR
   }));
 };
 

package/dist/components/PanelHeader/PanelHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PanelHeader/PanelHeader.tsx"],"names":["React","usePlatform","getClassName","classNames","FixedLayout","Separator","Platform","VKCOM","ConfigProviderContext","WebviewType","SizeType","withAdaptivity","Text","TooltipContainer","ModalRootContext","PanelHeaderIn","children","left","right","useContext","webviewType","isInsideModal","platform","INTERNAL","PanelHeader","props","separator","visor","transparent","shadow","getRef","getRootRef","sizeX","sizeY","fixed","restProps","needShadow","REGULAR","isFixed","undefined","VKAPPS","defaultProps"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport FixedLayout from \"../FixedLayout/FixedLayout\";\nimport Separator from \"../Separator/Separator\";\nimport { Platform, VKCOM } from \"../../lib/platform\";\nimport { HasRef, HasRootRef } from \"../../types\";\nimport {\n  ConfigProviderContext,\n  WebviewType,\n} from \"../ConfigProvider/ConfigProviderContext\";\nimport {\n  AdaptivityProps,\n  SizeType,\n  withAdaptivity,\n} from \"../../hoc/withAdaptivity\";\nimport Text from \"../Typography/Text/Text\";\nimport { TooltipContainer } from \"../Tooltip/TooltipContainer\";\nimport ModalRootContext from \"../ModalRoot/ModalRootContext\";\nimport \"./PanelHeader.css\";\n\nexport interface PanelHeaderProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRef<HTMLDivElement>,\n    HasRootRef<HTMLDivElement>,\n    AdaptivityProps {\n  left?: React.ReactNode;\n  right?: React.ReactNode;\n  separator?: boolean;\n  transparent?: boolean;\n  shadow?: boolean;\n  /**\n   * Если `false`, то шапка будет нулевой высоты и контент панели \"залезет\" под неё\n   */\n  visor?: boolean;\n  /**\n   * Если `false`, то шапка будет в потоке. По умолчанию `true`, но если платформа vkcom, то по умолчанию `false`.\n   */\n  fixed?: boolean;\n}\n\nconst PanelHeaderIn: React.FC<PanelHeaderProps> = ({\n  children,\n  left,\n  right,\n}) => {\n  const { webviewType } = React.useContext(ConfigProviderContext);\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const platform = usePlatform();\n\n  return (\n    <TooltipContainer fixed vkuiClass=\"PanelHeader__in\">\n      <div vkuiClass=\"PanelHeader__left\">{left}</div>\n      <div vkuiClass=\"PanelHeader__content\">\n        {platform === VKCOM ? (\n          <Text weight=\"medium\">{children}</Text>\n        ) : (\n          <span vkuiClass=\"PanelHeader__content-in\">{children}</span>\n        )}\n      </div>\n      <div vkuiClass=\"PanelHeader__right\">\n        {(webviewType === WebviewType.INTERNAL || isInsideModal) && right}\n      </div>\n    </TooltipContainer>\n  );\n};\n\nconst PanelHeader: React.FC<PanelHeaderProps> = (props: PanelHeaderProps) => {\n  const {\n    left,\n    children,\n    right,\n    separator,\n    visor,\n    transparent,\n    shadow,\n    getRef,\n    getRootRef,\n    sizeX,\n    sizeY,\n    fixed,\n    ...restProps\n  } = props;\n  const platform = usePlatform();\n  const { webviewType } = React.useContext(ConfigProviderContext);\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const needShadow = shadow && sizeX === SizeType.REGULAR;\n  let isFixed = fixed !== undefined ? fixed : platform !== Platform.VKCOM;\n\n  return (\n    <div\n      {...restProps}\n      // eslint-disable-next-line vkui/no-object-expression-in-arguments\n      vkuiClass={classNames(\n        getClassName(\"PanelHeader\", platform),\n        {\n          \"PanelHeader--trnsp\": transparent,\n          \"PanelHeader--shadow\": needShadow,\n          \"PanelHeader--vis\": visor,\n          \"PanelHeader--sep\": separator && visor,\n          \"PanelHeader--vkapps\":\n            webviewType === WebviewType.VKAPPS && !isInsideModal,\n          \"PanelHeader--no-left\": !left,\n          \"PanelHeader--no-right\": !right,\n          \"PanelHeader--fixed\": isFixed,\n        },\n        `PanelHeader--sizeX-${sizeX}`\n      )}\n      ref={isFixed ? getRootRef : getRef}\n    >\n      {isFixed ? (\n        <FixedLayout\n          vkuiClass=\"PanelHeader__fixed\"\n          vertical=\"top\"\n          getRootRef={getRef}\n        >\n          <PanelHeaderIn {...props} />\n        </FixedLayout>\n      ) : (\n        <PanelHeaderIn {...props} />\n      )}\n      {separator && visor && (\n        <Separator\n          expanded={sizeX === SizeType.REGULAR && platform !== VKCOM}\n          wide={platform === VKCOM}\n        />\n      )}\n    </div>\n  );\n};\n\nPanelHeader.defaultProps = {\n  separator: true,\n  transparent: false,\n  visor: true,\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default withAdaptivity(PanelHeader, {\n  sizeX: true,\n  sizeY: true,\n});\n"],"file":"PanelHeader.js"}
+{"version":3,"sources":["../../../src/components/PanelHeader/PanelHeader.tsx"],"names":["React","usePlatform","getClassName","classNames","FixedLayout","Separator","Platform","VKCOM","ConfigProviderContext","WebviewType","SizeType","withAdaptivity","Text","TooltipContainer","ModalRootContext","PanelHeaderIn","children","left","right","separator","useContext","webviewType","isInsideModal","platform","INTERNAL","PanelHeader","props","visor","transparent","shadow","getRef","getRootRef","sizeX","sizeY","fixed","restProps","needShadow","REGULAR","isFixed","undefined","VKAPPS","defaultProps"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport FixedLayout from \"../FixedLayout/FixedLayout\";\nimport Separator from \"../Separator/Separator\";\nimport { Platform, VKCOM } from \"../../lib/platform\";\nimport { HasRef, HasRootRef } from \"../../types\";\nimport {\n  ConfigProviderContext,\n  WebviewType,\n} from \"../ConfigProvider/ConfigProviderContext\";\nimport {\n  AdaptivityProps,\n  SizeType,\n  withAdaptivity,\n} from \"../../hoc/withAdaptivity\";\nimport Text from \"../Typography/Text/Text\";\nimport { TooltipContainer } from \"../Tooltip/TooltipContainer\";\nimport ModalRootContext from \"../ModalRoot/ModalRootContext\";\nimport \"./PanelHeader.css\";\n\nexport interface PanelHeaderProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRef<HTMLDivElement>,\n    HasRootRef<HTMLDivElement>,\n    AdaptivityProps {\n  left?: React.ReactNode;\n  right?: React.ReactNode;\n  separator?: boolean;\n  transparent?: boolean;\n  shadow?: boolean;\n  /**\n   * Если `false`, то шапка будет нулевой высоты и контент панели \"залезет\" под неё\n   */\n  visor?: boolean;\n  /**\n   * Если `false`, то шапка будет в потоке. По умолчанию `true`, но если платформа vkcom, то по умолчанию `false`.\n   */\n  fixed?: boolean;\n}\n\nconst PanelHeaderIn: React.FC<PanelHeaderProps> = ({\n  children,\n  left,\n  right,\n  separator,\n}) => {\n  const { webviewType } = React.useContext(ConfigProviderContext);\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const platform = usePlatform();\n\n  return (\n    <React.Fragment>\n      <TooltipContainer fixed vkuiClass=\"PanelHeader__in\">\n        <div vkuiClass=\"PanelHeader__left\">{left}</div>\n        <div vkuiClass=\"PanelHeader__content\">\n          {platform === VKCOM ? (\n            <Text weight=\"medium\">{children}</Text>\n          ) : (\n            <span vkuiClass=\"PanelHeader__content-in\">{children}</span>\n          )}\n        </div>\n        <div vkuiClass=\"PanelHeader__right\">\n          {(webviewType === WebviewType.INTERNAL || isInsideModal) && right}\n        </div>\n      </TooltipContainer>\n      {separator && platform === VKCOM && <Separator wide />}\n    </React.Fragment>\n  );\n};\n\nconst PanelHeader: React.FC<PanelHeaderProps> = (props: PanelHeaderProps) => {\n  const {\n    left,\n    children,\n    right,\n    separator,\n    visor,\n    transparent,\n    shadow,\n    getRef,\n    getRootRef,\n    sizeX,\n    sizeY,\n    fixed,\n    ...restProps\n  } = props;\n  const platform = usePlatform();\n  const { webviewType } = React.useContext(ConfigProviderContext);\n  const { isInsideModal } = React.useContext(ModalRootContext);\n  const needShadow = shadow && sizeX === SizeType.REGULAR;\n  let isFixed = fixed !== undefined ? fixed : platform !== Platform.VKCOM;\n\n  return (\n    <div\n      {...restProps}\n      // eslint-disable-next-line vkui/no-object-expression-in-arguments\n      vkuiClass={classNames(\n        getClassName(\"PanelHeader\", platform),\n        {\n          \"PanelHeader--trnsp\": transparent,\n          \"PanelHeader--shadow\": needShadow,\n          \"PanelHeader--vis\": visor,\n          \"PanelHeader--sep\": separator && visor,\n          \"PanelHeader--vkapps\":\n            webviewType === WebviewType.VKAPPS && !isInsideModal,\n          \"PanelHeader--no-left\": !left,\n          \"PanelHeader--no-right\": !right,\n          \"PanelHeader--fixed\": isFixed,\n        },\n        `PanelHeader--sizeX-${sizeX}`\n      )}\n      ref={isFixed ? getRootRef : getRef}\n    >\n      {isFixed ? (\n        <FixedLayout\n          vkuiClass=\"PanelHeader__fixed\"\n          vertical=\"top\"\n          getRootRef={getRef}\n        >\n          <PanelHeaderIn {...props} />\n        </FixedLayout>\n      ) : (\n        <PanelHeaderIn {...props} />\n      )}\n      {separator && visor && platform !== VKCOM && (\n        <Separator expanded={sizeX === SizeType.REGULAR} />\n      )}\n    </div>\n  );\n};\n\nPanelHeader.defaultProps = {\n  separator: true,\n  transparent: false,\n  visor: true,\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default withAdaptivity(PanelHeader, {\n  sizeX: true,\n  sizeY: true,\n});\n"],"file":"PanelHeader.js"}

package/dist/components/PopoutRoot/PopoutRoot.js

@@ -3,9 +3,10 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["popout", "modal", "viewWidth", "viewHeight", "hasMouse", "children", "getRootRef"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import * as React from "react";
-import { withAdaptivity, ViewWidth, ViewHeight } from "../../hoc/withAdaptivity";
+import { withAdaptivity } from "../../hoc/withAdaptivity";
 import { AppRootPortal } from "../AppRoot/AppRootPortal";
 import { blurActiveElement, useDOM } from "../../lib/dom";
+import { useAdaptivityIsDesktop } from "../../hooks/useAdaptivity";
 export var PopoutRootComponent = function PopoutRootComponent(props) {
   var popout = props.popout,
       modal = props.modal,
@@ -19,7 +20,7 @@ export var PopoutRootComponent = function PopoutRootComponent(props) {
   var _useDOM = useDOM(),
       document = _useDOM.document;
 
-  var isDesktop = viewWidth >= ViewWidth.SMALL_TABLET && (hasMouse || viewHeight >= ViewHeight.MEDIUM);
+  var isDesktop = useAdaptivityIsDesktop();
   React.useEffect(function () {
     popout && blurActiveElement(document);
   }, [document, popout]);

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PopoutRoot/PopoutRoot.tsx"],"names":["React","withAdaptivity","ViewWidth","ViewHeight","AppRootPortal","blurActiveElement","useDOM","PopoutRootComponent","props","popout","modal","viewWidth","viewHeight","hasMouse","children","getRootRef","restProps","document","isDesktop","SMALL_TABLET","MEDIUM","useEffect","displayName","PopoutRoot"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,SACEC,cADF,EAEEC,SAFF,EAGEC,UAHF;AAKA,SAASC,aAAT;AACA,SAASC,iBAAT,EAA4BC,MAA5B;AAeA,OAAO,IAAMC,mBAEZ,GAAG,SAFSA,mBAET,CAACC,KAAD,EAAW;AACb,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,CAACA,QAAD,EAAWR,MAAX,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} from \"../../hoc/withAdaptivity\";\nimport { AppRootPortal } from \"../AppRoot/AppRootPortal\";\nimport { blurActiveElement, useDOM } from \"../../lib/dom\";\nimport {\n  AdaptivityContextInterface,\n  AdaptivityProps,\n} from \"../AdaptivityProvider/AdaptivityContext\";\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<\n  PopoutRootProps & AdaptivityContextInterface\n> = (props) => {\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  }, [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"],"file":"PopoutRoot.js"}
+{"version":3,"sources":["../../../src/components/PopoutRoot/PopoutRoot.tsx"],"names":["React","withAdaptivity","AppRootPortal","blurActiveElement","useDOM","useAdaptivityIsDesktop","PopoutRootComponent","props","popout","modal","viewWidth","viewHeight","hasMouse","children","getRootRef","restProps","document","isDesktop","useEffect","displayName","PopoutRoot"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,SAASC,cAAT;AACA,SAASC,aAAT;AACA,SAASC,iBAAT,EAA4BC,MAA5B;AAKA,SAASC,sBAAT;AAWA,OAAO,IAAMC,mBAEZ,GAAG,SAFSA,mBAET,CAACC,KAAD,EAAW;AACb,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,gBAAqBH,MAAM,EAA3B;AAAA,MAAQY,QAAR,WAAQA,QAAR;;AAEA,MAAMC,SAAS,GAAGZ,sBAAsB,EAAxC;AAEAL,EAAAA,KAAK,CAACkB,SAAN,CAAgB,YAAM;AACpBV,IAAAA,MAAM,IAAIL,iBAAiB,CAACa,QAAD,CAA3B;AACD,GAFD,EAEG,CAACA,QAAD,EAAWR,MAAX,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,CAtCM;AAwCPH,mBAAmB,CAACa,WAApB,GAAkC,YAAlC;AAEA,OAAO,IAAMC,UAAU,GAAGnB,cAAc,CAACK,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 } 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: React.FC<\n  PopoutRootProps & AdaptivityContextInterface\n> = (props) => {\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 = 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"],"file":"PopoutRoot.js"}