@vkontakte/vkui 5.0.0 → 5.0.1

package/dist/cjs/hooks/useAdaptivityHasHover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAdaptivityHasHover.js","names":["useAdaptivityHasHover","deferDetect","React","useContext","AdaptivityContext","hasHoverContext","hasHover","useState","undefined","hasHoverLib","setHasHover","useEffect","prevHasHover","newHasHover"],"sources":["../../../src/hooks/useAdaptivityHasHover.ts"],"sourcesContent":["import * as React from \"react\";\nimport { hasHover as hasHoverLib } from \"@vkontakte/vkjs\";\nimport { AdaptivityContext } from \"../components/AdaptivityProvider/AdaptivityContext\";\n\n/**\n * Определение происходит с помощью `window.matchMedia`. Для того, чтобы не было ошибок при гидратации, по умолчанию\n * откладываем определение на второй рендер.\n *\n * [No SSR] Если передать `false`, то определение будет сразу.\n */\nexport function useAdaptivityHasHover(deferDetect?: true): undefined | boolean;\nexport function useAdaptivityHasHover(deferDetect?: false): boolean;\nexport function useAdaptivityHasHover(deferDetect = true): undefined | boolean {\n  const { hasHover: hasHoverContext } = React.useContext(AdaptivityContext);\n  const [hasHover, setHasHover] = React.useState(() =>\n    !deferDetect && hasHoverContext === undefined\n      ? hasHoverLib\n      : hasHoverContext\n  );\n\n  React.useEffect(() => {\n    setHasHover((prevHasHover) => {\n      const newHasHover =\n        hasHoverContext === undefined ? hasHoverLib : hasHoverContext;\n      return prevHasHover === newHasHover ? prevHasHover : newHasHover;\n    });\n  }, [hasHoverContext]);\n\n  return hasHover;\n}\n"],"mappings":";;;;;;;;;AAAA;AACA;AACA;AAUO,SAASA,qBAAqB,GAA0C;EAAA,IAAzCC,WAAW,uEAAG,IAAI;EACtD,wBAAsCC,KAAK,CAACC,UAAU,CAACC,oCAAiB,CAAC;IAAvDC,eAAe,qBAAzBC,QAAQ;EAChB,sBAAgCJ,KAAK,CAACK,QAAQ,CAAC;MAAA,OAC7C,CAACN,WAAW,IAAII,eAAe,KAAKG,SAAS,GACzCC,cAAW,GACXJ,eAAe;IAAA,EACpB;IAAA;IAJMC,QAAQ;IAAEI,WAAW;EAM5BR,KAAK,CAACS,SAAS,CAAC,YAAM;IACpBD,WAAW,CAAC,UAACE,YAAY,EAAK;MAC5B,IAAMC,WAAW,GACfR,eAAe,KAAKG,SAAS,GAAGC,cAAW,GAAGJ,eAAe;MAC/D,OAAOO,YAAY,KAAKC,WAAW,GAAGD,YAAY,GAAGC,WAAW;IAClE,CAAC,CAAC;EACJ,CAAC,EAAE,CAACR,eAAe,CAAC,CAAC;EAErB,OAAOC,QAAQ;AACjB"}

package/dist/cjs/hooks/useAdaptivityHasPointer.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Определение происходит с помощью `window.matchMedia`. Для того, чтобы не было ошибок при гидратации, по умолчанию
+ * откладываем определение на второй рендер.
+ *
+ * [No SSR] Если передать `false`, то определение будет сразу.
+ */
+export declare function useAdaptivityHasPointer(deferDetect?: true): undefined | boolean;
+export declare function useAdaptivityHasPointer(deferDetect?: false): boolean;

package/dist/cjs/hooks/useAdaptivityHasPointer.js

@@ -0,0 +1,31 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useAdaptivityHasPointer = useAdaptivityHasPointer;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var React = _interopRequireWildcard(require("react"));
+var _vkjs = require("@vkontakte/vkjs");
+var _AdaptivityContext = require("../components/AdaptivityProvider/AdaptivityContext");
+function useAdaptivityHasPointer() {
+  var deferDetect = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+  var _React$useContext = React.useContext(_AdaptivityContext.AdaptivityContext),
+    hasPointerContext = _React$useContext.hasPointer;
+  var _React$useState = React.useState(function () {
+      return !deferDetect && hasPointerContext === undefined ? _vkjs.hasMouse : hasPointerContext;
+    }),
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    hasPointer = _React$useState2[0],
+    setHasPointer = _React$useState2[1];
+  React.useEffect(function () {
+    setHasPointer(function (prevHasPointer) {
+      var newHasHover = hasPointerContext === undefined ? _vkjs.hasMouse : hasPointerContext;
+      return prevHasPointer === newHasHover ? prevHasPointer : newHasHover;
+    });
+  }, [hasPointerContext]);
+  return hasPointer;
+}
+//# sourceMappingURL=useAdaptivityHasPointer.js.map

package/dist/cjs/hooks/useAdaptivityHasPointer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAdaptivityHasPointer.js","names":["useAdaptivityHasPointer","deferDetect","React","useContext","AdaptivityContext","hasPointerContext","hasPointer","useState","undefined","hasPointerLib","setHasPointer","useEffect","prevHasPointer","newHasHover"],"sources":["../../../src/hooks/useAdaptivityHasPointer.ts"],"sourcesContent":["import * as React from \"react\";\nimport { hasMouse as hasPointerLib } from \"@vkontakte/vkjs\";\nimport { AdaptivityContext } from \"../components/AdaptivityProvider/AdaptivityContext\";\n\n/**\n * Определение происходит с помощью `window.matchMedia`. Для того, чтобы не было ошибок при гидратации, по умолчанию\n * откладываем определение на второй рендер.\n *\n * [No SSR] Если передать `false`, то определение будет сразу.\n */\nexport function useAdaptivityHasPointer(deferDetect?: true): undefined | boolean; // prettier-ignore\nexport function useAdaptivityHasPointer(deferDetect?: false): boolean;\nexport function useAdaptivityHasPointer(\n  deferDetect = true\n): undefined | boolean {\n  const { hasPointer: hasPointerContext } = React.useContext(AdaptivityContext);\n  const [hasPointer, setHasPointer] = React.useState(() =>\n    !deferDetect && hasPointerContext === undefined\n      ? hasPointerLib\n      : hasPointerContext\n  );\n\n  React.useEffect(() => {\n    setHasPointer((prevHasPointer) => {\n      const newHasHover =\n        hasPointerContext === undefined ? hasPointerLib : hasPointerContext;\n      return prevHasPointer === newHasHover ? prevHasPointer : newHasHover;\n    });\n  }, [hasPointerContext]);\n\n  return hasPointer;\n}\n"],"mappings":";;;;;;;;;AAAA;AACA;AACA;AAUO,SAASA,uBAAuB,GAEhB;EAAA,IADrBC,WAAW,uEAAG,IAAI;EAElB,wBAA0CC,KAAK,CAACC,UAAU,CAACC,oCAAiB,CAAC;IAAzDC,iBAAiB,qBAA7BC,UAAU;EAClB,sBAAoCJ,KAAK,CAACK,QAAQ,CAAC;MAAA,OACjD,CAACN,WAAW,IAAII,iBAAiB,KAAKG,SAAS,GAC3CC,cAAa,GACbJ,iBAAiB;IAAA,EACtB;IAAA;IAJMC,UAAU;IAAEI,aAAa;EAMhCR,KAAK,CAACS,SAAS,CAAC,YAAM;IACpBD,aAAa,CAAC,UAACE,cAAc,EAAK;MAChC,IAAMC,WAAW,GACfR,iBAAiB,KAAKG,SAAS,GAAGC,cAAa,GAAGJ,iBAAiB;MACrE,OAAOO,cAAc,KAAKC,WAAW,GAAGD,cAAc,GAAGC,WAAW;IACtE,CAAC,CAAC;EACJ,CAAC,EAAE,CAACR,iBAAiB,CAAC,CAAC;EAEvB,OAAOC,UAAU;AACnB"}

package/dist/cjs/hooks/useAdaptivityWithJSMediaQueries.d.ts

@@ -0,0 +1,18 @@
+import { type AdaptivityProps as BaseAdaptivityProps } from "../components/AdaptivityProvider/AdaptivityContext";
+export interface UseAdaptivityWithJSMediaQueries extends Required<BaseAdaptivityProps> {
+    isDesktop: boolean;
+}
+/**
+ * Высчитывает и возвращает параметры адаптивности при изменении вьюпорта.
+ *
+ * Берёт в приоритет значения из `AdaptivityContext`.
+ *
+ * > ⚠ SSR
+ * >
+ * > Во избежания ошибок при гидратации, не используйте данный хук, если есть вероятность, что компонент будет отрендерен
+ * > на стороне сервера.
+ * >
+ * > Лучше всего использовать для всплывающих окон, т.к. они вызываются только после загрузки
+ * > страницы либо пользователем, либо программно.
+ */
+export declare const useAdaptivityWithJSMediaQueries: () => UseAdaptivityWithJSMediaQueries;

package/dist/cjs/hooks/useAdaptivityWithJSMediaQueries.js

@@ -0,0 +1,105 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useAdaptivityWithJSMediaQueries = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var React = _interopRequireWildcard(require("react"));
+var _vkjs = require("@vkontakte/vkjs");
+var _AdaptivityContext = require("../components/AdaptivityProvider/AdaptivityContext");
+var _getOrDefault = require("../helpers/getOrDefault");
+var _adaptivity = require("../lib/adaptivity");
+var _useMediaQueries = require("./useMediaQueries");
+var _usePlatform = require("./usePlatform");
+/**
+ * Высчитывает и возвращает параметры адаптивности при изменении вьюпорта.
+ *
+ * Берёт в приоритет значения из `AdaptivityContext`.
+ *
+ * > ⚠ SSR
+ * >
+ * > Во избежания ошибок при гидратации, не используйте данный хук, если есть вероятность, что компонент будет отрендерен
+ * > на стороне сервера.
+ * >
+ * > Лучше всего использовать для всплывающих окон, т.к. они вызываются только после загрузки
+ * > страницы либо пользователем, либо программно.
+ */
+var useAdaptivityWithJSMediaQueries = function useAdaptivityWithJSMediaQueries() {
+  if (!_vkjs.canUseDOM) {
+    console.error("[useAdaptivityWithJSMediaQueries] \u041F\u043E\u0445\u043E\u0436\u0435, \u0432\u044B \u043F\u044B\u0442\u0430\u0435\u0442\u0435\u0441\u044C \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u044C \u0445\u0443\u043A \u0432\u043D\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430.\n\n\u041F\u043E\u0441\u0442\u0430\u0440\u0430\u0439\u0442\u0435\u0441\u044C \u044D\u0442\u043E\u0433\u043E \u0438\u0437\u0431\u0435\u0433\u0430\u0442\u044C, \u0447\u0442\u043E\u0431\u044B \u043D\u0435 \u0431\u044B\u043B\u043E \u043E\u0448\u0438\u0431\u043E\u043A \u043F\u0440\u0438 \u0433\u0438\u0434\u0440\u0430\u0442\u0430\u0446\u0438\u0438: \u043F\u0440\u0438 SSR \u043D\u0435\u0442 \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u0438 \u043E \u0440\u0430\u0437\u043C\u0435\u0440\u0430\u0445 \u044D\u043A\u0440\u0430\u043D\u0430.\n\n\u0418\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0439\u0442\u0435 CSS Media Query \u0438\u043B\u0438 \u0431\u0438\u0431\u043B\u0438\u043E\u0442\u0435\u043A\u0443 \u043F\u043E \u0442\u0438\u043F\u0443 https://github.com/artsy/fresnel.");
+  }
+  var _React$useContext = React.useContext(_AdaptivityContext.AdaptivityContext),
+    viewWidthContext = _React$useContext.viewWidth,
+    viewHeightContext = _React$useContext.viewHeight,
+    sizeXContext = _React$useContext.sizeX,
+    sizeYContext = _React$useContext.sizeY,
+    hasPointerContext = _React$useContext.hasPointer,
+    hasHoverContext = _React$useContext.hasHover;
+  var platform = (0, _usePlatform.usePlatform)();
+  var mediaQueries = (0, _useMediaQueries.useMediaQueries)();
+  var _React$useState = React.useState(function () {
+      return [(0, _getOrDefault.getOrDefault)(viewWidthContext, (0, _adaptivity.getViewWidthByMediaQueries)(mediaQueries)), (0, _getOrDefault.getOrDefault)(viewHeightContext, (0, _adaptivity.getViewHeightByMediaQueries)(mediaQueries))];
+    }),
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    _React$useState2$ = (0, _slicedToArray2.default)(_React$useState2[0], 2),
+    viewWidthLocal = _React$useState2$[0],
+    viewHeightLocal = _React$useState2$[1],
+    setViewSizeLocal = _React$useState2[1];
+  var adaptivityProps = React.useMemo(function () {
+    var hasPointer = (0, _getOrDefault.getOrDefault)(hasPointerContext, _vkjs.hasMouse);
+    var hasHover = (0, _getOrDefault.getOrDefault)(hasHoverContext, _vkjs.hasHover);
+    var viewWidth = (0, _getOrDefault.getOrDefault)(viewWidthContext, viewWidthLocal);
+    var viewHeight = (0, _getOrDefault.getOrDefault)(viewHeightContext, viewHeightLocal);
+    var sizeX = (0, _getOrDefault.getOrDefault)(sizeXContext, (0, _adaptivity.getSizeX)(viewWidth));
+    var sizeY = (0, _getOrDefault.getOrDefault)(sizeYContext, (0, _adaptivity.getSizeY)(viewWidth, viewHeight, hasPointer));
+    var isDesktop = (0, _adaptivity.tryToCheckIsDesktop)(viewWidth, viewHeight, hasPointer, platform);
+    return {
+      viewWidth: viewWidth,
+      viewHeight: viewHeight,
+      sizeX: sizeX,
+      sizeY: sizeY,
+      hasPointer: hasPointer,
+      hasHover: hasHover,
+      isDesktop: isDesktop
+    };
+  }, [viewWidthLocal, viewHeightLocal, viewWidthContext, viewHeightContext, sizeXContext, sizeYContext, hasPointerContext, hasHoverContext, platform]);
+  React.useEffect(function () {
+    var handleMediaQuery = function handleMediaQuery() {
+      setViewSizeLocal(function (prevSizeLocal) {
+        var newViewWidthLocal = (0, _getOrDefault.getOrDefault)(viewWidthContext, (0, _adaptivity.getViewWidthByMediaQueries)(mediaQueries));
+        var newViewHeightLocal = (0, _getOrDefault.getOrDefault)(viewHeightContext, (0, _adaptivity.getViewHeightByMediaQueries)(mediaQueries));
+        var _prevSizeLocal = (0, _slicedToArray2.default)(prevSizeLocal, 2),
+          prevViewWidthLocal = _prevSizeLocal[0],
+          prevViewHeightLocal = _prevSizeLocal[1];
+        if (prevViewWidthLocal !== newViewWidthLocal || prevViewHeightLocal !== newViewHeightLocal) {
+          return [newViewWidthLocal, newViewHeightLocal];
+        }
+        return prevSizeLocal;
+      });
+    };
+    if (!viewWidthContext) {
+      mediaQueries.desktopPlus.addEventListener("change", handleMediaQuery);
+      mediaQueries.tablet.addEventListener("change", handleMediaQuery);
+      mediaQueries.smallTablet.addEventListener("change", handleMediaQuery);
+      mediaQueries.mobile.addEventListener("change", handleMediaQuery);
+    }
+    if (!viewHeightContext) {
+      mediaQueries.mediumHeight.addEventListener("change", handleMediaQuery);
+      mediaQueries.mobileLandscapeHeight.addEventListener("change", handleMediaQuery);
+    }
+    return function () {
+      mediaQueries.desktopPlus.removeEventListener("change", handleMediaQuery);
+      mediaQueries.tablet.removeEventListener("change", handleMediaQuery);
+      mediaQueries.smallTablet.removeEventListener("change", handleMediaQuery);
+      mediaQueries.mobile.removeEventListener("change", handleMediaQuery);
+      mediaQueries.mediumHeight.removeEventListener("change", handleMediaQuery);
+      mediaQueries.mobileLandscapeHeight.removeEventListener("change", handleMediaQuery);
+    };
+  }, [mediaQueries, viewWidthContext, viewHeightContext]);
+  return adaptivityProps;
+};
+exports.useAdaptivityWithJSMediaQueries = useAdaptivityWithJSMediaQueries;
+//# sourceMappingURL=useAdaptivityWithJSMediaQueries.js.map

package/dist/cjs/hooks/useAdaptivityWithJSMediaQueries.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAdaptivityWithJSMediaQueries.js","names":["useAdaptivityWithJSMediaQueries","canUseDOM","console","error","React","useContext","AdaptivityContext","viewWidthContext","viewWidth","viewHeightContext","viewHeight","sizeXContext","sizeX","sizeYContext","sizeY","hasPointerContext","hasPointer","hasHoverContext","hasHover","platform","usePlatform","mediaQueries","useMediaQueries","useState","getOrDefault","getViewWidthByMediaQueries","getViewHeightByMediaQueries","viewWidthLocal","viewHeightLocal","setViewSizeLocal","adaptivityProps","useMemo","hasPointerLib","hasHoverLib","getSizeX","getSizeY","isDesktop","tryToCheckIsDesktop","useEffect","handleMediaQuery","prevSizeLocal","newViewWidthLocal","newViewHeightLocal","prevViewWidthLocal","prevViewHeightLocal","desktopPlus","addEventListener","tablet","smallTablet","mobile","mediumHeight","mobileLandscapeHeight","removeEventListener"],"sources":["../../../src/hooks/useAdaptivityWithJSMediaQueries.ts"],"sourcesContent":["import * as React from \"react\";\nimport {\n  canUseDOM,\n  hasMouse as hasPointerLib,\n  hasHover as hasHoverLib,\n} from \"@vkontakte/vkjs\";\nimport {\n  AdaptivityContext,\n  type AdaptivityProps as BaseAdaptivityProps,\n} from \"../components/AdaptivityProvider/AdaptivityContext\";\nimport { getOrDefault } from \"../helpers/getOrDefault\";\nimport {\n  getViewWidthByMediaQueries,\n  getViewHeightByMediaQueries,\n  getSizeX,\n  getSizeY,\n  tryToCheckIsDesktop,\n} from \"../lib/adaptivity\";\nimport { useMediaQueries } from \"./useMediaQueries\";\nimport { usePlatform } from \"./usePlatform\";\n\nexport interface UseAdaptivityWithJSMediaQueries\n  extends Required<BaseAdaptivityProps> {\n  isDesktop: boolean;\n}\n\n/**\n * Высчитывает и возвращает параметры адаптивности при изменении вьюпорта.\n *\n * Берёт в приоритет значения из `AdaptivityContext`.\n *\n * > ⚠ SSR\n * >\n * > Во избежания ошибок при гидратации, не используйте данный хук, если есть вероятность, что компонент будет отрендерен\n * > на стороне сервера.\n * >\n * > Лучше всего использовать для всплывающих окон, т.к. они вызываются только после загрузки\n * > страницы либо пользователем, либо программно.\n */\nexport const useAdaptivityWithJSMediaQueries =\n  (): UseAdaptivityWithJSMediaQueries => {\n    if (!canUseDOM) {\n      console.error(`[useAdaptivityWithJSMediaQueries] Похоже, вы пытаетесь использовать хук вне браузера.\n\nПостарайтесь этого избегать, чтобы не было ошибок при гидратации: при SSR нет информации о размерах экрана.\n\nИспользуйте CSS Media Query или библиотеку по типу https://github.com/artsy/fresnel.`);\n    }\n\n    const {\n      viewWidth: viewWidthContext,\n      viewHeight: viewHeightContext,\n      sizeX: sizeXContext,\n      sizeY: sizeYContext,\n      hasPointer: hasPointerContext,\n      hasHover: hasHoverContext,\n    } = React.useContext(AdaptivityContext);\n\n    const platform = usePlatform();\n    const mediaQueries = useMediaQueries();\n\n    const [[viewWidthLocal, viewHeightLocal], setViewSizeLocal] =\n      React.useState(() => [\n        getOrDefault(\n          viewWidthContext,\n          getViewWidthByMediaQueries(mediaQueries)\n        ),\n        getOrDefault(\n          viewHeightContext,\n          getViewHeightByMediaQueries(mediaQueries)\n        ),\n      ]);\n\n    const adaptivityProps = React.useMemo(() => {\n      const hasPointer = getOrDefault(hasPointerContext, hasPointerLib);\n      const hasHover = getOrDefault(hasHoverContext, hasHoverLib);\n      const viewWidth = getOrDefault(viewWidthContext, viewWidthLocal);\n      const viewHeight = getOrDefault(viewHeightContext, viewHeightLocal);\n      const sizeX = getOrDefault(sizeXContext, getSizeX(viewWidth));\n      const sizeY = getOrDefault(\n        sizeYContext,\n        getSizeY(viewWidth, viewHeight, hasPointer)\n      );\n      const isDesktop = tryToCheckIsDesktop(\n        viewWidth,\n        viewHeight,\n        hasPointer,\n        platform\n      );\n\n      return {\n        viewWidth,\n        viewHeight,\n        sizeX,\n        sizeY,\n        hasPointer,\n        hasHover,\n        isDesktop,\n      };\n    }, [\n      viewWidthLocal,\n      viewHeightLocal,\n      viewWidthContext,\n      viewHeightContext,\n      sizeXContext,\n      sizeYContext,\n      hasPointerContext,\n      hasHoverContext,\n      platform,\n    ]);\n\n    React.useEffect(() => {\n      const handleMediaQuery = () => {\n        setViewSizeLocal((prevSizeLocal) => {\n          const newViewWidthLocal = getOrDefault(\n            viewWidthContext,\n            getViewWidthByMediaQueries(mediaQueries)\n          );\n          const newViewHeightLocal = getOrDefault(\n            viewHeightContext,\n            getViewHeightByMediaQueries(mediaQueries)\n          );\n\n          const [prevViewWidthLocal, prevViewHeightLocal] = prevSizeLocal;\n\n          if (\n            prevViewWidthLocal !== newViewWidthLocal ||\n            prevViewHeightLocal !== newViewHeightLocal\n          ) {\n            return [newViewWidthLocal, newViewHeightLocal];\n          }\n\n          return prevSizeLocal;\n        });\n      };\n\n      if (!viewWidthContext) {\n        mediaQueries.desktopPlus.addEventListener(\"change\", handleMediaQuery);\n        mediaQueries.tablet.addEventListener(\"change\", handleMediaQuery);\n        mediaQueries.smallTablet.addEventListener(\"change\", handleMediaQuery);\n        mediaQueries.mobile.addEventListener(\"change\", handleMediaQuery);\n      }\n\n      if (!viewHeightContext) {\n        mediaQueries.mediumHeight.addEventListener(\"change\", handleMediaQuery);\n        mediaQueries.mobileLandscapeHeight.addEventListener(\n          \"change\",\n          handleMediaQuery\n        );\n      }\n\n      return () => {\n        mediaQueries.desktopPlus.removeEventListener(\n          \"change\",\n          handleMediaQuery\n        );\n        mediaQueries.tablet.removeEventListener(\"change\", handleMediaQuery);\n        mediaQueries.smallTablet.removeEventListener(\n          \"change\",\n          handleMediaQuery\n        );\n        mediaQueries.mobile.removeEventListener(\"change\", handleMediaQuery);\n        mediaQueries.mediumHeight.removeEventListener(\n          \"change\",\n          handleMediaQuery\n        );\n        mediaQueries.mobileLandscapeHeight.removeEventListener(\n          \"change\",\n          handleMediaQuery\n        );\n      };\n    }, [mediaQueries, viewWidthContext, viewHeightContext]);\n\n    return adaptivityProps;\n  };\n"],"mappings":"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"}

package/dist/cjs/hooks/useAppearance.d.ts

@@ -0,0 +1 @@
+export declare function useAppearance(): import("@vkontakte/vk-bridge").AppearanceType;

package/dist/cjs/hooks/useAppearance.js

@@ -1,19 +1,13 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useAppearance = void 0;
-
-var React = _interopRequireWildcard(require("react"));
-
-var _AppearanceProviderContext = require("../components/AppearanceProvider/AppearanceProviderContext");
-
-var useAppearance = function useAppearance() {
-  return React.useContext(_AppearanceProviderContext.AppearanceProviderContext);
-};
-
 exports.useAppearance = useAppearance;
+var _ConfigProviderContext = require("../components/ConfigProvider/ConfigProviderContext");
+function useAppearance() {
+  var _useConfigProvider = (0, _ConfigProviderContext.useConfigProvider)(),
+    appearance = _useConfigProvider.appearance;
+  return appearance !== null && appearance !== void 0 ? appearance : "light";
+}
 //# sourceMappingURL=useAppearance.js.map

package/dist/cjs/hooks/useAppearance.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAppearance.js","names":["useAppearance","React","useContext","AppearanceProviderContext"],"sources":["../../../src/hooks/useAppearance.ts"],"sourcesContent":["import * as React from \"react\";\nimport { AppearanceProviderContext } from \"../components/AppearanceProvider/AppearanceProviderContext\";\n\nexport const useAppearance = () => React.useContext(AppearanceProviderContext);\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEO,IAAMA,aAAa,GAAG,SAAhBA,aAAgB;EAAA,OAAMC,KAAK,CAACC,UAAN,CAAiBC,oDAAjB,CAAN;AAAA,CAAtB"}
+{"version":3,"file":"useAppearance.js","names":["useAppearance","useConfigProvider","appearance"],"sources":["../../../src/hooks/useAppearance.ts"],"sourcesContent":["import { useConfigProvider } from \"../components/ConfigProvider/ConfigProviderContext\";\n\nexport function useAppearance() {\n  const { appearance } = useConfigProvider();\n\n  return appearance ?? \"light\";\n}\n"],"mappings":";;;;;;AAAA;AAEO,SAASA,aAAa,GAAG;EAC9B,yBAAuB,IAAAC,wCAAiB,GAAE;IAAlCC,UAAU,sBAAVA,UAAU;EAElB,OAAOA,UAAU,aAAVA,UAAU,cAAVA,UAAU,GAAI,OAAO;AAC9B"}

package/dist/cjs/hooks/useAutoDetectAppearance.js

@@ -1,117 +1,89 @@
 "use strict";
 
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useAutoDetectAppearance = void 0;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _vkBridge = _interopRequireDefault(require("@vkontakte/vk-bridge"));
-
 var _dom = require("../lib/dom");
-
 var _utils = require("../lib/utils");
-
 var _appearance = require("../helpers/appearance");
-
 var initialAppearance = null;
-
 _vkBridge.default.send("VKWebAppGetConfig").then(function (data) {
   initialAppearance = (0, _appearance.resolveAppearance)(data);
 }).catch(console.error);
-
 function autoDetectAppearanceByBridge(setAppearance, onDetectAppearanceByBridge) {
   function bridgeListener(e) {
     var _e$detail = e.detail,
-        type = _e$detail.type,
-        data = _e$detail.data;
-
+      type = _e$detail.type,
+      data = _e$detail.data;
     if (type !== "VKWebAppUpdateConfig") {
       return;
     }
-
     initialAppearance = (0, _appearance.resolveAppearance)(data);
-
     if (initialAppearance) {
       onDetectAppearanceByBridge();
       setAppearance(initialAppearance);
     }
   }
-
   _vkBridge.default.subscribe(bridgeListener);
-
   return function () {
     return _vkBridge.default.unsubscribe(bridgeListener);
   };
 }
-
 function autoDetectAppearance(window, setAppearance) {
   var mediaQuery = window && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)");
-
   if (mediaQuery === undefined) {
     return _utils.noop;
   }
-
   var check = function check(event) {
     // eslint-disable-next-line no-restricted-properties
     setAppearance(event.matches ? "dark" : "light");
   };
-
   check(mediaQuery);
   mediaQuery.addEventListener("change", check);
   return function () {
     return mediaQuery.removeEventListener("change", check);
   };
 }
-
 var useAutoDetectAppearance = function useAutoDetectAppearance(appearanceProp, onDetectAppearanceByBridge) {
   var _useDOM = (0, _dom.useDOM)(),
-      window = _useDOM.window;
-
+    window = _useDOM.window;
   var onceDetectAppearanceByBridge = React.useRef(function () {
     onDetectAppearanceByBridge && onDetectAppearanceByBridge();
     onceDetectAppearanceByBridge.current = _utils.noop;
   });
-
   var _React$useState = React.useState(function () {
-    if (appearanceProp) {
-      return appearanceProp;
-    }
-
-    if (initialAppearance) {
-      onceDetectAppearanceByBridge.current();
-      return initialAppearance;
-    }
-
-    var mediaQuery = window && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)"); // eslint-disable-next-line no-restricted-properties
-
-    return mediaQuery !== null && mediaQuery !== void 0 && mediaQuery.matches ? "dark" : "light";
-  }),
-      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-      appearance = _React$useState2[0],
-      setAppearance = _React$useState2[1];
-
+      if (appearanceProp) {
+        return appearanceProp;
+      }
+      if (initialAppearance) {
+        onceDetectAppearanceByBridge.current();
+        return initialAppearance;
+      }
+      var mediaQuery = window && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)");
+
+      // eslint-disable-next-line no-restricted-properties
+      return mediaQuery !== null && mediaQuery !== void 0 && mediaQuery.matches ? "dark" : "light";
+    }),
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    appearance = _React$useState2[0],
+    setAppearance = _React$useState2[1];
   React.useEffect(function () {
     if (appearanceProp) {
       setAppearance(appearanceProp);
       return _utils.noop;
     }
-
     if (_vkBridge.default.isEmbedded()) {
       return autoDetectAppearanceByBridge(setAppearance, onceDetectAppearanceByBridge.current);
     }
-
     return autoDetectAppearance(window, setAppearance);
   }, [window, appearanceProp]);
   return appearance;
 };
-
 exports.useAutoDetectAppearance = useAutoDetectAppearance;
 //# sourceMappingURL=useAutoDetectAppearance.js.map

package/dist/cjs/hooks/useAutoDetectAppearance.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAutoDetectAppearance.js","names":["initialAppearance","vkBridge","send","then","data","resolveAppearance","catch","console","error","autoDetectAppearanceByBridge","setAppearance","onDetectAppearanceByBridge","bridgeListener","e","detail","type","subscribe","unsubscribe","autoDetectAppearance","window","mediaQuery","matchMedia","undefined","noop","check","event","matches","addEventListener","removeEventListener","useAutoDetectAppearance","appearanceProp","useDOM","onceDetectAppearanceByBridge","React","useRef","current","useState","appearance","useEffect","isEmbedded"],"sources":["../../../src/hooks/useAutoDetectAppearance.tsx"],"sourcesContent":["import * as React from \"react\";\nimport vkBridge, {\n  AnyReceiveMethodName,\n  AppearanceType,\n  VKBridgeEvent,\n} from \"@vkontakte/vk-bridge\";\nimport { useDOM } from \"../lib/dom\";\nimport { noop } from \"../lib/utils\";\nimport { resolveAppearance, VKBridgeConfigData } from \"../helpers/appearance\";\n\nlet initialAppearance: AppearanceType | null = null;\n\nvkBridge\n  .send(\"VKWebAppGetConfig\")\n  .then((data) => {\n    initialAppearance = resolveAppearance(data);\n  })\n  .catch(console.error);\n\nfunction autoDetectAppearanceByBridge(\n  setAppearance: (value: AppearanceType) => void,\n  onDetectAppearanceByBridge: () => void\n) {\n  function bridgeListener(e: VKBridgeEvent<AnyReceiveMethodName>) {\n    const { type, data } = e.detail;\n\n    if (type !== \"VKWebAppUpdateConfig\") {\n      return;\n    }\n\n    initialAppearance = resolveAppearance(data as VKBridgeConfigData);\n\n    if (initialAppearance) {\n      onDetectAppearanceByBridge();\n      setAppearance(initialAppearance);\n    }\n  }\n\n  vkBridge.subscribe(bridgeListener);\n\n  return () => vkBridge.unsubscribe(bridgeListener);\n}\n\nfunction autoDetectAppearance(\n  window: Window | undefined,\n  setAppearance: (value: AppearanceType) => void\n): () => void {\n  const mediaQuery =\n    window &&\n    window.matchMedia &&\n    window.matchMedia(\"(prefers-color-scheme: dark)\");\n\n  if (mediaQuery === undefined) {\n    return noop;\n  }\n\n  const check = (event: MediaQueryList | MediaQueryListEvent) => {\n    // eslint-disable-next-line no-restricted-properties\n    setAppearance(event.matches ? \"dark\" : \"light\");\n  };\n\n  check(mediaQuery);\n  mediaQuery.addEventListener(\"change\", check);\n\n  return () => mediaQuery.removeEventListener(\"change\", check);\n}\n\nexport const useAutoDetectAppearance = (\n  appearanceProp?: AppearanceType,\n  onDetectAppearanceByBridge?: () => void\n): AppearanceType => {\n  const { window } = useDOM();\n  const onceDetectAppearanceByBridge = React.useRef(() => {\n    onDetectAppearanceByBridge && onDetectAppearanceByBridge();\n    onceDetectAppearanceByBridge.current = noop;\n  });\n\n  const [appearance, setAppearance] = React.useState<AppearanceType>(() => {\n    if (appearanceProp) {\n      return appearanceProp;\n    }\n\n    if (initialAppearance) {\n      onceDetectAppearanceByBridge.current();\n      return initialAppearance;\n    }\n\n    const mediaQuery =\n      window &&\n      window.matchMedia &&\n      window.matchMedia(\"(prefers-color-scheme: dark)\");\n\n    // eslint-disable-next-line no-restricted-properties\n    return mediaQuery?.matches ? \"dark\" : \"light\";\n  });\n\n  React.useEffect(() => {\n    if (appearanceProp) {\n      setAppearance(appearanceProp);\n      return noop;\n    }\n\n    if (vkBridge.isEmbedded()) {\n      return autoDetectAppearanceByBridge(\n        setAppearance,\n        onceDetectAppearanceByBridge.current\n      );\n    }\n\n    return autoDetectAppearance(window, setAppearance);\n  }, [window, appearanceProp]);\n\n  return appearance;\n};\n"],"mappings":"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"}
+{"version":3,"file":"useAutoDetectAppearance.js","names":["initialAppearance","vkBridge","send","then","data","resolveAppearance","catch","console","error","autoDetectAppearanceByBridge","setAppearance","onDetectAppearanceByBridge","bridgeListener","e","detail","type","subscribe","unsubscribe","autoDetectAppearance","window","mediaQuery","matchMedia","undefined","noop","check","event","matches","addEventListener","removeEventListener","useAutoDetectAppearance","appearanceProp","useDOM","onceDetectAppearanceByBridge","React","useRef","current","useState","appearance","useEffect","isEmbedded"],"sources":["../../../src/hooks/useAutoDetectAppearance.tsx"],"sourcesContent":["import * as React from \"react\";\nimport vkBridge, {\n  AnyReceiveMethodName,\n  AppearanceType,\n  VKBridgeEvent,\n} from \"@vkontakte/vk-bridge\";\nimport { useDOM } from \"../lib/dom\";\nimport { noop } from \"../lib/utils\";\nimport { resolveAppearance, VKBridgeConfigData } from \"../helpers/appearance\";\n\nlet initialAppearance: AppearanceType | null = null;\n\nvkBridge\n  .send(\"VKWebAppGetConfig\")\n  .then((data) => {\n    initialAppearance = resolveAppearance(data);\n  })\n  .catch(console.error);\n\nfunction autoDetectAppearanceByBridge(\n  setAppearance: (value: AppearanceType) => void,\n  onDetectAppearanceByBridge: () => void\n) {\n  function bridgeListener(e: VKBridgeEvent<AnyReceiveMethodName>) {\n    const { type, data } = e.detail;\n\n    if (type !== \"VKWebAppUpdateConfig\") {\n      return;\n    }\n\n    initialAppearance = resolveAppearance(data as VKBridgeConfigData);\n\n    if (initialAppearance) {\n      onDetectAppearanceByBridge();\n      setAppearance(initialAppearance);\n    }\n  }\n\n  vkBridge.subscribe(bridgeListener);\n\n  return () => vkBridge.unsubscribe(bridgeListener);\n}\n\nfunction autoDetectAppearance(\n  window: Window | undefined,\n  setAppearance: (value: AppearanceType) => void\n): () => void {\n  const mediaQuery =\n    window &&\n    window.matchMedia &&\n    window.matchMedia(\"(prefers-color-scheme: dark)\");\n\n  if (mediaQuery === undefined) {\n    return noop;\n  }\n\n  const check = (event: MediaQueryList | MediaQueryListEvent) => {\n    // eslint-disable-next-line no-restricted-properties\n    setAppearance(event.matches ? \"dark\" : \"light\");\n  };\n\n  check(mediaQuery);\n  mediaQuery.addEventListener(\"change\", check);\n\n  return () => mediaQuery.removeEventListener(\"change\", check);\n}\n\nexport const useAutoDetectAppearance = (\n  appearanceProp?: AppearanceType,\n  onDetectAppearanceByBridge?: () => void\n): AppearanceType => {\n  const { window } = useDOM();\n  const onceDetectAppearanceByBridge = React.useRef(() => {\n    onDetectAppearanceByBridge && onDetectAppearanceByBridge();\n    onceDetectAppearanceByBridge.current = noop;\n  });\n\n  const [appearance, setAppearance] = React.useState<AppearanceType>(() => {\n    if (appearanceProp) {\n      return appearanceProp;\n    }\n\n    if (initialAppearance) {\n      onceDetectAppearanceByBridge.current();\n      return initialAppearance;\n    }\n\n    const mediaQuery =\n      window &&\n      window.matchMedia &&\n      window.matchMedia(\"(prefers-color-scheme: dark)\");\n\n    // eslint-disable-next-line no-restricted-properties\n    return mediaQuery?.matches ? \"dark\" : \"light\";\n  });\n\n  React.useEffect(() => {\n    if (appearanceProp) {\n      setAppearance(appearanceProp);\n      return noop;\n    }\n\n    if (vkBridge.isEmbedded()) {\n      return autoDetectAppearanceByBridge(\n        setAppearance,\n        onceDetectAppearanceByBridge.current\n      );\n    }\n\n    return autoDetectAppearance(window, setAppearance);\n  }, [window, appearanceProp]);\n\n  return appearance;\n};\n"],"mappings":"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"}

package/dist/cjs/hooks/useBooleanState.js

@@ -1,26 +1,19 @@
 "use strict";
 
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useBooleanState = void 0;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var useBooleanState = function useBooleanState() {
   var defaultValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
-
   var _React$useState = React.useState(defaultValue),
-      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-      value = _React$useState2[0],
-      setValue = _React$useState2[1];
-
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    value = _React$useState2[0],
+    setValue = _React$useState2[1];
   var setTrue = React.useCallback(function () {
     setValue(true);
   }, []);
@@ -37,6 +30,5 @@ var useBooleanState = function useBooleanState() {
     toggle: toggle
   };
 };
-
 exports.useBooleanState = useBooleanState;
 //# sourceMappingURL=useBooleanState.js.map

package/dist/cjs/hooks/useBooleanState.js.map

@@ -1 +1 @@
-{"version":3,"file":"useBooleanState.js","names":["useBooleanState","defaultValue","React","useState","value","setValue","setTrue","useCallback","setFalse","toggle"],"sources":["../../../src/hooks/useBooleanState.ts"],"sourcesContent":["import * as React from \"react\";\n\nexport const useBooleanState = (defaultValue = false) => {\n  const [value, setValue] = React.useState(defaultValue);\n\n  const setTrue = React.useCallback(() => {\n    setValue(true);\n  }, []);\n\n  const setFalse = React.useCallback(() => {\n    setValue(false);\n  }, []);\n\n  const toggle = React.useCallback(() => {\n    setValue(!value);\n  }, [value]);\n\n  return { value, setTrue, setFalse, toggle };\n};\n"],"mappings":";;;;;;;;;;;;;AAAA;;AAEO,IAAMA,eAAe,GAAG,SAAlBA,eAAkB,GAA0B;EAAA,IAAzBC,YAAyB,uEAAV,KAAU;;EACvD,sBAA0BC,KAAK,CAACC,QAAN,CAAeF,YAAf,CAA1B;EAAA;EAAA,IAAOG,KAAP;EAAA,IAAcC,QAAd;;EAEA,IAAMC,OAAO,GAAGJ,KAAK,CAACK,WAAN,CAAkB,YAAM;IACtCF,QAAQ,CAAC,IAAD,CAAR;EACD,CAFe,EAEb,EAFa,CAAhB;EAIA,IAAMG,QAAQ,GAAGN,KAAK,CAACK,WAAN,CAAkB,YAAM;IACvCF,QAAQ,CAAC,KAAD,CAAR;EACD,CAFgB,EAEd,EAFc,CAAjB;EAIA,IAAMI,MAAM,GAAGP,KAAK,CAACK,WAAN,CAAkB,YAAM;IACrCF,QAAQ,CAAC,CAACD,KAAF,CAAR;EACD,CAFc,EAEZ,CAACA,KAAD,CAFY,CAAf;EAIA,OAAO;IAAEA,KAAK,EAALA,KAAF;IAASE,OAAO,EAAPA,OAAT;IAAkBE,QAAQ,EAARA,QAAlB;IAA4BC,MAAM,EAANA;EAA5B,CAAP;AACD,CAhBM"}
+{"version":3,"file":"useBooleanState.js","names":["useBooleanState","defaultValue","React","useState","value","setValue","setTrue","useCallback","setFalse","toggle"],"sources":["../../../src/hooks/useBooleanState.ts"],"sourcesContent":["import * as React from \"react\";\n\nexport const useBooleanState = (defaultValue = false) => {\n  const [value, setValue] = React.useState(defaultValue);\n\n  const setTrue = React.useCallback(() => {\n    setValue(true);\n  }, []);\n\n  const setFalse = React.useCallback(() => {\n    setValue(false);\n  }, []);\n\n  const toggle = React.useCallback(() => {\n    setValue(!value);\n  }, [value]);\n\n  return { value, setTrue, setFalse, toggle };\n};\n"],"mappings":";;;;;;;;;AAAA;AAEO,IAAMA,eAAe,GAAG,SAAlBA,eAAe,GAA6B;EAAA,IAAzBC,YAAY,uEAAG,KAAK;EAClD,sBAA0BC,KAAK,CAACC,QAAQ,CAACF,YAAY,CAAC;IAAA;IAA/CG,KAAK;IAAEC,QAAQ;EAEtB,IAAMC,OAAO,GAAGJ,KAAK,CAACK,WAAW,CAAC,YAAM;IACtCF,QAAQ,CAAC,IAAI,CAAC;EAChB,CAAC,EAAE,EAAE,CAAC;EAEN,IAAMG,QAAQ,GAAGN,KAAK,CAACK,WAAW,CAAC,YAAM;IACvCF,QAAQ,CAAC,KAAK,CAAC;EACjB,CAAC,EAAE,EAAE,CAAC;EAEN,IAAMI,MAAM,GAAGP,KAAK,CAACK,WAAW,CAAC,YAAM;IACrCF,QAAQ,CAAC,CAACD,KAAK,CAAC;EAClB,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAEX,OAAO;IAAEA,KAAK,EAALA,KAAK;IAAEE,OAAO,EAAPA,OAAO;IAAEE,QAAQ,EAARA,QAAQ;IAAEC,MAAM,EAANA;EAAO,CAAC;AAC7C,CAAC;AAAC"}

package/dist/cjs/hooks/useBridgeAdaptivity.js

@@ -1,81 +1,62 @@
 "use strict";
 
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useBridgeAdaptivity = useBridgeAdaptivity;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _vkBridge = _interopRequireDefault(require("@vkontakte/vk-bridge"));
-
 var _useIsomorphicLayoutEffect = require("../lib/useIsomorphicLayoutEffect");
-
 var initialState = {
   type: "",
   viewportWidth: 0,
   viewportHeight: 0
 };
-
 function resolveAdaptivity(e) {
   var _e$detail = e.detail,
-      type = _e$detail.type,
-      data = _e$detail.data;
-
+    type = _e$detail.type,
+    data = _e$detail.data;
   if (type !== "VKWebAppUpdateConfig" || !data) {
     return null;
   }
-
   var adaptivity = data.adaptivity,
-      viewportWidth = data.viewport_width,
-      viewportHeight = data.viewport_height;
+    viewportWidth = data.viewport_width,
+    viewportHeight = data.viewport_height;
   var bridgeAdaptivity = {
     type: "",
     viewportWidth: isFinite(viewportWidth) ? +viewportWidth : 0,
     viewportHeight: isFinite(viewportHeight) ? +viewportHeight : 0
   };
-
   switch (adaptivity) {
     case "force_mobile":
     case "force_mobile_compact":
     case "adaptive":
       bridgeAdaptivity.type = adaptivity;
   }
-
   return bridgeAdaptivity;
 }
-
 _vkBridge.default.subscribe(function (e) {
   var bridgeAdaptivity = resolveAdaptivity(e);
-
   if (bridgeAdaptivity) {
     initialState = bridgeAdaptivity;
   }
 });
-
 function useBridgeAdaptivity() {
   var _React$useState = React.useState(initialState),
-      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-      bridgeAdaptivity = _React$useState2[0],
-      setBridgeAdaptivity = _React$useState2[1];
-
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    bridgeAdaptivity = _React$useState2[0],
+    setBridgeAdaptivity = _React$useState2[1];
   (0, _useIsomorphicLayoutEffect.useIsomorphicLayoutEffect)(function () {
     function bridgeListener(e) {
       var newBridgeAdaptivity = resolveAdaptivity(e);
-
       if (newBridgeAdaptivity) {
         setBridgeAdaptivity(newBridgeAdaptivity);
       }
     }
-
     _vkBridge.default.subscribe(bridgeListener);
-
     return function () {
       _vkBridge.default.unsubscribe(bridgeListener);
     };

package/dist/cjs/hooks/useBridgeAdaptivity.js.map

@@ -1 +1 @@
-{"version":3,"file":"useBridgeAdaptivity.js","names":["initialState","type","viewportWidth","viewportHeight","resolveAdaptivity","e","detail","data","adaptivity","viewport_width","viewport_height","bridgeAdaptivity","isFinite","vkBridge","subscribe","useBridgeAdaptivity","React","useState","setBridgeAdaptivity","useIsomorphicLayoutEffect","bridgeListener","newBridgeAdaptivity","unsubscribe"],"sources":["../../../src/hooks/useBridgeAdaptivity.ts"],"sourcesContent":["import * as React from \"react\";\nimport vkBridge from \"@vkontakte/vk-bridge\";\nimport { useIsomorphicLayoutEffect } from \"../lib/useIsomorphicLayoutEffect\";\n\nexport interface BridgeAdaptivity {\n  type: \"\" | \"force_mobile\" | \"force_mobile_compact\" | \"adaptive\";\n  viewportWidth: number;\n  viewportHeight: number;\n}\n\ninterface BridgeEvent {\n  detail: {\n    type: string;\n    data: {\n      [index: string]: any;\n    };\n  };\n}\n\nlet initialState: BridgeAdaptivity = {\n  type: \"\",\n  viewportWidth: 0,\n  viewportHeight: 0,\n};\n\nfunction resolveAdaptivity(e: BridgeEvent): BridgeAdaptivity | null {\n  const { type, data } = e.detail;\n\n  if (type !== \"VKWebAppUpdateConfig\" || !data) {\n    return null;\n  }\n\n  const {\n    adaptivity,\n    viewport_width: viewportWidth,\n    viewport_height: viewportHeight,\n  } = data;\n\n  const bridgeAdaptivity: BridgeAdaptivity = {\n    type: \"\",\n    viewportWidth: isFinite(viewportWidth) ? +viewportWidth : 0,\n    viewportHeight: isFinite(viewportHeight) ? +viewportHeight : 0,\n  };\n\n  switch (adaptivity) {\n    case \"force_mobile\":\n    case \"force_mobile_compact\":\n    case \"adaptive\":\n      bridgeAdaptivity.type = adaptivity;\n  }\n\n  return bridgeAdaptivity;\n}\n\nvkBridge.subscribe((e: BridgeEvent) => {\n  const bridgeAdaptivity = resolveAdaptivity(e);\n\n  if (bridgeAdaptivity) {\n    initialState = bridgeAdaptivity;\n  }\n});\n\nexport function useBridgeAdaptivity(): BridgeAdaptivity {\n  const [bridgeAdaptivity, setBridgeAdaptivity] =\n    React.useState<BridgeAdaptivity>(initialState);\n\n  useIsomorphicLayoutEffect(() => {\n    function bridgeListener(e: BridgeEvent) {\n      const newBridgeAdaptivity = resolveAdaptivity(e);\n\n      if (newBridgeAdaptivity) {\n        setBridgeAdaptivity(newBridgeAdaptivity);\n      }\n    }\n\n    vkBridge.subscribe(bridgeListener);\n    return () => {\n      vkBridge.unsubscribe(bridgeListener);\n    };\n  }, []);\n\n  return bridgeAdaptivity;\n}\n"],"mappings":";;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAiBA,IAAIA,YAA8B,GAAG;EACnCC,IAAI,EAAE,EAD6B;EAEnCC,aAAa,EAAE,CAFoB;EAGnCC,cAAc,EAAE;AAHmB,CAArC;;AAMA,SAASC,iBAAT,CAA2BC,CAA3B,EAAoE;EAClE,gBAAuBA,CAAC,CAACC,MAAzB;EAAA,IAAQL,IAAR,aAAQA,IAAR;EAAA,IAAcM,IAAd,aAAcA,IAAd;;EAEA,IAAIN,IAAI,KAAK,sBAAT,IAAmC,CAACM,IAAxC,EAA8C;IAC5C,OAAO,IAAP;EACD;;EAED,IACEC,UADF,GAIID,IAJJ,CACEC,UADF;EAAA,IAEkBN,aAFlB,GAIIK,IAJJ,CAEEE,cAFF;EAAA,IAGmBN,cAHnB,GAIII,IAJJ,CAGEG,eAHF;EAMA,IAAMC,gBAAkC,GAAG;IACzCV,IAAI,EAAE,EADmC;IAEzCC,aAAa,EAAEU,QAAQ,CAACV,aAAD,CAAR,GAA0B,CAACA,aAA3B,GAA2C,CAFjB;IAGzCC,cAAc,EAAES,QAAQ,CAACT,cAAD,CAAR,GAA2B,CAACA,cAA5B,GAA6C;EAHpB,CAA3C;;EAMA,QAAQK,UAAR;IACE,KAAK,cAAL;IACA,KAAK,sBAAL;IACA,KAAK,UAAL;MACEG,gBAAgB,CAACV,IAAjB,GAAwBO,UAAxB;EAJJ;;EAOA,OAAOG,gBAAP;AACD;;AAEDE,iBAAA,CAASC,SAAT,CAAmB,UAACT,CAAD,EAAoB;EACrC,IAAMM,gBAAgB,GAAGP,iBAAiB,CAACC,CAAD,CAA1C;;EAEA,IAAIM,gBAAJ,EAAsB;IACpBX,YAAY,GAAGW,gBAAf;EACD;AACF,CAND;;AAQO,SAASI,mBAAT,GAAiD;EACtD,sBACEC,KAAK,CAACC,QAAN,CAAiCjB,YAAjC,CADF;EAAA;EAAA,IAAOW,gBAAP;EAAA,IAAyBO,mBAAzB;;EAGA,IAAAC,oDAAA,EAA0B,YAAM;IAC9B,SAASC,cAAT,CAAwBf,CAAxB,EAAwC;MACtC,IAAMgB,mBAAmB,GAAGjB,iBAAiB,CAACC,CAAD,CAA7C;;MAEA,IAAIgB,mBAAJ,EAAyB;QACvBH,mBAAmB,CAACG,mBAAD,CAAnB;MACD;IACF;;IAEDR,iBAAA,CAASC,SAAT,CAAmBM,cAAnB;;IACA,OAAO,YAAM;MACXP,iBAAA,CAASS,WAAT,CAAqBF,cAArB;IACD,CAFD;EAGD,CAbD,EAaG,EAbH;EAeA,OAAOT,gBAAP;AACD"}
+{"version":3,"file":"useBridgeAdaptivity.js","names":["initialState","type","viewportWidth","viewportHeight","resolveAdaptivity","e","detail","data","adaptivity","viewport_width","viewport_height","bridgeAdaptivity","isFinite","vkBridge","subscribe","useBridgeAdaptivity","React","useState","setBridgeAdaptivity","useIsomorphicLayoutEffect","bridgeListener","newBridgeAdaptivity","unsubscribe"],"sources":["../../../src/hooks/useBridgeAdaptivity.ts"],"sourcesContent":["import * as React from \"react\";\nimport vkBridge from \"@vkontakte/vk-bridge\";\nimport { useIsomorphicLayoutEffect } from \"../lib/useIsomorphicLayoutEffect\";\n\nexport interface BridgeAdaptivity {\n  type: \"\" | \"force_mobile\" | \"force_mobile_compact\" | \"adaptive\";\n  viewportWidth: number;\n  viewportHeight: number;\n}\n\ninterface BridgeEvent {\n  detail: {\n    type: string;\n    data: {\n      [index: string]: any;\n    };\n  };\n}\n\nlet initialState: BridgeAdaptivity = {\n  type: \"\",\n  viewportWidth: 0,\n  viewportHeight: 0,\n};\n\nfunction resolveAdaptivity(e: BridgeEvent): BridgeAdaptivity | null {\n  const { type, data } = e.detail;\n\n  if (type !== \"VKWebAppUpdateConfig\" || !data) {\n    return null;\n  }\n\n  const {\n    adaptivity,\n    viewport_width: viewportWidth,\n    viewport_height: viewportHeight,\n  } = data;\n\n  const bridgeAdaptivity: BridgeAdaptivity = {\n    type: \"\",\n    viewportWidth: isFinite(viewportWidth) ? +viewportWidth : 0,\n    viewportHeight: isFinite(viewportHeight) ? +viewportHeight : 0,\n  };\n\n  switch (adaptivity) {\n    case \"force_mobile\":\n    case \"force_mobile_compact\":\n    case \"adaptive\":\n      bridgeAdaptivity.type = adaptivity;\n  }\n\n  return bridgeAdaptivity;\n}\n\nvkBridge.subscribe((e: BridgeEvent) => {\n  const bridgeAdaptivity = resolveAdaptivity(e);\n\n  if (bridgeAdaptivity) {\n    initialState = bridgeAdaptivity;\n  }\n});\n\nexport function useBridgeAdaptivity(): BridgeAdaptivity {\n  const [bridgeAdaptivity, setBridgeAdaptivity] =\n    React.useState<BridgeAdaptivity>(initialState);\n\n  useIsomorphicLayoutEffect(() => {\n    function bridgeListener(e: BridgeEvent) {\n      const newBridgeAdaptivity = resolveAdaptivity(e);\n\n      if (newBridgeAdaptivity) {\n        setBridgeAdaptivity(newBridgeAdaptivity);\n      }\n    }\n\n    vkBridge.subscribe(bridgeListener);\n    return () => {\n      vkBridge.unsubscribe(bridgeListener);\n    };\n  }, []);\n\n  return bridgeAdaptivity;\n}\n"],"mappings":";;;;;;;;;AAAA;AACA;AACA;AAiBA,IAAIA,YAA8B,GAAG;EACnCC,IAAI,EAAE,EAAE;EACRC,aAAa,EAAE,CAAC;EAChBC,cAAc,EAAE;AAClB,CAAC;AAED,SAASC,iBAAiB,CAACC,CAAc,EAA2B;EAClE,gBAAuBA,CAAC,CAACC,MAAM;IAAvBL,IAAI,aAAJA,IAAI;IAAEM,IAAI,aAAJA,IAAI;EAElB,IAAIN,IAAI,KAAK,sBAAsB,IAAI,CAACM,IAAI,EAAE;IAC5C,OAAO,IAAI;EACb;EAEA,IACEC,UAAU,GAGRD,IAAI,CAHNC,UAAU;IACMN,aAAa,GAE3BK,IAAI,CAFNE,cAAc;IACGN,cAAc,GAC7BI,IAAI,CADNG,eAAe;EAGjB,IAAMC,gBAAkC,GAAG;IACzCV,IAAI,EAAE,EAAE;IACRC,aAAa,EAAEU,QAAQ,CAACV,aAAa,CAAC,GAAG,CAACA,aAAa,GAAG,CAAC;IAC3DC,cAAc,EAAES,QAAQ,CAACT,cAAc,CAAC,GAAG,CAACA,cAAc,GAAG;EAC/D,CAAC;EAED,QAAQK,UAAU;IAChB,KAAK,cAAc;IACnB,KAAK,sBAAsB;IAC3B,KAAK,UAAU;MACbG,gBAAgB,CAACV,IAAI,GAAGO,UAAU;EAAC;EAGvC,OAAOG,gBAAgB;AACzB;AAEAE,iBAAQ,CAACC,SAAS,CAAC,UAACT,CAAc,EAAK;EACrC,IAAMM,gBAAgB,GAAGP,iBAAiB,CAACC,CAAC,CAAC;EAE7C,IAAIM,gBAAgB,EAAE;IACpBX,YAAY,GAAGW,gBAAgB;EACjC;AACF,CAAC,CAAC;AAEK,SAASI,mBAAmB,GAAqB;EACtD,sBACEC,KAAK,CAACC,QAAQ,CAAmBjB,YAAY,CAAC;IAAA;IADzCW,gBAAgB;IAAEO,mBAAmB;EAG5C,IAAAC,oDAAyB,EAAC,YAAM;IAC9B,SAASC,cAAc,CAACf,CAAc,EAAE;MACtC,IAAMgB,mBAAmB,GAAGjB,iBAAiB,CAACC,CAAC,CAAC;MAEhD,IAAIgB,mBAAmB,EAAE;QACvBH,mBAAmB,CAACG,mBAAmB,CAAC;MAC1C;IACF;IAEAR,iBAAQ,CAACC,SAAS,CAACM,cAAc,CAAC;IAClC,OAAO,YAAM;MACXP,iBAAQ,CAACS,WAAW,CAACF,cAAc,CAAC;IACtC,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,OAAOT,gBAAgB;AACzB"}