@vkontakte/vkui 4.37.0 → 5.0.0

package/dist/cjs/components/AdaptivityProvider/AdaptivityProvider.js

@@ -7,7 +7,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.TABLET_SIZE = exports.SMALL_TABLET_SIZE = exports.MOBILE_SIZE = exports.MOBILE_LANDSCAPE_HEIGHT = exports.MEDIUM_HEIGHT = exports.DESKTOP_SIZE = exports.AdaptivityProvider = void 0;
+exports.AdaptivityProvider = void 0;
 
 var _jsxRuntime = require("../../lib/jsxRuntime");
 
@@ -17,147 +17,121 @@ var React = _interopRequireWildcard(require("react"));
 
 var _vkjs = require("@vkontakte/vkjs");
 
-var _AdaptivityContext = require("./AdaptivityContext");
-
-var _dom = require("../../lib/dom");
+var _adaptivity = require("../../lib/adaptivity");
 
 var _useBridgeAdaptivity = require("../../hooks/useBridgeAdaptivity");
 
-var DESKTOP_SIZE = 1280;
-exports.DESKTOP_SIZE = DESKTOP_SIZE;
-var TABLET_SIZE = 1024;
-exports.TABLET_SIZE = TABLET_SIZE;
-var SMALL_TABLET_SIZE = 768;
-exports.SMALL_TABLET_SIZE = SMALL_TABLET_SIZE;
-var MOBILE_SIZE = 320;
-exports.MOBILE_SIZE = MOBILE_SIZE;
-var MOBILE_LANDSCAPE_HEIGHT = 414;
-exports.MOBILE_LANDSCAPE_HEIGHT = MOBILE_LANDSCAPE_HEIGHT;
-var MEDIUM_HEIGHT = 720;
-exports.MEDIUM_HEIGHT = MEDIUM_HEIGHT;
+var _AdaptivityContext = require("./AdaptivityContext");
 
 /**
  * @see https://vkcom.github.io/VKUI/#/AdaptivityProvider
  */
-var AdaptivityProvider = function AdaptivityProvider(props) {
-  var adaptivityRef = React.useRef(null);
-
-  var _React$useState = React.useState({}),
-      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-      updateAdaptivity = _React$useState2[1];
-
+var AdaptivityProvider = function AdaptivityProvider(_ref) {
+  var viewWidth = _ref.viewWidth,
+      viewHeight = _ref.viewHeight,
+      sizeX = _ref.sizeX,
+      sizeY = _ref.sizeY,
+      hasMouse = _ref.hasMouse,
+      deviceHasHover = _ref.deviceHasHover,
+      children = _ref.children;
   var bridge = (0, _useBridgeAdaptivity.useBridgeAdaptivity)();
 
-  var _useDOM = (0, _dom.useDOM)(),
-      window = _useDOM.window;
-
-  if (!adaptivityRef.current) {
-    adaptivityRef.current = calculateAdaptivity(props, bridge, window);
-  }
+  var _React$useState = React.useState({
+    viewWidth: viewWidth,
+    viewHeight: viewHeight,
+    sizeX: sizeX,
+    sizeY: sizeY,
+    hasMouse: hasMouse,
+    deviceHasHover: deviceHasHover
+  }),
+      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+      adaptivity = _React$useState2[0],
+      setAdaptivity = _React$useState2[1];
 
   React.useEffect(function () {
-    function onResize() {
-      if (adaptivityRef.current === null) {
-        return;
-      }
-
-      var calculated = calculateAdaptivity(props, bridge, window);
-      var _adaptivityRef$curren = adaptivityRef.current,
-          viewWidth = _adaptivityRef$curren.viewWidth,
-          viewHeight = _adaptivityRef$curren.viewHeight,
-          sizeX = _adaptivityRef$curren.sizeX,
-          sizeY = _adaptivityRef$curren.sizeY,
-          hasMouse = _adaptivityRef$curren.hasMouse,
-          deviceHasHover = _adaptivityRef$curren.deviceHasHover;
-
-      if (viewWidth !== calculated.viewWidth || viewHeight !== calculated.viewHeight || sizeX !== calculated.sizeX || sizeY !== calculated.sizeY || hasMouse !== calculated.hasMouse || deviceHasHover !== calculated.deviceHasHover) {
-        adaptivityRef.current = calculated;
-        updateAdaptivity({});
-      }
-    }
-
-    onResize();
-    window.addEventListener("resize", onResize, false);
-    return function () {
-      window.removeEventListener("resize", onResize, false);
-    };
-  }, [props.viewWidth, props.viewHeight, props.sizeX, props.sizeY, props.hasMouse, props.deviceHasHover, window, props, bridge]);
+    setAdaptivity(calculateAdaptivity({
+      viewWidth: viewWidth,
+      viewHeight: viewHeight,
+      sizeX: sizeX,
+      sizeY: sizeY,
+      hasMouse: hasMouse,
+      deviceHasHover: deviceHasHover
+    }, bridge));
+  }, [viewWidth, viewHeight, sizeX, sizeY, hasMouse, deviceHasHover, bridge]);
   return (0, _jsxRuntime.createScopedElement)(_AdaptivityContext.AdaptivityContext.Provider, {
-    value: adaptivityRef.current
-  }, props.children);
+    value: adaptivity
+  }, children);
 };
 
 exports.AdaptivityProvider = AdaptivityProvider;
 
-function calculateAdaptivity(props, bridge, window) {
-  var windowWidth = 0;
-  var windowHeight = 0;
+function calculateAdaptivity(_ref2, bridge) {
+  var viewWidth = _ref2.viewWidth,
+      viewHeight = _ref2.viewHeight,
+      sizeX = _ref2.sizeX,
+      sizeY = _ref2.sizeY,
+      hasMouse = _ref2.hasMouse,
+      deviceHasHover = _ref2.deviceHasHover;
 
   if (bridge.type === "adaptive") {
-    windowWidth = bridge.viewportWidth;
-    windowHeight = bridge.viewportHeight;
-  } else if (window) {
-    windowWidth = window.innerWidth;
-    windowHeight = window.innerHeight;
-  }
-
-  var viewWidth = _AdaptivityContext.ViewWidth.SMALL_MOBILE;
-  var viewHeight = _AdaptivityContext.ViewHeight.SMALL;
-  var sizeY = _AdaptivityContext.SizeType.REGULAR;
-  var sizeX = _AdaptivityContext.SizeType.REGULAR;
-  var hasMouse = _vkjs.hasMouse;
-  var deviceHasHover = _vkjs.hasHover;
-
-  if (windowWidth >= DESKTOP_SIZE) {
-    viewWidth = _AdaptivityContext.ViewWidth.DESKTOP;
-  } else if (windowWidth >= TABLET_SIZE) {
-    viewWidth = _AdaptivityContext.ViewWidth.TABLET;
-  } else if (windowWidth >= SMALL_TABLET_SIZE) {
-    viewWidth = _AdaptivityContext.ViewWidth.SMALL_TABLET;
-  } else if (windowWidth >= MOBILE_SIZE) {
-    viewWidth = _AdaptivityContext.ViewWidth.MOBILE;
-  } else {
-    viewWidth = _AdaptivityContext.ViewWidth.SMALL_MOBILE;
-  }
-
-  if (windowHeight >= MEDIUM_HEIGHT) {
-    viewHeight = _AdaptivityContext.ViewHeight.MEDIUM;
-  } else if (windowHeight > MOBILE_LANDSCAPE_HEIGHT) {
-    viewHeight = _AdaptivityContext.ViewHeight.SMALL;
-  } else {
-    viewHeight = _AdaptivityContext.ViewHeight.EXTRA_SMALL;
-  }
-
-  if (!bridge.type) {
-    var _props$hasMouse, _props$deviceHasHover;
-
-    props.viewWidth && (viewWidth = props.viewWidth);
-    props.viewHeight && (viewHeight = props.viewHeight);
-    hasMouse = (_props$hasMouse = props.hasMouse) !== null && _props$hasMouse !== void 0 ? _props$hasMouse : hasMouse;
-    deviceHasHover = (_props$deviceHasHover = props.deviceHasHover) !== null && _props$deviceHasHover !== void 0 ? _props$deviceHasHover : deviceHasHover;
-  }
-
-  if (viewWidth <= _AdaptivityContext.ViewWidth.MOBILE) {
-    sizeX = _AdaptivityContext.SizeType.COMPACT;
-  }
+    var viewportWidth = bridge.viewportWidth,
+        viewportHeight = bridge.viewportHeight;
+
+    if (viewportWidth >= _adaptivity.BREAKPOINTS.DESKTOP) {
+      viewWidth = _adaptivity.ViewWidth.DESKTOP;
+    } else if (viewportWidth >= _adaptivity.BREAKPOINTS.TABLET) {
+      viewWidth = _adaptivity.ViewWidth.TABLET;
+    } else if (viewportWidth >= _adaptivity.BREAKPOINTS.SMALL_TABLET) {
+      viewWidth = _adaptivity.ViewWidth.SMALL_TABLET;
+    } else if (viewportWidth >= _adaptivity.BREAKPOINTS.MOBILE) {
+      viewWidth = _adaptivity.ViewWidth.MOBILE;
+    } else {
+      viewWidth = _adaptivity.ViewWidth.SMALL_MOBILE;
+    }
 
-  if (viewWidth >= _AdaptivityContext.ViewWidth.SMALL_TABLET && hasMouse || viewHeight <= _AdaptivityContext.ViewHeight.EXTRA_SMALL) {
-    sizeY = _AdaptivityContext.SizeType.COMPACT;
-  }
+    if (viewportHeight >= _adaptivity.BREAKPOINTS.MEDIUM_HEIGHT) {
+      viewHeight = _adaptivity.ViewHeight.MEDIUM;
+    } else if (viewportHeight > _adaptivity.BREAKPOINTS.MOBILE_LANDSCAPE_HEIGHT) {
+      viewHeight = _adaptivity.ViewHeight.SMALL;
+    } else {
+      viewHeight = _adaptivity.ViewHeight.EXTRA_SMALL;
+    }
 
-  if (!bridge.type) {
-    props.sizeX && (sizeX = props.sizeX);
-    props.sizeY && (sizeY = props.sizeY);
-  }
+    if (viewWidth <= _adaptivity.ViewWidth.MOBILE) {
+      sizeX = _adaptivity.SizeType.COMPACT;
+    } else {
+      sizeX = _adaptivity.SizeType.REGULAR;
+    }
 
-  if (bridge.type === "force_mobile" || bridge.type === "force_mobile_compact") {
-    viewWidth = _AdaptivityContext.ViewWidth.MOBILE;
-    sizeX = _AdaptivityContext.SizeType.COMPACT;
+    if (viewWidth >= _adaptivity.ViewWidth.SMALL_TABLET && _vkjs.hasMouse || viewHeight <= _adaptivity.ViewHeight.EXTRA_SMALL) {
+      sizeY = _adaptivity.SizeType.COMPACT;
+    } else {
+      sizeY = _adaptivity.SizeType.REGULAR;
+    }
+  } else if (bridge.type === "force_mobile" || bridge.type === "force_mobile_compact") {
+    viewWidth = _adaptivity.ViewWidth.MOBILE;
+    sizeX = _adaptivity.SizeType.COMPACT;
 
     if (bridge.type === "force_mobile_compact") {
-      sizeY = _AdaptivityContext.SizeType.COMPACT;
+      sizeY = _adaptivity.SizeType.COMPACT;
     } else {
-      sizeY = _AdaptivityContext.SizeType.REGULAR;
+      sizeY = _adaptivity.SizeType.REGULAR;
+    }
+  } else {
+    if (sizeX === undefined && viewWidth !== undefined) {
+      if (viewWidth <= _adaptivity.ViewWidth.MOBILE) {
+        sizeX = _adaptivity.SizeType.COMPACT;
+      } else {
+        sizeX = _adaptivity.SizeType.REGULAR;
+      }
+    }
+
+    if (sizeY === undefined && viewWidth !== undefined && viewHeight !== undefined) {
+      if (viewWidth >= _adaptivity.ViewWidth.SMALL_TABLET && _vkjs.hasMouse || viewHeight <= _adaptivity.ViewHeight.EXTRA_SMALL) {
+        sizeY = _adaptivity.SizeType.COMPACT;
+      } else {
+        sizeY = _adaptivity.SizeType.REGULAR;
+      }
     }
   }
 

package/dist/cjs/components/AdaptivityProvider/AdaptivityProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"AdaptivityProvider.js","names":["DESKTOP_SIZE","TABLET_SIZE","SMALL_TABLET_SIZE","MOBILE_SIZE","MOBILE_LANDSCAPE_HEIGHT","MEDIUM_HEIGHT","AdaptivityProvider","props","adaptivityRef","React","useRef","useState","updateAdaptivity","bridge","useBridgeAdaptivity","useDOM","window","current","calculateAdaptivity","useEffect","onResize","calculated","viewWidth","viewHeight","sizeX","sizeY","hasMouse","deviceHasHover","addEventListener","removeEventListener","children","windowWidth","windowHeight","type","viewportWidth","viewportHeight","innerWidth","innerHeight","ViewWidth","SMALL_MOBILE","ViewHeight","SMALL","SizeType","REGULAR","_hasMouse","_hasHover","DESKTOP","TABLET","SMALL_TABLET","MOBILE","MEDIUM","EXTRA_SMALL","COMPACT"],"sources":["../../../../src/components/AdaptivityProvider/AdaptivityProvider.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { hasMouse as _hasMouse, hasHover as _hasHover } from \"@vkontakte/vkjs\";\nimport {\n  AdaptivityContext,\n  AdaptivityProps,\n  SizeType,\n  ViewHeight,\n  ViewWidth,\n} from \"./AdaptivityContext\";\nimport { useDOM } from \"../../lib/dom\";\nimport {\n  useBridgeAdaptivity,\n  BridgeAdaptivity,\n} from \"../../hooks/useBridgeAdaptivity\";\n\nexport const DESKTOP_SIZE = 1280;\nexport const TABLET_SIZE = 1024;\nexport const SMALL_TABLET_SIZE = 768;\nexport const MOBILE_SIZE = 320;\n\nexport const MOBILE_LANDSCAPE_HEIGHT = 414;\nexport const MEDIUM_HEIGHT = 720;\n\nexport interface AdaptivityProviderProps extends AdaptivityProps {\n  children?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/AdaptivityProvider\n */\nexport const AdaptivityProvider = (props: AdaptivityProviderProps) => {\n  const adaptivityRef = React.useRef<ReturnType<\n    typeof calculateAdaptivity\n  > | null>(null);\n  const [, updateAdaptivity] = React.useState({});\n  const bridge = useBridgeAdaptivity();\n\n  const { window } = useDOM();\n\n  if (!adaptivityRef.current) {\n    adaptivityRef.current = calculateAdaptivity(props, bridge, window);\n  }\n\n  React.useEffect(() => {\n    function onResize() {\n      if (adaptivityRef.current === null) {\n        return;\n      }\n\n      const calculated = calculateAdaptivity(props, bridge, window);\n      const { viewWidth, viewHeight, sizeX, sizeY, hasMouse, deviceHasHover } =\n        adaptivityRef.current;\n\n      if (\n        viewWidth !== calculated.viewWidth ||\n        viewHeight !== calculated.viewHeight ||\n        sizeX !== calculated.sizeX ||\n        sizeY !== calculated.sizeY ||\n        hasMouse !== calculated.hasMouse ||\n        deviceHasHover !== calculated.deviceHasHover\n      ) {\n        adaptivityRef.current = calculated;\n        updateAdaptivity({});\n      }\n    }\n\n    onResize();\n    window!.addEventListener(\"resize\", onResize, false);\n\n    return () => {\n      window!.removeEventListener(\"resize\", onResize, false);\n    };\n  }, [\n    props.viewWidth,\n    props.viewHeight,\n    props.sizeX,\n    props.sizeY,\n    props.hasMouse,\n    props.deviceHasHover,\n    window,\n    props,\n    bridge,\n  ]);\n\n  return (\n    <AdaptivityContext.Provider value={adaptivityRef.current}>\n      {props.children}\n    </AdaptivityContext.Provider>\n  );\n};\n\nfunction calculateAdaptivity(\n  props: AdaptivityProps,\n  bridge: BridgeAdaptivity,\n  window?: Window\n) {\n  let windowWidth = 0;\n  let windowHeight = 0;\n\n  if (bridge.type === \"adaptive\") {\n    windowWidth = bridge.viewportWidth;\n    windowHeight = bridge.viewportHeight;\n  } else if (window) {\n    windowWidth = window.innerWidth;\n    windowHeight = window.innerHeight;\n  }\n\n  let viewWidth = ViewWidth.SMALL_MOBILE;\n  let viewHeight = ViewHeight.SMALL;\n  let sizeY = SizeType.REGULAR;\n  let sizeX = SizeType.REGULAR;\n  let hasMouse = _hasMouse;\n  let deviceHasHover = _hasHover;\n\n  if (windowWidth >= DESKTOP_SIZE) {\n    viewWidth = ViewWidth.DESKTOP;\n  } else if (windowWidth >= TABLET_SIZE) {\n    viewWidth = ViewWidth.TABLET;\n  } else if (windowWidth >= SMALL_TABLET_SIZE) {\n    viewWidth = ViewWidth.SMALL_TABLET;\n  } else if (windowWidth >= MOBILE_SIZE) {\n    viewWidth = ViewWidth.MOBILE;\n  } else {\n    viewWidth = ViewWidth.SMALL_MOBILE;\n  }\n\n  if (windowHeight >= MEDIUM_HEIGHT) {\n    viewHeight = ViewHeight.MEDIUM;\n  } else if (windowHeight > MOBILE_LANDSCAPE_HEIGHT) {\n    viewHeight = ViewHeight.SMALL;\n  } else {\n    viewHeight = ViewHeight.EXTRA_SMALL;\n  }\n\n  if (!bridge.type) {\n    props.viewWidth && (viewWidth = props.viewWidth);\n    props.viewHeight && (viewHeight = props.viewHeight);\n\n    hasMouse = props.hasMouse ?? hasMouse;\n    deviceHasHover = props.deviceHasHover ?? deviceHasHover;\n  }\n\n  if (viewWidth <= ViewWidth.MOBILE) {\n    sizeX = SizeType.COMPACT;\n  }\n\n  if (\n    (viewWidth >= ViewWidth.SMALL_TABLET && hasMouse) ||\n    viewHeight <= ViewHeight.EXTRA_SMALL\n  ) {\n    sizeY = SizeType.COMPACT;\n  }\n\n  if (!bridge.type) {\n    props.sizeX && (sizeX = props.sizeX);\n    props.sizeY && (sizeY = props.sizeY);\n  }\n\n  if (\n    bridge.type === \"force_mobile\" ||\n    bridge.type === \"force_mobile_compact\"\n  ) {\n    viewWidth = ViewWidth.MOBILE;\n    sizeX = SizeType.COMPACT;\n\n    if (bridge.type === \"force_mobile_compact\") {\n      sizeY = SizeType.COMPACT;\n    } else {\n      sizeY = SizeType.REGULAR;\n    }\n  }\n\n  return { viewWidth, viewHeight, sizeX, sizeY, hasMouse, deviceHasHover };\n}\n"],"mappings":"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"}
+{"version":3,"file":"AdaptivityProvider.js","names":["AdaptivityProvider","viewWidth","viewHeight","sizeX","sizeY","hasMouse","deviceHasHover","children","bridge","useBridgeAdaptivity","React","useState","adaptivity","setAdaptivity","useEffect","calculateAdaptivity","type","viewportWidth","viewportHeight","BREAKPOINTS","DESKTOP","ViewWidth","TABLET","SMALL_TABLET","MOBILE","SMALL_MOBILE","MEDIUM_HEIGHT","ViewHeight","MEDIUM","MOBILE_LANDSCAPE_HEIGHT","SMALL","EXTRA_SMALL","SizeType","COMPACT","REGULAR","_hasMouse","undefined"],"sources":["../../../../src/components/AdaptivityProvider/AdaptivityProvider.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { hasMouse as _hasMouse } from \"@vkontakte/vkjs\";\nimport {\n  SizeType,\n  ViewWidth,\n  ViewHeight,\n  BREAKPOINTS,\n} from \"../../lib/adaptivity\";\nimport {\n  useBridgeAdaptivity,\n  BridgeAdaptivity,\n} from \"../../hooks/useBridgeAdaptivity\";\nimport { type AdaptivityProps, AdaptivityContext } from \"./AdaptivityContext\";\n\nexport interface AdaptivityProviderProps extends AdaptivityProps {\n  children?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/AdaptivityProvider\n */\nexport const AdaptivityProvider = ({\n  viewWidth,\n  viewHeight,\n  sizeX,\n  sizeY,\n  hasMouse,\n  deviceHasHover,\n  children,\n}: React.PropsWithChildren<AdaptivityProps>) => {\n  const bridge = useBridgeAdaptivity();\n  const [adaptivity, setAdaptivity] = React.useState({\n    viewWidth,\n    viewHeight,\n    sizeX,\n    sizeY,\n    hasMouse,\n    deviceHasHover,\n  });\n\n  React.useEffect(() => {\n    setAdaptivity(\n      calculateAdaptivity(\n        {\n          viewWidth,\n          viewHeight,\n          sizeX,\n          sizeY,\n          hasMouse,\n          deviceHasHover,\n        },\n        bridge\n      )\n    );\n  }, [viewWidth, viewHeight, sizeX, sizeY, hasMouse, deviceHasHover, bridge]);\n\n  return (\n    <AdaptivityContext.Provider value={adaptivity}>\n      {children}\n    </AdaptivityContext.Provider>\n  );\n};\n\nfunction calculateAdaptivity(\n  {\n    viewWidth,\n    viewHeight,\n    sizeX,\n    sizeY,\n    hasMouse,\n    deviceHasHover,\n  }: AdaptivityProps,\n  bridge: BridgeAdaptivity\n) {\n  if (bridge.type === \"adaptive\") {\n    const { viewportWidth, viewportHeight } = bridge;\n\n    if (viewportWidth >= BREAKPOINTS.DESKTOP) {\n      viewWidth = ViewWidth.DESKTOP;\n    } else if (viewportWidth >= BREAKPOINTS.TABLET) {\n      viewWidth = ViewWidth.TABLET;\n    } else if (viewportWidth >= BREAKPOINTS.SMALL_TABLET) {\n      viewWidth = ViewWidth.SMALL_TABLET;\n    } else if (viewportWidth >= BREAKPOINTS.MOBILE) {\n      viewWidth = ViewWidth.MOBILE;\n    } else {\n      viewWidth = ViewWidth.SMALL_MOBILE;\n    }\n\n    if (viewportHeight >= BREAKPOINTS.MEDIUM_HEIGHT) {\n      viewHeight = ViewHeight.MEDIUM;\n    } else if (viewportHeight > BREAKPOINTS.MOBILE_LANDSCAPE_HEIGHT) {\n      viewHeight = ViewHeight.SMALL;\n    } else {\n      viewHeight = ViewHeight.EXTRA_SMALL;\n    }\n\n    if (viewWidth <= ViewWidth.MOBILE) {\n      sizeX = SizeType.COMPACT;\n    } else {\n      sizeX = SizeType.REGULAR;\n    }\n\n    if (\n      (viewWidth >= ViewWidth.SMALL_TABLET && _hasMouse) ||\n      viewHeight <= ViewHeight.EXTRA_SMALL\n    ) {\n      sizeY = SizeType.COMPACT;\n    } else {\n      sizeY = SizeType.REGULAR;\n    }\n  } else if (\n    bridge.type === \"force_mobile\" ||\n    bridge.type === \"force_mobile_compact\"\n  ) {\n    viewWidth = ViewWidth.MOBILE;\n    sizeX = SizeType.COMPACT;\n\n    if (bridge.type === \"force_mobile_compact\") {\n      sizeY = SizeType.COMPACT;\n    } else {\n      sizeY = SizeType.REGULAR;\n    }\n  } else {\n    if (sizeX === undefined && viewWidth !== undefined) {\n      if (viewWidth <= ViewWidth.MOBILE) {\n        sizeX = SizeType.COMPACT;\n      } else {\n        sizeX = SizeType.REGULAR;\n      }\n    }\n    if (\n      sizeY === undefined &&\n      viewWidth !== undefined &&\n      viewHeight !== undefined\n    ) {\n      if (\n        (viewWidth >= ViewWidth.SMALL_TABLET && _hasMouse) ||\n        viewHeight <= ViewHeight.EXTRA_SMALL\n      ) {\n        sizeY = SizeType.COMPACT;\n      } else {\n        sizeY = SizeType.REGULAR;\n      }\n    }\n  }\n\n  return {\n    viewWidth,\n    viewHeight,\n    sizeX,\n    sizeY,\n    hasMouse,\n    deviceHasHover,\n  };\n}\n"],"mappings":"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"}

package/dist/cjs/components/Alert/Alert.js

@@ -27,8 +27,6 @@ var _classNames = require("../../lib/classNames");
 
 var _platform = require("../../lib/platform");
 
-var _withAdaptivity = require("../../hoc/withAdaptivity");
-
 var _Button = require("../Button/Button");
 
 var _utils = require("../../lib/utils");
@@ -37,6 +35,8 @@ var _Title = require("../Typography/Title/Title");
 
 var _Caption = require("../Typography/Caption/Caption");
 
+var _Footnote = require("../Typography/Footnote/Footnote");
+
 var _Text = require("../Typography/Text/Text");
 
 var _ModalDismissButton = require("../ModalDismissButton/ModalDismissButton");
@@ -49,7 +49,7 @@ var _useWaitTransitionFinish = require("../../hooks/useWaitTransitionFinish");
 
 var _usePlatform = require("../../hooks/usePlatform");
 
-var _useAdaptivity3 = require("../../hooks/useAdaptivity");
+var _useAdaptivityWithMediaQueries = require("../../hooks/useAdaptivityWithMediaQueries");
 
 var _excluded = ["action", "onItemClick"],
     _excluded2 = ["actions", "actionsLayout", "children", "className", "style", "text", "header", "onClose", "dismissLabel"];
@@ -58,7 +58,7 @@ var AlertHeader = function AlertHeader(props) {
   var platform = (0, _usePlatform.usePlatform)();
 
   switch (platform) {
-    case _platform.IOS:
+    case _platform.Platform.IOS:
       return (0, _jsxRuntime.createScopedElement)(_Title.Title, (0, _extends2.default)({
         vkuiClass: "Alert__header",
         weight: "1",
@@ -78,15 +78,14 @@ var AlertText = function AlertText(props) {
   var platform = (0, _usePlatform.usePlatform)();
 
   switch (platform) {
-    case _platform.VKCOM:
-      return (0, _jsxRuntime.createScopedElement)(_Caption.Caption, (0, _extends2.default)({
+    case _platform.Platform.VKCOM:
+      return (0, _jsxRuntime.createScopedElement)(_Footnote.Footnote, (0, _extends2.default)({
         vkuiClass: "Alert__text"
       }, props));
 
-    case _platform.IOS:
+    case _platform.Platform.IOS:
       return (0, _jsxRuntime.createScopedElement)(_Caption.Caption, (0, _extends2.default)({
-        vkuiClass: "Alert__text",
-        level: "2"
+        vkuiClass: "Alert__text"
       }, props));
 
     default:
@@ -103,38 +102,30 @@ var AlertAction = function AlertAction(_ref) {
       onItemClick = _ref.onItemClick,
       restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var platform = (0, _usePlatform.usePlatform)();
-
-  var _useAdaptivity = (0, _useAdaptivity3.useAdaptivity)(),
-      viewWidth = _useAdaptivity.viewWidth;
-
   var handleItemClick = React.useCallback(function () {
     return onItemClick(action);
   }, [onItemClick, action]);
 
-  if (platform === _platform.IOS) {
+  if (platform === _platform.Platform.IOS) {
     var _action$Component = action.Component,
         Component = _action$Component === void 0 ? "button" : _action$Component;
     return (0, _jsxRuntime.createScopedElement)(_Tappable.Tappable, (0, _extends2.default)({
       Component: action.href ? "a" : Component,
-      vkuiClass: (0, _classNames.classNames)("Alert__action", "Alert__action--".concat(action.mode)),
+      vkuiClass: (0, _classNames.classNames)("Alert__action", "Alert__action--mode-".concat(action.mode)),
       onClick: handleItemClick,
       href: action.href,
       target: action.target
     }, restProps), action.title);
   }
 
-  var mode = "tertiary"; // TODO v5.0.0 поправить под новую адаптивность
+  var mode = "tertiary";
 
-  if (viewWidth === _withAdaptivity.ViewWidth.DESKTOP && action.mode === "destructive") {
-    mode = "destructive";
-  }
-
-  if (platform === _platform.VKCOM) {
+  if (platform === _platform.Platform.VKCOM) {
     mode = action.mode === "cancel" ? "secondary" : "primary";
   }
 
   return (0, _jsxRuntime.createScopedElement)(_Button.Button, {
-    vkuiClass: (0, _classNames.classNames)("Alert__button", "Alert__button--".concat(action.mode)),
+    vkuiClass: (0, _classNames.classNames)("Alert__button", "Alert__button--mode-".concat(action.mode)),
     mode: mode,
     size: "m",
     onClick: handleItemClick,
@@ -164,8 +155,8 @@ var Alert = function Alert(_ref2) {
       restProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
   var platform = (0, _usePlatform.usePlatform)();
 
-  var _useAdaptivity2 = (0, _useAdaptivity3.useAdaptivity)(),
-      viewWidth = _useAdaptivity2.viewWidth;
+  var _useAdaptivityWithMed = (0, _useAdaptivityWithMediaQueries.useAdaptivityWithMediaQueries)(),
+      isDesktop = _useAdaptivityWithMed.isDesktop;
 
   var _useWaitTransitionFin = (0, _useWaitTransitionFinish.useWaitTransitionFinish)(),
       waitTransitionFinish = _useWaitTransitionFin.waitTransitionFinish;
@@ -176,11 +167,8 @@ var Alert = function Alert(_ref2) {
       setClosing = _React$useState2[1];
 
   var elementRef = React.useRef(null);
-  var resolvedActionsLayout = platform === _platform.VKCOM ? "horizontal" : actionsLayout;
-  var canShowCloseButton = platform !== _platform.IOS && viewWidth >= _withAdaptivity.ViewWidth.SMALL_TABLET;
-  var isDesktop = viewWidth >= _withAdaptivity.ViewWidth.SMALL_TABLET; // TODO v5.0.0 поправить под новую адаптивность
-
-  var timeout = platform === _platform.IOS ? 300 : 200;
+  var resolvedActionsLayout = platform === _platform.Platform.VKCOM ? "horizontal" : actionsLayout;
+  var timeout = platform === _platform.Platform.IOS ? 300 : 200;
   var close = React.useCallback(function () {
     setClosing(true);
     waitTransitionFinish(elementRef.current, function (e) {
@@ -191,9 +179,9 @@ var Alert = function Alert(_ref2) {
   }, [elementRef, waitTransitionFinish, onClose, timeout]);
   var onItemClick = React.useCallback(function (item) {
     var action = item.action,
-        autoclose = item.autoclose;
+        autoClose = item.autoClose;
 
-    if (autoclose) {
+    if (autoClose) {
       setClosing(true);
       waitTransitionFinish(elementRef.current, function (e) {
         if (!e || e.propertyName === "opacity") {
@@ -216,7 +204,7 @@ var Alert = function Alert(_ref2) {
     onClick: _utils.stopPropagation,
     onClose: close,
     timeout: timeout,
-    vkuiClass: (0, _classNames.classNames)("Alert", platform === _platform.IOS && "Alert--ios", platform === _platform.VKCOM && "Alert--vkcom", resolvedActionsLayout === "vertical" ? "Alert--v" : "Alert--h", closing && "Alert--closing", isDesktop && "Alert--desktop"),
+    vkuiClass: (0, _classNames.classNames)("Alert", platform === _platform.Platform.IOS && "Alert--ios", platform === _platform.Platform.VKCOM && "Alert--vkcom", resolvedActionsLayout === "vertical" ? "Alert--v" : "Alert--h", closing && "Alert--closing", isDesktop && "Alert--desktop"),
     role: "alertdialog",
     "aria-modal": true,
     "aria-labelledby": "vkui--alert--title",
@@ -235,7 +223,7 @@ var Alert = function Alert(_ref2) {
       action: action,
       onItemClick: onItemClick
     });
-  })), canShowCloseButton && (0, _jsxRuntime.createScopedElement)(_ModalDismissButton.ModalDismissButton, {
+  })), isDesktop && (0, _jsxRuntime.createScopedElement)(_ModalDismissButton.ModalDismissButton, {
     onClick: close,
     "aria-label": dismissLabel
   })));

package/dist/cjs/components/Alert/Alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.js","names":["AlertHeader","props","platform","usePlatform","IOS","AlertText","VKCOM","AlertAction","action","onItemClick","restProps","useAdaptivity","viewWidth","handleItemClick","React","useCallback","Component","href","classNames","mode","target","title","ViewWidth","DESKTOP","Alert","actions","actionsLayout","children","className","style","text","header","onClose","dismissLabel","useWaitTransitionFinish","waitTransitionFinish","useState","closing","setClosing","elementRef","useRef","resolvedActionsLayout","canShowCloseButton","SMALL_TABLET","isDesktop","timeout","close","current","e","propertyName","item","autoclose","useScrollLock","stopPropagation","hasReactNode","map","i"],"sources":["../../../../src/components/Alert/Alert.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Tappable } from \"../Tappable/Tappable\";\nimport { PopoutWrapper } from \"../PopoutWrapper/PopoutWrapper\";\nimport { classNames } from \"../../lib/classNames\";\nimport { VKCOM, IOS } from \"../../lib/platform\";\nimport { ViewWidth } from \"../../hoc/withAdaptivity\";\nimport { Button, ButtonProps } from \"../Button/Button\";\nimport { hasReactNode, stopPropagation } from \"../../lib/utils\";\nimport { Title } from \"../Typography/Title/Title\";\nimport { Caption } from \"../Typography/Caption/Caption\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { ModalDismissButton } from \"../ModalDismissButton/ModalDismissButton\";\nimport { FocusTrap } from \"../FocusTrap/FocusTrap\";\nimport { useScrollLock } from \"../AppRoot/ScrollContext\";\nimport { useWaitTransitionFinish } from \"../../hooks/useWaitTransitionFinish\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport \"./Alert.css\";\n\nexport type AlertActionInterface = AlertAction &\n  React.AnchorHTMLAttributes<HTMLElement>;\n\nexport interface AlertAction extends Pick<ButtonProps, \"Component\" | \"href\"> {\n  title: string;\n  action?: VoidFunction;\n  autoclose?: boolean;\n  mode: \"cancel\" | \"destructive\" | \"default\";\n}\n\nexport interface AlertProps extends React.HTMLAttributes<HTMLElement> {\n  actionsLayout?: \"vertical\" | \"horizontal\";\n  actions?: AlertAction[];\n  header?: React.ReactNode;\n  text?: React.ReactNode;\n  onClose?: VoidFunction;\n\n  /**\n   * `aria-label` для кнопки закрытия. Необходим, чтобы кнопка была доступной.\n   */\n  dismissLabel?: string;\n}\n\ntype ItemClickHandler = (item: AlertActionInterface) => void;\n\ninterface AlertTypography {\n  id: string;\n  children?: React.ReactNode;\n}\n\nconst AlertHeader = (props: AlertTypography) => {\n  const platform = usePlatform();\n\n  switch (platform) {\n    case IOS:\n      return (\n        <Title vkuiClass=\"Alert__header\" weight=\"1\" level=\"3\" {...props} />\n      );\n    default:\n      return (\n        <Title vkuiClass=\"Alert__header\" weight=\"2\" level=\"2\" {...props} />\n      );\n  }\n};\n\nconst AlertText = (props: AlertTypography) => {\n  const platform = usePlatform();\n\n  switch (platform) {\n    case VKCOM:\n      return <Caption vkuiClass=\"Alert__text\" {...props} />;\n    case IOS:\n      return <Caption vkuiClass=\"Alert__text\" level=\"2\" {...props} />;\n    default:\n      return (\n        <Text Component=\"span\" vkuiClass=\"Alert__text\" weight=\"3\" {...props} />\n      );\n  }\n};\n\ninterface AlertActionProps {\n  action: AlertActionInterface;\n  onItemClick: ItemClickHandler;\n}\n\nconst AlertAction = ({\n  action,\n  onItemClick,\n  ...restProps\n}: AlertActionProps) => {\n  const platform = usePlatform();\n  const { viewWidth } = useAdaptivity();\n  const handleItemClick = React.useCallback(\n    () => onItemClick(action),\n    [onItemClick, action]\n  );\n\n  if (platform === IOS) {\n    const { Component = \"button\" } = action;\n    return (\n      <Tappable\n        Component={action.href ? \"a\" : Component}\n        vkuiClass={classNames(\"Alert__action\", `Alert__action--${action.mode}`)}\n        onClick={handleItemClick}\n        href={action.href}\n        target={action.target}\n        {...restProps}\n      >\n        {action.title}\n      </Tappable>\n    );\n  }\n\n  let mode: ButtonProps[\"mode\"] = \"tertiary\";\n\n  // TODO v5.0.0 поправить под новую адаптивность\n  if (viewWidth === ViewWidth.DESKTOP && action.mode === \"destructive\") {\n    mode = \"destructive\";\n  }\n\n  if (platform === VKCOM) {\n    mode = action.mode === \"cancel\" ? \"secondary\" : \"primary\";\n  }\n\n  return (\n    <Button\n      vkuiClass={classNames(\"Alert__button\", `Alert__button--${action.mode}`)}\n      mode={mode}\n      size=\"m\"\n      onClick={handleItemClick}\n      Component={action.Component}\n      href={action.href}\n      target={action.target}\n    >\n      {action.title}\n    </Button>\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Alert\n */\nexport const Alert = ({\n  actions = [],\n  actionsLayout = \"horizontal\",\n  children,\n  className,\n  style,\n  text,\n  header,\n  onClose,\n  dismissLabel = \"Закрыть предупреждение\",\n  ...restProps\n}: AlertProps) => {\n  const platform = usePlatform();\n  const { viewWidth } = useAdaptivity();\n  const { waitTransitionFinish } = useWaitTransitionFinish();\n\n  const [closing, setClosing] = React.useState(false);\n\n  const elementRef = React.useRef<HTMLDivElement>(null);\n\n  const resolvedActionsLayout: AlertProps[\"actionsLayout\"] =\n    platform === VKCOM ? \"horizontal\" : actionsLayout;\n  const canShowCloseButton =\n    platform !== IOS && viewWidth >= ViewWidth.SMALL_TABLET;\n  const isDesktop = viewWidth >= ViewWidth.SMALL_TABLET; // TODO v5.0.0 поправить под новую адаптивность\n\n  const timeout = platform === IOS ? 300 : 200;\n\n  const close = React.useCallback(() => {\n    setClosing(true);\n    waitTransitionFinish(\n      elementRef.current,\n      (e?: TransitionEvent) => {\n        if (!e || e.propertyName === \"opacity\") {\n          onClose && onClose();\n        }\n      },\n      timeout\n    );\n  }, [elementRef, waitTransitionFinish, onClose, timeout]);\n\n  const onItemClick: ItemClickHandler = React.useCallback(\n    (item: AlertActionInterface) => {\n      const { action, autoclose } = item;\n\n      if (autoclose) {\n        setClosing(true);\n        waitTransitionFinish(\n          elementRef.current,\n          (e?: TransitionEvent) => {\n            if (!e || e.propertyName === \"opacity\") {\n              onClose && onClose();\n              action && action();\n            }\n          },\n          timeout\n        );\n      } else {\n        action && action();\n      }\n    },\n    [elementRef, waitTransitionFinish, onClose, timeout]\n  );\n\n  useScrollLock();\n\n  return (\n    <PopoutWrapper\n      className={className}\n      closing={closing}\n      style={style}\n      onClick={close}\n    >\n      <FocusTrap\n        {...restProps}\n        getRootRef={elementRef}\n        onClick={stopPropagation}\n        onClose={close}\n        timeout={timeout}\n        vkuiClass={classNames(\n          \"Alert\",\n          platform === IOS && \"Alert--ios\",\n          platform === VKCOM && \"Alert--vkcom\",\n          resolvedActionsLayout === \"vertical\" ? \"Alert--v\" : \"Alert--h\",\n          closing && \"Alert--closing\",\n          isDesktop && \"Alert--desktop\"\n        )}\n        role=\"alertdialog\"\n        aria-modal\n        aria-labelledby=\"vkui--alert--title\"\n        aria-describedby=\"vkui--alert--desc\"\n      >\n        <div vkuiClass=\"Alert__content\">\n          {hasReactNode(header) && (\n            <AlertHeader id=\"vkui--alert--title\">{header}</AlertHeader>\n          )}\n          {hasReactNode(text) && (\n            <AlertText id=\"vkui--alert--desc\">{text}</AlertText>\n          )}\n          {children}\n        </div>\n        <div vkuiClass=\"Alert__actions\">\n          {actions.map((action, i) => (\n            <AlertAction key={i} action={action} onItemClick={onItemClick} />\n          ))}\n        </div>\n        {canShowCloseButton && (\n          <ModalDismissButton onClick={close} aria-label={dismissLabel} />\n        )}\n      </FocusTrap>\n    </PopoutWrapper>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"Alert.js","names":["AlertHeader","props","platform","usePlatform","Platform","IOS","AlertText","VKCOM","AlertAction","action","onItemClick","restProps","handleItemClick","React","useCallback","Component","href","classNames","mode","target","title","Alert","actions","actionsLayout","children","className","style","text","header","onClose","dismissLabel","useAdaptivityWithMediaQueries","isDesktop","useWaitTransitionFinish","waitTransitionFinish","useState","closing","setClosing","elementRef","useRef","resolvedActionsLayout","timeout","close","current","e","propertyName","item","autoClose","useScrollLock","stopPropagation","hasReactNode","map","i"],"sources":["../../../../src/components/Alert/Alert.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Tappable } from \"../Tappable/Tappable\";\nimport { PopoutWrapper } from \"../PopoutWrapper/PopoutWrapper\";\nimport { classNames } from \"../../lib/classNames\";\nimport { Platform } from \"../../lib/platform\";\nimport { Button, ButtonProps } from \"../Button/Button\";\nimport { hasReactNode, stopPropagation } from \"../../lib/utils\";\nimport { Title } from \"../Typography/Title/Title\";\nimport { Caption } from \"../Typography/Caption/Caption\";\nimport { Footnote } from \"../Typography/Footnote/Footnote\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { ModalDismissButton } from \"../ModalDismissButton/ModalDismissButton\";\nimport { FocusTrap } from \"../FocusTrap/FocusTrap\";\nimport { useScrollLock } from \"../AppRoot/ScrollContext\";\nimport { useWaitTransitionFinish } from \"../../hooks/useWaitTransitionFinish\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useAdaptivityWithMediaQueries } from \"../../hooks/useAdaptivityWithMediaQueries\";\nimport \"./Alert.css\";\n\nexport type AlertActionInterface = AlertAction &\n  React.AnchorHTMLAttributes<HTMLElement>;\n\nexport interface AlertAction extends Pick<ButtonProps, \"Component\" | \"href\"> {\n  title: string;\n  action?: VoidFunction;\n  autoClose?: boolean;\n  mode: \"cancel\" | \"destructive\" | \"default\";\n}\n\nexport interface AlertProps extends React.HTMLAttributes<HTMLElement> {\n  actionsLayout?: \"vertical\" | \"horizontal\";\n  actions?: AlertAction[];\n  header?: React.ReactNode;\n  text?: React.ReactNode;\n  onClose?: VoidFunction;\n\n  /**\n   * `aria-label` для кнопки закрытия. Необходим, чтобы кнопка была доступной.\n   */\n  dismissLabel?: string;\n}\n\ntype ItemClickHandler = (item: AlertActionInterface) => void;\n\ninterface AlertTypography {\n  id: string;\n  children?: React.ReactNode;\n}\n\nconst AlertHeader = (props: AlertTypography) => {\n  const platform = usePlatform();\n\n  switch (platform) {\n    case Platform.IOS:\n      return (\n        <Title vkuiClass=\"Alert__header\" weight=\"1\" level=\"3\" {...props} />\n      );\n    default:\n      return (\n        <Title vkuiClass=\"Alert__header\" weight=\"2\" level=\"2\" {...props} />\n      );\n  }\n};\n\nconst AlertText = (props: AlertTypography) => {\n  const platform = usePlatform();\n\n  switch (platform) {\n    case Platform.VKCOM:\n      return <Footnote vkuiClass=\"Alert__text\" {...props} />;\n    case Platform.IOS:\n      return <Caption vkuiClass=\"Alert__text\" {...props} />;\n    default:\n      return (\n        <Text Component=\"span\" vkuiClass=\"Alert__text\" weight=\"3\" {...props} />\n      );\n  }\n};\n\ninterface AlertActionProps {\n  action: AlertActionInterface;\n  onItemClick: ItemClickHandler;\n}\n\nconst AlertAction = ({\n  action,\n  onItemClick,\n  ...restProps\n}: AlertActionProps) => {\n  const platform = usePlatform();\n  const handleItemClick = React.useCallback(\n    () => onItemClick(action),\n    [onItemClick, action]\n  );\n\n  if (platform === Platform.IOS) {\n    const { Component = \"button\" } = action;\n    return (\n      <Tappable\n        Component={action.href ? \"a\" : Component}\n        vkuiClass={classNames(\n          \"Alert__action\",\n          `Alert__action--mode-${action.mode}`\n        )}\n        onClick={handleItemClick}\n        href={action.href}\n        target={action.target}\n        {...restProps}\n      >\n        {action.title}\n      </Tappable>\n    );\n  }\n\n  let mode: ButtonProps[\"mode\"] = \"tertiary\";\n\n  if (platform === Platform.VKCOM) {\n    mode = action.mode === \"cancel\" ? \"secondary\" : \"primary\";\n  }\n\n  return (\n    <Button\n      vkuiClass={classNames(\n        \"Alert__button\",\n        `Alert__button--mode-${action.mode}`\n      )}\n      mode={mode}\n      size=\"m\"\n      onClick={handleItemClick}\n      Component={action.Component}\n      href={action.href}\n      target={action.target}\n    >\n      {action.title}\n    </Button>\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Alert\n */\nexport const Alert = ({\n  actions = [],\n  actionsLayout = \"horizontal\",\n  children,\n  className,\n  style,\n  text,\n  header,\n  onClose,\n  dismissLabel = \"Закрыть предупреждение\",\n  ...restProps\n}: AlertProps) => {\n  const platform = usePlatform();\n  const { isDesktop } = useAdaptivityWithMediaQueries();\n  const { waitTransitionFinish } = useWaitTransitionFinish();\n\n  const [closing, setClosing] = React.useState(false);\n\n  const elementRef = React.useRef<HTMLDivElement>(null);\n\n  const resolvedActionsLayout: AlertProps[\"actionsLayout\"] =\n    platform === Platform.VKCOM ? \"horizontal\" : actionsLayout;\n\n  const timeout = platform === Platform.IOS ? 300 : 200;\n\n  const close = React.useCallback(() => {\n    setClosing(true);\n    waitTransitionFinish(\n      elementRef.current,\n      (e?: TransitionEvent) => {\n        if (!e || e.propertyName === \"opacity\") {\n          onClose && onClose();\n        }\n      },\n      timeout\n    );\n  }, [elementRef, waitTransitionFinish, onClose, timeout]);\n\n  const onItemClick: ItemClickHandler = React.useCallback(\n    (item: AlertActionInterface) => {\n      const { action, autoClose } = item;\n\n      if (autoClose) {\n        setClosing(true);\n        waitTransitionFinish(\n          elementRef.current,\n          (e?: TransitionEvent) => {\n            if (!e || e.propertyName === \"opacity\") {\n              onClose && onClose();\n              action && action();\n            }\n          },\n          timeout\n        );\n      } else {\n        action && action();\n      }\n    },\n    [elementRef, waitTransitionFinish, onClose, timeout]\n  );\n\n  useScrollLock();\n\n  return (\n    <PopoutWrapper\n      className={className}\n      closing={closing}\n      style={style}\n      onClick={close}\n    >\n      <FocusTrap\n        {...restProps}\n        getRootRef={elementRef}\n        onClick={stopPropagation}\n        onClose={close}\n        timeout={timeout}\n        vkuiClass={classNames(\n          \"Alert\",\n          platform === Platform.IOS && \"Alert--ios\",\n          platform === Platform.VKCOM && \"Alert--vkcom\",\n          resolvedActionsLayout === \"vertical\" ? \"Alert--v\" : \"Alert--h\",\n          closing && \"Alert--closing\",\n          isDesktop && \"Alert--desktop\"\n        )}\n        role=\"alertdialog\"\n        aria-modal\n        aria-labelledby=\"vkui--alert--title\"\n        aria-describedby=\"vkui--alert--desc\"\n      >\n        <div vkuiClass=\"Alert__content\">\n          {hasReactNode(header) && (\n            <AlertHeader id=\"vkui--alert--title\">{header}</AlertHeader>\n          )}\n          {hasReactNode(text) && (\n            <AlertText id=\"vkui--alert--desc\">{text}</AlertText>\n          )}\n          {children}\n        </div>\n        <div vkuiClass=\"Alert__actions\">\n          {actions.map((action, i) => (\n            <AlertAction key={i} action={action} onItemClick={onItemClick} />\n          ))}\n        </div>\n        {isDesktop && (\n          <ModalDismissButton onClick={close} aria-label={dismissLabel} />\n        )}\n      </FocusTrap>\n    </PopoutWrapper>\n  );\n};\n"],"mappings":"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"}