@vkontakte/vkui 4.37.0 → 5.0.0

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

@@ -1 +1 @@
-{"version":3,"file":"ModalCard.js","names":["warn","warnOnce","ModalCardComponent","icon","header","subheader","children","actions","actionsLayout","onClose","platform","viewWidth","viewHeight","hasMouse","nav","id","restProps","isDesktop","useAdaptivityIsDesktop","modalContext","React","useContext","ModalRootContext","useModalRegistry","getNavId","ModalType","CARD","refs","classNames","getClassName","innerElement","ModalCard","withAdaptivity","withPlatform","displayName"],"sources":["../../../../src/components/ModalCard/ModalCard.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { withPlatform } from \"../../hoc/withPlatform\";\nimport { HasPlatform } from \"../../types\";\nimport { withAdaptivity } from \"../../hoc/withAdaptivity\";\nimport {\n  ModalRootContext,\n  useModalRegistry,\n} from \"../ModalRoot/ModalRootContext\";\nimport { ModalType } from \"../ModalRoot/types\";\nimport { getNavId, NavIdProps } from \"../../lib/getNavId\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport {\n  ModalCardBase,\n  ModalCardBaseProps,\n} from \"../ModalCardBase/ModalCardBase\";\nimport {\n  AdaptivityContextInterface,\n  AdaptivityProps,\n} from \"../AdaptivityProvider/AdaptivityContext\";\nimport { useAdaptivityIsDesktop } from \"../../hooks/useAdaptivity\";\nimport \"./ModalCard.css\";\n\nexport interface ModalCardProps\n  extends HasPlatform,\n    AdaptivityProps,\n    NavIdProps,\n    ModalCardBaseProps {}\n\nconst warn = warnOnce(\"ModalCard\");\n\nconst ModalCardComponent = ({\n  icon,\n  header,\n  subheader,\n  children,\n  actions,\n  actionsLayout = \"horizontal\",\n  onClose,\n  platform,\n  viewWidth,\n  viewHeight,\n  hasMouse,\n  nav,\n  id,\n  ...restProps\n}: ModalCardProps & AdaptivityContextInterface) => {\n  const isDesktop = useAdaptivityIsDesktop();\n\n  const modalContext = React.useContext(ModalRootContext);\n  const { refs } = useModalRegistry(\n    getNavId({ nav, id }, warn),\n    ModalType.CARD\n  );\n\n  return (\n    <div\n      {...restProps}\n      id={id}\n      vkuiClass={classNames(\n        getClassName(\"ModalCard\", platform),\n        isDesktop && \"ModalCard--desktop\"\n      )}\n    >\n      <ModalCardBase\n        vkuiClass=\"ModalCard__in\"\n        getRootRef={refs.innerElement}\n        icon={icon}\n        header={header}\n        subheader={subheader}\n        actions={actions}\n        actionsLayout={actionsLayout}\n        onClose={onClose || modalContext.onClose}\n      >\n        {children}\n      </ModalCardBase>\n    </div>\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalCard\n */\nexport const ModalCard = withAdaptivity(withPlatform(ModalCardComponent), {\n  viewWidth: true,\n  viewHeight: true,\n  hasMouse: true,\n});\n\nModalCard.displayName = \"ModalCard\";\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;AACA;;AAIA;;AACA;;AACA;;AACA;;AAQA;;;AASA,IAAMA,IAAI,GAAG,IAAAC,kBAAA,EAAS,WAAT,CAAb;;AAEA,IAAMC,kBAAkB,GAAG,SAArBA,kBAAqB,OAewB;EAAA,IAdjDC,IAciD,QAdjDA,IAciD;EAAA,IAbjDC,MAaiD,QAbjDA,MAaiD;EAAA,IAZjDC,SAYiD,QAZjDA,SAYiD;EAAA,IAXjDC,QAWiD,QAXjDA,QAWiD;EAAA,IAVjDC,OAUiD,QAVjDA,OAUiD;EAAA,8BATjDC,aASiD;EAAA,IATjDA,aASiD,mCATjC,YASiC;EAAA,IARjDC,OAQiD,QARjDA,OAQiD;EAAA,IAPjDC,QAOiD,QAPjDA,QAOiD;EAAA,IANjDC,SAMiD,QANjDA,SAMiD;EAAA,IALjDC,UAKiD,QALjDA,UAKiD;EAAA,IAJjDC,QAIiD,QAJjDA,QAIiD;EAAA,IAHjDC,GAGiD,QAHjDA,GAGiD;EAAA,IAFjDC,EAEiD,QAFjDA,EAEiD;EAAA,IAD9CC,SAC8C;EACjD,IAAMC,SAAS,GAAG,IAAAC,qCAAA,GAAlB;EAEA,IAAMC,YAAY,GAAGC,KAAK,CAACC,UAAN,CAAiBC,kCAAjB,CAArB;;EACA,wBAAiB,IAAAC,kCAAA,EACf,IAAAC,kBAAA,EAAS;IAAEV,GAAG,EAAHA,GAAF;IAAOC,EAAE,EAAFA;EAAP,CAAT,EAAsBf,IAAtB,CADe,EAEfyB,gBAAA,CAAUC,IAFK,CAAjB;EAAA,IAAQC,IAAR,qBAAQA,IAAR;;EAKA,OACE,uEACMX,SADN;IAEE,EAAE,EAAED,EAFN;IAGE,SAAS,EAAE,IAAAa,sBAAA,EACT,IAAAC,0BAAA,EAAa,WAAb,EAA0BnB,QAA1B,CADS,EAETO,SAAS,IAAI,oBAFJ;EAHb,IAQE,qCAAC,4BAAD;IACE,SAAS,EAAC,eADZ;IAEE,UAAU,EAAEU,IAAI,CAACG,YAFnB;IAGE,IAAI,EAAE3B,IAHR;IAIE,MAAM,EAAEC,MAJV;IAKE,SAAS,EAAEC,SALb;IAME,OAAO,EAAEE,OANX;IAOE,aAAa,EAAEC,aAPjB;IAQE,OAAO,EAAEC,OAAO,IAAIU,YAAY,CAACV;EARnC,GAUGH,QAVH,CARF,CADF;AAuBD,CA/CD;AAiDA;AACA;AACA;;;AACO,IAAMyB,SAAS,GAAG,IAAAC,8BAAA,EAAe,IAAAC,0BAAA,EAAa/B,kBAAb,CAAf,EAAiD;EACxES,SAAS,EAAE,IAD6D;EAExEC,UAAU,EAAE,IAF4D;EAGxEC,QAAQ,EAAE;AAH8D,CAAjD,CAAlB;;AAMPkB,SAAS,CAACG,WAAV,GAAwB,WAAxB"}
+{"version":3,"file":"ModalCard.js","names":["warn","warnOnce","ModalCard","icon","header","subheader","children","actions","onClose","nav","id","restProps","useAdaptivityWithMediaQueries","isDesktop","platform","usePlatform","modalContext","React","useContext","ModalRootContext","useModalRegistry","getNavId","ModalType","CARD","refs","classNames","getPlatformClassName","innerElement"],"sources":["../../../../src/components/ModalCard/ModalCard.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { getPlatformClassName } from \"../../helpers/getPlatformClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport {\n  ModalRootContext,\n  useModalRegistry,\n} from \"../ModalRoot/ModalRootContext\";\nimport { ModalType } from \"../ModalRoot/types\";\nimport { getNavId, NavIdProps } from \"../../lib/getNavId\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport {\n  ModalCardBase,\n  ModalCardBaseProps,\n} from \"../ModalCardBase/ModalCardBase\";\nimport { useAdaptivityWithMediaQueries } from \"../../hooks/useAdaptivityWithMediaQueries\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport \"./ModalCard.css\";\n\nexport interface ModalCardProps extends NavIdProps, ModalCardBaseProps {}\n\nconst warn = warnOnce(\"ModalCard\");\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalCard\n */\nexport const ModalCard = ({\n  icon,\n  header,\n  subheader,\n  children,\n  actions,\n  onClose,\n  nav,\n  id,\n  ...restProps\n}: ModalCardProps) => {\n  const { isDesktop } = useAdaptivityWithMediaQueries();\n  const platform = usePlatform();\n\n  const modalContext = React.useContext(ModalRootContext);\n  const { refs } = useModalRegistry(\n    getNavId({ nav, id }, warn),\n    ModalType.CARD\n  );\n\n  return (\n    <div\n      {...restProps}\n      id={id}\n      vkuiClass={classNames(\n        \"ModalCard\",\n        getPlatformClassName(\"ModalCard\", platform),\n        isDesktop && \"ModalCard--desktop\"\n      )}\n    >\n      <ModalCardBase\n        vkuiClass=\"ModalCard__in\"\n        getRootRef={refs.innerElement}\n        icon={icon}\n        header={header}\n        subheader={subheader}\n        actions={actions}\n        onClose={onClose || modalContext.onClose}\n      >\n        {children}\n      </ModalCardBase>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAIA;;AACA;;AACA;;AACA;;AAIA;;AACA;;;AAKA,IAAMA,IAAI,GAAG,IAAAC,kBAAA,EAAS,WAAT,CAAb;AAEA;AACA;AACA;;AACO,IAAMC,SAAS,GAAG,SAAZA,SAAY,OAUH;EAAA,IATpBC,IASoB,QATpBA,IASoB;EAAA,IARpBC,MAQoB,QARpBA,MAQoB;EAAA,IAPpBC,SAOoB,QAPpBA,SAOoB;EAAA,IANpBC,QAMoB,QANpBA,QAMoB;EAAA,IALpBC,OAKoB,QALpBA,OAKoB;EAAA,IAJpBC,OAIoB,QAJpBA,OAIoB;EAAA,IAHpBC,GAGoB,QAHpBA,GAGoB;EAAA,IAFpBC,EAEoB,QAFpBA,EAEoB;EAAA,IADjBC,SACiB;;EACpB,4BAAsB,IAAAC,4DAAA,GAAtB;EAAA,IAAQC,SAAR,yBAAQA,SAAR;;EACA,IAAMC,QAAQ,GAAG,IAAAC,wBAAA,GAAjB;EAEA,IAAMC,YAAY,GAAGC,KAAK,CAACC,UAAN,CAAiBC,kCAAjB,CAArB;;EACA,wBAAiB,IAAAC,kCAAA,EACf,IAAAC,kBAAA,EAAS;IAAEZ,GAAG,EAAHA,GAAF;IAAOC,EAAE,EAAFA;EAAP,CAAT,EAAsBV,IAAtB,CADe,EAEfsB,gBAAA,CAAUC,IAFK,CAAjB;EAAA,IAAQC,IAAR,qBAAQA,IAAR;;EAKA,OACE,uEACMb,SADN;IAEE,EAAE,EAAED,EAFN;IAGE,SAAS,EAAE,IAAAe,sBAAA,EACT,WADS,EAET,IAAAC,0CAAA,EAAqB,WAArB,EAAkCZ,QAAlC,CAFS,EAGTD,SAAS,IAAI,oBAHJ;EAHb,IASE,qCAAC,4BAAD;IACE,SAAS,EAAC,eADZ;IAEE,UAAU,EAAEW,IAAI,CAACG,YAFnB;IAGE,IAAI,EAAExB,IAHR;IAIE,MAAM,EAAEC,MAJV;IAKE,SAAS,EAAEC,SALb;IAME,OAAO,EAAEE,OANX;IAOE,OAAO,EAAEC,OAAO,IAAIQ,YAAY,CAACR;EAPnC,GASGF,QATH,CATF,CADF;AAuBD,CA3CM"}

package/dist/cjs/components/ModalCardBase/ModalCardBase.js

@@ -21,12 +21,10 @@ var _Subhead = require("../Typography/Subhead/Subhead");
 
 var _classNames = require("../../lib/classNames");
 
-var _getClassName = require("../../helpers/getClassName");
+var _getPlatformClassName = require("../../helpers/getPlatformClassName");
 
 var _usePlatform = require("../../hooks/usePlatform");
 
-var _withAdaptivity = require("../../hoc/withAdaptivity");
-
 var _PanelHeaderButton = require("../PanelHeaderButton/PanelHeaderButton");
 
 var _platform = require("../../lib/platform");
@@ -37,35 +35,34 @@ var _icons = require("@vkontakte/icons");
 
 var _useKeyboard = require("../../hooks/useKeyboard");
 
-var _useAdaptivity = require("../../hooks/useAdaptivity");
+var _useAdaptivityWithMediaQueries = require("../../hooks/useAdaptivityWithMediaQueries");
 
-var _excluded = ["getRootRef", "icon", "header", "subheader", "children", "actions", "actionsLayout", "viewWidth", "hasMouse", "viewHeight", "onClose", "dismissLabel"];
+var _excluded = ["getRootRef", "icon", "header", "subheader", "children", "actions", "onClose", "actionsLayout", "dismissLabel"];
 
 /**
  * @see https://vkcom.github.io/VKUI/#/ModalCardBase
  */
-var ModalCardBase = (0, _withAdaptivity.withAdaptivity)(function (_ref) {
+var ModalCardBase = function ModalCardBase(_ref) {
   var getRootRef = _ref.getRootRef,
       icon = _ref.icon,
       header = _ref.header,
       subheader = _ref.subheader,
       children = _ref.children,
       actions = _ref.actions,
-      actionsLayout = _ref.actionsLayout,
-      viewWidth = _ref.viewWidth,
-      hasMouse = _ref.hasMouse,
-      viewHeight = _ref.viewHeight,
       onClose = _ref.onClose,
+      actionsLayout = _ref.actionsLayout,
       _ref$dismissLabel = _ref.dismissLabel,
       dismissLabel = _ref$dismissLabel === void 0 ? "Скрыть" : _ref$dismissLabel,
       restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var platform = (0, _usePlatform.usePlatform)();
-  var isDesktop = (0, _useAdaptivity.useAdaptivityIsDesktop)();
+
+  var _useAdaptivityWithMed = (0, _useAdaptivityWithMediaQueries.useAdaptivityWithMediaQueries)(),
+      isDesktop = _useAdaptivityWithMed.isDesktop;
+
   var isSoftwareKeyboardOpened = (0, _useKeyboard.useKeyboard)().isOpened;
-  var canShowCloseBtn = viewWidth >= _withAdaptivity.ViewWidth.SMALL_TABLET || platform === _platform.Platform.VKCOM;
-  var canShowCloseBtnIos = platform === _platform.IOS && !canShowCloseBtn;
+  var canShowCloseButtonIOS = platform === _platform.Platform.IOS && !isDesktop;
   return (0, _jsxRuntime.createScopedElement)("div", (0, _extends2.default)({}, restProps, {
-    vkuiClass: (0, _classNames.classNames)((0, _getClassName.getClassName)("ModalCardBase", platform), isDesktop && "ModalCardBase--desktop"),
+    vkuiClass: (0, _classNames.classNames)("ModalCardBase", (0, _getPlatformClassName.getPlatformClassName)("ModalCardBase", platform), isDesktop && "ModalCardBase--desktop"),
     ref: getRootRef
   }), (0, _jsxRuntime.createScopedElement)("div", {
     vkuiClass: (0, _classNames.classNames)("ModalCardBase__container", isSoftwareKeyboardOpened && "ModalCardBase__container--softwareKeyboardOpened")
@@ -79,18 +76,14 @@ var ModalCardBase = (0, _withAdaptivity.withAdaptivity)(function (_ref) {
     vkuiClass: "ModalCardBase__subheader"
   }, subheader), children, (0, _utils.hasReactNode)(actions) && (0, _jsxRuntime.createScopedElement)("div", {
     vkuiClass: (0, _classNames.classNames)("ModalCardBase__actions", actionsLayout === "vertical" && "ModalCardBase__actions--v")
-  }, actions), canShowCloseBtn && (0, _jsxRuntime.createScopedElement)(_ModalDismissButton.ModalDismissButton, {
+  }, actions), isDesktop && (0, _jsxRuntime.createScopedElement)(_ModalDismissButton.ModalDismissButton, {
     onClick: onClose
-  }), canShowCloseBtnIos && (0, _jsxRuntime.createScopedElement)(_PanelHeaderButton.PanelHeaderButton, {
+  }), canShowCloseButtonIOS && (0, _jsxRuntime.createScopedElement)(_PanelHeaderButton.PanelHeaderButton, {
     "aria-label": dismissLabel,
     vkuiClass: "ModalCardBase__dismiss",
     onClick: onClose
   }, (0, _jsxRuntime.createScopedElement)(_icons.Icon24Dismiss, null))));
-}, {
-  viewWidth: true,
-  viewHeight: true,
-  hasMouse: true
-});
+};
+
 exports.ModalCardBase = ModalCardBase;
-ModalCardBase.displayName = "ModalCardBase";
 //# sourceMappingURL=ModalCardBase.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ModalCardBase.js","names":["ModalCardBase","withAdaptivity","getRootRef","icon","header","subheader","children","actions","actionsLayout","viewWidth","hasMouse","viewHeight","onClose","dismissLabel","restProps","platform","usePlatform","isDesktop","useAdaptivityIsDesktop","isSoftwareKeyboardOpened","useKeyboard","isOpened","canShowCloseBtn","ViewWidth","SMALL_TABLET","Platform","VKCOM","canShowCloseBtnIos","IOS","classNames","getClassName","hasReactNode","displayName"],"sources":["../../../../src/components/ModalCardBase/ModalCardBase.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { Title } from \"../Typography/Title/Title\";\nimport { Subhead } from \"../Typography/Subhead/Subhead\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { ViewWidth, withAdaptivity } from \"../../hoc/withAdaptivity\";\nimport { HasRootRef } from \"../../types\";\nimport { PanelHeaderButton } from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { IOS, Platform } from \"../../lib/platform\";\nimport { ModalDismissButton } from \"../ModalDismissButton/ModalDismissButton\";\nimport { Icon24Dismiss } from \"@vkontakte/icons\";\nimport { useKeyboard } from \"../../hooks/useKeyboard\";\nimport { AdaptivityContextInterface } from \"../AdaptivityProvider/AdaptivityContext\";\nimport { useAdaptivityIsDesktop } from \"../../hooks/useAdaptivity\";\nimport \"./ModalCardBase.css\";\n\nexport interface ModalCardBaseProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Иконка.\n   *\n   * Может быть компонентом иконки, например, `<Icon56MoneyTransferOutline />`, или `<Avatar size={72} src=\"\" />`\n   */\n  icon?: React.ReactNode;\n\n  /**\n   * Заголовок карточки\n   */\n  header?: React.ReactNode;\n\n  /**\n   * Подзаголовок\n   */\n  subheader?: React.ReactNode;\n\n  /**\n   * Кнопки-действия.\n   *\n   * Рекомендуется использовать `<Button size=\"l\" mode=\"primary\" />` или `<Button size=\"l\" mode=\"secondary\" />`\n   */\n  actions?: React.ReactNode;\n\n  /**\n   * Тип отображения кнопок: вертикальный или горизонтальный\n   */\n  actionsLayout?: \"vertical\" | \"horizontal\";\n  onClose?: VoidFunction;\n\n  /**\n   * `aria-label` для кнопки закрытия. Необходим, чтобы кнопка была доступной.\n   */\n  dismissLabel?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalCardBase\n */\nexport const ModalCardBase = withAdaptivity<\n  ModalCardBaseProps & AdaptivityContextInterface\n>(\n  ({\n    getRootRef,\n    icon,\n    header,\n    subheader,\n    children,\n    actions,\n    actionsLayout,\n    viewWidth,\n    hasMouse,\n    viewHeight,\n    onClose,\n    dismissLabel = \"Скрыть\",\n    ...restProps\n  }) => {\n    const platform = usePlatform();\n    const isDesktop = useAdaptivityIsDesktop();\n    const isSoftwareKeyboardOpened = useKeyboard().isOpened;\n\n    const canShowCloseBtn =\n      viewWidth >= ViewWidth.SMALL_TABLET || platform === Platform.VKCOM;\n    const canShowCloseBtnIos = platform === IOS && !canShowCloseBtn;\n\n    return (\n      <div\n        {...restProps}\n        vkuiClass={classNames(\n          getClassName(\"ModalCardBase\", platform),\n          isDesktop && \"ModalCardBase--desktop\"\n        )}\n        ref={getRootRef}\n      >\n        <div\n          vkuiClass={classNames(\n            \"ModalCardBase__container\",\n            isSoftwareKeyboardOpened &&\n              \"ModalCardBase__container--softwareKeyboardOpened\"\n          )}\n        >\n          {hasReactNode(icon) && (\n            <div vkuiClass=\"ModalCardBase__icon\">{icon}</div>\n          )}\n          {hasReactNode(header) && (\n            <Title level=\"2\" weight=\"2\" vkuiClass=\"ModalCardBase__header\">\n              {header}\n            </Title>\n          )}\n          {hasReactNode(subheader) && (\n            <Subhead vkuiClass=\"ModalCardBase__subheader\">{subheader}</Subhead>\n          )}\n\n          {children}\n\n          {hasReactNode(actions) && (\n            <div\n              vkuiClass={classNames(\n                \"ModalCardBase__actions\",\n                actionsLayout === \"vertical\" && \"ModalCardBase__actions--v\"\n              )}\n            >\n              {actions}\n            </div>\n          )}\n\n          {canShowCloseBtn && <ModalDismissButton onClick={onClose} />}\n          {canShowCloseBtnIos && (\n            <PanelHeaderButton\n              aria-label={dismissLabel}\n              vkuiClass=\"ModalCardBase__dismiss\"\n              onClick={onClose}\n            >\n              <Icon24Dismiss />\n            </PanelHeaderButton>\n          )}\n        </div>\n      </div>\n    );\n  },\n  {\n    viewWidth: true,\n    viewHeight: true,\n    hasMouse: true,\n  }\n);\n\nModalCardBase.displayName = \"ModalCardBase\";\n"],"mappings":";;;;;;;;;;;;;;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AAEA;;;;AA0CA;AACA;AACA;AACO,IAAMA,aAAa,GAAG,IAAAC,8BAAA,EAG3B,gBAcM;EAAA,IAbJC,UAaI,QAbJA,UAaI;EAAA,IAZJC,IAYI,QAZJA,IAYI;EAAA,IAXJC,MAWI,QAXJA,MAWI;EAAA,IAVJC,SAUI,QAVJA,SAUI;EAAA,IATJC,QASI,QATJA,QASI;EAAA,IARJC,OAQI,QARJA,OAQI;EAAA,IAPJC,aAOI,QAPJA,aAOI;EAAA,IANJC,SAMI,QANJA,SAMI;EAAA,IALJC,QAKI,QALJA,QAKI;EAAA,IAJJC,UAII,QAJJA,UAII;EAAA,IAHJC,OAGI,QAHJA,OAGI;EAAA,6BAFJC,YAEI;EAAA,IAFJA,YAEI,kCAFW,QAEX;EAAA,IADDC,SACC;EACJ,IAAMC,QAAQ,GAAG,IAAAC,wBAAA,GAAjB;EACA,IAAMC,SAAS,GAAG,IAAAC,qCAAA,GAAlB;EACA,IAAMC,wBAAwB,GAAG,IAAAC,wBAAA,IAAcC,QAA/C;EAEA,IAAMC,eAAe,GACnBb,SAAS,IAAIc,yBAAA,CAAUC,YAAvB,IAAuCT,QAAQ,KAAKU,kBAAA,CAASC,KAD/D;EAEA,IAAMC,kBAAkB,GAAGZ,QAAQ,KAAKa,aAAb,IAAoB,CAACN,eAAhD;EAEA,OACE,uEACMR,SADN;IAEE,SAAS,EAAE,IAAAe,sBAAA,EACT,IAAAC,0BAAA,EAAa,eAAb,EAA8Bf,QAA9B,CADS,EAETE,SAAS,IAAI,wBAFJ,CAFb;IAME,GAAG,EAAEf;EANP,IAQE;IACE,SAAS,EAAE,IAAA2B,sBAAA,EACT,0BADS,EAETV,wBAAwB,IACtB,kDAHO;EADb,GAOG,IAAAY,mBAAA,EAAa5B,IAAb,KACC;IAAK,SAAS,EAAC;EAAf,GAAsCA,IAAtC,CARJ,EAUG,IAAA4B,mBAAA,EAAa3B,MAAb,KACC,qCAAC,YAAD;IAAO,KAAK,EAAC,GAAb;IAAiB,MAAM,EAAC,GAAxB;IAA4B,SAAS,EAAC;EAAtC,GACGA,MADH,CAXJ,EAeG,IAAA2B,mBAAA,EAAa1B,SAAb,KACC,qCAAC,gBAAD;IAAS,SAAS,EAAC;EAAnB,GAA+CA,SAA/C,CAhBJ,EAmBGC,QAnBH,EAqBG,IAAAyB,mBAAA,EAAaxB,OAAb,KACC;IACE,SAAS,EAAE,IAAAsB,sBAAA,EACT,wBADS,EAETrB,aAAa,KAAK,UAAlB,IAAgC,2BAFvB;EADb,GAMGD,OANH,CAtBJ,EAgCGe,eAAe,IAAI,qCAAC,sCAAD;IAAoB,OAAO,EAAEV;EAA7B,EAhCtB,EAiCGe,kBAAkB,IACjB,qCAAC,oCAAD;IACE,cAAYd,YADd;IAEE,SAAS,EAAC,wBAFZ;IAGE,OAAO,EAAED;EAHX,GAKE,qCAAC,oBAAD,OALF,CAlCJ,CARF,CADF;AAsDD,CAhF0B,EAiF3B;EACEH,SAAS,EAAE,IADb;EAEEE,UAAU,EAAE,IAFd;EAGED,QAAQ,EAAE;AAHZ,CAjF2B,CAAtB;;AAwFPV,aAAa,CAACgC,WAAd,GAA4B,eAA5B"}
+{"version":3,"file":"ModalCardBase.js","names":["ModalCardBase","getRootRef","icon","header","subheader","children","actions","onClose","actionsLayout","dismissLabel","restProps","platform","usePlatform","useAdaptivityWithMediaQueries","isDesktop","isSoftwareKeyboardOpened","useKeyboard","isOpened","canShowCloseButtonIOS","Platform","IOS","classNames","getPlatformClassName","hasReactNode"],"sources":["../../../../src/components/ModalCardBase/ModalCardBase.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { Title } from \"../Typography/Title/Title\";\nimport { Subhead } from \"../Typography/Subhead/Subhead\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getPlatformClassName } from \"../../helpers/getPlatformClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { HasRootRef } from \"../../types\";\nimport { PanelHeaderButton } from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { Platform } from \"../../lib/platform\";\nimport { ModalDismissButton } from \"../ModalDismissButton/ModalDismissButton\";\nimport { Icon24Dismiss } from \"@vkontakte/icons\";\nimport { useKeyboard } from \"../../hooks/useKeyboard\";\nimport { useAdaptivityWithMediaQueries } from \"../../hooks/useAdaptivityWithMediaQueries\";\nimport \"./ModalCardBase.css\";\n\nexport interface ModalCardBaseProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Иконка.\n   *\n   * Может быть компонентом иконки, например, `<Icon56MoneyTransferOutline />`, или `<Avatar size={72} src=\"\" />`\n   */\n  icon?: React.ReactNode;\n\n  /**\n   * Заголовок карточки\n   */\n  header?: React.ReactNode;\n\n  /**\n   * Подзаголовок\n   */\n  subheader?: React.ReactNode;\n\n  /**\n   * Кнопки-действия.\n   *\n   * Рекомендуется использовать `<Button size=\"l\" mode=\"primary\" />` или `<Button size=\"l\" mode=\"secondary\" />`\n   */\n  actions?: React.ReactNode;\n\n  /**\n   * Тип отображения кнопок: вертикальный или горизонтальный\n   */\n  actionsLayout?: \"vertical\" | \"horizontal\";\n  onClose?: VoidFunction;\n\n  /**\n   * `aria-label` для кнопки закрытия. Необходим, чтобы кнопка была доступной.\n   */\n  dismissLabel?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalCardBase\n */\nexport const ModalCardBase: React.FC<ModalCardBaseProps> = ({\n  getRootRef,\n  icon,\n  header,\n  subheader,\n  children,\n  actions,\n  onClose,\n  actionsLayout,\n  dismissLabel = \"Скрыть\",\n  ...restProps\n}) => {\n  const platform = usePlatform();\n  const { isDesktop } = useAdaptivityWithMediaQueries();\n  const isSoftwareKeyboardOpened = useKeyboard().isOpened;\n\n  const canShowCloseButtonIOS = platform === Platform.IOS && !isDesktop;\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass={classNames(\n        \"ModalCardBase\",\n        getPlatformClassName(\"ModalCardBase\", platform),\n        isDesktop && \"ModalCardBase--desktop\"\n      )}\n      ref={getRootRef}\n    >\n      <div\n        vkuiClass={classNames(\n          \"ModalCardBase__container\",\n          isSoftwareKeyboardOpened &&\n            \"ModalCardBase__container--softwareKeyboardOpened\"\n        )}\n      >\n        {hasReactNode(icon) && (\n          <div vkuiClass=\"ModalCardBase__icon\">{icon}</div>\n        )}\n        {hasReactNode(header) && (\n          <Title level=\"2\" weight=\"2\" vkuiClass=\"ModalCardBase__header\">\n            {header}\n          </Title>\n        )}\n        {hasReactNode(subheader) && (\n          <Subhead vkuiClass=\"ModalCardBase__subheader\">{subheader}</Subhead>\n        )}\n\n        {children}\n\n        {hasReactNode(actions) && (\n          <div\n            vkuiClass={classNames(\n              \"ModalCardBase__actions\",\n              actionsLayout === \"vertical\" && \"ModalCardBase__actions--v\"\n            )}\n          >\n            {actions}\n          </div>\n        )}\n\n        {isDesktop && <ModalDismissButton onClick={onClose} />}\n        {canShowCloseButtonIOS && (\n          <PanelHeaderButton\n            aria-label={dismissLabel}\n            vkuiClass=\"ModalCardBase__dismiss\"\n            onClick={onClose}\n          >\n            <Icon24Dismiss />\n          </PanelHeaderButton>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AA0CA;AACA;AACA;AACO,IAAMA,aAA2C,GAAG,SAA9CA,aAA8C,OAWrD;EAAA,IAVJC,UAUI,QAVJA,UAUI;EAAA,IATJC,IASI,QATJA,IASI;EAAA,IARJC,MAQI,QARJA,MAQI;EAAA,IAPJC,SAOI,QAPJA,SAOI;EAAA,IANJC,QAMI,QANJA,QAMI;EAAA,IALJC,OAKI,QALJA,OAKI;EAAA,IAJJC,OAII,QAJJA,OAII;EAAA,IAHJC,aAGI,QAHJA,aAGI;EAAA,6BAFJC,YAEI;EAAA,IAFJA,YAEI,kCAFW,QAEX;EAAA,IADDC,SACC;EACJ,IAAMC,QAAQ,GAAG,IAAAC,wBAAA,GAAjB;;EACA,4BAAsB,IAAAC,4DAAA,GAAtB;EAAA,IAAQC,SAAR,yBAAQA,SAAR;;EACA,IAAMC,wBAAwB,GAAG,IAAAC,wBAAA,IAAcC,QAA/C;EAEA,IAAMC,qBAAqB,GAAGP,QAAQ,KAAKQ,kBAAA,CAASC,GAAtB,IAA6B,CAACN,SAA5D;EAEA,OACE,uEACMJ,SADN;IAEE,SAAS,EAAE,IAAAW,sBAAA,EACT,eADS,EAET,IAAAC,0CAAA,EAAqB,eAArB,EAAsCX,QAAtC,CAFS,EAGTG,SAAS,IAAI,wBAHJ,CAFb;IAOE,GAAG,EAAEb;EAPP,IASE;IACE,SAAS,EAAE,IAAAoB,sBAAA,EACT,0BADS,EAETN,wBAAwB,IACtB,kDAHO;EADb,GAOG,IAAAQ,mBAAA,EAAarB,IAAb,KACC;IAAK,SAAS,EAAC;EAAf,GAAsCA,IAAtC,CARJ,EAUG,IAAAqB,mBAAA,EAAapB,MAAb,KACC,qCAAC,YAAD;IAAO,KAAK,EAAC,GAAb;IAAiB,MAAM,EAAC,GAAxB;IAA4B,SAAS,EAAC;EAAtC,GACGA,MADH,CAXJ,EAeG,IAAAoB,mBAAA,EAAanB,SAAb,KACC,qCAAC,gBAAD;IAAS,SAAS,EAAC;EAAnB,GAA+CA,SAA/C,CAhBJ,EAmBGC,QAnBH,EAqBG,IAAAkB,mBAAA,EAAajB,OAAb,KACC;IACE,SAAS,EAAE,IAAAe,sBAAA,EACT,wBADS,EAETb,aAAa,KAAK,UAAlB,IAAgC,2BAFvB;EADb,GAMGF,OANH,CAtBJ,EAgCGQ,SAAS,IAAI,qCAAC,sCAAD;IAAoB,OAAO,EAAEP;EAA7B,EAhChB,EAiCGW,qBAAqB,IACpB,qCAAC,oCAAD;IACE,cAAYT,YADd;IAEE,SAAS,EAAC,wBAFZ;IAGE,OAAO,EAAEF;EAHX,GAKE,qCAAC,oBAAD,OALF,CAlCJ,CATF,CADF;AAuDD,CAzEM"}

package/dist/cjs/components/ModalPage/ModalPage.js

@@ -17,16 +17,18 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 
 var React = _interopRequireWildcard(require("react"));
 
+var _getSizeXClassName = require("../../helpers/getSizeXClassName");
+
 var _classNames = require("../../lib/classNames");
 
+var _platform = require("../../lib/platform");
+
 var _ModalRootContext = require("../ModalRoot/ModalRootContext");
 
 var _usePlatform = require("../../hooks/usePlatform");
 
 var _useOrientationChange = require("../../hooks/useOrientationChange");
 
-var _withAdaptivity = require("../../hoc/withAdaptivity");
-
 var _ModalDismissButton = require("../ModalDismissButton/ModalDismissButton");
 
 var _utils = require("../../lib/utils");
@@ -37,22 +39,19 @@ var _getNavId = require("../../lib/getNavId");
 
 var _warnOnce = require("../../lib/warnOnce");
 
-var _platform = require("../../lib/platform");
-
-var _useAdaptivity = require("../../hooks/useAdaptivity");
+var _useAdaptivityWithMediaQueries = require("../../hooks/useAdaptivityWithMediaQueries");
 
-var _excluded = ["children", "header", "size", "viewWidth", "viewHeight", "sizeX", "hasMouse", "onOpen", "onOpened", "onClose", "onClosed", "settlingHeight", "dynamicContentHeight", "getModalContentRef", "nav", "id", "hideCloseButton"];
+var _excluded = ["children", "header", "size", "onOpen", "onOpened", "onClose", "onClosed", "settlingHeight", "dynamicContentHeight", "getModalContentRef", "nav", "id", "hideCloseButton"];
 var warn = (0, _warnOnce.warnOnce)("ModalPage");
+/**
+ * @see https://vkcom.github.io/VKUI/#/ModalPage
+ */
 
-var ModalPageComponent = function ModalPageComponent(_ref) {
+var ModalPage = function ModalPage(_ref) {
   var children = _ref.children,
       header = _ref.header,
       _ref$size = _ref.size,
       sizeProp = _ref$size === void 0 ? "s" : _ref$size,
-      viewWidth = _ref.viewWidth,
-      viewHeight = _ref.viewHeight,
-      sizeX = _ref.sizeX,
-      hasMouse = _ref.hasMouse,
       onOpen = _ref.onOpen,
       onOpened = _ref.onOpened,
       onClose = _ref.onClose,
@@ -71,8 +70,12 @@ var ModalPageComponent = function ModalPageComponent(_ref) {
 
   var platform = (0, _usePlatform.usePlatform)();
   var orientation = (0, _useOrientationChange.useOrientationChange)();
+
+  var _useAdaptivityWithMed = (0, _useAdaptivityWithMediaQueries.useAdaptivityWithMediaQueries)(),
+      sizeX = _useAdaptivityWithMed.sizeX,
+      isDesktop = _useAdaptivityWithMed.isDesktop;
+
   React.useEffect(updateModalHeight, [children, orientation, updateModalHeight]);
-  var isDesktop = (0, _useAdaptivity.useAdaptivityIsDesktop)();
   var isCloseButtonShown = !hideCloseButton && isDesktop;
   var size = isDesktop ? sizeProp : "s";
   var modalContext = React.useContext(_ModalRootContext.ModalRootContext);
@@ -85,8 +88,7 @@ var ModalPageComponent = function ModalPageComponent(_ref) {
 
   return (0, _jsxRuntime.createScopedElement)("div", (0, _extends2.default)({}, restProps, {
     id: id,
-    vkuiClass: (0, _classNames.classNames)("ModalPage", platform === _platform.Platform.IOS && "ModalPage--ios", platform === _platform.Platform.VKCOM && "ModalPage--vkcom", "ModalPage--sizeX-".concat(sizeX), // TODO v5.0.0 поправить под новую адаптивность
-    isDesktop && "ModalPage--desktop", size && "ModalPage--".concat(size))
+    vkuiClass: (0, _classNames.classNames)("ModalPage", platform === _platform.Platform.IOS && "ModalPage--ios", platform === _platform.Platform.VKCOM && "ModalPage--vkcom", (0, _getSizeXClassName.getSizeXClassName)("ModalPage", sizeX), isDesktop && "ModalPage--desktop", "ModalPage--size-".concat(size))
   }), (0, _jsxRuntime.createScopedElement)("div", {
     vkuiClass: "ModalPage__in-wrap",
     ref: refs.innerElement
@@ -106,17 +108,6 @@ var ModalPageComponent = function ModalPageComponent(_ref) {
     onClick: onClose || modalContext.onClose
   }))));
 };
-/**
- * @see https://vkcom.github.io/VKUI/#/ModalPage
- */
 
-
-var ModalPage = (0, _withAdaptivity.withAdaptivity)(ModalPageComponent, {
-  viewWidth: true,
-  viewHeight: true,
-  sizeX: true,
-  hasMouse: true
-});
 exports.ModalPage = ModalPage;
-ModalPage.displayName = "ModalPage";
 //# sourceMappingURL=ModalPage.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ModalPage.js","names":["warn","warnOnce","ModalPageComponent","children","header","size","sizeProp","viewWidth","viewHeight","sizeX","hasMouse","onOpen","onOpened","onClose","onClosed","settlingHeight","dynamicContentHeight","getModalContentRef","nav","id","hideCloseButton","restProps","React","useContext","ModalRootContext","updateModalHeight","platform","usePlatform","orientation","useOrientationChange","useEffect","isDesktop","useAdaptivityIsDesktop","isCloseButtonShown","modalContext","useModalRegistry","getNavId","ModalType","PAGE","refs","classNames","Platform","IOS","VKCOM","innerElement","headerElement","multiRef","contentElement","ModalPage","withAdaptivity","displayName"],"sources":["../../../../src/components/ModalPage/ModalPage.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport {\n  ModalRootContext,\n  useModalRegistry,\n} from \"../ModalRoot/ModalRootContext\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useOrientationChange } from \"../../hooks/useOrientationChange\";\nimport { withAdaptivity } from \"../../hoc/withAdaptivity\";\nimport {\n  AdaptivityContextInterface,\n  AdaptivityProps,\n} from \"../AdaptivityProvider/AdaptivityContext\";\nimport { ModalDismissButton } from \"../ModalDismissButton/ModalDismissButton\";\nimport { multiRef } from \"../../lib/utils\";\nimport { ModalType } from \"../ModalRoot/types\";\nimport { getNavId, NavIdProps } from \"../../lib/getNavId\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { Platform } from \"../../lib/platform\";\nimport { useAdaptivityIsDesktop } from \"../../hooks/useAdaptivity\";\nimport \"./ModalPage.css\";\n\nexport interface ModalPageProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    AdaptivityProps,\n    NavIdProps {\n  /**\n   * Шапка модальной страницы, `<ModalPageHeader />`\n   */\n  header?: React.ReactNode;\n  /**\n   * Задаёт контенту максимальную ширину.\n   *\n   * > ⚠️ **Заметки:**\n   * > - Для `viewWidth < SMALL_TABLET_SIZE` будет всегда `\"s\"`\n   * > - Для `platform === VKCOM` максимальная ширина зашита, её не изменить.\n   */\n  size?: \"s\" | \"m\" | \"l\";\n  /**\n   * Будет вызвано при начале открытия модалки.\n   */\n  onOpen?: VoidFunction;\n  /**\n   * Будет вызвано при окончательном открытии модалки.\n   */\n  onOpened?: VoidFunction;\n  /**\n   * Будет вызвано при начале закрытия модалки.\n   */\n  onClose?: VoidFunction;\n  /**\n   * Будет вызвано при окончательном закрытии модалки.\n   */\n  onClosed?: VoidFunction;\n  /**\n   * Процент, на который изначально будет открыта модальная страница. При `settlingHeight={100}` модальная страница раскрывается на всю высоту.\n   */\n  settlingHeight?: number;\n  /**\n   * Если высота контента в модальной странице может поменяться, нужно установить это свойство\n   */\n  dynamicContentHeight?: boolean;\n  getModalContentRef?: React.Ref<HTMLDivElement>;\n  /**\n   * Скрывает кнопку закрытия (актуально для iOS, т.к. можно отрисовать кнопку закрытия внутри модалки)\n   */\n  hideCloseButton?: boolean;\n}\n\nconst warn = warnOnce(\"ModalPage\");\n\nconst ModalPageComponent = ({\n  children,\n  header,\n  size: sizeProp = \"s\",\n  viewWidth,\n  viewHeight,\n  sizeX,\n  hasMouse,\n  onOpen,\n  onOpened,\n  onClose,\n  onClosed,\n  settlingHeight, // 75\n  dynamicContentHeight,\n  getModalContentRef,\n  nav,\n  id,\n  hideCloseButton = false,\n  ...restProps\n}: ModalPageProps & AdaptivityContextInterface) => {\n  const { updateModalHeight } = React.useContext(ModalRootContext);\n\n  const platform = usePlatform();\n  const orientation = useOrientationChange();\n\n  React.useEffect(updateModalHeight, [\n    children,\n    orientation,\n    updateModalHeight,\n  ]);\n\n  const isDesktop = useAdaptivityIsDesktop();\n  const isCloseButtonShown = !hideCloseButton && isDesktop;\n  const size = isDesktop ? sizeProp : \"s\";\n\n  const modalContext = React.useContext(ModalRootContext);\n  const { refs } = useModalRegistry(\n    getNavId({ nav, id }, warn),\n    ModalType.PAGE\n  );\n\n  return (\n    <div\n      {...restProps}\n      id={id}\n      vkuiClass={classNames(\n        \"ModalPage\",\n        platform === Platform.IOS && \"ModalPage--ios\",\n        platform === Platform.VKCOM && \"ModalPage--vkcom\",\n        `ModalPage--sizeX-${sizeX}`, // TODO v5.0.0 поправить под новую адаптивность\n        isDesktop && \"ModalPage--desktop\",\n        size && `ModalPage--${size}`\n      )}\n    >\n      <div vkuiClass=\"ModalPage__in-wrap\" ref={refs.innerElement}>\n        <div vkuiClass=\"ModalPage__in\">\n          <div vkuiClass=\"ModalPage__header\" ref={refs.headerElement}>\n            {header}\n          </div>\n\n          <div vkuiClass=\"ModalPage__content-wrap\">\n            <div\n              vkuiClass=\"ModalPage__content\"\n              ref={multiRef<HTMLDivElement>(\n                refs.contentElement,\n                getModalContentRef\n              )}\n            >\n              <div vkuiClass=\"ModalPage__content-in\">{children}</div>\n            </div>\n          </div>\n          {isCloseButtonShown && (\n            <ModalDismissButton onClick={onClose || modalContext.onClose} />\n          )}\n        </div>\n      </div>\n    </div>\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalPage\n */\nexport const ModalPage = withAdaptivity(ModalPageComponent, {\n  viewWidth: true,\n  viewHeight: true,\n  sizeX: true,\n  hasMouse: true,\n});\n\nModalPage.displayName = \"ModalPage\";\n"],"mappings":"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"}
+{"version":3,"file":"ModalPage.js","names":["warn","warnOnce","ModalPage","children","header","size","sizeProp","onOpen","onOpened","onClose","onClosed","settlingHeight","dynamicContentHeight","getModalContentRef","nav","id","hideCloseButton","restProps","React","useContext","ModalRootContext","updateModalHeight","platform","usePlatform","orientation","useOrientationChange","useAdaptivityWithMediaQueries","sizeX","isDesktop","useEffect","isCloseButtonShown","modalContext","useModalRegistry","getNavId","ModalType","PAGE","refs","classNames","Platform","IOS","VKCOM","getSizeXClassName","innerElement","headerElement","multiRef","contentElement"],"sources":["../../../../src/components/ModalPage/ModalPage.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { getSizeXClassName } from \"../../helpers/getSizeXClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { Platform } from \"../../lib/platform\";\nimport {\n  ModalRootContext,\n  useModalRegistry,\n} from \"../ModalRoot/ModalRootContext\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useOrientationChange } from \"../../hooks/useOrientationChange\";\nimport { ModalDismissButton } from \"../ModalDismissButton/ModalDismissButton\";\nimport { multiRef } from \"../../lib/utils\";\nimport { ModalType } from \"../ModalRoot/types\";\nimport { getNavId, NavIdProps } from \"../../lib/getNavId\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { useAdaptivityWithMediaQueries } from \"../../hooks/useAdaptivityWithMediaQueries\";\nimport \"./ModalPage.css\";\n\nexport interface ModalPageProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    NavIdProps {\n  /**\n   * Шапка модальной страницы, `<ModalPageHeader />`\n   */\n  header?: React.ReactNode;\n  /**\n   * Задаёт контенту максимальную ширину.\n   *\n   * > ⚠️ **Заметки:**\n   * > - Для `viewWidth < SMALL_TABLET_SIZE` будет всегда `\"s\"`\n   * > - Для `platform === VKCOM` максимальная ширина зашита, её не изменить.\n   */\n  size?: \"s\" | \"m\" | \"l\";\n  /**\n   * Будет вызвано при начале открытия модалки.\n   */\n  onOpen?: VoidFunction;\n  /**\n   * Будет вызвано при окончательном открытии модалки.\n   */\n  onOpened?: VoidFunction;\n  /**\n   * Будет вызвано при начале закрытия модалки.\n   */\n  onClose?: VoidFunction;\n  /**\n   * Будет вызвано при окончательном закрытии модалки.\n   */\n  onClosed?: VoidFunction;\n  /**\n   * Процент, на который изначально будет открыта модальная страница. При `settlingHeight={100}` модальная страница раскрывается на всю высоту.\n   */\n  settlingHeight?: number;\n  /**\n   * Если высота контента в модальной странице может поменяться, нужно установить это свойство\n   */\n  dynamicContentHeight?: boolean;\n  getModalContentRef?: React.Ref<HTMLDivElement>;\n  /**\n   * Скрывает кнопку закрытия (актуально для iOS, т.к. можно отрисовать кнопку закрытия внутри модалки)\n   */\n  hideCloseButton?: boolean;\n}\n\nconst warn = warnOnce(\"ModalPage\");\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalPage\n */\nexport const ModalPage = ({\n  children,\n  header,\n  size: sizeProp = \"s\",\n  onOpen,\n  onOpened,\n  onClose,\n  onClosed,\n  settlingHeight, // 75\n  dynamicContentHeight,\n  getModalContentRef,\n  nav,\n  id,\n  hideCloseButton = false,\n  ...restProps\n}: ModalPageProps) => {\n  const { updateModalHeight } = React.useContext(ModalRootContext);\n\n  const platform = usePlatform();\n  const orientation = useOrientationChange();\n  const { sizeX, isDesktop } = useAdaptivityWithMediaQueries();\n\n  React.useEffect(updateModalHeight, [\n    children,\n    orientation,\n    updateModalHeight,\n  ]);\n\n  const isCloseButtonShown = !hideCloseButton && isDesktop;\n  const size = isDesktop ? sizeProp : \"s\";\n\n  const modalContext = React.useContext(ModalRootContext);\n  const { refs } = useModalRegistry(\n    getNavId({ nav, id }, warn),\n    ModalType.PAGE\n  );\n\n  return (\n    <div\n      {...restProps}\n      id={id}\n      vkuiClass={classNames(\n        \"ModalPage\",\n        platform === Platform.IOS && \"ModalPage--ios\",\n        platform === Platform.VKCOM && \"ModalPage--vkcom\",\n        getSizeXClassName(\"ModalPage\", sizeX),\n        isDesktop && \"ModalPage--desktop\",\n        `ModalPage--size-${size}`\n      )}\n    >\n      <div vkuiClass=\"ModalPage__in-wrap\" ref={refs.innerElement}>\n        <div vkuiClass=\"ModalPage__in\">\n          <div vkuiClass=\"ModalPage__header\" ref={refs.headerElement}>\n            {header}\n          </div>\n\n          <div vkuiClass=\"ModalPage__content-wrap\">\n            <div\n              vkuiClass=\"ModalPage__content\"\n              ref={multiRef<HTMLDivElement>(\n                refs.contentElement,\n                getModalContentRef\n              )}\n            >\n              <div vkuiClass=\"ModalPage__content-in\">{children}</div>\n            </div>\n          </div>\n          {isCloseButtonShown && (\n            <ModalDismissButton onClick={onClose || modalContext.onClose} />\n          )}\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AAIA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;AAiDA,IAAMA,IAAI,GAAG,IAAAC,kBAAA,EAAS,WAAT,CAAb;AAEA;AACA;AACA;;AACO,IAAMC,SAAS,GAAG,SAAZA,SAAY,OAeH;EAAA,IAdpBC,QAcoB,QAdpBA,QAcoB;EAAA,IAbpBC,MAaoB,QAbpBA,MAaoB;EAAA,qBAZpBC,IAYoB;EAAA,IAZdC,QAYc,0BAZH,GAYG;EAAA,IAXpBC,MAWoB,QAXpBA,MAWoB;EAAA,IAVpBC,QAUoB,QAVpBA,QAUoB;EAAA,IATpBC,OASoB,QATpBA,OASoB;EAAA,IARpBC,QAQoB,QARpBA,QAQoB;EAAA,IAPpBC,cAOoB,QAPpBA,cAOoB;EAAA,IANpBC,oBAMoB,QANpBA,oBAMoB;EAAA,IALpBC,kBAKoB,QALpBA,kBAKoB;EAAA,IAJpBC,GAIoB,QAJpBA,GAIoB;EAAA,IAHpBC,EAGoB,QAHpBA,EAGoB;EAAA,gCAFpBC,eAEoB;EAAA,IAFpBA,eAEoB,qCAFF,KAEE;EAAA,IADjBC,SACiB;;EACpB,wBAA8BC,KAAK,CAACC,UAAN,CAAiBC,kCAAjB,CAA9B;EAAA,IAAQC,iBAAR,qBAAQA,iBAAR;;EAEA,IAAMC,QAAQ,GAAG,IAAAC,wBAAA,GAAjB;EACA,IAAMC,WAAW,GAAG,IAAAC,0CAAA,GAApB;;EACA,4BAA6B,IAAAC,4DAAA,GAA7B;EAAA,IAAQC,KAAR,yBAAQA,KAAR;EAAA,IAAeC,SAAf,yBAAeA,SAAf;;EAEAV,KAAK,CAACW,SAAN,CAAgBR,iBAAhB,EAAmC,CACjClB,QADiC,EAEjCqB,WAFiC,EAGjCH,iBAHiC,CAAnC;EAMA,IAAMS,kBAAkB,GAAG,CAACd,eAAD,IAAoBY,SAA/C;EACA,IAAMvB,IAAI,GAAGuB,SAAS,GAAGtB,QAAH,GAAc,GAApC;EAEA,IAAMyB,YAAY,GAAGb,KAAK,CAACC,UAAN,CAAiBC,kCAAjB,CAArB;;EACA,wBAAiB,IAAAY,kCAAA,EACf,IAAAC,kBAAA,EAAS;IAAEnB,GAAG,EAAHA,GAAF;IAAOC,EAAE,EAAFA;EAAP,CAAT,EAAsBf,IAAtB,CADe,EAEfkC,gBAAA,CAAUC,IAFK,CAAjB;EAAA,IAAQC,IAAR,qBAAQA,IAAR;;EAKA,OACE,uEACMnB,SADN;IAEE,EAAE,EAAEF,EAFN;IAGE,SAAS,EAAE,IAAAsB,sBAAA,EACT,WADS,EAETf,QAAQ,KAAKgB,kBAAA,CAASC,GAAtB,IAA6B,gBAFpB,EAGTjB,QAAQ,KAAKgB,kBAAA,CAASE,KAAtB,IAA+B,kBAHtB,EAIT,IAAAC,oCAAA,EAAkB,WAAlB,EAA+Bd,KAA/B,CAJS,EAKTC,SAAS,IAAI,oBALJ,4BAMUvB,IANV;EAHb,IAYE;IAAK,SAAS,EAAC,oBAAf;IAAoC,GAAG,EAAE+B,IAAI,CAACM;EAA9C,GACE;IAAK,SAAS,EAAC;EAAf,GACE;IAAK,SAAS,EAAC,mBAAf;IAAmC,GAAG,EAAEN,IAAI,CAACO;EAA7C,GACGvC,MADH,CADF,EAKE;IAAK,SAAS,EAAC;EAAf,GACE;IACE,SAAS,EAAC,oBADZ;IAEE,GAAG,EAAE,IAAAwC,eAAA,EACHR,IAAI,CAACS,cADF,EAEHhC,kBAFG;EAFP,GAOE;IAAK,SAAS,EAAC;EAAf,GAAwCV,QAAxC,CAPF,CADF,CALF,EAgBG2B,kBAAkB,IACjB,qCAAC,sCAAD;IAAoB,OAAO,EAAErB,OAAO,IAAIsB,YAAY,CAACtB;EAArD,EAjBJ,CADF,CAZF,CADF;AAqCD,CA1EM"}

package/dist/cjs/components/ModalPageHeader/ModalPageHeader.js

@@ -15,7 +15,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 
 var _usePlatform = require("../../hooks/usePlatform");
 
-var _useAdaptivity = require("../../hooks/useAdaptivity");
+var _useAdaptivityWithMediaQueries = require("../../hooks/useAdaptivityWithMediaQueries");
 
 var _platform = require("../../lib/platform");
 
@@ -25,6 +25,8 @@ var _PanelHeader = require("../PanelHeader/PanelHeader");
 
 var _classNames = require("../../lib/classNames");
 
+var _getPlatformClassName = require("../../helpers/getPlatformClassName");
+
 var _excluded = ["children", "separator", "getRef"];
 
 /**
@@ -37,11 +39,13 @@ var ModalPageHeader = function ModalPageHeader(_ref) {
       getRef = _ref.getRef,
       restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var platform = (0, _usePlatform.usePlatform)();
-  var hasSeparator = separator && platform === _platform.VKCOM; // TODO v5.0.0 поправить под новую адаптивность
+  var hasSeparator = separator && platform === _platform.Platform.VKCOM;
+
+  var _useAdaptivityWithMed = (0, _useAdaptivityWithMediaQueries.useAdaptivityWithMediaQueries)(),
+      isDesktop = _useAdaptivityWithMed.isDesktop;
 
-  var isDesktop = (0, _useAdaptivity.useAdaptivityIsDesktop)();
   return (0, _jsxRuntime.createScopedElement)("div", {
-    vkuiClass: (0, _classNames.classNames)("ModalPageHeader", platform !== _platform.VKCOM && "ModalPageHeader--withGaps", isDesktop && "ModalPageHeader--desktop"),
+    vkuiClass: (0, _classNames.classNames)("ModalPageHeader", (0, _getPlatformClassName.getPlatformClassName)("ModalPageHeader", platform), platform !== _platform.Platform.VKCOM && "ModalPageHeader--withGaps", isDesktop && "ModalPageHeader--desktop"),
     ref: getRef
   }, (0, _jsxRuntime.createScopedElement)(_PanelHeader.PanelHeader, (0, _extends2.default)({
     vkuiClass: "ModalPageHeader__in"

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

@@ -1 +1 @@
-{"version":3,"file":"ModalPageHeader.js","names":["ModalPageHeader","children","separator","getRef","restProps","platform","usePlatform","hasSeparator","VKCOM","isDesktop","useAdaptivityIsDesktop","classNames"],"sources":["../../../../src/components/ModalPageHeader/ModalPageHeader.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useAdaptivityIsDesktop } from \"../../hooks/useAdaptivity\";\nimport { HasRef } from \"../../types\";\nimport { VKCOM } from \"../../lib/platform\";\nimport { Separator } from \"../Separator/Separator\";\nimport { PanelHeader, PanelHeaderProps } from \"../PanelHeader/PanelHeader\";\nimport { classNames } from \"../../lib/classNames\";\nimport \"./ModalPageHeader.css\";\n\nexport interface ModalPageHeaderProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    Omit<PanelHeaderProps, \"fixed\" | \"shadow\">,\n    HasRef<HTMLDivElement> {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalPageHeader\n */\nexport const ModalPageHeader = ({\n  children,\n  separator = true,\n  getRef,\n  ...restProps\n}: ModalPageHeaderProps) => {\n  const platform = usePlatform();\n  const hasSeparator = separator && platform === VKCOM;\n  // TODO v5.0.0 поправить под новую адаптивность\n  const isDesktop = useAdaptivityIsDesktop();\n\n  return (\n    <div\n      vkuiClass={classNames(\n        \"ModalPageHeader\",\n        platform !== VKCOM && \"ModalPageHeader--withGaps\",\n        isDesktop && \"ModalPageHeader--desktop\"\n      )}\n      ref={getRef}\n    >\n      <PanelHeader\n        vkuiClass=\"ModalPageHeader__in\"\n        {...restProps}\n        fixed={false}\n        separator={false}\n        transparent\n      >\n        {children}\n      </PanelHeader>\n      {hasSeparator && <Separator wide />}\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;AACA;;AACA;;AAEA;;AACA;;AACA;;AACA;;;;AAQA;AACA;AACA;AACO,IAAMA,eAAe,GAAG,SAAlBA,eAAkB,OAKH;EAAA,IAJ1BC,QAI0B,QAJ1BA,QAI0B;EAAA,0BAH1BC,SAG0B;EAAA,IAH1BA,SAG0B,+BAHd,IAGc;EAAA,IAF1BC,MAE0B,QAF1BA,MAE0B;EAAA,IADvBC,SACuB;EAC1B,IAAMC,QAAQ,GAAG,IAAAC,wBAAA,GAAjB;EACA,IAAMC,YAAY,GAAGL,SAAS,IAAIG,QAAQ,KAAKG,eAA/C,CAF0B,CAG1B;;EACA,IAAMC,SAAS,GAAG,IAAAC,qCAAA,GAAlB;EAEA,OACE;IACE,SAAS,EAAE,IAAAC,sBAAA,EACT,iBADS,EAETN,QAAQ,KAAKG,eAAb,IAAsB,2BAFb,EAGTC,SAAS,IAAI,0BAHJ,CADb;IAME,GAAG,EAAEN;EANP,GAQE,qCAAC,wBAAD;IACE,SAAS,EAAC;EADZ,GAEMC,SAFN;IAGE,KAAK,EAAE,KAHT;IAIE,SAAS,EAAE,KAJb;IAKE,WAAW;EALb,IAOGH,QAPH,CARF,EAiBGM,YAAY,IAAI,qCAAC,oBAAD;IAAW,IAAI;EAAf,EAjBnB,CADF;AAqBD,CAhCM"}
+{"version":3,"file":"ModalPageHeader.js","names":["ModalPageHeader","children","separator","getRef","restProps","platform","usePlatform","hasSeparator","Platform","VKCOM","useAdaptivityWithMediaQueries","isDesktop","classNames","getPlatformClassName"],"sources":["../../../../src/components/ModalPageHeader/ModalPageHeader.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useAdaptivityWithMediaQueries } from \"../../hooks/useAdaptivityWithMediaQueries\";\nimport { HasRef } from \"../../types\";\nimport { Platform } from \"../../lib/platform\";\nimport { Separator } from \"../Separator/Separator\";\nimport { PanelHeader, PanelHeaderProps } from \"../PanelHeader/PanelHeader\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getPlatformClassName } from \"../../helpers/getPlatformClassName\";\nimport \"./ModalPageHeader.css\";\n\nexport interface ModalPageHeaderProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    Omit<PanelHeaderProps, \"fixed\" | \"shadow\">,\n    HasRef<HTMLDivElement> {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalPageHeader\n */\nexport const ModalPageHeader = ({\n  children,\n  separator = true,\n  getRef,\n  ...restProps\n}: ModalPageHeaderProps) => {\n  const platform = usePlatform();\n  const hasSeparator = separator && platform === Platform.VKCOM;\n  const { isDesktop } = useAdaptivityWithMediaQueries();\n\n  return (\n    <div\n      vkuiClass={classNames(\n        \"ModalPageHeader\",\n        getPlatformClassName(\"ModalPageHeader\", platform),\n        platform !== Platform.VKCOM && \"ModalPageHeader--withGaps\",\n        isDesktop && \"ModalPageHeader--desktop\"\n      )}\n      ref={getRef}\n    >\n      <PanelHeader\n        vkuiClass=\"ModalPageHeader__in\"\n        {...restProps}\n        fixed={false}\n        separator={false}\n        transparent\n      >\n        {children}\n      </PanelHeader>\n      {hasSeparator && <Separator wide />}\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;AACA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;AAQA;AACA;AACA;AACO,IAAMA,eAAe,GAAG,SAAlBA,eAAkB,OAKH;EAAA,IAJ1BC,QAI0B,QAJ1BA,QAI0B;EAAA,0BAH1BC,SAG0B;EAAA,IAH1BA,SAG0B,+BAHd,IAGc;EAAA,IAF1BC,MAE0B,QAF1BA,MAE0B;EAAA,IADvBC,SACuB;EAC1B,IAAMC,QAAQ,GAAG,IAAAC,wBAAA,GAAjB;EACA,IAAMC,YAAY,GAAGL,SAAS,IAAIG,QAAQ,KAAKG,kBAAA,CAASC,KAAxD;;EACA,4BAAsB,IAAAC,4DAAA,GAAtB;EAAA,IAAQC,SAAR,yBAAQA,SAAR;;EAEA,OACE;IACE,SAAS,EAAE,IAAAC,sBAAA,EACT,iBADS,EAET,IAAAC,0CAAA,EAAqB,iBAArB,EAAwCR,QAAxC,CAFS,EAGTA,QAAQ,KAAKG,kBAAA,CAASC,KAAtB,IAA+B,2BAHtB,EAITE,SAAS,IAAI,0BAJJ,CADb;IAOE,GAAG,EAAER;EAPP,GASE,qCAAC,wBAAD;IACE,SAAS,EAAC;EADZ,GAEMC,SAFN;IAGE,KAAK,EAAE,KAHT;IAIE,SAAS,EAAE,KAJb;IAKE,WAAW;EALb,IAOGH,QAPH,CATF,EAkBGM,YAAY,IAAI,qCAAC,oBAAD;IAAW,IAAI;EAAf,EAlBnB,CADF;AAsBD,CAhCM"}

package/dist/cjs/components/ModalRoot/ModalRoot.js

@@ -33,8 +33,6 @@ var _Touch = require("../Touch/Touch");
 
 var _TouchContext = _interopRequireDefault(require("../Touch/TouchContext"));
 
-var _getClassName = require("../../helpers/getClassName");
-
 var _classNames = require("../../lib/classNames");
 
 var _styles = require("../../lib/styles");
@@ -201,9 +199,11 @@ var ModalRootTouchComponent = /*#__PURE__*/function (_React$Component) {
     _this.modalRootContext = {
       updateModalHeight: _this.updateModalHeight,
       registerModal: function registerModal(_ref) {
+        var _this$getModalState;
+
         var id = _ref.id,
             data = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-        return Object.assign(_this.getModalState(id), data);
+        return Object.assign((_this$getModalState = _this.getModalState(id)) !== null && _this$getModalState !== void 0 ? _this$getModalState : {}, data);
       },
       onClose: function onClose() {
         return _this.props.onExit();
@@ -217,7 +217,7 @@ var ModalRootTouchComponent = /*#__PURE__*/function (_React$Component) {
   (0, _createClass2.default)(ModalRootTouchComponent, [{
     key: "timeout",
     get: function get() {
-      return this.props.platform === _platform.ANDROID || this.props.platform === _platform.VKCOM ? 320 : 400;
+      return this.props.platform === _platform.Platform.IOS ? 400 : 320;
     }
   }, {
     key: "document",
@@ -247,7 +247,7 @@ var ModalRootTouchComponent = /*#__PURE__*/function (_React$Component) {
     key: "componentDidMount",
     value: function componentDidMount() {
       // Отслеживаем изменение размеров viewport (Необходимо для iOS)
-      if (this.props.platform === _platform.IOS) {
+      if (this.props.platform === _platform.Platform.IOS) {
         var _this$window;
 
         (_this$window = this.window) === null || _this$window === void 0 ? void 0 : _this$window.addEventListener("resize", this.updateModalTranslate, false);
@@ -316,7 +316,7 @@ var ModalRootTouchComponent = /*#__PURE__*/function (_React$Component) {
         // некоторые браузеры на странных вендорах типа Meizu не удаляют обработчик.
         // https://github.com/VKCOM/VKUI/issues/444
         this.window.removeEventListener("touchmove", this.preventTouch, {
-          // @ts-ignore (В интерфейсе EventListenerOptions нет поля passive)
+          // @ts-expect-error (В интерфейсе EventListenerOptions нет поля passive)
           passive: false
         });
       } else {
@@ -441,7 +441,7 @@ var ModalRootTouchComponent = /*#__PURE__*/function (_React$Component) {
           dragging: true
         });
         var shiftYPercent = shiftY / this.window.innerHeight * 100;
-        var shiftYCurrent = (0, _touch.rubber)(shiftYPercent, 72, 0.8, this.props.platform === _platform.ANDROID || this.props.platform === _platform.VKCOM);
+        var shiftYCurrent = (0, _touch.rubber)(shiftYPercent, 72, 0.8, this.props.platform !== _platform.Platform.IOS);
         modalState.touchShiftYPercent = shiftYPercent;
         modalState.translateYCurrent = rangeTranslate(((_modalState$translate = modalState.translateY) !== null && _modalState$translate !== void 0 ? _modalState$translate : 0) + shiftYCurrent);
         this.animateTranslate(modalState, modalState.translateYCurrent);
@@ -468,7 +468,7 @@ var ModalRootTouchComponent = /*#__PURE__*/function (_React$Component) {
         }
 
         var shiftYPercent = shiftY / modalState.innerElement.offsetHeight * 100;
-        var shiftYCurrent = (0, _touch.rubber)(shiftYPercent, 72, 1.2, this.props.platform === _platform.ANDROID || this.props.platform === _platform.VKCOM);
+        var shiftYCurrent = (0, _touch.rubber)(shiftYPercent, 72, 1.2, this.props.platform !== _platform.Platform.IOS);
         modalState.touchShiftYPercent = shiftYPercent;
         modalState.translateYCurrent = Math.max(0, ((_modalState$translate2 = modalState.translateY) !== null && _modalState$translate2 !== void 0 ? _modalState$translate2 : 0) + shiftYCurrent);
         this.animateTranslate(modalState, modalState.translateYCurrent);
@@ -674,7 +674,7 @@ var ModalRootTouchComponent = /*#__PURE__*/function (_React$Component) {
       }, (0, _jsxRuntime.createScopedElement)(_ModalRootContext.ModalRootContext.Provider, {
         value: this.modalRootContext
       }, (0, _jsxRuntime.createScopedElement)(_Touch.Touch, {
-        vkuiClass: (0, _classNames.classNames)((0, _getClassName.getClassName)("ModalRoot", this.props.platform), ((_this$props$configPro = this.props.configProvider) === null || _this$props$configPro === void 0 ? void 0 : _this$props$configPro.webviewType) === _ConfigProviderContext.WebviewType.VKAPPS && "ModalRoot--vkapps", touchDown && "ModalRoot--touched", !!(enteringModal || exitingModal) && "ModalRoot--switching"),
+        vkuiClass: (0, _classNames.classNames)("ModalRoot", ((_this$props$configPro = this.props.configProvider) === null || _this$props$configPro === void 0 ? void 0 : _this$props$configPro.webviewType) === _ConfigProviderContext.WebviewType.VKAPPS && "ModalRoot--vkapps", touchDown && "ModalRoot--touched", !!(enteringModal || exitingModal) && "ModalRoot--switching"),
         onMove: this.onTouchMove,
         onEnd: this.onTouchEnd,
         onScroll: this.onScroll