@vkontakte/vkui 5.3.2 → 5.4.1

package/dist/components/IconButton/IconButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { COMMON_WARNINGS, warnOnce } from '../../lib/warnOnce';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport styles from './IconButton.module.css';\n\nconst sizeYClassNames = {\n  none: styles['IconButton--sizeY-none'],\n  [SizeType.COMPACT]: styles['IconButton--sizeY-compact'],\n};\n\nexport interface IconButtonProps extends TappableProps {\n  children?: React.ReactNode;\n}\n\nconst warn = warnOnce('IconButton');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/IconButton\n */\nexport const IconButton = ({ children, className, ...restProps }: IconButtonProps) => {\n  const platform = usePlatform();\n  const { sizeY = 'none' } = useAdaptivity();\n\n  if (process.env.NODE_ENV === 'development') {\n    const isAccessible = restProps['aria-label'] || restProps['aria-labelledby'];\n\n    if (!isAccessible) {\n      warn(COMMON_WARNINGS.a11y[restProps.href ? 'link-name' : 'button-name'], 'error');\n    }\n  }\n\n  return (\n    <Tappable\n      activeEffectDelay={200}\n      activeMode=\"background\"\n      Component={restProps.href ? 'a' : 'button'}\n      {...restProps}\n      className={classNames(\n        styles['IconButton'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        platform === Platform.IOS && styles['IconButton--ios'],\n        className,\n      )}\n    >\n      {children}\n    </Tappable>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","usePlatform","SizeType","Platform","COMMON_WARNINGS","warnOnce","Tappable","sizeYClassNames","none","COMPACT","warn","IconButton","children","className","restProps","platform","sizeY","process","env","NODE_ENV","isAccessible","a11y","href","activeEffectDelay","activeMode","Component","REGULAR","IOS"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,eAAe,EAAEC,QAAQ,QAAQ,qBAAqB;AAC/D,SAASC,QAAQ,QAAuB,uBAAuB;AAG/D,IAAMC;IACJC,IAAI;GACHN,SAASO,OAAO;AAOnB,IAAMC,OAAOL,SAAS;AAEtB;;CAEC,GACD,OAAO,IAAMM,aAAa,iBAA4D;QAAzDC,kBAAAA,UAAUC,mBAAAA,WAAcC;QAAxBF;QAAUC;;IACrC,IAAME,WAAWd;IACjB,IAA2BD,iBAAAA,wCAAAA,eAAnBgB,OAAAA,0CAAQ;IAEhB,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,IAAMC,eAAeN,SAAS,CAAC,aAAa,IAAIA,SAAS,CAAC,kBAAkB;QAE5E,IAAI,CAACM,cAAc;YACjBV,KAAKN,gBAAgBiB,IAAI,CAACP,UAAUQ,IAAI,GAAG,cAAc,aAAa,CAAC,EAAE;QAC3E,CAAC;IACH,CAAC;IAED,qBACE,oBAAChB;QACCiB,mBAAmB;QACnBC,YAAW;QACXC,WAAWX,UAAUQ,IAAI,GAAG,MAAM,QAAQ;OACtCR;QACJD,WAAWd,6BAETiB,UAAUd,SAASwB,OAAO,IAAInB,eAAe,CAACS,MAAM,EACpDD,aAAaZ,SAASwB,GAAG,2BACzBd;QAGDD;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { COMMON_WARNINGS, warnOnce } from '../../lib/warnOnce';\nimport { HasChildren } from '../../types';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport styles from './IconButton.module.css';\n\nconst sizeYClassNames = {\n  none: styles['IconButton--sizeY-none'],\n  [SizeType.COMPACT]: styles['IconButton--sizeY-compact'],\n};\n\nexport interface IconButtonProps extends TappableProps, HasChildren {}\n\nconst warn = warnOnce('IconButton');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/IconButton\n */\nexport const IconButton = ({ children, className, ...restProps }: IconButtonProps) => {\n  const platform = usePlatform();\n  const { sizeY = 'none' } = useAdaptivity();\n\n  if (process.env.NODE_ENV === 'development') {\n    const isAccessible = restProps['aria-label'] || restProps['aria-labelledby'];\n\n    if (!isAccessible) {\n      warn(COMMON_WARNINGS.a11y[restProps.href ? 'link-name' : 'button-name'], 'error');\n    }\n  }\n\n  return (\n    <Tappable\n      activeEffectDelay={200}\n      activeMode=\"background\"\n      Component={restProps.href ? 'a' : 'button'}\n      {...restProps}\n      className={classNames(\n        styles['IconButton'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        platform === Platform.IOS && styles['IconButton--ios'],\n        className,\n      )}\n    >\n      {children}\n    </Tappable>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","usePlatform","SizeType","Platform","COMMON_WARNINGS","warnOnce","Tappable","sizeYClassNames","none","COMPACT","warn","IconButton","children","className","restProps","platform","sizeY","process","env","NODE_ENV","isAccessible","a11y","href","activeEffectDelay","activeMode","Component","REGULAR","IOS"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,eAAe,EAAEC,QAAQ,QAAQ,qBAAqB;AAE/D,SAASC,QAAQ,QAAuB,uBAAuB;AAG/D,IAAMC;IACJC,IAAI;GACHN,SAASO,OAAO;AAKnB,IAAMC,OAAOL,SAAS;AAEtB;;CAEC,GACD,OAAO,IAAMM,aAAa,iBAA4D;QAAzDC,kBAAAA,UAAUC,mBAAAA,WAAcC;QAAxBF;QAAUC;;IACrC,IAAME,WAAWd;IACjB,IAA2BD,iBAAAA,wCAAAA,eAAnBgB,OAAAA,0CAAQ;IAEhB,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,IAAMC,eAAeN,SAAS,CAAC,aAAa,IAAIA,SAAS,CAAC,kBAAkB;QAE5E,IAAI,CAACM,cAAc;YACjBV,KAAKN,gBAAgBiB,IAAI,CAACP,UAAUQ,IAAI,GAAG,cAAc,aAAa,CAAC,EAAE;QAC3E,CAAC;IACH,CAAC;IAED,qBACE,oBAAChB;QACCiB,mBAAmB;QACnBC,YAAW;QACXC,WAAWX,UAAUQ,IAAI,GAAG,MAAM,QAAQ;OACtCR;QACJD,WAAWd,6BAETiB,UAAUd,SAASwB,OAAO,IAAInB,eAAe,CAACS,MAAM,EACpDD,aAAaZ,SAASwB,GAAG,2BACzBd;QAGDD;AAGP,EAAE"}

package/dist/components/LocaleProvider/LocaleProvider.d.ts

@@ -9,9 +9,9 @@ export interface LocaleProviderProps {
 }
 /**
  * Компонент, прокидывающий локаль. Список можно найти в
- * [реестре языковых подмёток IANA](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)
+ * [реестре языковых подметок IANA](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)
  *
- * @version 5.0.0
+ * @since 5.0.0
  * @see https://vkcom.github.io/VKUI/#/LocaleProvider
  */
 export declare function LocaleProvider({ value, children }: LocaleProviderProps): JSX.Element;

package/dist/components/LocaleProvider/LocaleProvider.js

@@ -2,9 +2,9 @@ import React from "react";
 import { ConfigProviderOverride } from "../ConfigProvider/ConfigProviderOverride";
 /**
  * Компонент, прокидывающий локаль. Список можно найти в
- * [реестре языковых подмёток IANA](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)
+ * [реестре языковых подметок IANA](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)
  *
- * @version 5.0.0
+ * @since 5.0.0
  * @see https://vkcom.github.io/VKUI/#/LocaleProvider
  */ export function LocaleProvider(param) {
     var value = param.value, children = param.children;

package/dist/components/LocaleProvider/LocaleProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/LocaleProvider/LocaleProvider.tsx"],"sourcesContent":["import React from 'react';\nimport { ConfigProviderContextInterface } from '../ConfigProvider/ConfigProviderContext';\nimport { ConfigProviderOverride } from '../ConfigProvider/ConfigProviderOverride';\n\nexport interface LocaleProviderProps {\n  /**\n   * Строка с языковой меткой BCP 47\n   */\n  value: ConfigProviderContextInterface['locale'];\n  children: React.ReactNode;\n}\n\n/**\n * Компонент, прокидывающий локаль. Список можно найти в\n * [реестре языковых подмёток IANA](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)\n *\n * @version 5.0.0\n * @see https://vkcom.github.io/VKUI/#/LocaleProvider\n */\nexport function LocaleProvider({ value, children }: LocaleProviderProps) {\n  return <ConfigProviderOverride locale={value}>{children}</ConfigProviderOverride>;\n}\n"],"names":["React","ConfigProviderOverride","LocaleProvider","value","children","locale"],"mappings":"AAAA,OAAOA,WAAW,QAAQ;AAE1B,SAASC,sBAAsB,QAAQ,2CAA2C;AAUlF;;;;;;CAMC,GACD,OAAO,SAASC,eAAe,KAAwC,EAAE;QAAxCC,QAAF,MAAEA,OAAOC,WAAT,MAASA;IACtC,qBAAO,oBAACH;QAAuBI,QAAQF;OAAQC;AACjD,CAAC"}
+{"version":3,"sources":["../../../src/components/LocaleProvider/LocaleProvider.tsx"],"sourcesContent":["import React from 'react';\nimport { ConfigProviderContextInterface } from '../ConfigProvider/ConfigProviderContext';\nimport { ConfigProviderOverride } from '../ConfigProvider/ConfigProviderOverride';\n\nexport interface LocaleProviderProps {\n  /**\n   * Строка с языковой меткой BCP 47\n   */\n  value: ConfigProviderContextInterface['locale'];\n  children: React.ReactNode;\n}\n\n/**\n * Компонент, прокидывающий локаль. Список можно найти в\n * [реестре языковых подметок IANA](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)\n *\n * @since 5.0.0\n * @see https://vkcom.github.io/VKUI/#/LocaleProvider\n */\nexport function LocaleProvider({ value, children }: LocaleProviderProps) {\n  return <ConfigProviderOverride locale={value}>{children}</ConfigProviderOverride>;\n}\n"],"names":["React","ConfigProviderOverride","LocaleProvider","value","children","locale"],"mappings":"AAAA,OAAOA,WAAW,QAAQ;AAE1B,SAASC,sBAAsB,QAAQ,2CAA2C;AAUlF;;;;;;CAMC,GACD,OAAO,SAASC,eAAe,KAAwC,EAAE;QAAxCC,QAAF,MAAEA,OAAOC,WAAT,MAASA;IACtC,qBAAO,oBAACH;QAAuBI,QAAQF;OAAQC;AACjD,CAAC"}

package/dist/components/ModalPage/ModalPage.d.ts

@@ -42,4 +42,4 @@ export interface ModalPageProps extends React.HTMLAttributes<HTMLDivElement>, Na
 /**
  * @see https://vkcom.github.io/VKUI/#/ModalPage
  */
-export declare const ModalPage: ({ children, header, size: sizeProp, onOpen, onOpened, onClose, onClosed, settlingHeight, dynamicContentHeight, getModalContentRef, nav, id, hideCloseButton, className, ...restProps }: ModalPageProps) => JSX.Element;
+export declare const ModalPage: ({ children, header, size: sizeProp, onOpen, onOpened, onClose, onClosed, settlingHeight, dynamicContentHeight, getModalContentRef, nav, id: idProp, hideCloseButton, className, ...restProps }: ModalPageProps) => JSX.Element;

package/dist/components/ModalPage/ModalPage.js

@@ -4,6 +4,7 @@ import _object_without_properties from "@swc/helpers/src/_object_without_propert
 import * as React from "react";
 import { classNames } from "@vkontakte/vkjs";
 import { useAdaptivityWithJSMediaQueries } from "../../hooks/useAdaptivityWithJSMediaQueries";
+import { useId } from "../../hooks/useId";
 import { useOrientationChange } from "../../hooks/useOrientationChange";
 import { usePlatform } from "../../hooks/usePlatform";
 import { SizeType } from "../../lib/adaptivity";
@@ -14,6 +15,7 @@ import { warnOnce } from "../../lib/warnOnce";
 import { ModalDismissButton } from "../ModalDismissButton/ModalDismissButton";
 import { ModalRootContext, useModalRegistry } from "../ModalRoot/ModalRootContext";
 import { ModalType } from "../ModalRoot/types";
+import { ModalPageContext } from "./ModalPageContext";
 var sizeClassName = {
     s: "vkuiModalPage--size-s",
     m: "vkuiModalPage--size-m",
@@ -23,7 +25,7 @@ var warn = warnOnce("ModalPage");
 /**
  * @see https://vkcom.github.io/VKUI/#/ModalPage
  */ export var ModalPage = function(_param) {
-    var children = _param.children, header = _param.header, tmp = _param.size, sizeProp = tmp === void 0 ? "s" : tmp, onOpen = _param.onOpen, onOpened = _param.onOpened, onClose = _param.onClose, onClosed = _param.onClosed, settlingHeight = _param.settlingHeight, dynamicContentHeight = _param.dynamicContentHeight, getModalContentRef = _param.getModalContentRef, nav = _param.nav, id = _param.id, _param_hideCloseButton = _param.hideCloseButton, hideCloseButton = _param_hideCloseButton === void 0 ? false : _param_hideCloseButton, className = _param.className, restProps = _object_without_properties(_param, [
+    var children = _param.children, header = _param.header, tmp = _param.size, sizeProp = tmp === void 0 ? "s" : tmp, onOpen = _param.onOpen, onOpened = _param.onOpened, onClose = _param.onClose, onClosed = _param.onClosed, settlingHeight = _param.settlingHeight, dynamicContentHeight = _param.dynamicContentHeight, getModalContentRef = _param.getModalContentRef, nav = _param.nav, idProp = _param.id, _param_hideCloseButton = _param.hideCloseButton, hideCloseButton = _param_hideCloseButton === void 0 ? false : _param_hideCloseButton, className = _param.className, restProps = _object_without_properties(_param, [
         "children",
         "header",
         "size",
@@ -39,6 +41,8 @@ var warn = warnOnce("ModalPage");
         "hideCloseButton",
         "className"
     ]);
+    var generatingId = useId();
+    var id = idProp || generatingId;
     var updateModalHeight = React.useContext(ModalRootContext).updateModalHeight;
     var platform = usePlatform();
     var orientation = useOrientationChange();
@@ -55,7 +59,19 @@ var warn = warnOnce("ModalPage");
         nav: nav,
         id: id
     }, warn), ModalType.PAGE).refs;
-    return /*#__PURE__*/ React.createElement("div", _object_spread_props(_object_spread({}, restProps), {
+    var contextValue = React.useMemo(function() {
+        return {
+            labelId: "".concat(id, "-label")
+        };
+    }, [
+        id
+    ]);
+    return /*#__PURE__*/ React.createElement(ModalPageContext.Provider, {
+        value: contextValue
+    }, /*#__PURE__*/ React.createElement("div", _object_spread_props(_object_spread({}, restProps), {
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-labelledby": contextValue.labelId,
         id: id,
         className: classNames("vkuiModalPage", platform === Platform.IOS && "vkuiModalPage--ios", isDesktop && "vkuiModalPage--desktop", sizeX === SizeType.REGULAR && "vkuiInternalModalPage--sizeX-regular", typeof size === "string" && sizeClassName[size], className)
     }), /*#__PURE__*/ React.createElement("div", {
@@ -78,7 +94,7 @@ var warn = warnOnce("ModalPage");
         className: "vkuiModalPage__content-in"
     }, children))), isCloseButtonShown && /*#__PURE__*/ React.createElement(ModalDismissButton, {
         onClick: onClose || modalContext.onClose
-    }))));
+    })))));
 };
 
 //# sourceMappingURL=ModalPage.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ModalPage/ModalPage.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useOrientationChange } from '../../hooks/useOrientationChange';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { Platform } from '../../lib/platform';\nimport { multiRef } from '../../lib/utils';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { ModalRootContext, useModalRegistry } from '../ModalRoot/ModalRootContext';\nimport { ModalType } from '../ModalRoot/types';\nimport styles from './ModalPage.module.css';\n\nconst sizeClassName = {\n  s: styles['ModalPage--size-s'],\n  m: styles['ModalPage--size-m'],\n  l: styles['ModalPage--size-l'],\n};\n\nexport interface ModalPageProps extends React.HTMLAttributes<HTMLDivElement>, NavIdProps {\n  /**\n   * Шапка модальной страницы, `<ModalPageHeader />`\n   */\n  header?: React.ReactNode;\n  /**\n   * Задаёт контенту максимальную ширину для десктопной версии.\n   */\n  size?: 's' | 'm' | 'l' | number;\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  className,\n  ...restProps\n}: ModalPageProps) => {\n  const { updateModalHeight } = React.useContext(ModalRootContext);\n\n  const platform = usePlatform();\n  const orientation = useOrientationChange();\n  const { sizeX, isDesktop } = useAdaptivityWithJSMediaQueries();\n\n  React.useEffect(updateModalHeight, [children, orientation, updateModalHeight]);\n\n  const isCloseButtonShown = !hideCloseButton && isDesktop;\n  const size = isDesktop ? sizeProp : 's';\n\n  const modalContext = React.useContext(ModalRootContext);\n  const { refs } = useModalRegistry(getNavId({ nav, id }, warn), ModalType.PAGE);\n\n  return (\n    <div\n      {...restProps}\n      id={id}\n      className={classNames(\n        styles['ModalPage'],\n        platform === Platform.IOS && styles['ModalPage--ios'],\n        isDesktop && styles['ModalPage--desktop'],\n        sizeX === SizeType.REGULAR && 'vkuiInternalModalPage--sizeX-regular',\n        typeof size === 'string' && sizeClassName[size],\n        className,\n      )}\n    >\n      <div\n        className={styles['ModalPage__in-wrap']}\n        style={{\n          maxWidth: typeof size === 'number' ? size : undefined,\n        }}\n        ref={refs.innerElement}\n      >\n        <div className={styles['ModalPage__in']}>\n          <div className={styles['ModalPage__header']} ref={refs.headerElement}>\n            {header}\n          </div>\n\n          <div className={styles['ModalPage__content-wrap']}>\n            <div\n              className={styles['ModalPage__content']}\n              ref={multiRef<HTMLDivElement>(refs.contentElement, getModalContentRef)}\n            >\n              <div className={styles['ModalPage__content-in']}>{children}</div>\n            </div>\n          </div>\n          {isCloseButtonShown && <ModalDismissButton onClick={onClose || modalContext.onClose} />}\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","useOrientationChange","usePlatform","SizeType","getNavId","Platform","multiRef","warnOnce","ModalDismissButton","ModalRootContext","useModalRegistry","ModalType","sizeClassName","s","m","l","warn","ModalPage","children","header","sizeProp","size","onOpen","onOpened","onClose","onClosed","settlingHeight","dynamicContentHeight","getModalContentRef","nav","id","hideCloseButton","className","restProps","updateModalHeight","useContext","platform","orientation","sizeX","isDesktop","useEffect","isCloseButtonShown","modalContext","refs","PAGE","div","IOS","REGULAR","style","maxWidth","undefined","ref","innerElement","headerElement","contentElement","onClick"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,8CAA8C;AAC9F,SAASC,oBAAoB,QAAQ,mCAAmC;AACxE,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,QAAoB,qBAAqB;AAC1D,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,QAAQ,QAAQ,kBAAkB;AAC3C,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,kBAAkB,QAAQ,2CAA2C;AAC9E,SAASC,gBAAgB,EAAEC,gBAAgB,QAAQ,gCAAgC;AACnF,SAASC,SAAS,QAAQ,qBAAqB;AAG/C,IAAMC,gBAAgB;IACpBC,CAAC;IACDC,CAAC;IACDC,CAAC;AACH;AA0CA,IAAMC,OAAOT,SAAS;AAEtB;;CAEC,GACD,OAAO,IAAMU,YAAY,iBAgBH;QAfpBC,kBAAAA,UACAC,gBAAAA,QACMC,aAANC,MAAMD,WAAAA,iBAAW,MAAXA,KACNE,gBAAAA,QACAC,kBAAAA,UACAC,iBAAAA,SACAC,kBAAAA,UACAC,wBAAAA,gBACAC,8BAAAA,sBACAC,4BAAAA,oBACAC,aAAAA,KACAC,YAAAA,oCACAC,iBAAAA,sDAAkB,KAAK,2BACvBC,mBAAAA,WACGC;QAdHf;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAM,AAAEE,oBAAsBpC,MAAMqC,UAAU,CAAC1B,kBAAvCyB;IAER,IAAME,WAAWlC;IACjB,IAAMmC,cAAcpC;IACpB,IAA6BD,mCAAAA,mCAArBsC,QAAqBtC,iCAArBsC,OAAOC,YAAcvC,iCAAduC;IAEfzC,MAAM0C,SAAS,CAACN,mBAAmB;QAAChB;QAAUmB;QAAaH;KAAkB;IAE7E,IAAMO,qBAAqB,CAACV,mBAAmBQ;IAC/C,IAAMlB,OAAOkB,YAAYnB,WAAW,GAAG;IAEvC,IAAMsB,eAAe5C,MAAMqC,UAAU,CAAC1B;IACtC,IAAM,AAAEkC,OAASjC,iBAAiBN,SAAS;QAAEyB,KAAAA;QAAKC,IAAAA;IAAG,GAAGd,OAAOL,UAAUiC,IAAI,EAArED;IAER,qBACE,oBAACE,+CACKZ;QACJH,IAAIA;QACJE,WAAWjC,4BAETqC,aAAa/B,SAASyC,GAAG,0BACzBP,uCACAD,UAAUnC,SAAS4C,OAAO,IAAI,wCAC9B,OAAO1B,SAAS,YAAYT,aAAa,CAACS,KAAK,EAC/CW;sBAGF,oBAACa;QACCb,SAAS;QACTgB,OAAO;YACLC,UAAU,OAAO5B,SAAS,WAAWA,OAAO6B,SAAS;QACvD;QACAC,KAAKR,KAAKS,YAAY;qBAEtB,oBAACP;QAAIb,SAAS;qBACZ,oBAACa;QAAIb,SAAS;QAA+BmB,KAAKR,KAAKU,aAAa;OACjElC,uBAGH,oBAAC0B;QAAIb,SAAS;qBACZ,oBAACa;QACCb,SAAS;QACTmB,KAAK7C,SAAyBqC,KAAKW,cAAc,EAAE1B;qBAEnD,oBAACiB;QAAIb,SAAS;OAAoCd,aAGrDuB,oCAAsB,oBAACjC;QAAmB+C,SAAS/B,WAAWkB,aAAalB,OAAO;;AAK7F,EAAE"}
+{"version":3,"sources":["../../../src/components/ModalPage/ModalPage.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useId } from '../../hooks/useId';\nimport { useOrientationChange } from '../../hooks/useOrientationChange';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { Platform } from '../../lib/platform';\nimport { multiRef } from '../../lib/utils';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { ModalRootContext, useModalRegistry } from '../ModalRoot/ModalRootContext';\nimport { ModalType } from '../ModalRoot/types';\nimport { ModalPageContext } from './ModalPageContext';\nimport styles from './ModalPage.module.css';\n\nconst sizeClassName = {\n  s: styles['ModalPage--size-s'],\n  m: styles['ModalPage--size-m'],\n  l: styles['ModalPage--size-l'],\n};\n\nexport interface ModalPageProps extends React.HTMLAttributes<HTMLDivElement>, NavIdProps {\n  /**\n   * Шапка модальной страницы, `<ModalPageHeader />`\n   */\n  header?: React.ReactNode;\n  /**\n   * Задаёт контенту максимальную ширину для десктопной версии.\n   */\n  size?: 's' | 'm' | 'l' | number;\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: idProp,\n  hideCloseButton = false,\n  className,\n  ...restProps\n}: ModalPageProps) => {\n  const generatingId = useId();\n  const id = idProp || generatingId;\n\n  const { updateModalHeight } = React.useContext(ModalRootContext);\n\n  const platform = usePlatform();\n  const orientation = useOrientationChange();\n  const { sizeX, isDesktop } = useAdaptivityWithJSMediaQueries();\n\n  React.useEffect(updateModalHeight, [children, orientation, updateModalHeight]);\n\n  const isCloseButtonShown = !hideCloseButton && isDesktop;\n  const size = isDesktop ? sizeProp : 's';\n\n  const modalContext = React.useContext(ModalRootContext);\n  const { refs } = useModalRegistry(getNavId({ nav, id }, warn), ModalType.PAGE);\n\n  const contextValue = React.useMemo(() => ({ labelId: `${id}-label` }), [id]);\n\n  return (\n    <ModalPageContext.Provider value={contextValue}>\n      <div\n        {...restProps}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-labelledby={contextValue.labelId}\n        id={id}\n        className={classNames(\n          styles['ModalPage'],\n          platform === Platform.IOS && styles['ModalPage--ios'],\n          isDesktop && styles['ModalPage--desktop'],\n          sizeX === SizeType.REGULAR && 'vkuiInternalModalPage--sizeX-regular',\n          typeof size === 'string' && sizeClassName[size],\n          className,\n        )}\n      >\n        <div\n          className={styles['ModalPage__in-wrap']}\n          style={{\n            maxWidth: typeof size === 'number' ? size : undefined,\n          }}\n          ref={refs.innerElement}\n        >\n          <div className={styles['ModalPage__in']}>\n            <div className={styles['ModalPage__header']} ref={refs.headerElement}>\n              {header}\n            </div>\n\n            <div className={styles['ModalPage__content-wrap']}>\n              <div\n                className={styles['ModalPage__content']}\n                ref={multiRef<HTMLDivElement>(refs.contentElement, getModalContentRef)}\n              >\n                <div className={styles['ModalPage__content-in']}>{children}</div>\n              </div>\n            </div>\n            {isCloseButtonShown && <ModalDismissButton onClick={onClose || modalContext.onClose} />}\n          </div>\n        </div>\n      </div>\n    </ModalPageContext.Provider>\n  );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","useId","useOrientationChange","usePlatform","SizeType","getNavId","Platform","multiRef","warnOnce","ModalDismissButton","ModalRootContext","useModalRegistry","ModalType","ModalPageContext","sizeClassName","s","m","l","warn","ModalPage","children","header","sizeProp","size","onOpen","onOpened","onClose","onClosed","settlingHeight","dynamicContentHeight","getModalContentRef","nav","id","idProp","hideCloseButton","className","restProps","generatingId","updateModalHeight","useContext","platform","orientation","sizeX","isDesktop","useEffect","isCloseButtonShown","modalContext","refs","PAGE","contextValue","useMemo","labelId","Provider","value","div","role","aria-modal","aria-labelledby","IOS","REGULAR","style","maxWidth","undefined","ref","innerElement","headerElement","contentElement","onClick"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,8CAA8C;AAC9F,SAASC,KAAK,QAAQ,oBAAoB;AAC1C,SAASC,oBAAoB,QAAQ,mCAAmC;AACxE,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,QAAoB,qBAAqB;AAC1D,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,QAAQ,QAAQ,kBAAkB;AAC3C,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,kBAAkB,QAAQ,2CAA2C;AAC9E,SAASC,gBAAgB,EAAEC,gBAAgB,QAAQ,gCAAgC;AACnF,SAASC,SAAS,QAAQ,qBAAqB;AAC/C,SAASC,gBAAgB,QAAQ,qBAAqB;AAGtD,IAAMC,gBAAgB;IACpBC,CAAC;IACDC,CAAC;IACDC,CAAC;AACH;AA0CA,IAAMC,OAAOV,SAAS;AAEtB;;CAEC,GACD,OAAO,IAAMW,YAAY,iBAgBH;QAfpBC,kBAAAA,UACAC,gBAAAA,QACMC,aAANC,MAAMD,WAAAA,iBAAW,MAAXA,KACNE,gBAAAA,QACAC,kBAAAA,UACAC,iBAAAA,SACAC,kBAAAA,UACAC,wBAAAA,gBACAC,8BAAAA,sBACAC,4BAAAA,oBACAC,aAAAA,KACAC,AAAIC,gBAAJD,oCACAE,iBAAAA,sDAAkB,KAAK,2BACvBC,mBAAAA,WACGC;QAdHhB;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;;IAGA,IAAME,eAAepC;IACrB,IAAM+B,KAAKC,UAAUI;IAErB,IAAM,AAAEC,oBAAsBxC,MAAMyC,UAAU,CAAC7B,kBAAvC4B;IAER,IAAME,WAAWrC;IACjB,IAAMsC,cAAcvC;IACpB,IAA6BF,mCAAAA,mCAArB0C,QAAqB1C,iCAArB0C,OAAOC,YAAc3C,iCAAd2C;IAEf7C,MAAM8C,SAAS,CAACN,mBAAmB;QAAClB;QAAUqB;QAAaH;KAAkB;IAE7E,IAAMO,qBAAqB,CAACX,mBAAmBS;IAC/C,IAAMpB,OAAOoB,YAAYrB,WAAW,GAAG;IAEvC,IAAMwB,eAAehD,MAAMyC,UAAU,CAAC7B;IACtC,IAAM,AAAEqC,OAASpC,iBAAiBN,SAAS;QAAE0B,KAAAA;QAAKC,IAAAA;IAAG,GAAGd,OAAON,UAAUoC,IAAI,EAArED;IAER,IAAME,eAAenD,MAAMoD,OAAO,CAAC;eAAO;YAAEC,SAAS,AAAC,GAAK,OAAHnB,IAAG;QAAQ;OAAI;QAACA;KAAG;IAE3E,qBACE,oBAACnB,iBAAiBuC,QAAQ;QAACC,OAAOJ;qBAChC,oBAACK,+CACKlB;QACJmB,MAAK;QACLC,cAAW;QACXC,mBAAiBR,aAAaE,OAAO;QACrCnB,IAAIA;QACJG,WAAWpC,4BAETyC,aAAalC,SAASoD,GAAG,0BACzBf,uCACAD,UAAUtC,SAASuD,OAAO,IAAI,wCAC9B,OAAOpC,SAAS,YAAYT,aAAa,CAACS,KAAK,EAC/CY;sBAGF,oBAACmB;QACCnB,SAAS;QACTyB,OAAO;YACLC,UAAU,OAAOtC,SAAS,WAAWA,OAAOuC,SAAS;QACvD;QACAC,KAAKhB,KAAKiB,YAAY;qBAEtB,oBAACV;QAAInB,SAAS;qBACZ,oBAACmB;QAAInB,SAAS;QAA+B4B,KAAKhB,KAAKkB,aAAa;OACjE5C,uBAGH,oBAACiC;QAAInB,SAAS;qBACZ,oBAACmB;QACCnB,SAAS;QACT4B,KAAKxD,SAAyBwC,KAAKmB,cAAc,EAAEpC;qBAEnD,oBAACwB;QAAInB,SAAS;OAAoCf,aAGrDyB,oCAAsB,oBAACpC;QAAmB0D,SAASzC,WAAWoB,aAAapB,OAAO;;AAM/F,EAAE"}

package/dist/components/ModalPage/ModalPageContext.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+export interface ModalPageContextInterface {
+    labelId?: string;
+}
+export declare const ModalPageContext: React.Context<ModalPageContextInterface>;

package/dist/components/ModalPage/ModalPageContext.js

@@ -0,0 +1,4 @@
+import * as React from "react";
+export var ModalPageContext = /*#__PURE__*/ React.createContext({});
+
+//# sourceMappingURL=ModalPageContext.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/ModalPage/ModalPageContext.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport interface ModalPageContextInterface {\n  labelId?: string;\n}\n\nexport const ModalPageContext = React.createContext<ModalPageContextInterface>({});\n"],"names":["React","ModalPageContext","createContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAM/B,OAAO,IAAMC,iCAAmBD,MAAME,aAAa,CAA4B,CAAC,GAAG"}

package/dist/components/ModalPageHeader/ModalPageHeader.js

@@ -6,6 +6,7 @@ import { classNames } from "@vkontakte/vkjs";
 import { useAdaptivityWithJSMediaQueries } from "../../hooks/useAdaptivityWithJSMediaQueries";
 import { usePlatform } from "../../hooks/usePlatform";
 import { Platform } from "../../lib/platform";
+import { ModalPageContext } from "../ModalPage/ModalPageContext";
 import { PanelHeader } from "../PanelHeader/PanelHeader";
 import { Separator } from "../Separator/Separator";
 /**
@@ -20,6 +21,7 @@ import { Separator } from "../Separator/Separator";
     var platform = usePlatform();
     var hasSeparator = separator && platform === Platform.VKCOM;
     var isDesktop = useAdaptivityWithJSMediaQueries().isDesktop;
+    var labelId = React.useContext(ModalPageContext).labelId;
     return /*#__PURE__*/ React.createElement("div", {
         className: classNames("vkuiModalPageHeader", platform !== Platform.VKCOM && "vkuiModalPageHeader--withGaps", isDesktop && "vkuiModalPageHeader--desktop"),
         ref: getRef
@@ -29,7 +31,10 @@ import { Separator } from "../Separator/Separator";
         fixed: false,
         separator: false,
         transparent: true
-    }), children), hasSeparator && /*#__PURE__*/ React.createElement(Separator, {
+    }), /*#__PURE__*/ React.createElement(PanelHeader.Content, {
+        Component: "h2",
+        id: labelId
+    }, children)), hasSeparator && /*#__PURE__*/ React.createElement(Separator, {
         wide: true
     }));
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ModalPageHeader/ModalPageHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasRef } from '../../types';\nimport { PanelHeader, PanelHeaderProps } from '../PanelHeader/PanelHeader';\nimport { Separator } from '../Separator/Separator';\nimport styles from './ModalPageHeader.module.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  className,\n  ...restProps\n}: ModalPageHeaderProps) => {\n  const platform = usePlatform();\n  const hasSeparator = separator && platform === Platform.VKCOM;\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n\n  return (\n    <div\n      className={classNames(\n        styles['ModalPageHeader'],\n        platform !== Platform.VKCOM && styles['ModalPageHeader--withGaps'],\n        isDesktop && styles['ModalPageHeader--desktop'],\n      )}\n      ref={getRef}\n    >\n      <PanelHeader\n        className={classNames('vkuiInternalModalPageHeader__in', className)}\n        {...restProps}\n        fixed={false}\n        separator={false}\n        transparent\n      >\n        {children}\n      </PanelHeader>\n      {hasSeparator && <Separator wide />}\n    </div>\n  );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","usePlatform","Platform","PanelHeader","Separator","ModalPageHeader","children","separator","getRef","className","restProps","platform","hasSeparator","VKCOM","isDesktop","div","ref","fixed","transparent","wide"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,8CAA8C;AAC9F,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,qBAAqB;AAE9C,SAASC,WAAW,QAA0B,6BAA6B;AAC3E,SAASC,SAAS,QAAQ,yBAAyB;AAQnD;;CAEC,GACD,OAAO,IAAMC,kBAAkB,iBAMH;QAL1BC,kBAAAA,oCACAC,WAAAA,0CAAY,IAAI,qBAChBC,gBAAAA,QACAC,mBAAAA,WACGC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,IAAME,WAAWV;IACjB,IAAMW,eAAeL,aAAaI,aAAaT,SAASW,KAAK;IAC7D,IAAM,AAAEC,YAAcd,kCAAdc;IAER,qBACE,oBAACC;QACCN,WAAWV,kCAETY,aAAaT,SAASW,KAAK,qCAC3BC;QAEFE,KAAKR;qBAEL,oBAACL;QACCM,WAAWV,WAAW,mCAAmCU;OACrDC;QACJO,OAAO,KAAK;QACZV,WAAW,KAAK;QAChBW,aAAAA,IAAW;QAEVZ,WAEFM,8BAAgB,oBAACR;QAAUe,MAAAA,IAAI;;AAGtC,EAAE"}
+{"version":3,"sources":["../../../src/components/ModalPageHeader/ModalPageHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasRef } from '../../types';\nimport { ModalPageContext } from '../ModalPage/ModalPageContext';\nimport { PanelHeader, PanelHeaderProps } from '../PanelHeader/PanelHeader';\nimport { Separator } from '../Separator/Separator';\nimport styles from './ModalPageHeader.module.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  className,\n  ...restProps\n}: ModalPageHeaderProps) => {\n  const platform = usePlatform();\n  const hasSeparator = separator && platform === Platform.VKCOM;\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const { labelId } = React.useContext(ModalPageContext);\n\n  return (\n    <div\n      className={classNames(\n        styles['ModalPageHeader'],\n        platform !== Platform.VKCOM && styles['ModalPageHeader--withGaps'],\n        isDesktop && styles['ModalPageHeader--desktop'],\n      )}\n      ref={getRef}\n    >\n      <PanelHeader\n        className={classNames('vkuiInternalModalPageHeader__in', className)}\n        {...restProps}\n        fixed={false}\n        separator={false}\n        transparent\n      >\n        <PanelHeader.Content Component=\"h2\" id={labelId}>\n          {children}\n        </PanelHeader.Content>\n      </PanelHeader>\n      {hasSeparator && <Separator wide />}\n    </div>\n  );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","usePlatform","Platform","ModalPageContext","PanelHeader","Separator","ModalPageHeader","children","separator","getRef","className","restProps","platform","hasSeparator","VKCOM","isDesktop","labelId","useContext","div","ref","fixed","transparent","Content","Component","id","wide"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,8CAA8C;AAC9F,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,qBAAqB;AAE9C,SAASC,gBAAgB,QAAQ,gCAAgC;AACjE,SAASC,WAAW,QAA0B,6BAA6B;AAC3E,SAASC,SAAS,QAAQ,yBAAyB;AAQnD;;CAEC,GACD,OAAO,IAAMC,kBAAkB,iBAMH;QAL1BC,kBAAAA,oCACAC,WAAAA,0CAAY,IAAI,qBAChBC,gBAAAA,QACAC,mBAAAA,WACGC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,IAAME,WAAWX;IACjB,IAAMY,eAAeL,aAAaI,aAAaV,SAASY,KAAK;IAC7D,IAAM,AAAEC,YAAcf,kCAAde;IACR,IAAM,AAAEC,UAAYlB,MAAMmB,UAAU,CAACd,kBAA7Ba;IAER,qBACE,oBAACE;QACCR,WAAWX,kCAETa,aAAaV,SAASY,KAAK,qCAC3BC;QAEFI,KAAKV;qBAEL,oBAACL;QACCM,WAAWX,WAAW,mCAAmCW;OACrDC;QACJS,OAAO,KAAK;QACZZ,WAAW,KAAK;QAChBa,aAAAA,IAAW;sBAEX,oBAACjB,YAAYkB,OAAO;QAACC,WAAU;QAAKC,IAAIR;OACrCT,YAGJM,8BAAgB,oBAACR;QAAUoB,MAAAA,IAAI;;AAGtC,EAAE"}

package/dist/components/ModalRoot/ModalRoot.d.ts

@@ -1,28 +1,3 @@
 import * as React from 'react';
-import { HasPlatform } from '../../types';
-import { ConfigProviderContextInterface } from '../ConfigProvider/ConfigProviderContext';
-export interface ModalRootProps extends HasPlatform {
-    activeModal?: string | null;
-    /**
-     * Будет вызвано при начале открытия активной модалки с её id
-     */
-    onOpen?(modalId: string): void;
-    /**
-     * Будет вызвано при окончательном открытии активной модалки с её id
-     */
-    onOpened?(modalId: string): void;
-    /**
-     * Будет вызвано при начале закрытия активной модалки с её id
-     */
-    onClose?(modalId: string): void;
-    /**
-     * Будет вызвано при окончательном закрытии активной модалки с её id
-     */
-    onClosed?(modalId: string): void;
-    /**
-     * @ignore
-     */
-    configProvider?: ConfigProviderContextInterface;
-    children?: React.ReactNode;
-}
-export declare const ModalRootTouch: React.FC<Omit<ModalRootProps, "platform">>;
+import { ModalRootWithDOMProps } from './types';
+export declare const ModalRootTouch: React.FC<Omit<ModalRootWithDOMProps, "platform">>;

package/dist/components/ModalRoot/ModalRoot.js

@@ -64,11 +64,11 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
             return false;
         });
         _define_property(_assert_this_initialized(_this), "updateModalTranslate", function() {
-            var modalState = _this.getModalState(_this.props.activeModal);
+            var modalState = _this.props.getModalState(_this.props.activeModal);
             modalState && _this.animateTranslate(modalState, modalState.translateY);
         });
         _define_property(_assert_this_initialized(_this), "updateModalHeight", function() {
-            var modalState = _this.getModalState(_this.props.activeModal);
+            var modalState = _this.props.getModalState(_this.props.activeModal);
             if (modalState && modalState.type === ModalType.PAGE && modalState.dynamicContentHeight) {
                 if (_this.props.enteringModal) {
                     _this.waitTransitionFinish(modalState, function() {
@@ -87,7 +87,7 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
             if (_this.props.exitingModal) {
                 return;
             }
-            var modalState = _this.getModalState(_this.props.activeModal);
+            var modalState = _this.props.getModalState(_this.props.activeModal);
             if (!modalState) {
                 return;
             }
@@ -99,7 +99,7 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
             }
         });
         _define_property(_assert_this_initialized(_this), "onTouchEnd", function(e) {
-            var modalState = _this.getModalState(_this.props.activeModal);
+            var modalState = _this.props.getModalState(_this.props.activeModal);
             if ((modalState === null || modalState === void 0 ? void 0 : modalState.type) === ModalType.PAGE) {
                 return _this.onPageTouchEnd(e, modalState);
             }
@@ -114,7 +114,7 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
             if (!activeModal) {
                 return;
             }
-            var modalState = _this.getModalState(activeModal);
+            var modalState = _this.props.getModalState(activeModal);
             if ((modalState === null || modalState === void 0 ? void 0 : modalState.type) === ModalType.PAGE && (modalState === null || modalState === void 0 ? void 0 : (_modalState_contentElement = modalState.contentElement) === null || _modalState_contentElement === void 0 ? void 0 : _modalState_contentElement.contains(target))) {
                 modalState.contentScrolled = true;
                 if (modalState.contentScrollStopTimeout) {
@@ -132,14 +132,14 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
             dragging: false
         };
         _this.maskElementRef = /*#__PURE__*/ React.createRef();
-        var _this_getModalState;
+        var _this_props_getModalState;
         _this.modalRootContext = {
             updateModalHeight: _this.updateModalHeight,
             registerModal: function(_param) {
                 var id = _param.id, data = _object_without_properties(_param, [
                     "id"
                 ]);
-                return Object.assign((_this_getModalState = _this.getModalState(id)) !== null && _this_getModalState !== void 0 ? _this_getModalState : {}, data);
+                return Object.assign((_this_props_getModalState = _this.props.getModalState(id)) !== null && _this_props_getModalState !== void 0 ? _this_props_getModalState : {}, data);
             },
             onClose: function() {
                 return _this.props.onExit();
@@ -168,15 +168,6 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
                 return this.props.window;
             }
         },
-        {
-            key: "getModalState",
-            value: function getModalState(id) {
-                if (!id) {
-                    return undefined;
-                }
-                return this.props.getModalState(id);
-            }
-        },
         {
             key: "getModals",
             value: function getModals() {
@@ -211,7 +202,7 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
                 // transition phase 3: animate entering modal
                 if (this.props.enteringModal && this.props.enteringModal !== prevProps.enteringModal) {
                     var enteringModal = this.props.enteringModal;
-                    var enteringState = this.getModalState(enteringModal);
+                    var enteringState = this.props.getModalState(enteringModal);
                     this.props.onEnter();
                     this.waitTransitionFinish(enteringState, function() {
                         if (enteringState === null || enteringState === void 0 ? void 0 : enteringState.innerElement) {
@@ -260,7 +251,7 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
         {
             key: "checkPageContentHeight",
             value: function checkPageContentHeight() {
-                var modalState = this.getModalState(this.props.activeModal);
+                var modalState = this.props.getModalState(this.props.activeModal);
                 if ((modalState === null || modalState === void 0 ? void 0 : modalState.type) === ModalType.PAGE && (modalState === null || modalState === void 0 ? void 0 : modalState.modalElement)) {
                     var prevModalState = _object_spread({}, modalState);
                     initPageModal(modalState);
@@ -287,12 +278,12 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
                 this.setState({
                     touchDown: false
                 });
-                var prevModalState = this.getModalState(id);
+                var prevModalState = this.props.getModalState(id);
                 if (!prevModalState) {
                     id && warn("closeActiveModal: модальное окно (страница) ".concat(id, " не существует"), "error");
                     return;
                 }
-                var nextModalState = this.getModalState(this.props.activeModal);
+                var nextModalState = this.props.getModalState(this.props.activeModal);
                 var nextIsPage = !!nextModalState && nextModalState.type === ModalType.PAGE;
                 var prevIsPage = !!prevModalState && prevModalState.type === ModalType.PAGE;
                 this.waitTransitionFinish(prevModalState, function() {
@@ -558,7 +549,7 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
                     ref: this.viewportRef
                 }, this.getModals().map(function(Modal) {
                     var modalId = getNavId(Modal.props, warn);
-                    var _modalState = _this.getModalState(modalId);
+                    var _modalState = _this.props.getModalState(modalId);
                     if (modalId !== activeModal && modalId !== exitingModal || !_modalState) {
                         return null;
                     }
@@ -568,7 +559,7 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
                     return /*#__PURE__*/ React.createElement(FocusTrap, {
                         key: key,
                         getRootRef: function(e) {
-                            var modalState = _this.getModalState(modalId);
+                            var modalState = _this.props.getModalState(modalId);
                             if (modalState) {
                                 modalState.modalElement = e;
                             }