@vkontakte/vkui 6.5.0 → 6.5.2

package/dist/components.js.tmp

@@ -5729,6 +5729,9 @@ function AppRoot_unsupported_iterable_to_array(o, minLen) {
     }, props), content);
 };
 
+;// CONCATENATED MODULE: ./src/components/RootComponent/RootComponent.module.css
+// extracted by mini-css-extract-plugin
+
 ;// CONCATENATED MODULE: ./src/components/RootComponent/RootComponent.tsx
 function RootComponent_define_property(obj, key, value) {
     if (key in obj) {
@@ -5787,6 +5790,7 @@ function RootComponent_object_without_properties_loose(source, excluded) {
 }
 
 
+
 /**
  * Базовый корневой компонент.
  */ var RootComponent_RootComponent = function(_param) {
@@ -5798,7 +5802,7 @@ function RootComponent_object_without_properties_loose(source, excluded) {
     ]);
     return /*#__PURE__*/ react.createElement(Component, RootComponent_object_spread({
         ref: getRootRef,
-        className: clsx(baseClassName, className)
+        className: clsx(className, baseClassName, "vkuiRootComponent", restProps.hidden === true && "vkuiRootComponent--hidden")
     }, restProps));
 };
 
@@ -7751,7 +7755,7 @@ function Clickable_object_without_properties_loose(source, excluded) {
 /**
  * Проверяем, является ли компонент кликабельным
  */ function checkClickable(props) {
-    return (props.href !== undefined || props.onClick !== undefined || props.onClickCapture !== undefined || props.Component === 'label') && !props.disabled;
+    return (props.href !== undefined || props.onClick !== undefined || props.onClickCapture !== undefined || props.Component === 'a' || props.Component === 'button' || props.Component === 'label' || props.Component === 'input') && !props.disabled;
 }
 /**
  * Определяет правильный компонент и его свойства
@@ -9387,7 +9391,7 @@ function useIsClient_unsupported_iterable_to_array(o, minLen) {
  * ВНИМАНИЕ: Этот подход сделает ваши компоненты медленнее, потому что они
  * должны рендериться дважды, поэтому используйте хук с осторожностью.
  *
- * @see {@link https://beta.reactjs.org/apis/react-dom/hydrate#handling-different-client-and-server-content React Docs}
+ * @see {@link https://react.dev/reference/react-dom/hydrate#handling-different-client-and-server-content React Docs}
  */ function useIsClient_useIsClient() {
     var initial = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : false;
     var _React_useState = useIsClient_sliced_to_array(react.useState(initial), 2), isClient = _React_useState[0], setIsClient = _React_useState[1];
@@ -11175,7 +11179,7 @@ var Button_sizeYClassNames = Button_define_property({
 /**
  * @see https://vkcom.github.io/VKUI/#/Button
  */ var Button_Button = function(_param) {
-    var _param_size = _param.size, size = _param_size === void 0 ? 's' : _param_size, _param_mode = _param.mode, mode = _param_mode === void 0 ? 'primary' : _param_mode, _param_appearance = _param.appearance, appearance = _param_appearance === void 0 ? 'accent' : _param_appearance, _param_stretched = _param.stretched, stretched = _param_stretched === void 0 ? false : _param_stretched, _param_align = _param.align, align = _param_align === void 0 ? 'center' : _param_align, children = _param.children, before = _param.before, after = _param.after, getRootRef = _param.getRootRef, loading = _param.loading, _param_onClick = _param.onClick, onClick = _param_onClick === void 0 ? functions_noop : _param_onClick, className = _param.className, disableSpinnerAnimation = _param.disableSpinnerAnimation, rounded = _param.rounded, restProps = Button_object_without_properties(_param, [
+    var _param_size = _param.size, size = _param_size === void 0 ? 's' : _param_size, _param_mode = _param.mode, mode = _param_mode === void 0 ? 'primary' : _param_mode, _param_appearance = _param.appearance, appearance = _param_appearance === void 0 ? 'accent' : _param_appearance, _param_stretched = _param.stretched, stretched = _param_stretched === void 0 ? false : _param_stretched, _param_align = _param.align, align = _param_align === void 0 ? 'center' : _param_align, children = _param.children, before = _param.before, after = _param.after, getRootRef = _param.getRootRef, loading = _param.loading, onClick = _param.onClick, className = _param.className, disableSpinnerAnimation = _param.disableSpinnerAnimation, rounded = _param.rounded, restProps = Button_object_without_properties(_param, [
         "size",
         "mode",
         "appearance",
@@ -11592,11 +11596,10 @@ var ToolButton_sizeYClassNames = {
  *
  * @see https://vkcom.github.io/VKUI/#/ToolButton
  */ var ToolButton = function(_param) {
-    var _param_mode = _param.mode, mode = _param_mode === void 0 ? 'primary' : _param_mode, _param_appearance = _param.appearance, appearance = _param_appearance === void 0 ? 'accent' : _param_appearance, _param_direction = _param.direction, direction = _param_direction === void 0 ? 'row' : _param_direction, _param_onClick = _param.onClick, onClick = _param_onClick === void 0 ? noop : _param_onClick, className = _param.className, children = _param.children, IconCompact = _param.IconCompact, IconRegular = _param.IconRegular, rounded = _param.rounded, restProps = ToolButton_object_without_properties(_param, [
+    var _param_mode = _param.mode, mode = _param_mode === void 0 ? 'primary' : _param_mode, _param_appearance = _param.appearance, appearance = _param_appearance === void 0 ? 'accent' : _param_appearance, _param_direction = _param.direction, direction = _param_direction === void 0 ? 'row' : _param_direction, className = _param.className, children = _param.children, IconCompact = _param.IconCompact, IconRegular = _param.IconRegular, rounded = _param.rounded, restProps = ToolButton_object_without_properties(_param, [
         "mode",
         "appearance",
         "direction",
-        "onClick",
         "className",
         "children",
         "IconCompact",
@@ -11610,7 +11613,6 @@ var ToolButton_sizeYClassNames = {
         activeMode: "vkuiToolButton--active",
         Component: restProps.href ? 'a' : 'button',
         focusVisibleMode: "outside",
-        onClick: onClick,
         className: classNames(className, "vkuiToolButton", rounded && !hasChildren && "vkuiToolButton--rounded", ToolButton_stylesMode[mode], ToolButton_stylesAppearance[appearance], stylesDirection[direction], sizeY !== 'compact' && ToolButton_sizeYClassNames[sizeY])
     }, restProps), /*#__PURE__*/ React.createElement(AdaptiveIconRenderer, {
         IconCompact: IconCompact,
@@ -13079,6 +13081,7 @@ function useEnsuredControl_unsupported_iterable_to_array(o, minLen) {
 
 
 
+
 function useEnsuredControl_useEnsuredControl(_param) {
     var onChangeProp = _param.onChange, disabled = _param.disabled, props = useEnsuredControl_object_without_properties(_param, [
         "onChange",
@@ -13101,14 +13104,27 @@ function useEnsuredControl_useEnsuredControl(_param) {
         onChange
     ];
 }
+var useEnsuredControl_warn = warnOnce('useCustomEnsuredControl');
 function useEnsuredControl_useCustomEnsuredControl(param) {
     var value = param.value, defaultValue = param.defaultValue, disabled = param.disabled, onChangeProp = param.onChange;
     var isControlled = value !== undefined;
     var _React_useState = useEnsuredControl_sliced_to_array(react.useState(defaultValue), 2), localValue = _React_useState[0], setLocalValue = _React_useState[1];
-    var preservedControlledValueRef = react.useRef(value);
+    var preservedControlledValueRef = react.useRef();
     useIsomorphicLayoutEffect_useIsomorphicLayoutEffect(function() {
         preservedControlledValueRef.current = value;
     });
+    /*
+   * Для ситуации, когда nextValue это пользовательская функция,
+   * и в качестве аргумента мы должны передать prevValue.
+   * Обычно в качестве prevValue используется preservedControlledValueRef, но оно может быть undefined, если
+   * некотролируемое value вдруг стало контролируемым
+   * (value = undefined ---> value = true)
+   * Если в момент вызова onChange preservedControlledValueRef ещё не был
+   * обновлён в useEffect, то мы не можем использовать preservedControlledValueRef как prevValue
+   * В качестве запасного варианта мы храним текущее значение value в currentFallbackValueRef, чтобы
+   * использовать его вместо preservedControlledValueRef.
+   */ var currentFallbackValueRef = react.useRef(value);
+    currentFallbackValueRef.current = value;
     var onChange = react.useCallback(function(nextValue) {
         if (disabled) {
             return;
@@ -13123,8 +13139,14 @@ function useEnsuredControl_useCustomEnsuredControl(param) {
                     return resolvedValue;
                 });
             } else if (onChangeProp) {
-                var resolvedValue = nextValue(preservedControlledValueRef.current);
-                onChangeProp(resolvedValue);
+                if (false) {}
+                var prevValue = preservedControlledValueRef.current === undefined ? currentFallbackValueRef.current : preservedControlledValueRef.current;
+                // В теории prevValue не может быть undefined,
+                // но лучше не вызывать nextValue с таким значением
+                if (prevValue !== undefined) {
+                    var resolvedValue = nextValue(prevValue);
+                    onChangeProp(resolvedValue);
+                }
             }
         } else {
             if (onChangeProp) {
@@ -13907,15 +13929,11 @@ var View_warn = warnOnce('View');
         onTransition,
         scroll
     ]);
-    var onAnimationEnd = React.useCallback(function() {
+    var handleAnimatedTargetAnimationEnd = function() {
         if (prevPanel !== null) {
             flushTransition(prevPanel, Boolean(isBack));
         }
-    }, [
-        flushTransition,
-        isBack,
-        prevPanel
-    ]);
+    };
     var onSwipeBackSuccess = React.useCallback(function() {
         onSwipeBack && onSwipeBack();
     }, [
@@ -14018,45 +14036,33 @@ var View_warn = warnOnce('View');
             }
         }
     };
-    var calcPanelSwipeStyles = function(panelId) {
-        if (!canUseDOM || !window) {
-            return {};
-        }
-        var isPrev = panelId === swipeBackPrevPanel;
-        var isNext = panelId === swipeBackNextPanel;
+    var calcPanelSwipeStyles = function(isPrev, isNext) {
         if (!isPrev && !isNext || swipeBackResult) {
             return {};
         }
-        var prevPanelTranslate = "".concat(swipeBackShift, "px");
-        var nextPanelTranslate = "".concat(-50 + swipeBackShift * 100 / window.innerWidth / 2, "%");
         if (isNext) {
-            return {
-                transform: "translate3d(".concat(nextPanelTranslate, ", 0, 0)")
-            };
+            return window ? {
+                transform: "translate3d(".concat(-50 + swipeBackShift * 100 / window.innerWidth / 2, "%, 0, 0)")
+            } : {};
         }
         if (isPrev) {
             return {
-                transform: "translate3d(".concat(prevPanelTranslate, ", 0, 0)")
+                transform: "translate3d(".concat(swipeBackShift, "px, 0, 0)")
             };
         }
         return {};
     };
-    var calcPanelSwipeBackOverlayStyles = function(panelId) {
-        if (!canUseDOM || !window) {
-            return {};
-        }
-        var isNext = panelId === swipeBackNextPanel;
-        if (!isNext) {
+    var calcPanelSwipeBackOverlayStyles = function(isNext) {
+        if (!window || !isNext) {
             return {};
         }
-        var calculatedOpacity = 1 - swipeBackShift / window.innerWidth;
         var opacityOnSwipeEnd = swipeBackResult === 'success' ? 0 : swipeBackResult === 'fail' ? 1 : null;
         return {
             display: 'block',
-            opacity: opacityOnSwipeEnd === null ? calculatedOpacity : opacityOnSwipeEnd
+            opacity: opacityOnSwipeEnd === null ? 1 - swipeBackShift / window.innerWidth : opacityOnSwipeEnd
         };
     };
-    var onTransitionEnd = function(event) {
+    var handleSwipeBackTargetTransitionEnd = function(event) {
         if (event.propertyName.includes('transform')) {
             swipingBackTransitionEndHandler();
         }
@@ -14183,7 +14189,7 @@ var View_warn = warnOnce('View');
         var isAnimatedTarget = animated && (isBack ? isPanelPrev : isPanelNext);
         var isSwipeBackPrev = panelId === swipeBackPrevPanel;
         var isSwipeBackNext = panelId === swipeBackNextPanel;
-        var isSwipeBackTarget = !prevSwipeBackResult && swipeBackResult && isSwipeBackNext;
+        var isSwipeBackTarget = swipeBackResult && isSwipeBackPrev;
         var scrollCompensateStyle = undefined;
         if (isPanelPrev || isPanelNext && isBack || isSwipeBackPrev || isSwipeBackNext) {
             var marginTop = scrolls.current[panelId];
@@ -14195,16 +14201,16 @@ var View_warn = warnOnce('View');
         }
         return /*#__PURE__*/ React.createElement("div", {
             className: classNames("vkuiView__panel", isPanelActive && "vkuiView__panel--active", isPanelPrev && "vkuiView__panel--prev", isPanelNext && "vkuiView__panel--next", isSwipeBackPrev && "vkuiView__panel--swipe-back-prev", isSwipeBackNext && "vkuiView__panel--swipe-back-next", swipeBackResult === 'success' && "vkuiView__panel--swipe-back-success", swipeBackResult === 'fail' && "vkuiView__panel--swipe-back-failed"),
-            onTransitionEnd: isSwipeBackTarget ? onTransitionEnd : undefined,
-            onAnimationEnd: isAnimatedTarget ? onAnimationEnd : undefined,
+            onTransitionEnd: isSwipeBackTarget ? handleSwipeBackTargetTransitionEnd : undefined,
+            onAnimationEnd: isAnimatedTarget ? handleAnimatedTargetAnimationEnd : undefined,
             ref: function(el) {
                 return panelId !== undefined && (panelNodes.current[panelId] = el);
             },
-            style: calcPanelSwipeStyles(panelId),
+            style: calcPanelSwipeStyles(isSwipeBackPrev, isSwipeBackNext),
             key: panelId
         }, platform === 'ios' && /*#__PURE__*/ React.createElement("div", {
             className: "vkuiView__panel-overlay",
-            style: calcPanelSwipeBackOverlayStyles(panelId)
+            style: calcPanelSwipeBackOverlayStyles(isSwipeBackNext)
         }), /*#__PURE__*/ React.createElement("div", {
             className: "vkuiView__panel-in",
             style: scrollCompensateStyle
@@ -20888,7 +20894,7 @@ var animationStateClassNames = {
 /**
  * @see https://vkcom.github.io/VKUI/#/Snackbar
  */ var Snackbar = function(_param) {
-    var _param_placement = _param.placement, placement = _param_placement === void 0 ? 'bottom-start' : _param_placement, children = _param.children, layout = _param.layout, action = _param.action, before = _param.before, after = _param.after, _param_duration = _param.duration, duration = _param_duration === void 0 ? 4000 : _param_duration, _param_onActionClick = _param.onActionClick, onActionClick = _param_onActionClick === void 0 ? functions_noop : _param_onActionClick, onClose = _param.onClose, _param_mode = _param.mode, mode = _param_mode === void 0 ? 'default' : _param_mode, subtitle = _param.subtitle, offsetY = _param.offsetY, style = _param.style, getRootRef = _param.getRootRef, restProps = Snackbar_object_without_properties(_param, [
+    var _param_placement = _param.placement, placement = _param_placement === void 0 ? 'bottom-start' : _param_placement, children = _param.children, layout = _param.layout, action = _param.action, before = _param.before, after = _param.after, _param_duration = _param.duration, duration = _param_duration === void 0 ? 4000 : _param_duration, onActionClick = _param.onActionClick, onClose = _param.onClose, _param_mode = _param.mode, mode = _param_mode === void 0 ? 'default' : _param_mode, subtitle = _param.subtitle, offsetY = _param.offsetY, style = _param.style, getRootRef = _param.getRootRef, restProps = Snackbar_object_without_properties(_param, [
         "placement",
         "children",
         "layout",
@@ -20941,7 +20947,7 @@ var animationStateClassNames = {
     var handleActionClick = function(event) {
         close();
         if (action) {
-            onActionClick(event);
+            onActionClick === null || onActionClick === void 0 ? void 0 : onActionClick(event);
         }
     };
     var handleTouchStart = function(event) {
@@ -25232,9 +25238,11 @@ function Group_object_without_properties_loose(source, excluded) {
 
 
 
-var Group_sizeXClassNames = Group_define_property({
-    none: clsx("vkuiGroup--sizeX-none", 'vkuiInternalGroup--sizeX-none')
-}, 'compact', "vkuiGroup--sizeX-compact");
+var Group_sizeXClassNames = {
+    none: clsx("vkuiGroup--sizeX-none", 'vkuiInternalGroup--sizeX-none'),
+    regular: "vkuiGroup--sizeX-regular",
+    compact: "vkuiGroup--sizeX-compact"
+};
 var Group_stylesMode = {
     none: clsx("vkuiGroup--mode-none", 'vkuiInternalGroup--mode-none'),
     plain: clsx("vkuiGroup--mode-plain", 'vkuiInternalGroup--mode-plain'),
@@ -25300,7 +25308,7 @@ var Group_warn = warnOnce('Group');
         Component: "section"
     }, restProps), {
         tabIndex: tabIndex,
-        baseClassName: classNames('vkuiInternalGroup', "vkuiGroup", sizeX !== 'regular' && Group_sizeXClassNames[sizeX], mode === 'plain' && isInsideModal && "vkuiGroup--mode-plain-inside-modal", Group_stylesMode[mode], stylesPadding[padding])
+        baseClassName: classNames('vkuiInternalGroup', "vkuiGroup", Group_sizeXClassNames[sizeX], mode === 'plain' && isInsideModal && "vkuiGroup--mode-plain-inside-modal", Group_stylesMode[mode], stylesPadding[padding])
     }), hasReactNode(header) && /*#__PURE__*/ React.createElement("div", {
         className: "vkuiGroup__header"
     }, header), children, hasReactNode(description) && /*#__PURE__*/ React.createElement(Footnote, {
@@ -26330,7 +26338,7 @@ function Removable_unsupported_iterable_to_array(o, minLen) {
 /**
  * @see https://vkcom.github.io/VKUI/#/RemovableIos
  */ var RemovableIos = function(param) {
-    var onRemove = param.onRemove, removePlaceholder = param.removePlaceholder, removePlaceholderString = param.removePlaceholderString, childrenProp = param.children, toggleButtonTestId = param.toggleButtonTestId, removeButtonTestId = param.removeButtonTestId;
+    var onRemove = param.onRemove, removePlaceholder = param.removePlaceholder, removePlaceholderString = param.removePlaceholderString, childrenProp = param.children, toggleButtonTestId = param.toggleButtonTestId, removeButtonTestId = param.removeButtonTestId, disabled = param.disabled;
     var window = dom_useDOM().window;
     var removeButtonRef = react.useRef(null);
     var disabledRef = react.useRef(true);
@@ -26370,7 +26378,7 @@ function Removable_unsupported_iterable_to_array(o, minLen) {
         hasHover: false,
         className: clsx("vkuiRemovable__action", "vkuiRemovable__toggle", 'vkuiInternalRemovable__action'),
         onClick: onRemoveActivateClick,
-        disabled: removeOffset > 0,
+        disabled: removeOffset > 0 || disabled,
         "data-testid": toggleButtonTestId
     }, /*#__PURE__*/ react.createElement(VisuallyHidden_VisuallyHidden, null, removePlaceholderString), /*#__PURE__*/ react.createElement("i", {
         className: "vkuiRemovable__toggle-in",
@@ -26396,19 +26404,20 @@ function Removable_unsupported_iterable_to_array(o, minLen) {
 /**
  * @see https://vkcom.github.io/VKUI/#/Removable
  */ var Removable_Removable = function(_param) {
-    var children = _param.children, _param_onRemove = _param.onRemove, onRemove = _param_onRemove === void 0 ? functions_noop : _param_onRemove, _param_removePlaceholder = _param.removePlaceholder, removePlaceholder = _param_removePlaceholder === void 0 ? 'Удалить' : _param_removePlaceholder, _param_align = _param.align, align = _param_align === void 0 ? 'center' : _param_align, _param_indent = _param.indent, indent = _param_indent === void 0 ? false : _param_indent, toggleButtonTestId = _param.toggleButtonTestId, removeButtonTestId = _param.removeButtonTestId, restProps = Removable_object_without_properties(_param, [
+    var children = _param.children, onRemove = _param.onRemove, _param_removePlaceholder = _param.removePlaceholder, removePlaceholder = _param_removePlaceholder === void 0 ? 'Удалить' : _param_removePlaceholder, _param_align = _param.align, align = _param_align === void 0 ? 'center' : _param_align, _param_indent = _param.indent, indent = _param_indent === void 0 ? false : _param_indent, toggleButtonTestId = _param.toggleButtonTestId, removeButtonTestId = _param.removeButtonTestId, disabled = _param.disabled, restProps = Removable_object_without_properties(_param, [
         "children",
         "onRemove",
         "removePlaceholder",
         "align",
         "indent",
         "toggleButtonTestId",
-        "removeButtonTestId"
+        "removeButtonTestId",
+        "disabled"
     ]);
     var platform = usePlatform_usePlatform();
     var onRemoveClick = function(e) {
         e.preventDefault();
-        onRemove(e);
+        onRemove === null || onRemove === void 0 ? void 0 : onRemove(e);
     };
     var removePlaceholderString = children_getTextFromChildren(removePlaceholder);
     return /*#__PURE__*/ react.createElement(RootComponent_RootComponent, Removable_object_spread_props(Removable_object_spread({}, restProps), {
@@ -26423,7 +26432,8 @@ function Removable_unsupported_iterable_to_array(o, minLen) {
         className: clsx("vkuiRemovable__action", 'vkuiInternalRemovable__action'),
         onClick: onRemoveClick,
         label: removePlaceholderString,
-        "data-testid": removeButtonTestId
+        "data-testid": removeButtonTestId,
+        disabled: disabled
     }, /*#__PURE__*/ react.createElement(cancel_24_Icon24Cancel, {
         role: "presentation"
     })), /*#__PURE__*/ react.createElement("span", {
@@ -26434,7 +26444,8 @@ function Removable_unsupported_iterable_to_array(o, minLen) {
         removePlaceholder: removePlaceholder,
         removePlaceholderString: removePlaceholderString,
         toggleButtonTestId: toggleButtonTestId,
-        removeButtonTestId: removeButtonTestId
+        removeButtonTestId: removeButtonTestId,
+        disabled: disabled
     }, children));
 };
 
@@ -26611,7 +26622,7 @@ var SimpleCell_sizeYClassNames = SimpleCell_define_property({
     var hasAfter = react_utils_hasReactNode(after) || hasChevron;
     var _useAdaptivity = useAdaptivity_useAdaptivity(), _useAdaptivity_sizeY = _useAdaptivity.sizeY, sizeY = _useAdaptivity_sizeY === void 0 ? 'none' : _useAdaptivity_sizeY;
     return /*#__PURE__*/ react.createElement(Tappable_Tappable, SimpleCell_object_spread_props(SimpleCell_object_spread({}, restProps), {
-        className: clsx("vkuiSimpleCell", sizeY !== 'regular' && SimpleCell_sizeYClassNames[sizeY], multiline && "vkuiSimpleCell--mult", className)
+        className: clsx("vkuiSimpleCell", restProps.disabled && "vkuiSimpleCell--disabled", sizeY !== 'regular' && SimpleCell_sizeYClassNames[sizeY], multiline && "vkuiSimpleCell--mult", className)
     }), /*#__PURE__*/ react.createElement("div", {
         className: clsx("vkuiSimpleCell__before", platform === 'ios' && "vkuiSimpleCell__before--ios")
     }, before), /*#__PURE__*/ react.createElement("div", {
@@ -27090,7 +27101,7 @@ function Cell_unsupported_iterable_to_array(o, minLen) {
 /**
  * @see https://vkcom.github.io/VKUI/#/Cell
  */ var Cell = function(_param) {
-    var mode = _param.mode, _param_onRemove = _param.onRemove, onRemove = _param_onRemove === void 0 ? functions_noop : _param_onRemove, _param_removePlaceholder = _param.removePlaceholder, removePlaceholder = _param_removePlaceholder === void 0 ? 'Удалить' : _param_removePlaceholder, onDragFinish = _param.onDragFinish, before = _param.before, after = _param.after, disabled = _param.disabled, draggable = _param.draggable, ComponentProps = _param.Component, onChange = _param.onChange, name = _param.name, value = _param.value, checked = _param.checked, defaultChecked = _param.defaultChecked, getRootRef = _param.getRootRef, _param_draggerLabel = _param.draggerLabel, draggerLabel = _param_draggerLabel === void 0 ? DEFAULT_DRAGGABLE_LABEL : _param_draggerLabel, className = _param.className, style = _param.style, toggleButtonTestId = _param.toggleButtonTestId, removeButtonTestId = _param.removeButtonTestId, restProps = Cell_object_without_properties(_param, [
+    var mode = _param.mode, onRemove = _param.onRemove, _param_removePlaceholder = _param.removePlaceholder, removePlaceholder = _param_removePlaceholder === void 0 ? 'Удалить' : _param_removePlaceholder, onDragFinish = _param.onDragFinish, before = _param.before, after = _param.after, disabled = _param.disabled, draggable = _param.draggable, ComponentProps = _param.Component, onChange = _param.onChange, name = _param.name, value = _param.value, checked = _param.checked, defaultChecked = _param.defaultChecked, getRootRef = _param.getRootRef, _param_draggerLabel = _param.draggerLabel, draggerLabel = _param_draggerLabel === void 0 ? DEFAULT_DRAGGABLE_LABEL : _param_draggerLabel, className = _param.className, style = _param.style, toggleButtonTestId = _param.toggleButtonTestId, removeButtonTestId = _param.removeButtonTestId, restProps = Cell_object_without_properties(_param, [
         "mode",
         "onRemove",
         "removePlaceholder",
@@ -27121,7 +27132,6 @@ function Cell_unsupported_iterable_to_array(o, minLen) {
     var dragger = draggable ? /*#__PURE__*/ react.createElement(CellDragger, {
         elRef: rootElRef,
         className: clsx("vkuiCell__dragger", !before && !selectable && "vkuiCell__control--noBefore"),
-        disabled: disabled,
         onDragStateChange: setDragging,
         onDragFinish: onDragFinish
     }, draggerLabel) : null;
@@ -27139,12 +27149,12 @@ function Cell_unsupported_iterable_to_array(o, minLen) {
             className: clsx("vkuiCell__checkbox", !before && "vkuiCell__control--noBefore")
         }, checkboxProps));
     }
-    var simpleCellDisabled = draggable && !selectable || removable && !restProps.onClick || disabled;
-    var hasActive = !simpleCellDisabled && !dragging;
-    var cellClasses = clsx("vkuiCell", dragging && "vkuiCell--dragging", platform === 'ios' && "vkuiCell--ios", removable && "vkuiCell--removable", Component === 'label' && "vkuiCell--selectable", disabled && "vkuiCell--disabled");
+    var hasActive = !disabled && !dragging;
+    var cellClasses = clsx("vkuiCell", dragging && "vkuiCell--dragging", platform === 'ios' && "vkuiCell--ios", removable && "vkuiCell--removable", Component === 'label' && "vkuiCell--selectable");
     var simpleCellProps = Cell_object_spread_props(Cell_object_spread(Cell_object_spread_props(Cell_object_spread({
         hasActive: hasActive,
-        hasHover: hasActive && !removable
+        hasHover: hasActive && !removable,
+        disabled: disabled
     }, restProps), {
         className: "vkuiCell__content"
     }), Component && {
@@ -27153,9 +27163,6 @@ function Cell_unsupported_iterable_to_array(o, minLen) {
         before: /*#__PURE__*/ react.createElement(react.Fragment, null, draggable && platform !== 'ios' && dragger, selectable && checkbox, before),
         after: /*#__PURE__*/ react.createElement(react.Fragment, null, draggable && platform === 'ios' && dragger, after)
     });
-    if (restProps.onClick) {
-        simpleCellProps.disabled = simpleCellDisabled;
-    }
     if (removable) {
         return /*#__PURE__*/ react.createElement(Removable_Removable, {
             className: clsx(cellClasses, className),
@@ -27163,16 +27170,16 @@ function Cell_unsupported_iterable_to_array(o, minLen) {
             getRootRef: rootElRef,
             removePlaceholder: removePlaceholder,
             onRemove: function(e) {
-                return onRemove(e, rootElRef.current);
+                return onRemove === null || onRemove === void 0 ? void 0 : onRemove(e, rootElRef.current);
             },
             toggleButtonTestId: toggleButtonTestId,
-            removeButtonTestId: removeButtonTestId
+            removeButtonTestId: removeButtonTestId,
+            disabled: disabled
         }, platform === 'ios' ? function(param) {
             var isRemoving = param.isRemoving;
-            if (simpleCellProps.onClick) {
-                simpleCellProps.disabled = isRemoving || !simpleCellProps.disabled;
-            }
-            return /*#__PURE__*/ react.createElement(SimpleCell_SimpleCell, simpleCellProps);
+            return /*#__PURE__*/ react.createElement(SimpleCell_SimpleCell, Cell_object_spread({}, simpleCellProps, isRemoving ? {
+                onClick: undefined
+            } : {}));
         } : /*#__PURE__*/ react.createElement(SimpleCell_SimpleCell, simpleCellProps));
     }
     return /*#__PURE__*/ react.createElement("div", {
@@ -28239,12 +28246,16 @@ function Footer_object_without_properties_loose(source, excluded) {
 /**
  * @see https://vkcom.github.io/VKUI/#/Footer
  */ var Footer = function(_param) {
-    var children = _param.children, className = _param.className, restProps = Footer_object_without_properties(_param, [
+    var children = _param.children, className = _param.className, _param_Component = _param.Component, Component = _param_Component === void 0 ? 'footer' : _param_Component, roleProp = _param.role, restProps = Footer_object_without_properties(_param, [
         "children",
-        "className"
+        "className",
+        "Component",
+        "role"
     ]);
+    var role = roleProp !== null && roleProp !== void 0 ? roleProp : Component === 'footer' ? 'contentinfo' : undefined;
     return /*#__PURE__*/ React.createElement(Footnote, Footer_object_spread_props(Footer_object_spread({
-        Component: "footer"
+        Component: Component,
+        role: role
     }, restProps), {
         className: classNames("vkuiFooter", className)
     }), children);
@@ -30564,7 +30575,7 @@ function Search_unsupported_iterable_to_array(o, minLen) {
 /**
  * @see https://vkcom.github.io/VKUI/#/Search
  */ var Search = function(_param) {
-    var idProp = _param.id, _param_before = _param.before, before = _param_before === void 0 ? /*#__PURE__*/ React.createElement(Icon16SearchOutline, null) : _param_before, className = _param.className, _param_placeholder = _param.placeholder, placeholder = _param_placeholder === void 0 ? 'Поиск' : _param_placeholder, _param_after = _param.after, after = _param_after === void 0 ? 'Отмена' : _param_after, getRef = _param.getRef, iconProp = _param.icon, _param_onIconClick = _param.onIconClick, onIconClick = _param_onIconClick === void 0 ? noop : _param_onIconClick, style = _param.style, _param_autoComplete = _param.autoComplete, autoComplete = _param_autoComplete === void 0 ? 'off' : _param_autoComplete, onChange = _param.onChange, iconLabel = _param.iconLabel, _param_clearLabel = _param.clearLabel, clearLabel = _param_clearLabel === void 0 ? 'Очистить' : _param_clearLabel, noPadding = _param.noPadding, getRootRef = _param.getRootRef, _param_findButtonText = _param.findButtonText, findButtonText = _param_findButtonText === void 0 ? 'Найти' : _param_findButtonText, onFindButtonClick = _param.onFindButtonClick, inputProps = Search_object_without_properties(_param, [
+    var idProp = _param.id, _param_before = _param.before, before = _param_before === void 0 ? /*#__PURE__*/ React.createElement(Icon16SearchOutline, null) : _param_before, className = _param.className, _param_placeholder = _param.placeholder, placeholder = _param_placeholder === void 0 ? 'Поиск' : _param_placeholder, _param_after = _param.after, after = _param_after === void 0 ? 'Отмена' : _param_after, getRef = _param.getRef, iconProp = _param.icon, onIconClick = _param.onIconClick, style = _param.style, _param_autoComplete = _param.autoComplete, autoComplete = _param_autoComplete === void 0 ? 'off' : _param_autoComplete, onChange = _param.onChange, iconLabel = _param.iconLabel, _param_clearLabel = _param.clearLabel, clearLabel = _param_clearLabel === void 0 ? 'Очистить' : _param_clearLabel, noPadding = _param.noPadding, getRootRef = _param.getRootRef, _param_findButtonText = _param.findButtonText, findButtonText = _param_findButtonText === void 0 ? 'Найти' : _param_findButtonText, onFindButtonClick = _param.onFindButtonClick, inputProps = Search_object_without_properties(_param, [
         "id",
         "before",
         "className",
@@ -30617,7 +30628,7 @@ function Search_unsupported_iterable_to_array(o, minLen) {
         inputRef
     ]);
     var onIconClickStart = React.useCallback(function(e) {
-        return onIconClick(e);
+        return onIconClick === null || onIconClick === void 0 ? void 0 : onIconClick(e);
     }, [
         onIconClick
     ]);
@@ -30685,7 +30696,8 @@ function Search_unsupported_iterable_to_array(o, minLen) {
         onPointerDown: onIconCancelClickStart,
         onClick: onCancel,
         className: "vkuiSearch__icon",
-        tabIndex: hasValue ? undefined : -1
+        tabIndex: hasValue ? undefined : -1,
+        disabled: inputProps.disabled
     }, /*#__PURE__*/ React.createElement(VisuallyHidden, null, clearLabel), platform === 'ios' ? /*#__PURE__*/ React.createElement(Icon16Clear, null) : /*#__PURE__*/ React.createElement(Icon24Cancel, null)), adaptiveSizeY.compact && onFindButtonClick && /*#__PURE__*/ React.createElement(Button, {
         mode: "primary",
         size: "m",
@@ -31675,15 +31687,13 @@ function Link_object_without_properties_loose(source, excluded) {
 /**
  * @see https://vkcom.github.io/VKUI/#/Link
  */ var Link = function(_param) {
-    var hasVisited = _param.hasVisited, children = _param.children, className = _param.className, _param_onClick = _param.onClick, onClick = _param_onClick === void 0 ? noop : _param_onClick, restProps = Link_object_without_properties(_param, [
+    var hasVisited = _param.hasVisited, children = _param.children, className = _param.className, restProps = Link_object_without_properties(_param, [
         "hasVisited",
         "children",
-        "className",
-        "onClick"
+        "className"
     ]);
     return /*#__PURE__*/ React.createElement(Tappable, Link_object_spread_props(Link_object_spread({
-        Component: restProps.href ? 'a' : 'button',
-        onClick: onClick
+        Component: restProps.href ? 'a' : 'button'
     }, restProps), {
         className: classNames("vkuiLink", hasVisited && "vkuiLink--has-visited", className),
         hasHover: false,
@@ -34670,7 +34680,7 @@ var stylesStatus = {
 /**
  * @see https://vkcom.github.io/VKUI/#/FormItem
  */ var FormItem = function(_param) {
-    var children = _param.children, top = _param.top, topId = _param.topId, topMultiline = _param.topMultiline, topComponentProp = _param.topComponent, bottom = _param.bottom, _param_status = _param.status, status = _param_status === void 0 ? 'default' : _param_status, removable = _param.removable, _param_onRemove = _param.onRemove, onRemove = _param_onRemove === void 0 ? functions_noop : _param_onRemove, _param_removePlaceholder = _param.removePlaceholder, removePlaceholder = _param_removePlaceholder === void 0 ? 'Удалить' : _param_removePlaceholder, getRootRef = _param.getRootRef, htmlFor = _param.htmlFor, bottomId = _param.bottomId, noPadding = _param.noPadding, topNode = _param.topNode, _param_required = _param.required, required = _param_required === void 0 ? false : _param_required, restProps = FormItem_object_without_properties(_param, [
+    var children = _param.children, top = _param.top, topId = _param.topId, topMultiline = _param.topMultiline, topComponentProp = _param.topComponent, bottom = _param.bottom, _param_status = _param.status, status = _param_status === void 0 ? 'default' : _param_status, removable = _param.removable, onRemove = _param.onRemove, _param_removePlaceholder = _param.removePlaceholder, removePlaceholder = _param_removePlaceholder === void 0 ? 'Удалить' : _param_removePlaceholder, getRootRef = _param.getRootRef, htmlFor = _param.htmlFor, bottomId = _param.bottomId, noPadding = _param.noPadding, topNode = _param.topNode, _param_required = _param.required, required = _param_required === void 0 ? false : _param_required, restProps = FormItem_object_without_properties(_param, [
         "children",
         "top",
         "topId",
@@ -34713,7 +34723,7 @@ var stylesStatus = {
         align: "start",
         onRemove: function(e) {
             if (rootEl === null || rootEl === void 0 ? void 0 : rootEl.current) {
-                onRemove(e, rootEl.current);
+                onRemove === null || onRemove === void 0 ? void 0 : onRemove(e, rootEl.current);
             }
         },
         removePlaceholder: removePlaceholder,
@@ -35009,7 +35019,7 @@ var FormLayoutGroup_sizeYClassNames = FormLayoutGroup_define_property({
 /**
  * @see https://vkcom.github.io/VKUI/#/FormLayoutGroup
  */ var FormLayoutGroup = function(_param) {
-    var children = _param.children, _param_mode = _param.mode, mode = _param_mode === void 0 ? 'vertical' : _param_mode, removable = _param.removable, segmented = _param.segmented, _param_removePlaceholder = _param.removePlaceholder, removePlaceholder = _param_removePlaceholder === void 0 ? 'Удалить' : _param_removePlaceholder, _param_onRemove = _param.onRemove, onRemove = _param_onRemove === void 0 ? noop : _param_onRemove, getRootRef = _param.getRootRef, restProps = FormLayoutGroup_object_without_properties(_param, [
+    var children = _param.children, _param_mode = _param.mode, mode = _param_mode === void 0 ? 'vertical' : _param_mode, removable = _param.removable, segmented = _param.segmented, _param_removePlaceholder = _param.removePlaceholder, removePlaceholder = _param_removePlaceholder === void 0 ? 'Удалить' : _param_removePlaceholder, onRemove = _param.onRemove, getRootRef = _param.getRootRef, restProps = FormLayoutGroup_object_without_properties(_param, [
         "children",
         "mode",
         "removable",
@@ -35024,14 +35034,14 @@ var FormLayoutGroup_sizeYClassNames = FormLayoutGroup_define_property({
     return /*#__PURE__*/ React.createElement(RootComponent, FormLayoutGroup_object_spread({
         getRootRef: rootEl,
         Component: "fieldset",
-        baseClassName: classNames("vkuiFormLayoutGroup", sizeY !== 'regular' && FormLayoutGroup_sizeYClassNames[sizeY], mode === 'horizontal' && classNames("vkuiFormLayoutGroup--mode-horizontal", 'vkuiInternalFormLayoutGroup--mode-horizontal'), mode === 'vertical' && classNames("vkuiFormLayoutGroup--mode-vertical", 'vkuiInternalFormLayoutGroup--mode-vertical'), isRemovable && classNames("vkuiFormLayoutGroup--removable", 'vkuiInternalFormLayoutGroup--removable'), segmented && classNames("vkuiFormLayoutGroup--segmented", 'vkuiInternalFormLayoutGroup--segmented'))
+        baseClassName: classNames("vkuiFormLayoutGroup", sizeY !== 'regular' && FormLayoutGroup_sizeYClassNames[sizeY], mode === 'horizontal' && classNames("vkuiFormLayoutGroup--mode-horizontal", 'vkuiInternalFormLayoutGroup--mode-horizontal'), mode === 'vertical' && 'vkuiInternalFormLayoutGroup--mode-vertical', isRemovable && classNames("vkuiFormLayoutGroup--removable", 'vkuiInternalFormLayoutGroup--removable'), segmented && classNames("vkuiFormLayoutGroup--segmented", 'vkuiInternalFormLayoutGroup--segmented'))
     }, restProps), isRemovable ? /*#__PURE__*/ React.createElement(Removable, {
         className: "vkuiFormLayoutGroup__removable",
         align: "start",
         removePlaceholder: removePlaceholder,
         onRemove: function(e) {
             if (rootEl === null || rootEl === void 0 ? void 0 : rootEl.current) {
-                onRemove(e, rootEl.current);
+                onRemove === null || onRemove === void 0 ? void 0 : onRemove(e, rootEl.current);
             }
         },
         indent: removable === 'indent'
@@ -35927,7 +35937,7 @@ var Chip_sizeYClassNames = {
 /**
  * @see https://vkcom.github.io/VKUI/#/Chip
  */ var Chip_Chip = function(_param) {
-    var _param_Component = _param.Component, Component = _param_Component === void 0 ? 'span' : _param_Component, _param_value = _param.value, value = _param_value === void 0 ? '' : _param_value, _param_removable = _param.removable, removable = _param_removable === void 0 ? true : _param_removable, _param_onRemove = _param.onRemove, onRemove = _param_onRemove === void 0 ? noop : _param_onRemove, _param_removeLabel = _param.removeLabel, removeLabel = _param_removeLabel === void 0 ? 'Удалить' : _param_removeLabel, before = _param.before, after = _param.after, disabled = _param.disabled, readOnly = _param.readOnly, children = _param.children, className = _param.className, onFocusProp = _param.onFocus, onBlurProp = _param.onBlur, restProps = Chip_object_without_properties(_param, [
+    var _param_Component = _param.Component, Component = _param_Component === void 0 ? 'span' : _param_Component, _param_value = _param.value, value = _param_value === void 0 ? '' : _param_value, _param_removable = _param.removable, removable = _param_removable === void 0 ? true : _param_removable, onRemove = _param.onRemove, _param_removeLabel = _param.removeLabel, removeLabel = _param_removeLabel === void 0 ? 'Удалить' : _param_removeLabel, before = _param.before, after = _param.after, disabled = _param.disabled, readOnly = _param.readOnly, children = _param.children, className = _param.className, onFocusProp = _param.onFocus, onBlurProp = _param.onBlur, restProps = Chip_object_without_properties(_param, [
         "Component",
         "value",
         "removable",
@@ -35960,7 +35970,7 @@ var Chip_sizeYClassNames = {
         onBlur(event);
     };
     var onRemoveWrapper = React.useCallback(function(event) {
-        onRemove(event, value);
+        onRemove === null || onRemove === void 0 ? void 0 : onRemove(event, value);
     }, [
         onRemove,
         value
@@ -37728,14 +37738,6 @@ var overscrollBehaviorClassNames = {
 // extracted by mini-css-extract-plugin
 
 ;// CONCATENATED MODULE: ./src/components/CustomSelectDropdown/CustomSelectDropdown.tsx
-function CustomSelectDropdown_array_like_to_array(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 CustomSelectDropdown_array_with_holes(arr) {
-    if (Array.isArray(arr)) return arr;
-}
 function CustomSelectDropdown_define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -37749,33 +37751,6 @@ function CustomSelectDropdown_define_property(obj, key, value) {
     }
     return obj;
 }
-function CustomSelectDropdown_iterable_to_array_limit(arr, i) {
-    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
-    if (_i == null) return;
-    var _arr = [];
-    var _n = true;
-    var _d = false;
-    var _s, _e;
-    try {
-        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
-            _arr.push(_s.value);
-            if (i && _arr.length === i) break;
-        }
-    } catch (err) {
-        _d = true;
-        _e = err;
-    } finally{
-        try {
-            if (!_n && _i["return"] != null) _i["return"]();
-        } finally{
-            if (_d) throw _e;
-        }
-    }
-    return _arr;
-}
-function CustomSelectDropdown_non_iterable_rest() {
-    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
 function CustomSelectDropdown_object_spread(target) {
     for(var i = 1; i < arguments.length; i++){
         var source = arguments[i] != null ? arguments[i] : {};
@@ -37818,35 +37793,20 @@ function CustomSelectDropdown_object_without_properties_loose(source, excluded)
     }
     return target;
 }
-function CustomSelectDropdown_sliced_to_array(arr, i) {
-    return CustomSelectDropdown_array_with_holes(arr) || CustomSelectDropdown_iterable_to_array_limit(arr, i) || CustomSelectDropdown_unsupported_iterable_to_array(arr, i) || CustomSelectDropdown_non_iterable_rest();
-}
-function CustomSelectDropdown_unsupported_iterable_to_array(o, minLen) {
-    if (!o) return;
-    if (typeof o === "string") return CustomSelectDropdown_array_like_to_array(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 CustomSelectDropdown_array_like_to_array(o, minLen);
-}
 
 
 
 
 
 
-var calcIsTop = function(placement) {
-    return placement.startsWith('top');
-};
 var CustomSelectDropdown_CustomSelectDropdown = function(_param) {
-    var children = _param.children, targetRef = _param.targetRef, scrollBoxRef = _param.scrollBoxRef, _param_placement = _param.placement, placement = _param_placement === void 0 ? 'bottom' : _param_placement, fetching = _param.fetching, parentOnPlacementChange = _param.onPlacementChange, _param_offsetDistance = _param.offsetDistance, offsetDistance = _param_offsetDistance === void 0 ? 0 : _param_offsetDistance, _param_autoWidth = _param.autoWidth, autoWidth = _param_autoWidth === void 0 ? false : _param_autoWidth, _param_forcePortal = _param.forcePortal, forcePortal = _param_forcePortal === void 0 ? true : _param_forcePortal, autoHideScrollbar = _param.autoHideScrollbar, autoHideScrollbarDelay = _param.autoHideScrollbarDelay, className = _param.className, _param_noMaxHeight = _param.noMaxHeight, noMaxHeight = _param_noMaxHeight === void 0 ? false : _param_noMaxHeight, // CustomScrollView
+    var children = _param.children, targetRef = _param.targetRef, scrollBoxRef = _param.scrollBoxRef, _param_placement = _param.placement, placement = _param_placement === void 0 ? 'bottom' : _param_placement, fetching = _param.fetching, _param_offsetDistance = _param.offsetDistance, offsetDistance = _param_offsetDistance === void 0 ? 0 : _param_offsetDistance, _param_autoWidth = _param.autoWidth, autoWidth = _param_autoWidth === void 0 ? false : _param_autoWidth, _param_forcePortal = _param.forcePortal, forcePortal = _param_forcePortal === void 0 ? true : _param_forcePortal, autoHideScrollbar = _param.autoHideScrollbar, autoHideScrollbarDelay = _param.autoHideScrollbarDelay, className = _param.className, _param_noMaxHeight = _param.noMaxHeight, noMaxHeight = _param_noMaxHeight === void 0 ? false : _param_noMaxHeight, // CustomScrollView
     overscrollBehavior = _param.overscrollBehavior, restProps = CustomSelectDropdown_object_without_properties(_param, [
         "children",
         "targetRef",
         "scrollBoxRef",
         "placement",
         "fetching",
-        "onPlacementChange",
         "offsetDistance",
         "autoWidth",
         "forcePortal",
@@ -37856,24 +37816,12 @@ var CustomSelectDropdown_CustomSelectDropdown = function(_param) {
         "noMaxHeight",
         "overscrollBehavior"
     ]);
-    var _React_useState = CustomSelectDropdown_sliced_to_array(React.useState(function() {
-        return calcIsTop(placement);
-    }), 2), isTop = _React_useState[0], setIsTop = _React_useState[1];
-    var onPlacementChange = React.useCallback(function(placement) {
-        setIsTop(calcIsTop(placement));
-        if (parentOnPlacementChange) {
-            parentOnPlacementChange(placement);
-        }
-    }, [
-        parentOnPlacementChange
-    ]);
     return /*#__PURE__*/ React.createElement(Popper, CustomSelectDropdown_object_spread({
         targetRef: targetRef,
         offsetByMainAxis: offsetDistance,
         sameWidth: !autoWidth,
-        onPlacementChange: onPlacementChange,
         placement: placement,
-        className: classNames("vkuiCustomSelectDropdown", 'vkuiInternalCustomSelectDropdown', offsetDistance === 0 && (isTop ? "vkuiCustomSelectDropdown--top" : "vkuiCustomSelectDropdown--bottom"), autoWidth && classNames("vkuiCustomSelectDropdown--wide", 'vkuiInternalCustomSelectDropdown--wide'), className),
+        className: classNames("vkuiCustomSelectDropdown", 'vkuiInternalCustomSelectDropdown', offsetDistance === 0 && (placement.includes('top') ? "vkuiCustomSelectDropdown--top" : "vkuiCustomSelectDropdown--bottom"), autoWidth && classNames("vkuiCustomSelectDropdown--wide", 'vkuiInternalCustomSelectDropdown--wide'), className),
         usePortal: forcePortal,
         autoUpdateOnTargetResize: true
     }, restProps), /*#__PURE__*/ React.createElement(CustomScrollView, {
@@ -38547,7 +38495,7 @@ function ChipsSelect_unsupported_iterable_to_array(o, minLen) {
 
 
 
-var findIndexAfter = function() {
+var ChipsSelect_findIndexAfter = function() {
     var options = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [], startIndex = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : -1;
     if (startIndex >= options.length - 1) {
         return -1;
@@ -38556,7 +38504,7 @@ var findIndexAfter = function() {
         return i > startIndex && (!isNotServicePreset(option) || !option.disabled);
     });
 };
-var findIndexBefore = function() {
+var ChipsSelect_findIndexBefore = function() {
     var options = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [], endIndex = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : options.length;
     var result = -1;
     if (endIndex <= 0) {
@@ -38652,6 +38600,13 @@ var findIndexBefore = function() {
     var inputRef = useExternRef(getRef, inputRefHook);
     // Связано с CustomSelectDropdownProps
     var _React_useState = ChipsSelect_sliced_to_array(React.useState(placementProp), 2), dropdownVerticalPlacement = _React_useState[0], setDropdownVerticalPlacement = _React_useState[1];
+    var onDropdownPlacementChange = React.useCallback(function(placement) {
+        if (placement.startsWith('top')) {
+            setDropdownVerticalPlacement('top');
+        } else if (placement.startsWith('bottom')) {
+            setDropdownVerticalPlacement('bottom');
+        }
+    }, []);
     var dropdownId = React.useId();
     var dropdownCurrentItemId = focusedOptionIndex !== null ? "".concat(dropdownId, "-").concat(focusedOptionIndex) : undefined;
     var dropdownScrollBoxRef = React.useRef(null);
@@ -38707,11 +38662,11 @@ var findIndexBefore = function() {
     var focusOption = function(nextIndex, type) {
         var index = nextIndex === null ? -1 : nextIndex;
         if (type === FOCUS_ACTION_NEXT) {
-            var _$nextIndex = findIndexAfter(options, index);
-            index = _$nextIndex === -1 ? findIndexAfter(options) : _$nextIndex; // Следующий за index или первый валидный до index
+            var _$nextIndex = ChipsSelect_findIndexAfter(options, index);
+            index = _$nextIndex === -1 ? ChipsSelect_findIndexAfter(options) : _$nextIndex; // Следующий за index или первый валидный до index
         } else if (type === FOCUS_ACTION_PREV) {
-            var beforeIndex = findIndexBefore(options, index);
-            index = beforeIndex === -1 ? findIndexBefore(options) : beforeIndex; // Предшествующий index или последний валидный после index
+            var beforeIndex = ChipsSelect_findIndexBefore(options, index);
+            index = beforeIndex === -1 ? ChipsSelect_findIndexBefore(options) : beforeIndex; // Предшествующий index или последний валидный после index
         }
         focusOptionByIndex(index, focusedOptionIndex);
     };
@@ -38780,13 +38735,6 @@ var findIndexBefore = function() {
         focusedOptionIndex,
         setFocusedOption
     ]);
-    var onDropdownPlacementChange = React.useCallback(function(placement) {
-        /* istanbul ignore next:  */ if (placement.startsWith('top')) {
-            setDropdownVerticalPlacement('top');
-        } else if (placement.startsWith('bottom')) {
-            setDropdownVerticalPlacement('bottom');
-        }
-    }, []);
     var onDropdownMouseLeave = React.useCallback(function() {
         setFocusedOptionIndex(null);
     }, [
@@ -38799,7 +38747,7 @@ var findIndexBefore = function() {
     ]);
     useGlobalOnClickOutside(handleClickOutside, opened ? rootRef : null, opened ? dropdownScrollBoxRef : null);
     var openedClassNames = React.useMemo(function() {
-        return opened && dropdownOffsetDistance === 0 && ((dropdownVerticalPlacement === null || dropdownVerticalPlacement === void 0 ? void 0 : dropdownVerticalPlacement.includes('top')) ? "vkuiChipsSelect--pop-up" : "vkuiChipsSelect--pop-down") || undefined;
+        return opened && dropdownOffsetDistance === 0 && (dropdownVerticalPlacement.includes('top') ? "vkuiChipsSelect--pop-up" : "vkuiChipsSelect--pop-down") || undefined;
     }, [
         dropdownOffsetDistance,
         opened,
@@ -38843,7 +38791,7 @@ var findIndexBefore = function() {
     })), opened && /*#__PURE__*/ React.createElement(CustomSelectDropdown, {
         "data-testid": dropdownTestId,
         targetRef: rootRef,
-        placement: placementProp,
+        placement: dropdownVerticalPlacement,
         scrollBoxRef: dropdownScrollBoxRef,
         onPlacementChange: onDropdownPlacementChange,
         onMouseLeave: onDropdownMouseLeave,
@@ -40958,8 +40906,6 @@ function CustomSelectInput_object_without_properties_loose(source, excluded) {
 
 
 
-
-
 var CustomSelectInput_sizeYClassNames = {
     none: "vkuiCustomSelectInput--sizeY-none",
     compact: "vkuiCustomSelectInput--sizeY-compact"
@@ -40968,7 +40914,7 @@ var CustomSelectInput_sizeYClassNames = {
  * @since 5.10.0
  * @private
  */ var CustomSelectInput_CustomSelectInput = function(_param) {
-    var _param_align = _param.align, align = _param_align === void 0 ? 'left' : _param_align, getRef = _param.getRef, className = _param.className, getRootRef = _param.getRootRef, style = _param.style, before = _param.before, after = _param.after, status = _param.status, children = _param.children, placeholder = _param.placeholder, _param_selectType = _param.selectType, selectType = _param_selectType === void 0 ? 'default' : _param_selectType, multiline = _param.multiline, disabled = _param.disabled, fetching = _param.fetching, labelTextTestId = _param.labelTextTestId, restProps = CustomSelectInput_object_without_properties(_param, [
+    var _param_align = _param.align, align = _param_align === void 0 ? 'left' : _param_align, getRef = _param.getRef, className = _param.className, getRootRef = _param.getRootRef, style = _param.style, before = _param.before, after = _param.after, status = _param.status, selectedOptionLabel = _param.selectedOptionLabel, _param_selectType = _param.selectType, selectType = _param_selectType === void 0 ? 'default' : _param_selectType, multiline = _param.multiline, disabled = _param.disabled, fetching = _param.fetching, labelTextTestId = _param.labelTextTestId, searchable = _param.searchable, restInputProps = CustomSelectInput_object_without_properties(_param, [
         "align",
         "getRef",
         "className",
@@ -40977,35 +40923,32 @@ var CustomSelectInput_sizeYClassNames = {
         "before",
         "after",
         "status",
-        "children",
-        "placeholder",
+        "selectedOptionLabel",
         "selectType",
         "multiline",
         "disabled",
         "fetching",
-        "labelTextTestId"
+        "labelTextTestId",
+        "searchable"
     ]);
     var _useAdaptivity = useAdaptivity(), _useAdaptivity_sizeY = _useAdaptivity.sizeY, sizeY = _useAdaptivity_sizeY === void 0 ? 'none' : _useAdaptivity_sizeY;
-    var title = children || placeholder;
-    var showLabelOrPlaceholder = !Boolean(restProps.value);
     var handleRootRef = useExternRef(getRootRef);
-    var focusWithin = useFocusWithin(handleRootRef);
-    var input = /*#__PURE__*/ React.createElement(Text, CustomSelectInput_object_spread_props(CustomSelectInput_object_spread({
+    var platform = usePlatform();
+    var input = /*#__PURE__*/ React.createElement(SelectTypography, CustomSelectInput_object_spread_props(CustomSelectInput_object_spread({
+        selectType: selectType,
         type: "text"
-    }, restProps), {
+    }, restInputProps), {
         disabled: disabled && !fetching,
-        readOnly: restProps.readOnly || disabled && fetching,
+        readOnly: restInputProps.readOnly || !searchable || disabled && fetching,
         Component: "input",
         normalize: false,
-        className: classNames("vkuiCustomSelectInput__el", (restProps.readOnly || showLabelOrPlaceholder && !focusWithin) && "vkuiCustomSelectInput__el--cursor-pointer"),
-        getRootRef: getRef,
-        placeholder: children ? '' : placeholder
+        className: "vkuiCustomSelectInput__input",
+        getRootRef: getRef
     }));
-    var platform = usePlatform();
     return /*#__PURE__*/ React.createElement(FormField, {
         Component: "div",
         style: style,
-        className: classNames("vkuiCustomSelectInput", align === 'right' && "vkuiCustomSelectInput--align-right", align === 'center' && "vkuiCustomSelectInput--align-center", !children && "vkuiCustomSelectInput--empty", multiline && "vkuiCustomSelectInput--multiline", sizeY !== 'regular' && CustomSelectInput_sizeYClassNames[sizeY], before && "vkuiCustomSelectInput--hasBefore", after && "vkuiCustomSelectInput--hasAfter", className),
+        className: classNames("vkuiCustomSelectInput", align === 'right' && "vkuiCustomSelectInput--align-right", align === 'center' && "vkuiCustomSelectInput--align-center", !selectedOptionLabel && "vkuiCustomSelectInput--empty", multiline && "vkuiCustomSelectInput--multiline", sizeY !== 'regular' && CustomSelectInput_sizeYClassNames[sizeY], before && "vkuiCustomSelectInput--hasBefore", after && "vkuiCustomSelectInput--hasAfter", className),
         getRootRef: handleRootRef,
         before: before,
         after: after,
@@ -41014,16 +40957,96 @@ var CustomSelectInput_sizeYClassNames = {
         status: status
     }, /*#__PURE__*/ React.createElement("div", {
         className: "vkuiCustomSelectInput__input-group"
-    }, /*#__PURE__*/ React.createElement("div", {
-        className: classNames("vkuiCustomSelectInput__container", className),
+    }, !searchable && platform === 'ios' ? /*#__PURE__*/ React.createElement(VisuallyHidden, null, input) : input, /*#__PURE__*/ React.createElement("div", {
+        className: classNames("vkuiCustomSelectInput__label-wrapper", className),
         tabIndex: -1,
         "aria-hidden": true,
         "data-testid": labelTextTestId
     }, /*#__PURE__*/ React.createElement(SelectTypography, {
         selectType: selectType,
-        className: "vkuiCustomSelectInput__title"
-    }, showLabelOrPlaceholder && title)), restProps.readOnly && platform === 'ios' ? /*#__PURE__*/ React.createElement(VisuallyHidden, null, input) : input));
+        className: "vkuiCustomSelectInput__label"
+    }, selectedOptionLabel || restInputProps.placeholder))));
+};
+
+;// CONCATENATED MODULE: ./src/components/CustomSelect/helpers.tsx
+function helpers_object_without_properties(source, excluded) {
+    if (source == null) return {};
+    var target = helpers_object_without_properties_loose(source, excluded);
+    var key, i;
+    if (Object.getOwnPropertySymbols) {
+        var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+        for(i = 0; i < sourceSymbolKeys.length; i++){
+            key = sourceSymbolKeys[i];
+            if (excluded.indexOf(key) >= 0) continue;
+            if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+            target[key] = source[key];
+        }
+    }
+    return target;
+}
+function helpers_object_without_properties_loose(source, excluded) {
+    if (source == null) return {};
+    var target = {};
+    var sourceKeys = Object.keys(source);
+    var key, i;
+    for(i = 0; i < sourceKeys.length; i++){
+        key = sourceKeys[i];
+        if (excluded.indexOf(key) >= 0) continue;
+        target[key] = source[key];
+    }
+    return target;
+}
+
+
+
+var helpers_findIndexAfter = function() {
+    var options = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [], startIndex = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : -1;
+    if (startIndex >= options.length - 1) {
+        return -1;
+    }
+    return options.findIndex(function(option, i) {
+        return i > startIndex && !option.disabled;
+    });
 };
+var helpers_findIndexBefore = function() {
+    var options = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [], endIndex = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : options.length;
+    var result = -1;
+    if (endIndex <= 0) {
+        return result;
+    }
+    for(var i = endIndex - 1; i >= 0; i--){
+        var option = options[i];
+        if (!option.disabled) {
+            result = i;
+            break;
+        }
+    }
+    return result;
+};
+function helpers_findSelectedIndex() {
+    var options = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [], value = arguments.length > 1 ? arguments[1] : void 0, withClear = arguments.length > 2 ? arguments[2] : void 0;
+    if (withClear && value === '') {
+        return -1;
+    }
+    var _options_findIndex;
+    return (_options_findIndex = options.findIndex(function(item) {
+        value = typeof item.value === 'number' ? Number(value) : value;
+        return item.value === value;
+    })) !== null && _options_findIndex !== void 0 ? _options_findIndex : -1;
+}
+function helpers_calculateInputValueFromOptions() {
+    var options = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [], selectValue = arguments.length > 1 ? arguments[1] : void 0;
+    var selectedOption = options.find(function(option) {
+        return option.value === selectValue;
+    });
+    return selectedOption ? getTextFromChildren(selectedOption.label) : '';
+}
+function helpers_defaultRenderOptionFn(_param) {
+    var option = _param.option, props = helpers_object_without_properties(_param, [
+        "option"
+    ]);
+    return /*#__PURE__*/ React.createElement(CustomSelectOption, props);
+}
 
 ;// CONCATENATED MODULE: ./src/components/CustomSelect/CustomSelect.module.css
 // extracted by mini-css-extract-plugin
@@ -41173,35 +41196,9 @@ function CustomSelect_unsupported_iterable_to_array(o, minLen) {
 
 
 
-
-
 var CustomSelect_sizeYClassNames = CustomSelect_define_property({
     none: "vkuiCustomSelect--sizeY-none"
 }, 'compact', "vkuiCustomSelect--sizeY-compact");
-var CustomSelect_findIndexAfter = function() {
-    var options = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [], startIndex = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : -1;
-    if (startIndex >= options.length - 1) {
-        return -1;
-    }
-    return options.findIndex(function(option, i) {
-        return i > startIndex && !option.disabled;
-    });
-};
-var CustomSelect_findIndexBefore = function() {
-    var options = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [], endIndex = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : options.length;
-    var result = -1;
-    if (endIndex <= 0) {
-        return result;
-    }
-    for(var i = endIndex - 1; i >= 0; i--){
-        var option = options[i];
-        if (!option.disabled) {
-            result = i;
-            break;
-        }
-    }
-    return result;
-};
 var CustomSelect_warn = warnOnce('CustomSelect');
 var checkOptionsValueType = function(options) {
     if (new Set(options.map(function(item) {
@@ -41210,26 +41207,9 @@ var checkOptionsValueType = function(options) {
         CustomSelect_warn('Некоторые значения ваших опций имеют разные типы. onChange всегда возвращает строковый тип.', 'error');
     }
 };
-function defaultRenderOptionFn(_param) {
-    var option = _param.option, props = CustomSelect_object_without_properties(_param, [
-        "option"
-    ]);
-    return /*#__PURE__*/ React.createElement(CustomSelectOption, props);
-}
 var handleOptionDown = function(e) {
     e.preventDefault();
 };
-function findSelectedIndex() {
-    var options = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [], value = arguments.length > 1 ? arguments[1] : void 0, withClear = arguments.length > 2 ? arguments[2] : void 0;
-    if (withClear && value === '') {
-        return -1;
-    }
-    var _options_findIndex;
-    return (_options_findIndex = options.findIndex(function(item) {
-        value = typeof item.value === 'number' ? Number(value) : value;
-        return item.value === value;
-    })) !== null && _options_findIndex !== void 0 ? _options_findIndex : -1;
-}
 var filter = function(options, inputValue, filterFn) {
     return typeof filterFn === 'function' ? options.filter(function(option) {
         return filterFn(inputValue, option);
@@ -41286,11 +41266,13 @@ var filter = function(options, inputValue, filterFn) {
     var optionsWrapperRef = React.useRef(null);
     var _React_useState1 = CustomSelect_sliced_to_array(React.useState(-1), 2), focusedOptionIndex = _React_useState1[0], setFocusedOptionIndex = _React_useState1[1];
     var _React_useState2 = CustomSelect_sliced_to_array(React.useState(props.value !== undefined), 2), isControlledOutside = _React_useState2[0], setIsControlledOutside = _React_useState2[1];
-    var _React_useState3 = CustomSelect_sliced_to_array(React.useState(''), 2), inputValue = _React_useState3[0], setInputValue = _React_useState3[1];
-    var _React_useState4 = CustomSelect_sliced_to_array(React.useState(function() {
+    var _React_useState3 = CustomSelect_sliced_to_array(React.useState(function() {
         var _props_value, _ref;
         return (_ref = (_props_value = props.value) !== null && _props_value !== void 0 ? _props_value : defaultValue) !== null && _ref !== void 0 ? _ref : allowClearButton ? '' : undefined;
-    }), 2), nativeSelectValue = _React_useState4[0], setNativeSelectValue = _React_useState4[1];
+    }), 2), nativeSelectValue = _React_useState3[0], setNativeSelectValue = _React_useState3[1];
+    var _React_useState4 = CustomSelect_sliced_to_array(React.useState(function() {
+        return calculateInputValueFromOptions(optionsProp, nativeSelectValue);
+    }), 2), inputValue = _React_useState4[0], setInputValue = _React_useState4[1];
     var _React_useState5 = CustomSelect_sliced_to_array(React.useState(popupDirection), 2), popperPlacement = _React_useState5[0], setPopperPlacement = _React_useState5[1];
     var _React_useState6 = CustomSelect_sliced_to_array(React.useState(optionsProp), 2), options = _React_useState6[0], setOptions = _React_useState6[1];
     var _props_value;
@@ -41328,7 +41310,7 @@ var filter = function(options, inputValue, filterFn) {
         selectedOptionIndex
     ]);
     var openedClassNames = React.useMemo(function() {
-        return opened && dropdownOffsetDistance === 0 && ((popperPlacement === null || popperPlacement === void 0 ? void 0 : popperPlacement.includes('top')) ? "vkuiCustomSelect--pop-up" : "vkuiCustomSelect--pop-down") || undefined;
+        return opened && dropdownOffsetDistance === 0 && (popperPlacement.includes('top') ? "vkuiCustomSelect--pop-up" : "vkuiCustomSelect--pop-down") || undefined;
     }, [
         dropdownOffsetDistance,
         opened,
@@ -41417,7 +41399,6 @@ var filter = function(options, inputValue, filterFn) {
    *  Сброс происходит в одном из эффекте `updateOptionsAndSelectedOptionIndex()`.
    */ var close = React.useCallback(function() {
         resetKeyboardInput();
-        setInputValue('');
         setOpened(false);
         resetFocusedOption();
         onClose === null || onClose === void 0 ? void 0 : onClose();
@@ -41428,8 +41409,8 @@ var filter = function(options, inputValue, filterFn) {
     ]);
     var selectOption = React.useCallback(function(index) {
         var item = options[index];
-        setNativeSelectValue(item === null || item === void 0 ? void 0 : item.value);
         close();
+        setNativeSelectValue(item === null || item === void 0 ? void 0 : item.value);
         var shouldTriggerOnChangeWhenControlledAndInnerValueIsOutOfSync = isControlledOutside && props.value !== nativeSelectValue && nativeSelectValue === (item === null || item === void 0 ? void 0 : item.value);
         if (shouldTriggerOnChangeWhenControlledAndInnerValueIsOutOfSync) {
             var _selectElRef_current;
@@ -41473,9 +41454,12 @@ var filter = function(options, inputValue, filterFn) {
             bubbles: true
         });
         (_selectElRef_current = selectElRef.current) === null || _selectElRef_current === void 0 ? void 0 : _selectElRef_current.dispatchEvent(event);
+        setInputValue(calculateInputValueFromOptions(optionsProp, nativeSelectValue));
     }, [
         close,
-        selectElRef
+        selectElRef,
+        optionsProp,
+        nativeSelectValue
     ]);
     var onFocus = React.useCallback(function() {
         var _selectElRef_current;
@@ -41505,11 +41489,11 @@ var filter = function(options, inputValue, filterFn) {
     var focusOption = React.useCallback(function(type) {
         var index = focusedOptionIndex;
         if (type === 'next') {
-            var nextIndex = CustomSelect_findIndexAfter(options, index);
-            index = nextIndex === -1 ? CustomSelect_findIndexAfter(options) : nextIndex; // Следующий за index или первый валидный до index
+            var nextIndex = findIndexAfter(options, index);
+            index = nextIndex === -1 ? findIndexAfter(options) : nextIndex; // Следующий за index или первый валидный до index
         } else if (type === 'prev') {
-            var beforeIndex = CustomSelect_findIndexBefore(options, index);
-            index = beforeIndex === -1 ? CustomSelect_findIndexBefore(options) : beforeIndex; // Предшествующий index или последний валидный после index
+            var beforeIndex = findIndexBefore(options, index);
+            index = beforeIndex === -1 ? findIndexBefore(options) : beforeIndex; // Предшествующий index или последний валидный после index
         }
         focusOptionByIndex(index);
     }, [
@@ -41517,21 +41501,38 @@ var filter = function(options, inputValue, filterFn) {
         focusedOptionIndex,
         options
     ]);
-    React.useEffect(function updateOptionsAndSelectedOptionIndex() {
-        var _props_value, _ref;
-        var value = (_ref = (_props_value = props.value) !== null && _props_value !== void 0 ? _props_value : nativeSelectValue) !== null && _ref !== void 0 ? _ref : defaultValue;
+    React.useEffect(function filterOptions() {
         var options = searchable && inputValue !== undefined ? filter(optionsProp, inputValue, filterFn) : optionsProp;
         setOptions(options);
-        setSelectedOptionIndex(findSelectedIndex(options, value, allowClearButton));
     }, [
         filterFn,
         inputValue,
-        nativeSelectValue,
         optionsProp,
-        defaultValue,
-        props.value,
-        searchable,
-        allowClearButton
+        searchable
+    ]);
+    var _props_value1, _ref;
+    var selectValue = (_ref = (_props_value1 = props.value) !== null && _props_value1 !== void 0 ? _props_value1 : nativeSelectValue) !== null && _ref !== void 0 ? _ref : defaultValue;
+    React.useEffect(function updateSelectedOptionIndexOnValueChange() {
+        setSelectedOptionIndex(findSelectedIndex(options, selectValue, allowClearButton));
+    }, [
+        selectValue,
+        allowClearButton,
+        options
+    ]);
+    var prevSelectValueRef = React.useRef(selectValue);
+    React.useEffect(function updateInputValueOnSelectValueChange() {
+        if (prevSelectValueRef.current === selectValue) {
+            return;
+        }
+        setInputValue(calculateInputValueFromOptions(optionsProp, selectValue));
+    }, [
+        selectValue,
+        optionsProp
+    ]);
+    React.useEffect(function updatePrevSelectValue() {
+        prevSelectValueRef.current = selectValue;
+    }, [
+        selectValue
     ]);
     var onNativeSelectChange = function(e) {
         var newSelectedOptionIndex = findSelectedIndex(options, e.currentTarget.value, allowClearButton);
@@ -41791,19 +41792,15 @@ var filter = function(options, inputValue, filterFn) {
     var selectInputAriaProps = (_obj = {
         'role': 'combobox',
         'aria-controls': popupAriaId,
-        'aria-owns': popupAriaId,
         'aria-expanded': opened
     }, CustomSelect_define_property(_obj, 'aria-activedescendant', ariaActiveDescendantId && opened ? "".concat(popupAriaId, "-").concat(ariaActiveDescendantId) : undefined), CustomSelect_define_property(_obj, 'aria-labelledby', ariaLabelledBy), CustomSelect_define_property(_obj, 'aria-haspopup', 'listbox'), CustomSelect_define_property(_obj, 'aria-autocomplete', 'none'), _obj);
-    var focusWithin = useFocusWithin(handleRootRef);
     return /*#__PURE__*/ React.createElement("div", {
         className: classNames("vkuiCustomSelect", sizeY !== 'regular' && CustomSelect_sizeYClassNames[sizeY], className),
         style: style,
         ref: handleRootRef,
         onClick: passClickAndFocusToInputOnClick,
         onMouseDown: preventInputBlurWhenClickInsideFocusedSelectArea
-    }, focusWithin && selected && !opened && /*#__PURE__*/ React.createElement(VisuallyHidden, {
-        "aria-live": "polite"
-    }, selected.label), /*#__PURE__*/ React.createElement(CustomSelectInput, CustomSelect_object_spread_props(CustomSelect_object_spread({
+    }, /*#__PURE__*/ React.createElement(CustomSelectInput, CustomSelect_object_spread_props(CustomSelect_object_spread({
         autoComplete: "off",
         autoCapitalize: "none",
         autoCorrect: "off",
@@ -41813,7 +41810,7 @@ var filter = function(options, inputValue, filterFn) {
         onFocus: onFocus,
         onBlur: onBlur,
         className: openedClassNames,
-        readOnly: !searchable,
+        searchable: searchable,
         fetching: fetching,
         value: inputValue,
         onKeyUp: handleKeyUp,
@@ -41822,8 +41819,9 @@ var filter = function(options, inputValue, filterFn) {
         onClick: onClick,
         before: before,
         after: afterIcons,
-        selectType: selectType
-    }), selected === null || selected === void 0 ? void 0 : selected.label), /*#__PURE__*/ React.createElement("select", {
+        selectType: selectType,
+        selectedOptionLabel: selected === null || selected === void 0 ? void 0 : selected.label
+    })), /*#__PURE__*/ React.createElement("select", {
         ref: selectElRef,
         name: name,
         onChange: onNativeSelectChange,
@@ -41845,7 +41843,7 @@ var filter = function(options, inputValue, filterFn) {
         });
     })), opened && /*#__PURE__*/ React.createElement(CustomSelectDropdown, {
         targetRef: containerRef,
-        placement: popupDirection,
+        placement: popperPlacement,
         scrollBoxRef: setScrollBoxRef,
         onPlacementChange: setPopperPlacement,
         onMouseLeave: resetFocusedOption,
@@ -42136,7 +42134,7 @@ function Select_object_without_properties_loose(source, excluded) {
         "children",
         "className"
     ]);
-    var _props_options = props.options, options = _props_options === void 0 ? [] : _props_options, searchable = props.searchable, emptyText = props.emptyText, onInputChange = props.onInputChange, filterFn = props.filterFn, popupDirection = props.popupDirection, renderOption = props.renderOption, renderDropdown = props.renderDropdown, fetching = props.fetching, onClose = props.onClose, onOpen = props.onOpen, icon = props.icon, ClearButton = props.ClearButton, allowClearButton = props.allowClearButton, clearButtonTestId = props.clearButtonTestId, dropdownOffsetDistance = props.dropdownOffsetDistance, dropdownAutoWidth = props.dropdownAutoWidth, forceDropdownPortal = props.forceDropdownPortal, noMaxHeight = props.noMaxHeight, autoHideScrollbar = props.autoHideScrollbar, autoHideScrollbarDelay = props.autoHideScrollbarDelay, labelTextTestId = props.labelTextTestId, nativeSelectTestId = props.nativeSelectTestId, after = props.after, mode = props.mode, maxHeight = props.maxHeight, getSelectInputRef = props.getSelectInputRef, overscrollBehavior = props.overscrollBehavior, beforeAlign = props.beforeAlign, afterAlign = props.afterAlign, restProps = Select_object_without_properties(props, [
+    var _props_options = props.options, options = _props_options === void 0 ? [] : _props_options, searchable = props.searchable, emptyText = props.emptyText, onInputChange = props.onInputChange, filterFn = props.filterFn, popupDirection = props.popupDirection, renderOption = props.renderOption, renderDropdown = props.renderDropdown, fetching = props.fetching, onClose = props.onClose, onOpen = props.onOpen, icon = props.icon, ClearButton = props.ClearButton, allowClearButton = props.allowClearButton, clearButtonTestId = props.clearButtonTestId, dropdownOffsetDistance = props.dropdownOffsetDistance, dropdownAutoWidth = props.dropdownAutoWidth, forceDropdownPortal = props.forceDropdownPortal, noMaxHeight = props.noMaxHeight, autoHideScrollbar = props.autoHideScrollbar, autoHideScrollbarDelay = props.autoHideScrollbarDelay, labelTextTestId = props.labelTextTestId, nativeSelectTestId = props.nativeSelectTestId, after = props.after, mode = props.mode, getSelectInputRef = props.getSelectInputRef, overscrollBehavior = props.overscrollBehavior, beforeAlign = props.beforeAlign, afterAlign = props.afterAlign, restProps = Select_object_without_properties(props, [
         "options",
         "searchable",
         "emptyText",
@@ -42162,7 +42160,6 @@ function Select_object_without_properties_loose(source, excluded) {
         "nativeSelectTestId",
         "after",
         "mode",
-        "maxHeight",
         "getSelectInputRef",
         "overscrollBehavior",
         "beforeAlign",