@vkontakte/vkui 4.37.0 → 5.0.0

package/dist/cssm/components/AdaptivityProvider/AdaptivityContext.d.ts

@@ -1,20 +1,5 @@
 import * as React from "react";
-export declare enum SizeType {
-    COMPACT = "compact",
-    REGULAR = "regular"
-}
-export declare enum ViewWidth {
-    SMALL_MOBILE = 1,
-    MOBILE = 2,
-    SMALL_TABLET = 3,
-    TABLET = 4,
-    DESKTOP = 5
-}
-export declare enum ViewHeight {
-    EXTRA_SMALL = 1,
-    SMALL = 2,
-    MEDIUM = 3
-}
+import { SizeType, ViewWidth, ViewHeight } from "../../lib/adaptivity";
 export interface SizeProps {
     sizeX?: SizeType;
     sizeY?: SizeType;
@@ -37,10 +22,4 @@ export interface AdaptivityProps extends SizeProps {
      */
     deviceHasHover?: boolean;
 }
-export interface AdaptivityContextInterface extends SizeProps {
-    viewWidth: ViewWidth;
-    viewHeight: ViewHeight;
-    hasMouse: boolean;
-    deviceHasHover: boolean;
-}
-export declare const AdaptivityContext: React.Context<AdaptivityContextInterface>;
+export declare const AdaptivityContext: React.Context<AdaptivityProps>;

package/dist/cssm/components/AdaptivityProvider/AdaptivityContext.js

@@ -1,36 +1,3 @@
 import * as React from "react";
-import { hasHover, hasMouse } from "@vkontakte/vkjs";
-export var SizeType;
-
-(function (SizeType) {
-  SizeType["COMPACT"] = "compact";
-  SizeType["REGULAR"] = "regular";
-})(SizeType || (SizeType = {}));
-
-export var ViewWidth;
-
-(function (ViewWidth) {
-  ViewWidth[ViewWidth["SMALL_MOBILE"] = 1] = "SMALL_MOBILE";
-  ViewWidth[ViewWidth["MOBILE"] = 2] = "MOBILE";
-  ViewWidth[ViewWidth["SMALL_TABLET"] = 3] = "SMALL_TABLET";
-  ViewWidth[ViewWidth["TABLET"] = 4] = "TABLET";
-  ViewWidth[ViewWidth["DESKTOP"] = 5] = "DESKTOP";
-})(ViewWidth || (ViewWidth = {}));
-
-export var ViewHeight;
-
-(function (ViewHeight) {
-  ViewHeight[ViewHeight["EXTRA_SMALL"] = 1] = "EXTRA_SMALL";
-  ViewHeight[ViewHeight["SMALL"] = 2] = "SMALL";
-  ViewHeight[ViewHeight["MEDIUM"] = 3] = "MEDIUM";
-})(ViewHeight || (ViewHeight = {}));
-
-export var AdaptivityContext = /*#__PURE__*/React.createContext({
-  sizeX: SizeType.COMPACT,
-  sizeY: SizeType.REGULAR,
-  hasMouse: hasMouse,
-  deviceHasHover: hasHover,
-  viewWidth: 0,
-  viewHeight: 0
-});
+export var AdaptivityContext = /*#__PURE__*/React.createContext({});
 //# sourceMappingURL=AdaptivityContext.js.map

package/dist/cssm/components/AdaptivityProvider/AdaptivityContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"AdaptivityContext.js","names":["React","hasHover","hasMouse","SizeType","ViewWidth","ViewHeight","AdaptivityContext","createContext","sizeX","COMPACT","sizeY","REGULAR","deviceHasHover","viewWidth","viewHeight"],"sources":["../../../../src/components/AdaptivityProvider/AdaptivityContext.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { hasHover, hasMouse } from \"@vkontakte/vkjs\";\n\nexport enum SizeType {\n  COMPACT = \"compact\",\n  REGULAR = \"regular\",\n}\n\nexport enum ViewWidth {\n  SMALL_MOBILE = 1,\n  MOBILE,\n  SMALL_TABLET,\n  TABLET,\n  DESKTOP,\n}\n\nexport enum ViewHeight {\n  EXTRA_SMALL = 1,\n  SMALL,\n  MEDIUM,\n}\n\nexport interface SizeProps {\n  sizeX?: SizeType;\n  sizeY?: SizeType;\n}\n\nexport interface AdaptivityProps extends SizeProps {\n  /**\n   * @ignore\n   */\n  viewWidth?: ViewWidth;\n  /**\n   * @ignore\n   */\n  viewHeight?: ViewHeight;\n  /**\n   * @ignore\n   */\n  hasMouse?: boolean;\n  /**\n   * @ignore\n   */\n  deviceHasHover?: boolean;\n}\n\nexport interface AdaptivityContextInterface extends SizeProps {\n  viewWidth: ViewWidth;\n  viewHeight: ViewHeight;\n  hasMouse: boolean;\n  deviceHasHover: boolean;\n}\n\nexport const AdaptivityContext =\n  React.createContext<AdaptivityContextInterface>({\n    sizeX: SizeType.COMPACT,\n    sizeY: SizeType.REGULAR,\n    hasMouse,\n    deviceHasHover: hasHover,\n    viewWidth: 0,\n    viewHeight: 0,\n  });\n"],"mappings":"AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,QAAT,EAAmBC,QAAnB,QAAmC,iBAAnC;AAEA,WAAYC,QAAZ;;WAAYA,Q;EAAAA,Q;EAAAA,Q;GAAAA,Q,KAAAA,Q;;AAKZ,WAAYC,SAAZ;;WAAYA,S;EAAAA,S,CAAAA,S;EAAAA,S,CAAAA,S;EAAAA,S,CAAAA,S;EAAAA,S,CAAAA,S;EAAAA,S,CAAAA,S;GAAAA,S,KAAAA,S;;AAQZ,WAAYC,UAAZ;;WAAYA,U;EAAAA,U,CAAAA,U;EAAAA,U,CAAAA,U;EAAAA,U,CAAAA,U;GAAAA,U,KAAAA,U;;AAqCZ,OAAO,IAAMC,iBAAiB,gBAC5BN,KAAK,CAACO,aAAN,CAAgD;EAC9CC,KAAK,EAAEL,QAAQ,CAACM,OAD8B;EAE9CC,KAAK,EAAEP,QAAQ,CAACQ,OAF8B;EAG9CT,QAAQ,EAARA,QAH8C;EAI9CU,cAAc,EAAEX,QAJ8B;EAK9CY,SAAS,EAAE,CALmC;EAM9CC,UAAU,EAAE;AANkC,CAAhD,CADK"}
+{"version":3,"file":"AdaptivityContext.js","names":["React","AdaptivityContext","createContext"],"sources":["../../../../src/components/AdaptivityProvider/AdaptivityContext.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { SizeType, ViewWidth, ViewHeight } from \"../../lib/adaptivity\";\n\nexport interface SizeProps {\n  sizeX?: SizeType;\n  sizeY?: SizeType;\n}\n\nexport interface AdaptivityProps extends SizeProps {\n  /**\n   * @ignore\n   */\n  viewWidth?: ViewWidth;\n  /**\n   * @ignore\n   */\n  viewHeight?: ViewHeight;\n  /**\n   * @ignore\n   */\n  hasMouse?: boolean;\n  /**\n   * @ignore\n   */\n  deviceHasHover?: boolean;\n}\n\nexport const AdaptivityContext = React.createContext<AdaptivityProps>({});\n"],"mappings":"AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AA2BA,OAAO,IAAMC,iBAAiB,gBAAGD,KAAK,CAACE,aAAN,CAAqC,EAArC,CAA1B"}

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

@@ -1,15 +1,9 @@
 import * as React from "react";
-import { AdaptivityProps } from "./AdaptivityContext";
-export declare const DESKTOP_SIZE = 1280;
-export declare const TABLET_SIZE = 1024;
-export declare const SMALL_TABLET_SIZE = 768;
-export declare const MOBILE_SIZE = 320;
-export declare const MOBILE_LANDSCAPE_HEIGHT = 414;
-export declare const MEDIUM_HEIGHT = 720;
+import { type AdaptivityProps } from "./AdaptivityContext";
 export interface AdaptivityProviderProps extends AdaptivityProps {
     children?: React.ReactNode;
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/AdaptivityProvider
  */
-export declare const AdaptivityProvider: (props: AdaptivityProviderProps) => JSX.Element;
+export declare const AdaptivityProvider: ({ viewWidth, viewHeight, sizeX, sizeY, hasMouse, deviceHasHover, children, }: React.PropsWithChildren<AdaptivityProps>) => JSX.Element;

package/dist/cssm/components/AdaptivityProvider/AdaptivityProvider.js

@@ -1,130 +1,95 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import { createScopedElement } from "../../lib/jsxRuntime";
 import * as React from "react";
-import { hasMouse as _hasMouse, hasHover as _hasHover } from "@vkontakte/vkjs";
-import { AdaptivityContext, SizeType, ViewHeight, ViewWidth } from "./AdaptivityContext";
-import { useDOM } from "../../lib/dom";
+import { hasMouse as _hasMouse } from "@vkontakte/vkjs";
+import { SizeType, ViewWidth, ViewHeight, BREAKPOINTS } from "../../lib/adaptivity";
 import { useBridgeAdaptivity } from "../../hooks/useBridgeAdaptivity";
-export var DESKTOP_SIZE = 1280;
-export var TABLET_SIZE = 1024;
-export var SMALL_TABLET_SIZE = 768;
-export var MOBILE_SIZE = 320;
-export var MOBILE_LANDSCAPE_HEIGHT = 414;
-export var MEDIUM_HEIGHT = 720;
+import { AdaptivityContext } from "./AdaptivityContext";
 
 /**
  * @see https://vkcom.github.io/VKUI/#/AdaptivityProvider
  */
-export var AdaptivityProvider = function AdaptivityProvider(props) {
-  var adaptivityRef = React.useRef(null);
-
-  var _React$useState = React.useState({}),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      updateAdaptivity = _React$useState2[1];
-
+export 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 = useBridgeAdaptivity();
 
-  var _useDOM = 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 = _slicedToArray(_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 createScopedElement(AdaptivityContext.Provider, {
-    value: adaptivityRef.current
-  }, props.children);
+    value: adaptivity
+  }, children);
 };
 
-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 = ViewWidth.SMALL_MOBILE;
-  var viewHeight = ViewHeight.SMALL;
-  var sizeY = SizeType.REGULAR;
-  var sizeX = SizeType.REGULAR;
-  var hasMouse = _hasMouse;
-  var deviceHasHover = _hasHover;
-
-  if (windowWidth >= DESKTOP_SIZE) {
-    viewWidth = ViewWidth.DESKTOP;
-  } else if (windowWidth >= TABLET_SIZE) {
-    viewWidth = ViewWidth.TABLET;
-  } else if (windowWidth >= SMALL_TABLET_SIZE) {
-    viewWidth = ViewWidth.SMALL_TABLET;
-  } else if (windowWidth >= MOBILE_SIZE) {
-    viewWidth = ViewWidth.MOBILE;
-  } else {
-    viewWidth = ViewWidth.SMALL_MOBILE;
-  }
-
-  if (windowHeight >= MEDIUM_HEIGHT) {
-    viewHeight = ViewHeight.MEDIUM;
-  } else if (windowHeight > MOBILE_LANDSCAPE_HEIGHT) {
-    viewHeight = ViewHeight.SMALL;
-  } else {
-    viewHeight = 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 <= ViewWidth.MOBILE) {
-    sizeX = SizeType.COMPACT;
-  }
+    var viewportWidth = bridge.viewportWidth,
+        viewportHeight = bridge.viewportHeight;
+
+    if (viewportWidth >= BREAKPOINTS.DESKTOP) {
+      viewWidth = ViewWidth.DESKTOP;
+    } else if (viewportWidth >= BREAKPOINTS.TABLET) {
+      viewWidth = ViewWidth.TABLET;
+    } else if (viewportWidth >= BREAKPOINTS.SMALL_TABLET) {
+      viewWidth = ViewWidth.SMALL_TABLET;
+    } else if (viewportWidth >= BREAKPOINTS.MOBILE) {
+      viewWidth = ViewWidth.MOBILE;
+    } else {
+      viewWidth = ViewWidth.SMALL_MOBILE;
+    }
 
-  if (viewWidth >= ViewWidth.SMALL_TABLET && hasMouse || viewHeight <= ViewHeight.EXTRA_SMALL) {
-    sizeY = SizeType.COMPACT;
-  }
+    if (viewportHeight >= BREAKPOINTS.MEDIUM_HEIGHT) {
+      viewHeight = ViewHeight.MEDIUM;
+    } else if (viewportHeight > BREAKPOINTS.MOBILE_LANDSCAPE_HEIGHT) {
+      viewHeight = ViewHeight.SMALL;
+    } else {
+      viewHeight = ViewHeight.EXTRA_SMALL;
+    }
 
-  if (!bridge.type) {
-    props.sizeX && (sizeX = props.sizeX);
-    props.sizeY && (sizeY = props.sizeY);
-  }
+    if (viewWidth <= ViewWidth.MOBILE) {
+      sizeX = SizeType.COMPACT;
+    } else {
+      sizeX = SizeType.REGULAR;
+    }
 
-  if (bridge.type === "force_mobile" || bridge.type === "force_mobile_compact") {
+    if (viewWidth >= ViewWidth.SMALL_TABLET && _hasMouse || viewHeight <= ViewHeight.EXTRA_SMALL) {
+      sizeY = SizeType.COMPACT;
+    } else {
+      sizeY = SizeType.REGULAR;
+    }
+  } else if (bridge.type === "force_mobile" || bridge.type === "force_mobile_compact") {
     viewWidth = ViewWidth.MOBILE;
     sizeX = SizeType.COMPACT;
 
@@ -133,6 +98,22 @@ function calculateAdaptivity(props, bridge, window) {
     } else {
       sizeY = SizeType.REGULAR;
     }
+  } else {
+    if (sizeX === undefined && viewWidth !== undefined) {
+      if (viewWidth <= ViewWidth.MOBILE) {
+        sizeX = SizeType.COMPACT;
+      } else {
+        sizeX = SizeType.REGULAR;
+      }
+    }
+
+    if (sizeY === undefined && viewWidth !== undefined && viewHeight !== undefined) {
+      if (viewWidth >= ViewWidth.SMALL_TABLET && _hasMouse || viewHeight <= ViewHeight.EXTRA_SMALL) {
+        sizeY = SizeType.COMPACT;
+      } else {
+        sizeY = SizeType.REGULAR;
+      }
+    }
   }
 
   return {

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

@@ -1 +1 @@
-{"version":3,"file":"AdaptivityProvider.js","names":["React","hasMouse","_hasMouse","hasHover","_hasHover","AdaptivityContext","SizeType","ViewHeight","ViewWidth","useDOM","useBridgeAdaptivity","DESKTOP_SIZE","TABLET_SIZE","SMALL_TABLET_SIZE","MOBILE_SIZE","MOBILE_LANDSCAPE_HEIGHT","MEDIUM_HEIGHT","AdaptivityProvider","props","adaptivityRef","useRef","useState","updateAdaptivity","bridge","window","current","calculateAdaptivity","useEffect","onResize","calculated","viewWidth","viewHeight","sizeX","sizeY","deviceHasHover","addEventListener","removeEventListener","children","windowWidth","windowHeight","type","viewportWidth","viewportHeight","innerWidth","innerHeight","SMALL_MOBILE","SMALL","REGULAR","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":["React","hasMouse","_hasMouse","SizeType","ViewWidth","ViewHeight","BREAKPOINTS","useBridgeAdaptivity","AdaptivityContext","AdaptivityProvider","viewWidth","viewHeight","sizeX","sizeY","deviceHasHover","children","bridge","useState","adaptivity","setAdaptivity","useEffect","calculateAdaptivity","type","viewportWidth","viewportHeight","DESKTOP","TABLET","SMALL_TABLET","MOBILE","SMALL_MOBILE","MEDIUM_HEIGHT","MEDIUM","MOBILE_LANDSCAPE_HEIGHT","SMALL","EXTRA_SMALL","COMPACT","REGULAR","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/cssm/components/Alert/Alert.css

@@ -1,7 +1 @@
-.vkuiAlert{-webkit-animation:vkui-animation-android-alert-intro .2s cubic-bezier(.4,0,.2,1);animation:vkui-animation-android-alert-intro .2s cubic-bezier(.4,0,.2,1);-webkit-animation:vkui-animation-android-alert-intro .2s var(--android-easing);animation:vkui-animation-android-alert-intro .2s var(--android-easing);border-radius:12px;border-radius:var(--vkui--size_border_radius_paper--regular,12px);box-shadow:0 0 8px rgba(0,0,0,.12),0 16px 16px rgba(0,0,0,.16);box-shadow:var(--vkui--elevation4,0 0 8px rgba(0,0,0,.12),0 16px 16px rgba(0,0,0,.16));color:#000;color:var(--text_primary,var(--vkui--color_text_primary));margin:auto 24px;max-width:416px;min-width:280px;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vkuiAlert--desktop{width:100%}.vkuiAlert--closing{opacity:0;-webkit-transform:scale(.95);transform:scale(.95);transition:opacity .2s cubic-bezier(.4,0,.2,1),-webkit-transform .2s cubic-bezier(.4,0,.2,1);transition:transform .2s cubic-bezier(.4,0,.2,1),opacity .2s cubic-bezier(.4,0,.2,1);transition:transform .2s cubic-bezier(.4,0,.2,1),opacity .2s cubic-bezier(.4,0,.2,1),-webkit-transform .2s cubic-bezier(.4,0,.2,1);transition:opacity .2s var(--android-easing),-webkit-transform .2s var(--android-easing);transition:transform .2s var(--android-easing),opacity .2s var(--android-easing);transition:transform .2s var(--android-easing),opacity .2s var(--android-easing),-webkit-transform .2s var(--android-easing)}.vkuiAlert:before{background-color:#fff;background-color:var(
-    --modal_card_background,var(--vkui--color_background_modal)
-  );border-radius:inherit;content:"";height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.vkuiAlert__content{padding:24px 24px 20px;position:relative;z-index:2}.vkuiAlert__action{background:transparent;white-space:nowrap}.vkuiAlert__actions{display:flex;max-width:100%;padding:0 16px 16px;position:relative;z-index:2}.vkuiAlert__header{margin-bottom:8px}.vkuiAlert__text{color:#818c99;color:var(--text_secondary,var(--vkui--color_text_secondary))}.vkuiAlert--h .vkuiAlert__actions{justify-content:flex-end}.vkuiAlert--h .vkuiAlert__button{margin-left:8px}.vkuiAlert--v .vkuiAlert__actions{align-items:flex-end;flex-direction:column}.vkuiAlert--v .vkuiAlert__button{margin-bottom:4px;margin-top:4px}.vkuiAlert--v .vkuiAlert__button:first-child{margin-top:0}.vkuiAlert--v .vkuiAlert__button:last-child{margin-bottom:0}.vkuiAlert--ios{-webkit-animation:vkui-animation-ios-alert-intro .3s cubic-bezier(.36,.66,.04,1);animation:vkui-animation-ios-alert-intro .3s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-animation-ios-alert-intro .3s var(--ios-easing);animation:vkui-animation-ios-alert-intro .3s var(--ios-easing);box-shadow:none;min-width:270px;overflow:hidden;width:270px}.vkuiAlert--ios.vkuiAlert--closing{opacity:0;-webkit-transform:none;transform:none;transition:opacity .3s cubic-bezier(.36,.66,.04,1);transition:opacity .3s var(--ios-easing)}.vkuiAlert--ios .vkuiAlert__content{padding:19px 16px 20px;text-align:center}.vkuiAlert--ios .vkuiAlert__header:not(:last-child){margin-bottom:7px}.vkuiAlert--ios .vkuiAlert__text{color:inherit}.vkuiAlert--ios .vkuiAlert__content:after{background:rgba(0,0,0,.12);background:var(
-    --action_sheet_separator,var(--vkui--color_separator_primary_alpha)
-  );bottom:0;content:"";height:1px;left:0;position:absolute;right:0;-webkit-transform-origin:center bottom;transform-origin:center bottom}.vkuiAlert--ios .vkuiAlert__actions{padding:initial}.vkuiAlert--ios.vkuiAlert--v .vkuiAlert__actions{align-items:normal;flex-direction:column}.vkuiAlert--ios .vkuiAlert__action{border:0;border-radius:0;color:#2688eb;color:var(--accent,var(--vkui--color_text_accent));display:block;font-size:17px;height:44px;line-height:44px;margin:0;overflow:hidden;padding:0 6px;position:relative;text-align:center;text-decoration:none;text-overflow:ellipsis}.vkuiAlert--ios .vkuiAlert__action:active{z-index:1}.vkuiAlert--ios .vkuiAlert__action:after{background:rgba(0,0,0,.12);background:var(
-    --action_sheet_separator,var(--vkui--color_separator_primary_alpha)
-  );content:"";position:absolute}.vkuiAlert--ios.vkuiAlert--h .vkuiAlert__action:after{height:100%;right:0;top:0;-webkit-transform-origin:right center;transform-origin:right center;width:1px}.vkuiAlert--ios.vkuiAlert--h .vkuiAlert__action:last-child:after{content:none}.vkuiAlert--ios.vkuiAlert--h .vkuiAlert__action{flex-basis:0;flex-grow:1;flex-shrink:1}.vkuiAlert--ios.vkuiAlert--h .vkuiAlert__action:first-child{border-bottom-left-radius:12px}.vkuiAlert--ios.vkuiAlert--h .vkuiAlert__action:last-child{border-bottom-right-radius:12px}.vkuiAlert--ios.vkuiAlert--v .vkuiAlert__action:after{bottom:0;height:1px;left:0;-webkit-transform-origin:center bottom;transform-origin:center bottom;width:100%}.vkuiAlert--ios.vkuiAlert--v .vkuiAlert__action:last-child:after{content:none}.vkuiAlert--ios.vkuiAlert--v .vkuiAlert__action:last-child{border-radius:0 0 12px 12px}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:2dppx){.vkuiAlert--ios .vkuiAlert__content:after,.vkuiAlert--ios.vkuiAlert--v .vkuiAlert__action:after{-webkit-transform:scaleY(.5);transform:scaleY(.5)}.vkuiAlert--ios.vkuiAlert--h .vkuiAlert__action:after{-webkit-transform:scaleX(.5);transform:scaleX(.5)}}@media (-webkit-min-device-pixel-ratio:3),(min-resolution:3dppx){.vkuiAlert--ios .vkuiAlert__content:after,.vkuiAlert--ios.vkuiAlert--v .vkuiAlert__action:after{-webkit-transform:scaleY(.33);transform:scaleY(.33)}.vkuiAlert--ios.vkuiAlert--h .vkuiAlert__action:after{-webkit-transform:scaleX(.33);transform:scaleX(.33)}}.vkuiAlert--ios .vkuiAlert__action--cancel{font-weight:600}.vkuiAlert--ios .vkuiAlert__action--destructive{color:#e64646;color:var(--destructive,var(--vkui--color_text_negative))}.vkuiAlert--vkcom{box-shadow:0 0 2px rgba(0,0,0,.12),0 0 96px rgba(0,0,0,.16);width:400px}.vkuiAlert--vkcom .vkuiAlert__content{padding:24px}.vkuiAlert--vkcom .vkuiAlert__actions{padding:0 24px 16px}.vkuiAlert--vkcom .vkuiAlert__button{order:2}.vkuiAlert--vkcom .vkuiAlert__button--cancel{order:1}@-webkit-keyframes vkui-animation-ios-alert-intro{0%{opacity:0;-webkit-transform:scale(1.05);transform:scale(1.05)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes vkui-animation-ios-alert-intro{0%{opacity:0;-webkit-transform:scale(1.05);transform:scale(1.05)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes vkui-animation-android-alert-intro{0%{opacity:0;-webkit-transform:scale(.95);transform:scale(.95)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes vkui-animation-android-alert-intro{0%{opacity:0;-webkit-transform:scale(.95);transform:scale(.95)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}
+.vkuiAlert{animation:vkui-animation-android-alert-intro .2s cubic-bezier(.4,0,.2,1);animation:vkui-animation-android-alert-intro .2s var(--android-easing);border-radius:var(--vkui--size_border_radius_paper--regular);box-shadow:var(--vkui--elevation4);color:var(--vkui--color_text_primary);margin:auto 24px;max-width:416px;min-width:280px;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vkuiAlert--desktop{width:100%}.vkuiAlert--closing{opacity:0;transform:scale(.95);transition:transform .2s cubic-bezier(.4,0,.2,1),opacity .2s cubic-bezier(.4,0,.2,1);transition:transform .2s var(--android-easing),opacity .2s var(--android-easing)}.vkuiAlert:before{background-color:var(--vkui--color_background_modal);border-radius:inherit;content:"";height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.vkuiAlert__content{padding:24px 24px 20px;position:relative;z-index:2}.vkuiAlert__action{background:transparent;white-space:nowrap}.vkuiAlert__actions{display:flex;max-width:100%;padding:0 16px 16px;position:relative;z-index:2}.vkuiAlert__header{margin-bottom:8px}.vkuiAlert__text{color:var(--vkui--color_text_secondary)}.vkuiAlert--h .vkuiAlert__actions{justify-content:flex-end}.vkuiAlert--h .vkuiAlert__button{margin-left:8px}.vkuiAlert--v .vkuiAlert__actions{align-items:flex-end;flex-direction:column}.vkuiAlert--v .vkuiAlert__button{margin-bottom:4px;margin-top:4px}.vkuiAlert--v .vkuiAlert__button:first-child{margin-top:0}.vkuiAlert--v .vkuiAlert__button:last-child{margin-bottom:0}.vkuiAlert--ios{animation:vkui-animation-ios-alert-intro .3s cubic-bezier(.36,.66,.04,1);animation:vkui-animation-ios-alert-intro .3s var(--ios-easing);box-shadow:none;min-width:270px;overflow:hidden;width:270px}.vkuiAlert--ios.vkuiAlert--closing{opacity:0;transform:none;transition:opacity .3s cubic-bezier(.36,.66,.04,1);transition:opacity .3s var(--ios-easing)}.vkuiAlert--ios .vkuiAlert__content{padding:19px 16px 20px;text-align:center}.vkuiAlert--ios .vkuiAlert__header:not(:last-child){margin-bottom:7px}.vkuiAlert--ios .vkuiAlert__text{color:inherit}.vkuiAlert--ios .vkuiAlert__content:after{background:var(--vkui--color_separator_primary_alpha);bottom:0;content:"";height:1px;left:0;position:absolute;right:0;transform-origin:center bottom}.vkuiAlert--ios .vkuiAlert__actions{padding:initial}.vkuiAlert--ios.vkuiAlert--v .vkuiAlert__actions{align-items:normal;flex-direction:column}.vkuiAlert--ios .vkuiAlert__action{border:0;border-radius:0;color:var(--vkui--color_text_accent);display:block;font-size:17px;height:44px;line-height:44px;margin:0;overflow:hidden;padding:0 6px;position:relative;text-align:center;text-decoration:none;text-overflow:ellipsis}.vkuiAlert--ios .vkuiAlert__action:active{z-index:1}.vkuiAlert--ios .vkuiAlert__action:after{background:var(--vkui--color_separator_primary_alpha);content:"";position:absolute}.vkuiAlert--ios.vkuiAlert--h .vkuiAlert__action:after{height:100%;right:0;top:0;transform-origin:right center;width:1px}.vkuiAlert--ios.vkuiAlert--h .vkuiAlert__action:last-child:after{content:none}.vkuiAlert--ios.vkuiAlert--h .vkuiAlert__action{flex-basis:0;flex-grow:1;flex-shrink:1}.vkuiAlert--ios.vkuiAlert--h .vkuiAlert__action:first-child{border-bottom-left-radius:12px}.vkuiAlert--ios.vkuiAlert--h .vkuiAlert__action:last-child{border-bottom-right-radius:12px}.vkuiAlert--ios.vkuiAlert--v .vkuiAlert__action:after{bottom:0;height:1px;left:0;transform-origin:center bottom;width:100%}.vkuiAlert--ios.vkuiAlert--v .vkuiAlert__action:last-child:after{content:none}.vkuiAlert--ios.vkuiAlert--v .vkuiAlert__action:last-child{border-radius:0 0 12px 12px}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:2dppx){.vkuiAlert--ios .vkuiAlert__content:after,.vkuiAlert--ios.vkuiAlert--v .vkuiAlert__action:after{transform:scaleY(.5)}.vkuiAlert--ios.vkuiAlert--h .vkuiAlert__action:after{transform:scaleX(.5)}}@media (-webkit-min-device-pixel-ratio:3),(min-resolution:3dppx){.vkuiAlert--ios .vkuiAlert__content:after,.vkuiAlert--ios.vkuiAlert--v .vkuiAlert__action:after{transform:scaleY(.33)}.vkuiAlert--ios.vkuiAlert--h .vkuiAlert__action:after{transform:scaleX(.33)}}.vkuiAlert--ios .vkuiAlert__action--mode-cancel{font-weight:600}.vkuiAlert--ios .vkuiAlert__action--mode-destructive{color:var(--vkui--color_text_negative)}.vkuiAlert--vkcom{box-shadow:0 0 2px rgba(0,0,0,.12),0 0 96px rgba(0,0,0,.16);width:400px}.vkuiAlert--vkcom .vkuiAlert__content{padding:24px}.vkuiAlert--vkcom .vkuiAlert__actions{padding:0 24px 16px}.vkuiAlert--vkcom .vkuiAlert__button{order:2}.vkuiAlert--vkcom .vkuiAlert__button--mode-cancel{order:1}@keyframes vkui-animation-ios-alert-intro{0%{opacity:0;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}@keyframes vkui-animation-android-alert-intro{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}

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

@@ -5,7 +5,7 @@ export declare type AlertActionInterface = AlertAction & React.AnchorHTMLAttribu
 export interface AlertAction extends Pick<ButtonProps, "Component" | "href"> {
     title: string;
     action?: VoidFunction;
-    autoclose?: boolean;
+    autoClose?: boolean;
     mode: "cancel" | "destructive" | "default";
 }
 export interface AlertProps extends React.HTMLAttributes<HTMLElement> {

package/dist/cssm/components/Alert/Alert.js

@@ -8,26 +8,26 @@ import * as React from "react";
 import { Tappable } from "../Tappable/Tappable";
 import { PopoutWrapper } from "../PopoutWrapper/PopoutWrapper";
 import { classNames } from "../../lib/classNames";
-import { VKCOM, IOS } from "../../lib/platform";
-import { ViewWidth } from "../../hoc/withAdaptivity";
+import { Platform } from "../../lib/platform";
 import { Button } from "../Button/Button";
 import { hasReactNode, stopPropagation } from "../../lib/utils";
 import { Title } from "../Typography/Title/Title";
 import { Caption } from "../Typography/Caption/Caption";
+import { Footnote } from "../Typography/Footnote/Footnote";
 import { Text } from "../Typography/Text/Text";
 import { ModalDismissButton } from "../ModalDismissButton/ModalDismissButton";
 import { FocusTrap } from "../FocusTrap/FocusTrap";
 import { useScrollLock } from "../AppRoot/ScrollContext";
 import { useWaitTransitionFinish } from "../../hooks/useWaitTransitionFinish";
 import { usePlatform } from "../../hooks/usePlatform";
-import { useAdaptivity } from "../../hooks/useAdaptivity";
+import { useAdaptivityWithMediaQueries } from "../../hooks/useAdaptivityWithMediaQueries";
 import "./Alert.css";
 
 var AlertHeader = function AlertHeader(props) {
   var platform = usePlatform();
 
   switch (platform) {
-    case IOS:
+    case Platform.IOS:
       return createScopedElement(Title, _extends({
         vkuiClass: "Alert__header",
         weight: "1",
@@ -47,15 +47,14 @@ var AlertText = function AlertText(props) {
   var platform = usePlatform();
 
   switch (platform) {
-    case VKCOM:
-      return createScopedElement(Caption, _extends({
+    case Platform.VKCOM:
+      return createScopedElement(Footnote, _extends({
         vkuiClass: "Alert__text"
       }, props));
 
-    case IOS:
+    case Platform.IOS:
       return createScopedElement(Caption, _extends({
-        vkuiClass: "Alert__text",
-        level: "2"
+        vkuiClass: "Alert__text"
       }, props));
 
     default:
@@ -73,38 +72,30 @@ var AlertAction = function AlertAction(_ref) {
       restProps = _objectWithoutProperties(_ref, _excluded);
 
   var platform = usePlatform();
-
-  var _useAdaptivity = useAdaptivity(),
-      viewWidth = _useAdaptivity.viewWidth;
-
   var handleItemClick = React.useCallback(function () {
     return onItemClick(action);
   }, [onItemClick, action]);
 
-  if (platform === IOS) {
+  if (platform === Platform.IOS) {
     var _action$Component = action.Component,
         Component = _action$Component === void 0 ? "button" : _action$Component;
     return createScopedElement(Tappable, _extends({
       Component: action.href ? "a" : Component,
-      vkuiClass: classNames("Alert__action", "Alert__action--".concat(action.mode)),
+      vkuiClass: 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 поправить под новую адаптивность
-
-  if (viewWidth === ViewWidth.DESKTOP && action.mode === "destructive") {
-    mode = "destructive";
-  }
+  var mode = "tertiary";
 
-  if (platform === VKCOM) {
+  if (platform === Platform.VKCOM) {
     mode = action.mode === "cancel" ? "secondary" : "primary";
   }
 
   return createScopedElement(Button, {
-    vkuiClass: classNames("Alert__button", "Alert__button--".concat(action.mode)),
+    vkuiClass: classNames("Alert__button", "Alert__button--mode-".concat(action.mode)),
     mode: mode,
     size: "m",
     onClick: handleItemClick,
@@ -135,8 +126,8 @@ export var Alert = function Alert(_ref2) {
 
   var platform = usePlatform();
 
-  var _useAdaptivity2 = useAdaptivity(),
-      viewWidth = _useAdaptivity2.viewWidth;
+  var _useAdaptivityWithMed = useAdaptivityWithMediaQueries(),
+      isDesktop = _useAdaptivityWithMed.isDesktop;
 
   var _useWaitTransitionFin = useWaitTransitionFinish(),
       waitTransitionFinish = _useWaitTransitionFin.waitTransitionFinish;
@@ -147,11 +138,8 @@ export var Alert = function Alert(_ref2) {
       setClosing = _React$useState2[1];
 
   var elementRef = React.useRef(null);
-  var resolvedActionsLayout = platform === VKCOM ? "horizontal" : actionsLayout;
-  var canShowCloseButton = platform !== IOS && viewWidth >= ViewWidth.SMALL_TABLET;
-  var isDesktop = viewWidth >= ViewWidth.SMALL_TABLET; // TODO v5.0.0 поправить под новую адаптивность
-
-  var timeout = platform === IOS ? 300 : 200;
+  var resolvedActionsLayout = platform === Platform.VKCOM ? "horizontal" : actionsLayout;
+  var timeout = platform === Platform.IOS ? 300 : 200;
   var close = React.useCallback(function () {
     setClosing(true);
     waitTransitionFinish(elementRef.current, function (e) {
@@ -162,9 +150,9 @@ export 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") {
@@ -187,7 +175,7 @@ export var Alert = function Alert(_ref2) {
     onClick: stopPropagation,
     onClose: close,
     timeout: timeout,
-    vkuiClass: classNames("Alert", platform === IOS && "Alert--ios", platform === VKCOM && "Alert--vkcom", resolvedActionsLayout === "vertical" ? "Alert--v" : "Alert--h", closing && "Alert--closing", isDesktop && "Alert--desktop"),
+    vkuiClass: classNames("Alert", platform === Platform.IOS && "Alert--ios", 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",
@@ -206,7 +194,7 @@ export var Alert = function Alert(_ref2) {
       action: action,
       onItemClick: onItemClick
     });
-  })), canShowCloseButton && createScopedElement(ModalDismissButton, {
+  })), isDesktop && createScopedElement(ModalDismissButton, {
     onClick: close,
     "aria-label": dismissLabel
   })));