@vkontakte/vkui 5.4.1 → 5.4.3

package/dist/components.js.tmp

@@ -11993,7 +11993,7 @@ function _unsupportedIterableToArray(o, minLen) {
             width: size,
             height: size
         }),
-        className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)(className, "vkuiImageBase", sizeClassName, withBorder && "vkuiImageBase--withBorder", loaded && "vkuiImageBase--loaded"),
+        className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)(className, "vkuiImageBase", sizeClassName, loaded && "vkuiImageBase--loaded"),
         role: hasSrc ? "img" : "presentation",
         "aria-label": ariaLabel,
         onClick: onClick
@@ -12015,7 +12015,10 @@ function _unsupportedIterableToArray(o, minLen) {
         onError: handleImageError
     }), fallbackIcon && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiImageBase__fallback")
-    }, fallbackIcon), children));
+    }, fallbackIcon), children, withBorder && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
+        "aria-hidden": true,
+        className: "vkuiImageBase__border"
+    })));
 };
 ImageBase.Badge = _ImageBaseBadge_ImageBaseBadge__WEBPACK_IMPORTED_MODULE_6__.ImageBaseBadge;
 ImageBase.Overlay = _ImageBaseOverlay_ImageBaseOverlay__WEBPACK_IMPORTED_MODULE_7__.ImageBaseOverlay;
@@ -14131,13 +14134,13 @@ var sizeXClassNames = (_obj = {
     }), /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Touch_Touch__WEBPACK_IMPORTED_MODULE_6__.Touch, {
         Component: _Tooltip_TooltipContainer__WEBPACK_IMPORTED_MODULE_7__.TooltipContainer,
         className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiPanel__in", "vkuiInternalPanel__in")
-    }, platform === _lib_platform__WEBPACK_IMPORTED_MODULE_8__.Platform.IOS && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
-        className: "vkuiInternalPanel__fade"
-    }), /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
+    }, /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         className: "vkuiPanel__in-before"
     }), centered ? /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         className: "vkuiPanel__centered"
-    }, children) : children, /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
+    }, children) : children, platform === _lib_platform__WEBPACK_IMPORTED_MODULE_8__.Platform.IOS && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
+        className: "vkuiInternalPanel__fade"
+    }), /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         className: "vkuiPanel__in-after"
     })));
 };
@@ -14351,16 +14354,17 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(9);
 /* harmony import */ var _hooks_useAdaptivity__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(68);
 /* harmony import */ var _hooks_useAdaptivityConditionalRender__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(164);
-/* harmony import */ var _hooks_usePlatform__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(108);
+/* harmony import */ var _hooks_usePlatform__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(108);
 /* harmony import */ var _lib_adaptivity__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(54);
-/* harmony import */ var _lib_platform__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(66);
-/* harmony import */ var _ConfigProvider_ConfigProviderContext__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(65);
+/* harmony import */ var _lib_platform__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(66);
+/* harmony import */ var _lib_warnOnce__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(129);
+/* harmony import */ var _ConfigProvider_ConfigProviderContext__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(65);
 /* harmony import */ var _FixedLayout_FixedLayout__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(120);
-/* harmony import */ var _ModalRoot_ModalRootContext__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(161);
+/* harmony import */ var _ModalRoot_ModalRootContext__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(161);
 /* harmony import */ var _Separator_Separator__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(162);
 /* harmony import */ var _Spacing_Spacing__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(168);
 /* harmony import */ var _Tooltip_TooltipContainer__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(123);
-/* harmony import */ var _Typography_Text_Text__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(91);
+/* harmony import */ var _Typography_Text_Text__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(91);
 /* harmony import */ var _PanelHeader_module_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(160);
 function _defineProperty(obj, key, value) {
     if (key in obj) {
@@ -14456,6 +14460,7 @@ function _objectWithoutPropertiesLoose(source, excluded) {
 
 
 
+
 var platformClassNames = {
     ios: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiPanelHeader--ios", "vkuiInternalPanelHeader--ios"),
     android: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiPanelHeader--android", "vkuiInternalPanelHeader--android"),
@@ -14465,24 +14470,27 @@ var sizeXClassNames = {
     none: "vkuiPanelHeader--sizeX-none",
     regular: "vkuiPanelHeader--sizeX-regular"
 };
-var PanelHeaderContent = function(param) {
-    var children = param.children, _param_Component = param.Component, Component = _param_Component === void 0 ? "span" : _param_Component, id = param.id;
-    var platform = (0,_hooks_usePlatform__WEBPACK_IMPORTED_MODULE_3__.usePlatform)();
-    return platform === _lib_platform__WEBPACK_IMPORTED_MODULE_4__.Platform.VKCOM ? /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Text_Text__WEBPACK_IMPORTED_MODULE_5__.Text, {
-        weight: "2",
-        Component: Component,
-        id: id
-    }, children) : /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(Component, {
-        className: "vkuiPanelHeader__content-in",
-        id: id
-    }, children);
-};
-PanelHeaderContent.displayName = "PanelHeaderContent";
 var PanelHeaderIn = function(param) {
-    var before = param.before, after = param.after, separator = param.separator, children = param.children;
-    var webviewType = (0,_ConfigProvider_ConfigProviderContext__WEBPACK_IMPORTED_MODULE_6__.useConfigProvider)().webviewType;
-    var isInsideModal = react__WEBPACK_IMPORTED_MODULE_0__.useContext(_ModalRoot_ModalRootContext__WEBPACK_IMPORTED_MODULE_7__.ModalRootContext).isInsideModal;
-    var platform = (0,_hooks_usePlatform__WEBPACK_IMPORTED_MODULE_3__.usePlatform)();
+    var before = param.before, after = param.after, separator = param.separator, children = param.children, _param_typographyProps = param.typographyProps, typographyProps = _param_typographyProps === void 0 ? {} : _param_typographyProps;
+    var _typographyProps_Component = typographyProps.Component, Component = _typographyProps_Component === void 0 ? "span" : _typographyProps_Component, restProps = _objectWithoutProperties(typographyProps, [
+        "Component"
+    ]);
+    var webviewType = (0,_ConfigProvider_ConfigProviderContext__WEBPACK_IMPORTED_MODULE_3__.useConfigProvider)().webviewType;
+    var isInsideModal = react__WEBPACK_IMPORTED_MODULE_0__.useContext(_ModalRoot_ModalRootContext__WEBPACK_IMPORTED_MODULE_4__.ModalRootContext).isInsideModal;
+    var platform = (0,_hooks_usePlatform__WEBPACK_IMPORTED_MODULE_5__.usePlatform)();
+    var typographyNode;
+    // TODO [>=6]: Удалить условие
+    if (/*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.isValidElement(children) && // eslint-disable-next-line @typescript-eslint/no-use-before-define
+    children.type.displayName === LegacyPanelHeaderContent.displayName) {
+        typographyNode = children;
+    } else {
+        typographyNode = platform === _lib_platform__WEBPACK_IMPORTED_MODULE_6__.Platform.VKCOM ? /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Text_Text__WEBPACK_IMPORTED_MODULE_7__.Text, _objectSpread({
+            weight: "2",
+            Component: Component
+        }, restProps), children) : /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(Component, _objectSpread({
+            className: "vkuiPanelHeader__content-in"
+        }, restProps), children);
+    }
     return /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Tooltip_TooltipContainer__WEBPACK_IMPORTED_MODULE_8__.TooltipContainer, {
         fixed: true,
         className: "vkuiPanelHeader__in"
@@ -14490,9 +14498,9 @@ var PanelHeaderIn = function(param) {
         className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiPanelHeader__before", "vkuiInternalPanelHeader__before")
     }, before), /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         className: "vkuiPanelHeader__content"
-    }, /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.isValidElement(children) && children.type.displayName === PanelHeaderContent.displayName ? children : /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(PanelHeaderContent, null, children)), /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
+    }, typographyNode), /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiPanelHeader__after", "vkuiInternalPanelHeader__after")
-    }, (webviewType === _ConfigProvider_ConfigProviderContext__WEBPACK_IMPORTED_MODULE_6__.WebviewType.INTERNAL || isInsideModal) && after)), separator && platform === _lib_platform__WEBPACK_IMPORTED_MODULE_4__.Platform.VKCOM && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Separator_Separator__WEBPACK_IMPORTED_MODULE_9__.Separator, {
+    }, (webviewType === _ConfigProvider_ConfigProviderContext__WEBPACK_IMPORTED_MODULE_3__.WebviewType.INTERNAL || isInsideModal) && after)), separator && platform === _lib_platform__WEBPACK_IMPORTED_MODULE_6__.Platform.VKCOM && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Separator_Separator__WEBPACK_IMPORTED_MODULE_9__.Separator, {
         className: "vkuiPanelHeader__separator",
         wide: true
     }));
@@ -14500,7 +14508,7 @@ var PanelHeaderIn = function(param) {
 /**
  * @see https://vkcom.github.io/VKUI/#/PanelHeader
  */ var PanelHeader = function(_param) {
-    var before = _param.before, children = _param.children, after = _param.after, _param_separator = _param.separator, separator = _param_separator === void 0 ? true : _param_separator, _param_visor = _param.visor, visor = _param_visor === void 0 ? true : _param_visor, _param_transparent = _param.transparent, transparent = _param_transparent === void 0 ? false : _param_transparent, shadow = _param.shadow, getRef = _param.getRef, getRootRef = _param.getRootRef, fixed = _param.fixed, className = _param.className, restProps = _objectWithoutProperties(_param, [
+    var before = _param.before, children = _param.children, after = _param.after, _param_separator = _param.separator, separator = _param_separator === void 0 ? true : _param_separator, _param_visor = _param.visor, visor = _param_visor === void 0 ? true : _param_visor, _param_transparent = _param.transparent, transparent = _param_transparent === void 0 ? false : _param_transparent, shadow = _param.shadow, getRef = _param.getRef, getRootRef = _param.getRootRef, fixed = _param.fixed, className = _param.className, typographyProps = _param.typographyProps, restProps = _objectWithoutProperties(_param, [
         "before",
         "children",
         "after",
@@ -14511,16 +14519,17 @@ var PanelHeaderIn = function(param) {
         "getRef",
         "getRootRef",
         "fixed",
-        "className"
+        "className",
+        "typographyProps"
     ]);
-    var platform = (0,_hooks_usePlatform__WEBPACK_IMPORTED_MODULE_3__.usePlatform)();
-    var webviewType = (0,_ConfigProvider_ConfigProviderContext__WEBPACK_IMPORTED_MODULE_6__.useConfigProvider)().webviewType;
-    var isInsideModal = react__WEBPACK_IMPORTED_MODULE_0__.useContext(_ModalRoot_ModalRootContext__WEBPACK_IMPORTED_MODULE_7__.ModalRootContext).isInsideModal;
+    var platform = (0,_hooks_usePlatform__WEBPACK_IMPORTED_MODULE_5__.usePlatform)();
+    var webviewType = (0,_ConfigProvider_ConfigProviderContext__WEBPACK_IMPORTED_MODULE_3__.useConfigProvider)().webviewType;
+    var isInsideModal = react__WEBPACK_IMPORTED_MODULE_0__.useContext(_ModalRoot_ModalRootContext__WEBPACK_IMPORTED_MODULE_4__.ModalRootContext).isInsideModal;
     var _useAdaptivity = (0,_hooks_useAdaptivity__WEBPACK_IMPORTED_MODULE_10__.useAdaptivity)(), _useAdaptivity_sizeX = _useAdaptivity.sizeX, sizeX = _useAdaptivity_sizeX === void 0 ? "none" : _useAdaptivity_sizeX;
     var _useAdaptivityConditionalRender = (0,_hooks_useAdaptivityConditionalRender__WEBPACK_IMPORTED_MODULE_11__.useAdaptivityConditionalRender)(), adaptiveSizeX = _useAdaptivityConditionalRender.sizeX;
-    var isFixed = fixed !== undefined ? fixed : platform !== _lib_platform__WEBPACK_IMPORTED_MODULE_4__.Platform.VKCOM;
+    var isFixed = fixed !== undefined ? fixed : platform !== _lib_platform__WEBPACK_IMPORTED_MODULE_6__.Platform.VKCOM;
     return /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", _objectSpreadProps(_objectSpread({}, restProps), {
-        className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiPanelHeader", "vkuiInternalPanelHeader", platformClassNames.hasOwnProperty(platform) ? platformClassNames[platform] : platformClassNames.android, transparent && "vkuiPanelHeader--trnsp", shadow && "vkuiPanelHeader--shadow", visor && (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiPanelHeader--vis", "vkuiInternalPanelHeader--vis"), separator && visor && (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiPanelHeader--sep", "vkuiInternalPanelHeader--sep"), webviewType === _ConfigProvider_ConfigProviderContext__WEBPACK_IMPORTED_MODULE_6__.WebviewType.VKAPPS && !isInsideModal && "vkuiPanelHeader--vkapps", !before && "vkuiPanelHeader--no-before", !after && "vkuiPanelHeader--no-after", isFixed && "vkuiPanelHeader--fixed", sizeX !== _lib_adaptivity__WEBPACK_IMPORTED_MODULE_12__.SizeType.COMPACT && sizeXClassNames[sizeX], className),
+        className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiPanelHeader", "vkuiInternalPanelHeader", platformClassNames.hasOwnProperty(platform) ? platformClassNames[platform] : platformClassNames.android, transparent && "vkuiPanelHeader--trnsp", shadow && "vkuiPanelHeader--shadow", visor && (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiPanelHeader--vis", "vkuiInternalPanelHeader--vis"), separator && visor && (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiPanelHeader--sep", "vkuiInternalPanelHeader--sep"), webviewType === _ConfigProvider_ConfigProviderContext__WEBPACK_IMPORTED_MODULE_3__.WebviewType.VKAPPS && !isInsideModal && "vkuiPanelHeader--vkapps", !before && (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiPanelHeader--no-before", "vkuiInternalPanelHeader--no-before"), !after && "vkuiPanelHeader--no-after", isFixed && "vkuiPanelHeader--fixed", sizeX !== _lib_adaptivity__WEBPACK_IMPORTED_MODULE_12__.SizeType.COMPACT && sizeXClassNames[sizeX], className),
         ref: isFixed ? getRootRef : getRef
     }), isFixed ? /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FixedLayout_FixedLayout__WEBPACK_IMPORTED_MODULE_13__.FixedLayout, {
         className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiPanelHeader__fixed", "vkuiInternalPanelHeader__fixed"),
@@ -14529,19 +14538,41 @@ var PanelHeaderIn = function(param) {
     }, /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(PanelHeaderIn, {
         before: before,
         after: after,
-        separator: separator
+        separator: separator,
+        typographyProps: typographyProps
     }, children)) : /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(PanelHeaderIn, {
         before: before,
         after: after,
-        separator: separator
-    }, children), separator && visor && platform !== _lib_platform__WEBPACK_IMPORTED_MODULE_4__.Platform.VKCOM && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, adaptiveSizeX.compact && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Separator_Separator__WEBPACK_IMPORTED_MODULE_9__.Separator, {
+        separator: separator,
+        typographyProps: typographyProps
+    }, children), separator && visor && platform !== _lib_platform__WEBPACK_IMPORTED_MODULE_6__.Platform.VKCOM && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, adaptiveSizeX.compact && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Separator_Separator__WEBPACK_IMPORTED_MODULE_9__.Separator, {
         className: adaptiveSizeX.compact.className
     }), adaptiveSizeX.regular && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Spacing_Spacing__WEBPACK_IMPORTED_MODULE_14__.Spacing, {
         className: adaptiveSizeX.regular.className,
         size: 16
     })));
 };
-PanelHeader.Content = PanelHeaderContent;
+var warn = (0,_lib_warnOnce__WEBPACK_IMPORTED_MODULE_15__.warnOnce)("PanelHeader");
+/**
+ * TODO [>=6]: Удалить подкомпонент
+ * @deprecated
+ */ var LegacyPanelHeaderContent = function(param) {
+    var children = param.children, _param_Component = param.Component, Component = _param_Component === void 0 ? "span" : _param_Component, id = param.id;
+    if (process.env.NODE_ENV === "development") {
+        warn("Подкомпонент PanelHeader.Content устарел и будет удалён в v6. Используйте параметр typographyProps.");
+    }
+    var platform = (0,_hooks_usePlatform__WEBPACK_IMPORTED_MODULE_5__.usePlatform)();
+    return platform === _lib_platform__WEBPACK_IMPORTED_MODULE_6__.Platform.VKCOM ? /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Text_Text__WEBPACK_IMPORTED_MODULE_7__.Text, {
+        weight: "2",
+        Component: Component,
+        id: id
+    }, children) : /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(Component, {
+        className: "vkuiPanelHeader__content-in",
+        id: id
+    }, children);
+};
+LegacyPanelHeaderContent.displayName = "LegacyPanelHeaderContent";
+PanelHeader.Content = LegacyPanelHeaderContent;
 
 
 /***/ }),
@@ -47680,8 +47711,9 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _lib_platform__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(66);
 /* harmony import */ var _ActionSheet_ActionSheetContext__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(236);
 /* harmony import */ var _Tappable_Tappable__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(101);
-/* harmony import */ var _Typography_Subhead_Subhead__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(95);
-/* harmony import */ var _Typography_Text_Text__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(91);
+/* harmony import */ var _Typography_Subhead_Subhead__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(95);
+/* harmony import */ var _Typography_Text_Text__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(91);
+/* harmony import */ var _Typography_Title_Title__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(85);
 /* harmony import */ var _ActionSheetItem_module_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(238);
 function _defineProperty(obj, key, value) {
     if (key in obj) {
@@ -47774,6 +47806,7 @@ function _objectWithoutPropertiesLoose(source, excluded) {
 
 
 
+
 /**
  * @see https://vkcom.github.io/VKUI/#/ActionSheetItem
  */ var ActionSheetItem = function(_param) {
@@ -47813,19 +47846,22 @@ function _objectWithoutPropertiesLoose(source, excluded) {
     }, restProps), {
         onClick: selectable ? onClick : onItemClick(onClick, onImmediateClick, Boolean(autoClose)),
         activeMode: platform === _lib_platform__WEBPACK_IMPORTED_MODULE_9__.Platform.IOS ? "vkuiActionSheetItem--active" : undefined,
-        className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiActionSheetItem", platform === _lib_platform__WEBPACK_IMPORTED_MODULE_9__.Platform.IOS && "vkuiActionSheetItem--ios", mode === "cancel" && "vkuiActionSheetItem--mode-cancel", mode === "destructive" && "vkuiActionSheetItem--mode-destructive", sizeY === _lib_adaptivity__WEBPACK_IMPORTED_MODULE_6__.SizeType.COMPACT && "vkuiActionSheetItem--sizeY-compact", isRich && "vkuiActionSheetItem--rich", isDesktop && "vkuiActionSheetItem--desktop", className)
+        className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiActionSheetItem", platform === _lib_platform__WEBPACK_IMPORTED_MODULE_9__.Platform.IOS && "vkuiActionSheetItem--ios", mode === "cancel" && "vkuiActionSheetItem--mode-cancel", mode === "destructive" && "vkuiActionSheetItem--mode-destructive", sizeY === _lib_adaptivity__WEBPACK_IMPORTED_MODULE_6__.SizeType.COMPACT && "vkuiActionSheetItem--sizeY-compact", isRich && "vkuiActionSheetItem--rich", isDesktop && "vkuiActionSheetItem--desktop", selectable && "vkuiActionSheetItem--selectable", className)
     }), before && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         className: "vkuiActionSheetItem__before"
     }, before), /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiActionSheetItem__container", !multiline && "vkuiActionSheetItem--ellipsis")
     }, /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiActionSheetItem__content", isCentered && "vkuiActionSheetItem--centered")
-    }, /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Text_Text__WEBPACK_IMPORTED_MODULE_11__.Text, {
-        weight: mode === "cancel" ? "2" : undefined,
+    }, platform === _lib_platform__WEBPACK_IMPORTED_MODULE_9__.Platform.IOS ? /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Title_Title__WEBPACK_IMPORTED_MODULE_11__.Title, {
+        className: "vkuiActionSheetItem__children",
+        weight: mode === "cancel" ? "2" : "3",
+        level: isCentered ? "2" : "3"
+    }, children) : /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Text_Text__WEBPACK_IMPORTED_MODULE_12__.Text, {
         className: "vkuiActionSheetItem__children"
-    }, children), meta && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Text_Text__WEBPACK_IMPORTED_MODULE_11__.Text, {
+    }, children), meta && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Text_Text__WEBPACK_IMPORTED_MODULE_12__.Text, {
         className: "vkuiActionSheetItem__meta"
-    }, meta)), subtitle && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Subhead_Subhead__WEBPACK_IMPORTED_MODULE_12__.Subhead, {
+    }, meta)), subtitle && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Subhead_Subhead__WEBPACK_IMPORTED_MODULE_13__.Subhead, {
         className: "vkuiActionSheetItem__subtitle"
     }, subtitle)), selectable && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         className: "vkuiActionSheetItem__after"
@@ -47922,7 +47958,7 @@ var ActionSheetDefaultIosCloseItem = function(props) {
     return /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_ActionSheetItem_ActionSheetItem__WEBPACK_IMPORTED_MODULE_1__.ActionSheetItem, _objectSpread({
         autoClose: true,
         mode: "cancel"
-    }, props), "Отменить");
+    }, props), "Отмена");
 };
 
 
@@ -48962,7 +48998,6 @@ function modalTransitionReducer(state, action) {
         state.onOpened = Modal.props.onOpened;
         state.onClose = Modal.props.onClose;
         state.onClosed = Modal.props.onClosed;
-        state.dynamicContentHeight = !!modalProps.dynamicContentHeight;
         // ModalPage props
         if (typeof modalProps.settlingHeight === "number") {
             state.settlingHeight = modalProps.settlingHeight;
@@ -49118,6 +49153,14 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _types__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(253);
 /* harmony import */ var _useModalManager__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(252);
 /* harmony import */ var _ModalRoot_module_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(251);
+function _arrayLikeToArray(arr, len) {
+    if (len == null || len > arr.length) len = arr.length;
+    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
+    return arr2;
+}
+function _arrayWithoutHoles(arr) {
+    if (Array.isArray(arr)) return _arrayLikeToArray(arr);
+}
 function _assertThisInitialized(self) {
     if (self === void 0) {
         throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
@@ -49175,6 +49218,12 @@ function _inherits(subClass, superClass) {
     });
     if (superClass) _setPrototypeOf(subClass, superClass);
 }
+function _iterableToArray(iter) {
+    if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
+}
+function _nonIterableSpread() {
+    throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
 function _objectSpread(target) {
     for(var i = 1; i < arguments.length; i++){
         var source = arguments[i] != null ? arguments[i] : {};
@@ -49230,10 +49279,21 @@ function _setPrototypeOf(o, p) {
     };
     return _setPrototypeOf(o, p);
 }
+function _toConsumableArray(arr) {
+    return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
+}
 var _typeof = function(obj) {
     "@swc/helpers - typeof";
     return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
 };
+function _unsupportedIterableToArray(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+    var n = Object.prototype.toString.call(o).slice(8, -1);
+    if (n === "Object" && o.constructor) n = o.constructor.name;
+    if (n === "Map" || n === "Set") return Array.from(n);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
 function _isNativeReflectConstruct() {
     if (typeof Reflect === "undefined" || !Reflect.construct) return false;
     if (Reflect.construct.sham) return false;
@@ -49316,13 +49376,9 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
             }
             return false;
         });
-        _defineProperty(_assertThisInitialized(_this), "updateModalTranslate", function() {
-            var modalState = _this.props.getModalState(_this.props.activeModal);
-            modalState && _this.animateTranslate(modalState, modalState.translateY);
-        });
         _defineProperty(_assertThisInitialized(_this), "updateModalHeight", function() {
             var modalState = _this.props.getModalState(_this.props.activeModal);
-            if (modalState && modalState.type === _types__WEBPACK_IMPORTED_MODULE_5__.ModalType.PAGE && modalState.dynamicContentHeight) {
+            if (modalState && modalState.type === _types__WEBPACK_IMPORTED_MODULE_5__.ModalType.PAGE) {
                 if (_this.props.enteringModal) {
                     _this.waitTransitionFinish(modalState, function() {
                         requestAnimationFrame(function() {
@@ -49382,7 +49438,8 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
         });
         _this.state = {
             touchDown: false,
-            dragging: false
+            dragging: false,
+            modalOpenedLog: []
         };
         _this.maskElementRef = /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createRef();
         var _this_props_getModalState;
@@ -49430,18 +49487,16 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
         {
             key: "componentDidMount",
             value: function componentDidMount() {
-                // Отслеживаем изменение размеров viewport (Необходимо для iOS)
-                if (this.props.platform === _lib_platform__WEBPACK_IMPORTED_MODULE_6__.Platform.IOS) {
-                    var _this_window;
-                    (_this_window = this.window) === null || _this_window === void 0 ? void 0 : _this_window.addEventListener("resize", this.updateModalTranslate, false);
-                }
+                var // Отслеживаем изменение размеров viewport
+                _this_window;
+                (_this_window = this.window) === null || _this_window === void 0 ? void 0 : _this_window.addEventListener("resize", this.updateModalHeight, false);
             }
         },
         {
             key: "componentWillUnmount",
             value: function componentWillUnmount() {
                 this.toggleDocumentScrolling(true);
-                this.window.removeEventListener("resize", this.updateModalTranslate, false);
+                this.window.removeEventListener("resize", this.updateModalHeight, false);
             }
         },
         {
@@ -49536,6 +49591,15 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
                     id && warn("closeActiveModal: модальное окно (страница) ".concat(id, " не существует"), "error");
                     return;
                 }
+                if (!this.state.modalOpenedLog.length) {
+                    this.setState(function(prevState) {
+                        return {
+                            modalOpenedLog: _toConsumableArray(prevState.modalOpenedLog).concat([
+                                id
+                            ])
+                        };
+                    });
+                }
                 var nextModalState = this.props.getModalState(this.props.activeModal);
                 var nextIsPage = !!nextModalState && nextModalState.type === _types__WEBPACK_IMPORTED_MODULE_5__.ModalType.PAGE;
                 var prevIsPage = !!prevModalState && prevModalState.type === _types__WEBPACK_IMPORTED_MODULE_5__.ModalType.PAGE;
@@ -49548,6 +49612,19 @@ var ModalRootTouchComponent = /*#__PURE__*/ function(_React_Component) {
                 if (!nextModalState) {
                     // NOTE: was only for clean exit
                     this.setMaskOpacity(prevModalState, 0);
+                    this.setState({
+                        modalOpenedLog: []
+                    });
+                    prevModalState.translateY = undefined;
+                } else if (nextModalState.id && !this.state.modalOpenedLog.includes(nextModalState.id)) {
+                    nextModalState.translateY = undefined;
+                    this.setState(function(prevState) {
+                        return {
+                            modalOpenedLog: _toConsumableArray(prevState.modalOpenedLog).concat([
+                                nextModalState.id
+                            ])
+                        };
+                    });
                 }
             }
         },
@@ -50328,8 +50405,13 @@ var warn = (0,_lib_warnOnce__WEBPACK_IMPORTED_MODULE_3__.warnOnce)("ModalPage");
     var platform = (0,_hooks_usePlatform__WEBPACK_IMPORTED_MODULE_6__.usePlatform)();
     var orientation = (0,_hooks_useOrientationChange__WEBPACK_IMPORTED_MODULE_7__.useOrientationChange)();
     var _useAdaptivityWithJSMediaQueries = (0,_hooks_useAdaptivityWithJSMediaQueries__WEBPACK_IMPORTED_MODULE_8__.useAdaptivityWithJSMediaQueries)(), sizeX = _useAdaptivityWithJSMediaQueries.sizeX, isDesktop = _useAdaptivityWithJSMediaQueries.isDesktop;
-    react__WEBPACK_IMPORTED_MODULE_0__.useEffect(updateModalHeight, [
+    react__WEBPACK_IMPORTED_MODULE_0__.useEffect(function() {
+        if (dynamicContentHeight) {
+            updateModalHeight();
+        }
+    }, [
         children,
+        dynamicContentHeight,
         orientation,
         updateModalHeight
     ]);
@@ -50690,11 +50772,12 @@ function _objectWithoutPropertiesLoose(source, excluded) {
     }, restProps), {
         fixed: false,
         separator: false,
-        transparent: true
-    }), /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_PanelHeader_PanelHeader__WEBPACK_IMPORTED_MODULE_7__.PanelHeader.Content, {
-        Component: "h2",
-        id: labelId
-    }, children)), hasSeparator && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Separator_Separator__WEBPACK_IMPORTED_MODULE_8__.Separator, {
+        transparent: true,
+        typographyProps: {
+            Component: "h2",
+            id: labelId
+        }
+    }), children), hasSeparator && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Separator_Separator__WEBPACK_IMPORTED_MODULE_8__.Separator, {
         wide: true
     }));
 };
@@ -53156,12 +53239,14 @@ var useDraggable = function(param) {
     var _React_useState3 = _slicedToArray(react__WEBPACK_IMPORTED_MODULE_0__.useState(0), 2), dragEndIndex = _React_useState3[0], setDragEndIndex = _React_useState3[1];
     var _React_useState4 = _slicedToArray(react__WEBPACK_IMPORTED_MODULE_0__.useState(0), 2), dragShift = _React_useState4[0], setDragShift = _React_useState4[1];
     var _React_useState5 = _slicedToArray(react__WEBPACK_IMPORTED_MODULE_0__.useState(undefined), 2), dragDirection = _React_useState5[0], setDragDirection = _React_useState5[1];
-    var onDragStart = function() {
+    var onDragStart = function(event) {
         var _rootEl_parentElement;
         var rootEl = rootElRef.current;
         if (!rootEl) {
             return;
         }
+        event.originalEvent.stopPropagation();
+        event.originalEvent.preventDefault();
         setDragging(true);
         var _siblings = [];
         if ((_rootEl_parentElement = rootEl.parentElement) === null || _rootEl_parentElement === void 0 ? void 0 : _rootEl_parentElement.childNodes) {
@@ -53173,14 +53258,15 @@ var useDraggable = function(param) {
         setSiblings(_siblings);
         setDragShift(0);
     };
-    var onDragMove = function(e) {
-        e.originalEvent.preventDefault();
+    var onDragMove = function(event) {
+        event.originalEvent.stopPropagation();
+        event.originalEvent.preventDefault();
         var rootEl = rootElRef.current;
         if (rootEl) {
-            rootEl.style.transform = "translateY(".concat(e.shiftY, "px)");
+            rootEl.style.transform = "translateY(".concat(event.shiftY, "px)");
             var rootGesture = rootEl.getBoundingClientRect();
-            setDragDirection(dragShift - e.shiftY < 0 ? "down" : "up");
-            setDragShift(e.shiftY);
+            setDragDirection(dragShift - event.shiftY < 0 ? "down" : "up");
+            setDragShift(event.shiftY);
             setDragEndIndex(dragStartIndex);
             siblings.forEach(function(sibling, siblingIndex) {
                 var siblingGesture = sibling.getBoundingClientRect();
@@ -53215,7 +53301,9 @@ var useDraggable = function(param) {
             });
         }
     };
-    var onDragEnd = function() {
+    var onDragEnd = function(event) {
+        event.originalEvent.stopPropagation();
+        event.originalEvent.preventDefault();
         var _ref = [
             dragStartIndex,
             dragEndIndex
@@ -53324,22 +53412,26 @@ function _objectWithoutPropertiesLoose(source, excluded) {
 
 
 var CellDragger = function(_param) {
-    var onDragStart = _param.onDragStart, onDragMove = _param.onDragMove, onDragEnd = _param.onDragEnd, className = _param.className, restProps = _objectWithoutProperties(_param, [
+    var onDragStart = _param.onDragStart, onDragMove = _param.onDragMove, onDragEnd = _param.onDragEnd, onClick = _param.onClick, className = _param.className, restProps = _objectWithoutProperties(_param, [
         "onDragStart",
         "onDragMove",
         "onDragEnd",
+        "onClick",
         "className"
     ]);
     var platform = (0,_hooks_usePlatform__WEBPACK_IMPORTED_MODULE_3__.usePlatform)();
-    var onClick = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(function(e) {
-        e.preventDefault();
-    }, []);
+    var handleClick = function(event) {
+        event.preventDefault();
+        if (onClick) {
+            onClick(event);
+        }
+    };
     return /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Touch_Touch__WEBPACK_IMPORTED_MODULE_4__.Touch, _objectSpread({
         className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiCellDragger", className),
         onStart: onDragStart,
         onMoveY: onDragMove,
         onEnd: onDragEnd,
-        onClick: onClick
+        onClick: handleClick
     }, restProps), platform === _lib_platform__WEBPACK_IMPORTED_MODULE_5__.Platform.IOS ? /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_vkontakte_icons__WEBPACK_IMPORTED_MODULE_6__["default"], null) : /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_vkontakte_icons__WEBPACK_IMPORTED_MODULE_7__["default"], null));
 };
 
@@ -53644,12 +53736,11 @@ function _objectWithoutPropertiesLoose(source, excluded) {
 
 
 /**
- * @since v5.4.0
- * @see https://vkcom.github.io/VKUI/#/VisuallyHidden
- * @description
- *
  * Компонент-обертка. Позволяет скрыть контент визуально, но оставить его
  * доступным для ассистивных технологий. По умолчанию — `span`.
+ *
+ * @since v5.4.0
+ * @see https://vkcom.github.io/VKUI/#/VisuallyHidden
  */ var VisuallyHidden = function(_param) {
     var _param_Component = _param.Component, Component = _param_Component === void 0 ? "span" : _param_Component, getRootRef = _param.getRootRef, className = _param.className, restProps = _objectWithoutProperties(_param, [
         "Component",
@@ -54631,7 +54722,7 @@ var CellTypography = function(_param) {
  */ var HorizontalCell = function(_param) {
     var className = _param.className, header = _param.header, style = _param.style, subtitle = _param.subtitle, _param_size = _param.size, size = _param_size === void 0 ? "s" : _param_size, _param_children = _param.children, children = _param_children === void 0 ? /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Avatar_Avatar__WEBPACK_IMPORTED_MODULE_5__.Avatar, {
         size: 56
-    }) : _param_children, getRootRef = _param.getRootRef, getRef = _param.getRef, restProps = _objectWithoutProperties(_param, [
+    }) : _param_children, getRootRef = _param.getRootRef, getRef = _param.getRef, extraSubtitle = _param.extraSubtitle, restProps = _objectWithoutProperties(_param, [
         "className",
         "header",
         "style",
@@ -54639,7 +54730,8 @@ var CellTypography = function(_param) {
         "size",
         "children",
         "getRootRef",
-        "getRef"
+        "getRef",
+        "extraSubtitle"
     ]);
     return /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         ref: getRootRef,
@@ -54660,7 +54752,9 @@ var CellTypography = function(_param) {
         size: size
     }, header), (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.hasReactNode)(subtitle) && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Footnote_Footnote__WEBPACK_IMPORTED_MODULE_7__.Footnote, {
         className: "vkuiHorizontalCell__subtitle"
-    }, subtitle))));
+    }, subtitle), (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.hasReactNode)(extraSubtitle) && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Footnote_Footnote__WEBPACK_IMPORTED_MODULE_7__.Footnote, {
+        className: "vkuiHorizontalCell__subtitle"
+    }, extraSubtitle))));
 };
 
 
@@ -55359,6 +55453,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(9);
 /* harmony import */ var _Typography_Headline_Headline__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(89);
 /* harmony import */ var _Typography_Subhead_Subhead__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(95);
+/* harmony import */ var _VisuallyHidden_VisuallyHidden__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(308);
 /* harmony import */ var _InfoRow_module_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(334);
 function _defineProperty(obj, key, value) {
     if (key in obj) {
@@ -55444,6 +55539,7 @@ function _objectWithoutPropertiesLoose(source, excluded) {
 
 
 
+
 /**
  * @see https://vkcom.github.io/VKUI/#/InfoRow
  */ var InfoRow = function(_param) /*#__PURE__*/ {
@@ -55457,9 +55553,9 @@ function _objectWithoutPropertiesLoose(source, excluded) {
         className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiInfoRow", className),
         weight: "3"
     }), (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.hasReactNode)(header) && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Subhead_Subhead__WEBPACK_IMPORTED_MODULE_4__.Subhead, {
-        Component: "span",
+        Component: "strong",
         className: "vkuiInfoRow__header"
-    }, header), children);
+    }, header, /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_VisuallyHidden_VisuallyHidden__WEBPACK_IMPORTED_MODULE_5__.VisuallyHidden, null, "\xa0")), children);
 };
 
 
@@ -57552,9 +57648,10 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _lib_adaptivity__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(54);
 /* harmony import */ var _lib_warnOnce__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(129);
 /* harmony import */ var _Tabs_Tabs__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(353);
-/* harmony import */ var _Tappable_Tappable__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(101);
-/* harmony import */ var _Typography_Headline_Headline__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(89);
+/* harmony import */ var _Tappable_Tappable__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(101);
+/* harmony import */ var _Typography_Headline_Headline__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(89);
 /* harmony import */ var _Typography_Subhead_Subhead__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(95);
+/* harmony import */ var _VisuallyHidden_VisuallyHidden__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(308);
 /* harmony import */ var _TabsItem_module_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(356);
 function _defineProperty(obj, key, value) {
     if (key in obj) {
@@ -57645,6 +57742,7 @@ function _objectWithoutPropertiesLoose(source, excluded) {
 
 
 
+
 var sizeYClassNames = _defineProperty({
     none: "vkuiTabsItem--sizeY-none"
 }, _lib_adaptivity__WEBPACK_IMPORTED_MODULE_3__.SizeType.COMPACT, "vkuiTabsItem--sizeY-compact");
@@ -57671,9 +57769,9 @@ var warn = (0,_lib_warnOnce__WEBPACK_IMPORTED_MODULE_4__.warnOnce)("TabsItem");
             Component: "span",
             className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiTabsItem__status", "vkuiTabsItem__status--count"),
             weight: "2"
-        }, status) : /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("span", {
+        }, /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_VisuallyHidden_VisuallyHidden__WEBPACK_IMPORTED_MODULE_8__.VisuallyHidden, null, "\xa0"), status) : /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("span", {
             className: "vkuiTabsItem__status"
-        }, status);
+        }, /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_VisuallyHidden_VisuallyHidden__WEBPACK_IMPORTED_MODULE_8__.VisuallyHidden, null, "\xa0"), status);
     }
     if (process.env.NODE_ENV === "development" && isTabFlow) {
         if (!restProps["aria-controls"]) {
@@ -57686,7 +57784,7 @@ var warn = (0,_lib_warnOnce__WEBPACK_IMPORTED_MODULE_4__.warnOnce)("TabsItem");
     if (isTabFlow && tabIndex === undefined) {
         tabIndex = selected ? 0 : -1;
     }
-    return /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Tappable_Tappable__WEBPACK_IMPORTED_MODULE_8__.Tappable, _objectSpreadProps(_objectSpread({}, restProps), {
+    return /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Tappable_Tappable__WEBPACK_IMPORTED_MODULE_9__.Tappable, _objectSpreadProps(_objectSpread({}, restProps), {
         className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiTabsItem", mode && ({
             default: "vkuiTabsItem--mode-default",
             accent: "vkuiTabsItem--mode-accent",
@@ -57701,7 +57799,7 @@ var warn = (0,_lib_warnOnce__WEBPACK_IMPORTED_MODULE_4__.warnOnce)("TabsItem");
         tabIndex: tabIndex
     }), before && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         className: "vkuiTabsItem__before"
-    }, before), /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Headline_Headline__WEBPACK_IMPORTED_MODULE_9__.Headline, {
+    }, before), /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Headline_Headline__WEBPACK_IMPORTED_MODULE_10__.Headline, {
         Component: "span",
         className: "vkuiTabsItem__label",
         level: mode === "default" ? "1" : "2",
@@ -59320,14 +59418,14 @@ function _objectWithoutPropertiesLoose(source, excluded) {
     }, before), /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         className: "vkuiBanner__content"
     }, (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.hasReactNode)(header) && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(HeaderTypography, {
-        Component: "span",
-        className: "vkuiBanner__header",
+        Component: "p",
         weight: "2",
         level: size === "m" ? "2" : "1"
     }, header), (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.hasReactNode)(subheader) && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(SubheaderTypography, {
-        Component: "span",
+        Component: "p",
         className: "vkuiBanner__subheader"
     }, subheader), (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.hasReactNode)(text) && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Text_Text__WEBPACK_IMPORTED_MODULE_6__.Text, {
+        Component: "p",
         className: "vkuiBanner__text"
     }, text), (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.hasReactNode)(actions) && react__WEBPACK_IMPORTED_MODULE_0__.Children.count(actions) > 0 && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         className: "vkuiBanner__actions"
@@ -59551,11 +59649,12 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(5);
 /* harmony import */ var _vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(9);
-/* harmony import */ var _hooks_useEnsuredControl__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(351);
-/* harmony import */ var _hooks_useExternRef__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(114);
+/* harmony import */ var _hooks_useEnsuredControl__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(351);
+/* harmony import */ var _hooks_useExternRef__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(114);
 /* harmony import */ var _hooks_usePlatform__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(108);
-/* harmony import */ var _lib_platform__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(66);
-/* harmony import */ var _Typography_Headline_Headline__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(89);
+/* harmony import */ var _lib_platform__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(66);
+/* harmony import */ var _Typography_Headline_Headline__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(89);
+/* harmony import */ var _Typography_Title_Title__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(85);
 /* harmony import */ var _WriteBar_module_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(378);
 function _arrayLikeToArray(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
@@ -59690,6 +59789,17 @@ function _unsupportedIterableToArray(o, minLen) {
 
 
 
+
+var WriteBarTypography = function(props) {
+    var platform = (0,_hooks_usePlatform__WEBPACK_IMPORTED_MODULE_3__.usePlatform)();
+    if (platform === _lib_platform__WEBPACK_IMPORTED_MODULE_4__.Platform.IOS) {
+        return /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Title_Title__WEBPACK_IMPORTED_MODULE_5__.Title, _objectSpreadProps(_objectSpread({}, props), {
+            level: "3",
+            weight: "3"
+        }));
+    }
+    return /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Headline_Headline__WEBPACK_IMPORTED_MODULE_6__.Headline, props);
+};
 /**
  * @see https://vkcom.github.io/VKUI/#/WriteBar
  */ var WriteBar = function(_param) {
@@ -59706,10 +59816,10 @@ function _unsupportedIterableToArray(o, minLen) {
         "defaultValue"
     ]);
     var platform = (0,_hooks_usePlatform__WEBPACK_IMPORTED_MODULE_3__.usePlatform)();
-    var _useEnsuredControl = _slicedToArray((0,_hooks_useEnsuredControl__WEBPACK_IMPORTED_MODULE_4__.useEnsuredControl)(_objectSpread({
+    var _useEnsuredControl = _slicedToArray((0,_hooks_useEnsuredControl__WEBPACK_IMPORTED_MODULE_7__.useEnsuredControl)(_objectSpread({
         defaultValue: defaultValue
     }, restProps)), 2), value = _useEnsuredControl[0], onChange = _useEnsuredControl[1];
-    var textareaRef = (0,_hooks_useExternRef__WEBPACK_IMPORTED_MODULE_5__.useExternRef)(getRef);
+    var textareaRef = (0,_hooks_useExternRef__WEBPACK_IMPORTED_MODULE_8__.useExternRef)(getRef);
     var currentScrollHeight = react__WEBPACK_IMPORTED_MODULE_0__.useRef();
     var resize = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(function() {
         var textareaEl = textareaRef.current;
@@ -59730,11 +59840,12 @@ function _unsupportedIterableToArray(o, minLen) {
     ]);
     react__WEBPACK_IMPORTED_MODULE_0__.useEffect(resize, [
         resize,
-        value
+        value,
+        platform
     ]);
     return /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         ref: getRootRef,
-        className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiWriteBar", platform === _lib_platform__WEBPACK_IMPORTED_MODULE_6__.Platform.IOS && "vkuiWriteBar--ios", shadow && "vkuiWriteBar--shadow", className),
+        className: (0,_vkontakte_vkjs__WEBPACK_IMPORTED_MODULE_1__.classNames)("vkuiWriteBar", platform === _lib_platform__WEBPACK_IMPORTED_MODULE_4__.Platform.IOS && "vkuiWriteBar--ios", shadow && "vkuiWriteBar--shadow", className),
         style: style
     }, /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         className: "vkuiWriteBar__form"
@@ -59742,7 +59853,7 @@ function _unsupportedIterableToArray(o, minLen) {
         className: "vkuiWriteBar__before"
     }, before), /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
         className: "vkuiWriteBar__formIn"
-    }, /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Headline_Headline__WEBPACK_IMPORTED_MODULE_7__.Headline, _objectSpreadProps(_objectSpread({}, restProps), {
+    }, /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(WriteBarTypography, _objectSpreadProps(_objectSpread({}, restProps), {
         Component: "textarea",
         className: "vkuiWriteBar__textarea",
         onChange: onChange,
@@ -64917,12 +65028,24 @@ var defaultOptions = [];
             var item = options[focusedOptionIndex];
             setNativeSelectValue(item === null || item === void 0 ? void 0 : item.value);
             close();
+            var shouldTriggerOnChangeWhenControlledAndInnerValueIsOutOfSync = isControlledOutside && props.value !== nativeSelectValue && nativeSelectValue === (item === null || item === void 0 ? void 0 : item.value);
+            if (shouldTriggerOnChangeWhenControlledAndInnerValueIsOutOfSync) {
+                var _selectElRef_current;
+                var event = new Event("change", {
+                    bubbles: true
+                });
+                (_selectElRef_current = selectElRef.current) === null || _selectElRef_current === void 0 ? void 0 : _selectElRef_current.dispatchEvent(event);
+            }
         }
     }, [
         close,
         focusedOptionIndex,
         isValidIndex,
-        options
+        options,
+        selectElRef,
+        isControlledOutside,
+        props.value,
+        nativeSelectValue
     ]);
     var open = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(function() {
         setOpened(true);
@@ -65181,7 +65304,9 @@ var defaultOptions = [];
         renderDropdown,
         renderOption
     ]);
-    var clearButtonShown = allowClearButton && !opened && nativeSelectValue !== "";
+    var controlledValueSet = isControlledOutside && props.value !== "";
+    var uncontrolledValueSet = !isControlledOutside && nativeSelectValue !== "";
+    var clearButtonShown = allowClearButton && !opened && (controlledValueSet || uncontrolledValueSet);
     var clearButton = react__WEBPACK_IMPORTED_MODULE_0__.useMemo(function() {
         if (!clearButtonShown) {
             return null;
@@ -65397,7 +65522,7 @@ var warn = (0,_lib_warnOnce__WEBPACK_IMPORTED_MODULE_4__.warnOnce)("CustomSelect
 /**
  * @see https://vkcom.github.io/VKUI/#/CustomSelectOption
  */ var CustomSelectOption = function(_param) {
-    var children = _param.children, _param_hierarchy = _param.hierarchy, hierarchy = _param_hierarchy === void 0 ? 0 : _param_hierarchy, hovered = _param.hovered, selected = _param.selected, before = _param.before, after = _param.after, option = _param.option, description = _param.description, disabled = _param.disabled, styleProp = _param.style, className = _param.className, restProps = _objectWithoutProperties(_param, [
+    var children = _param.children, _param_hierarchy = _param.hierarchy, hierarchy = _param_hierarchy === void 0 ? 0 : _param_hierarchy, hovered = _param.hovered, selected = _param.selected, before = _param.before, after = _param.after, option = _param.option, description = _param.description, disabled = _param.disabled, styleProp = _param.style, className = _param.className, onClick = _param.onClick, restProps = _objectWithoutProperties(_param, [
         "children",
         "hierarchy",
         "hovered",
@@ -65408,7 +65533,8 @@ var warn = (0,_lib_warnOnce__WEBPACK_IMPORTED_MODULE_4__.warnOnce)("CustomSelect
         "description",
         "disabled",
         "style",
-        "className"
+        "className",
+        "onClick"
     ]);
     var title = typeof children === "string" ? children : undefined;
     var _useAdaptivity = (0,_hooks_useAdaptivity__WEBPACK_IMPORTED_MODULE_5__.useAdaptivity)(), _useAdaptivity_sizeY = _useAdaptivity.sizeY, sizeY = _useAdaptivity_sizeY === void 0 ? "none" : _useAdaptivity_sizeY;
@@ -65425,6 +65551,7 @@ var warn = (0,_lib_warnOnce__WEBPACK_IMPORTED_MODULE_4__.warnOnce)("CustomSelect
         warn("Свойство option было добавлено по ошибке и будет удалено в v6.0.0.");
     }
     return /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Typography_Paragraph_Paragraph__WEBPACK_IMPORTED_MODULE_6__.Paragraph, _objectSpreadProps(_objectSpread({}, restProps), {
+        onClick: disabled ? undefined : onClick,
         Component: "div",
         role: "option",
         title: title,
@@ -66667,7 +66794,8 @@ var sizeYClassNames = _defineProperty({
     }), placeholder && /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("option", {
         value: ""
     }, placeholder), children), /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
-        className: "vkuiSelect__container"
+        className: "vkuiSelect__container",
+        "aria-hidden": true
     }, /*#__PURE__*/ react__WEBPACK_IMPORTED_MODULE_0__.createElement(_SelectTypography_SelectTypography__WEBPACK_IMPORTED_MODULE_10__.SelectTypography, {
         className: "vkuiSelect__title",
         selectType: selectType
@@ -68905,7 +69033,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   "useTodayDate": function() { return /* binding */ useTodayDate; }
 /* harmony export */ });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(5);
-/* harmony import */ var _lib_date__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(475);
+/* harmony import */ var _lib_date__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(475);
+/* harmony import */ var _lib_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(57);
 function _arrayLikeToArray(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
     for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
@@ -68954,6 +69083,7 @@ function _unsupportedIterableToArray(o, minLen) {
 }
 
 
+
 /**
  * Опционально обновляемая дата сегодняшнего дня
  *
@@ -68964,23 +69094,45 @@ function _unsupportedIterableToArray(o, minLen) {
  * @param listenDayChangesForUpdate - флаг по которому определяется, будет ли создаваться подписка на смену календарного дня
  */ function useTodayDate() {
     var listenDayChangesForUpdate = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : false;
+    var _useDOM = (0,_lib_dom__WEBPACK_IMPORTED_MODULE_1__.useDOM)(), document = _useDOM.document, window = _useDOM.window;
     var _React_useState = _slicedToArray(react__WEBPACK_IMPORTED_MODULE_0__.useState(function() {
         return new Date();
     }), 2), todayDate = _React_useState[0], setTodayDate = _React_useState[1];
     react__WEBPACK_IMPORTED_MODULE_0__.useEffect(function() {
-        if (!listenDayChangesForUpdate) {
+        if (!listenDayChangesForUpdate || !document || !window) {
             return;
         }
-        var timeToDayChange = (0,_lib_date__WEBPACK_IMPORTED_MODULE_1__.getMillisecondsToTomorrow)(todayDate);
-        var timeout = setTimeout(function() {
-            setTodayDate(new Date());
-        }, timeToDayChange);
+        var timeout = undefined;
+        var recalcTimeout = function() {
+            if (document.visibilityState === "visible") {
+                var now = new Date();
+                var timeToDayChange = (0,_lib_date__WEBPACK_IMPORTED_MODULE_2__.getMillisecondsToTomorrow)(now);
+                // Удаляем старый таймаут
+                window.clearTimeout(timeout);
+                // Создаем новый таймаут
+                timeout = window.setTimeout(function() {
+                    setTodayDate(now);
+                }, timeToDayChange);
+                // Если todayDate не обновился в таймаут - обновить при заходе на вкладку
+                if (!(0,_lib_date__WEBPACK_IMPORTED_MODULE_2__.isSameDay)(todayDate, now)) {
+                    setTodayDate(now);
+                }
+            }
+        };
+        recalcTimeout();
+        // Создаем слушатель visibilitychange, чтобы предотвратить пропуск обновления стейта после заморозки вкладки
+        // Если человек ее долго не трогал или закрывал крышку ноута и тп
+        // https://developer.chrome.com/blog/page-lifecycle-api/
+        document.addEventListener("visibilitychange", recalcTimeout);
         return function() {
-            clearTimeout(timeout);
+            window.clearTimeout(timeout);
+            document.removeEventListener("visibilitychange", recalcTimeout);
         };
     }, [
+        document,
         listenDayChangesForUpdate,
-        todayDate
+        todayDate,
+        window
     ]);
     return todayDate;
 }
@@ -72667,7 +72819,7 @@ var chipsSelectDefaultProps = _objectSpreadProps(_objectSpread({}, _ChipsInputBa
     var showCreatable = Boolean(creatable && creatableText && !filteredOptions.length && fieldValue);
     var handleFocus = function(e) {
         setOpened(true);
-        setFocusedOptionIndex(0);
+        setFocusedOptionIndex(null);
         onFocus(e);
     };
     var handleClickOutside = function(e) {
@@ -72710,15 +72862,13 @@ var chipsSelectDefaultProps = _objectSpreadProps(_objectSpread({}, _ChipsInputBa
         setFocusedOptionIndex(index);
     };
     var focusOption = function(nextIndex, type) {
-        var index = typeof nextIndex !== "number" ? -1 : nextIndex;
+        var index = nextIndex === null ? -1 : nextIndex;
         if (type === FOCUS_ACTION_NEXT) {
             index = index + 1;
         } else if (type === FOCUS_ACTION_PREV) {
             index = index - 1;
         }
-        if (focusedOptionIndex != null) {
-            focusOptionByIndex(index, focusedOptionIndex);
-        }
+        focusOptionByIndex(index, focusedOptionIndex);
     };
     var handleKeyDown = function(e) {
         onKeyDown(e);
@@ -72773,21 +72923,6 @@ var chipsSelectDefaultProps = _objectSpreadProps(_objectSpread({}, _ChipsInputBa
         filteredOptions,
         setFocusedOption
     ]);
-    react__WEBPACK_IMPORTED_MODULE_0__.useEffect(function() {
-        var index = focusedOption ? filteredOptions.findIndex(function(param) {
-            var value = param.value;
-            return value === focusedOption.value;
-        }) : -1;
-        if (index === -1 && !!filteredOptions.length && !showCreatable && closeAfterSelect) {
-            setFocusedOption(filteredOptions[0]);
-        }
-    }, [
-        filteredOptions,
-        focusedOption,
-        showCreatable,
-        closeAfterSelect,
-        setFocusedOption
-    ]);
     (0,_hooks_useGlobalEventListener__WEBPACK_IMPORTED_MODULE_9__.useGlobalEventListener)(document, "click", handleClickOutside);
     var renderChipWrapper = function(renderChipProps) {
         if (renderChipProps === undefined) {