@vkontakte/vkui 6.7.0 → 6.7.2

package/dist/vkui.js.tmp

@@ -5671,8 +5671,8 @@ function AppRoot_unsupported_iterable_to_array(o, minLen) {
     }, [
         scroll
     ]);
-    var content = /*#__PURE__*/ React.createElement(AppRootContext.Provider, {
-        value: {
+    var contextValue = React.useMemo(function() {
+        return {
             appRoot: appRootRef,
             portalRoot: portalRootRef,
             embedded: mode === 'embedded',
@@ -5682,7 +5682,15 @@ function AppRoot_unsupported_iterable_to_array(o, minLen) {
             get keyboardInput () {
                 return isKeyboardInputActiveRef.current;
             }
-        }
+        };
+    }, [
+        disablePortal,
+        isKeyboardInputActiveRef,
+        layout,
+        mode
+    ]);
+    var content = /*#__PURE__*/ React.createElement(AppRootContext.Provider, {
+        value: contextValue
     }, /*#__PURE__*/ React.createElement(ScrollController, {
         elRef: appRootRef
     }, children));
@@ -13653,6 +13661,9 @@ var whileElementsMounted = function() {
     var handleFocusOnReference = useStableCallback(function() {
         // Повторный вызов события фокуса - следствие клика на reference-элемент
         if (shownLocalState.shown) {
+            if (!closeAfterClick && shownLocalState.reason === 'hover') {
+                return;
+            }
             commitShownLocalState(false, 'focus');
             return;
         }
@@ -15070,7 +15081,7 @@ var sizesClassNames = {
         "style"
     ]);
     return /*#__PURE__*/ React.createElement(RootComponent, Spacing_object_spread_props(Spacing_object_spread({}, restProps), {
-        style: Spacing_object_spread({}, typeof size === 'number' && Spacing_define_property({}, CUSTOM_CSS_TOKEN_FOR_USER_GAP, size), style),
+        style: Spacing_object_spread({}, typeof size === 'number' && Spacing_define_property({}, CUSTOM_CSS_TOKEN_FOR_USER_GAP, "".concat(size, "px")), style),
         baseClassName: classNames("vkuiSpacing", typeof size === 'string' && sizesClassNames[size])
     }));
 };
@@ -30110,11 +30121,20 @@ var CarouselBase_CarouselBase = function(_param) {
         align,
         slideWidth
     ]);
+    var calculateMinDeltaXToSlide = function() {
+        return slidesManager.current.slides[slideIndex].width * SLIDE_THRESHOLD;
+    };
     var slideLeft = function(event) {
+        if (slideIndex > 0) {
+            shiftXCurrentRef.current += calculateMinDeltaXToSlide();
+        }
         onChange === null || onChange === void 0 ? void 0 : onChange((slideIndex - 1 + slidesManager.current.slides.length) % slidesManager.current.slides.length);
         onPrevClick === null || onPrevClick === void 0 ? void 0 : onPrevClick(event);
     };
     var slideRight = function(event) {
+        if (slideIndex < slidesManager.current.slides.length - 1) {
+            shiftXCurrentRef.current -= calculateMinDeltaXToSlide();
+        }
         onChange === null || onChange === void 0 ? void 0 : onChange((slideIndex + 1) % slidesManager.current.slides.length);
         onNextClick === null || onNextClick === void 0 ? void 0 : onNextClick(event);
     };
@@ -39260,7 +39280,7 @@ function ChipsSelect_unsupported_iterable_to_array(o, minLen) {
 
 
 
-var ChipsSelect_findIndexAfter = function() {
+var 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;
@@ -39269,7 +39289,7 @@ var ChipsSelect_findIndexAfter = function() {
         return i > startIndex && (!isNotServicePreset(option) || !option.disabled);
     });
 };
-var ChipsSelect_findIndexBefore = function() {
+var 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) {
@@ -39428,11 +39448,11 @@ var ChipsSelect_findIndexBefore = function() {
     var focusOption = function(nextIndex, type) {
         var index = nextIndex === null ? -1 : nextIndex;
         if (type === FOCUS_ACTION_NEXT) {
-            var _$nextIndex = ChipsSelect_findIndexAfter(options, index);
-            index = _$nextIndex === -1 ? ChipsSelect_findIndexAfter(options) : _$nextIndex; // Следующий за index или первый валидный до index
+            var _$nextIndex = findIndexAfter(options, index);
+            index = _$nextIndex === -1 ? findIndexAfter(options) : _$nextIndex; // Следующий за index или первый валидный до index
         } else if (type === FOCUS_ACTION_PREV) {
-            var beforeIndex = ChipsSelect_findIndexBefore(options, index);
-            index = beforeIndex === -1 ? ChipsSelect_findIndexBefore(options) : beforeIndex; // Предшествующий index или последний валидный после index
+            var beforeIndex = findIndexBefore(options, index);
+            index = beforeIndex === -1 ? findIndexBefore(options) : beforeIndex; // Предшествующий index или последний валидный после index
         }
         focusOptionByIndex(index, focusedOptionIndex);
     };
@@ -41713,6 +41733,8 @@ function CustomSelectInput_object_without_properties_loose(source, excluded) {
 
 
 
+
+
 var CustomSelectInput_sizeYClassNames = {
     none: "vkuiCustomSelectInput--sizeY-none",
     compact: "vkuiCustomSelectInput--sizeY-compact"
@@ -41721,7 +41743,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, 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, [
+    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, [
         "align",
         "getRef",
         "className",
@@ -41730,32 +41752,35 @@ var CustomSelectInput_sizeYClassNames = {
         "before",
         "after",
         "status",
-        "selectedOptionLabel",
+        "children",
+        "placeholder",
         "selectType",
         "multiline",
         "disabled",
         "fetching",
-        "labelTextTestId",
-        "searchable"
+        "labelTextTestId"
     ]);
     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 platform = usePlatform();
-    var input = /*#__PURE__*/ React.createElement(SelectTypography, CustomSelectInput_object_spread_props(CustomSelectInput_object_spread({
-        selectType: selectType,
+    var focusWithin = useFocusWithin(handleRootRef);
+    var input = /*#__PURE__*/ React.createElement(Text, CustomSelectInput_object_spread_props(CustomSelectInput_object_spread({
         type: "text"
-    }, restInputProps), {
+    }, restProps), {
         disabled: disabled && !fetching,
-        readOnly: restInputProps.readOnly || !searchable || disabled && fetching,
+        readOnly: restProps.readOnly || disabled && fetching,
         Component: "input",
         normalize: false,
-        className: "vkuiCustomSelectInput__input",
-        getRootRef: getRef
+        className: classNames("vkuiCustomSelectInput__el", (restProps.readOnly || showLabelOrPlaceholder && !focusWithin) && "vkuiCustomSelectInput__el--cursor-pointer"),
+        getRootRef: getRef,
+        placeholder: children ? '' : placeholder
     }));
+    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", !selectedOptionLabel && "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", !children && "vkuiCustomSelectInput--empty", multiline && "vkuiCustomSelectInput--multiline", sizeY !== 'regular' && CustomSelectInput_sizeYClassNames[sizeY], before && "vkuiCustomSelectInput--hasBefore", after && "vkuiCustomSelectInput--hasAfter", className),
         getRootRef: handleRootRef,
         before: before,
         after: after,
@@ -41764,97 +41789,17 @@ var CustomSelectInput_sizeYClassNames = {
         status: status
     }, /*#__PURE__*/ React.createElement("div", {
         className: "vkuiCustomSelectInput__input-group"
-    }, !searchable && platform === 'ios' ? /*#__PURE__*/ React.createElement(VisuallyHidden, null, input) : input, /*#__PURE__*/ React.createElement("div", {
-        className: classNames("vkuiCustomSelectInput__label-wrapper", className),
+    }, /*#__PURE__*/ React.createElement("div", {
+        className: classNames("vkuiCustomSelectInput__container", className),
         tabIndex: -1,
         "aria-hidden": true,
         "data-testid": labelTextTestId
     }, /*#__PURE__*/ React.createElement(SelectTypography, {
         selectType: selectType,
-        className: "vkuiCustomSelectInput__label"
-    }, selectedOptionLabel || restInputProps.placeholder))));
+        className: "vkuiCustomSelectInput__title"
+    }, showLabelOrPlaceholder && title)), restProps.readOnly && platform === 'ios' ? /*#__PURE__*/ React.createElement(VisuallyHidden, null, input) : input));
 };
 
-;// 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
 
@@ -42003,10 +41948,36 @@ function CustomSelect_unsupported_iterable_to_array(o, minLen) {
 
 
 
+
+
 var CustomSelect_sizeYClassNames = {
     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) {
@@ -42015,9 +41986,26 @@ 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);
@@ -42072,16 +42060,13 @@ var filter = function(options, inputValue, filterFn) {
     var scrollBoxRef = React.useRef(null);
     var selectElRef = useExternRef(getRef);
     var optionsWrapperRef = React.useRef(null);
-    var selectInputRef = useExternRef(getSelectInputRef);
     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(function() {
+    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 _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_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];
+    }), 2), nativeSelectValue = _React_useState4[0], setNativeSelectValue = _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;
@@ -42208,6 +42193,7 @@ 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();
@@ -42218,8 +42204,8 @@ var filter = function(options, inputValue, filterFn) {
     ]);
     var selectOption = React.useCallback(function(index) {
         var item = options[index];
-        close();
         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;
@@ -42263,23 +42249,18 @@ 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,
-        optionsProp,
-        nativeSelectValue
+        selectElRef
     ]);
     var onFocus = React.useCallback(function() {
-        var _selectElRef_current, _selectInputRef_current;
+        var _selectElRef_current;
         var event = new Event('focusin', {
             bubbles: true
         });
         (_selectElRef_current = selectElRef.current) === null || _selectElRef_current === void 0 ? void 0 : _selectElRef_current.dispatchEvent(event);
-        (_selectInputRef_current = selectInputRef.current) === null || _selectInputRef_current === void 0 ? void 0 : _selectInputRef_current.select();
     }, [
-        selectElRef,
-        selectInputRef
+        selectElRef
     ]);
     var onClick = React.useCallback(function() {
         if (opened) {
@@ -42300,11 +42281,11 @@ var filter = function(options, inputValue, filterFn) {
     var focusOption = React.useCallback(function(type) {
         var index = focusedOptionIndex;
         if (type === 'next') {
-            var nextIndex = findIndexAfter(options, index);
-            index = nextIndex === -1 ? findIndexAfter(options) : nextIndex; // Следующий за index или первый валидный до index
+            var nextIndex = CustomSelect_findIndexAfter(options, index);
+            index = nextIndex === -1 ? CustomSelect_findIndexAfter(options) : nextIndex; // Следующий за index или первый валидный до index
         } else if (type === 'prev') {
-            var beforeIndex = findIndexBefore(options, index);
-            index = beforeIndex === -1 ? findIndexBefore(options) : beforeIndex; // Предшествующий index или последний валидный после index
+            var beforeIndex = CustomSelect_findIndexBefore(options, index);
+            index = beforeIndex === -1 ? CustomSelect_findIndexBefore(options) : beforeIndex; // Предшествующий index или последний валидный после index
         }
         focusOptionByIndex(index);
     }, [
@@ -42312,38 +42293,21 @@ var filter = function(options, inputValue, filterFn) {
         focusedOptionIndex,
         options
     ]);
-    React.useEffect(function filterOptions() {
+    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;
         var options = searchable && inputValue !== undefined ? filter(optionsProp, inputValue, filterFn) : optionsProp;
         setOptions(options);
+        setSelectedOptionIndex(findSelectedIndex(options, value, allowClearButton));
     }, [
         filterFn,
         inputValue,
+        nativeSelectValue,
         optionsProp,
-        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
+        defaultValue,
+        props.value,
+        searchable,
+        allowClearButton
     ]);
     var onNativeSelectChange = function(e) {
         var newSelectedOptionIndex = findSelectedIndex(options, e.currentTarget.value, allowClearButton);
@@ -42508,6 +42472,7 @@ var filter = function(options, inputValue, filterFn) {
         renderDropdown,
         renderOption
     ]);
+    var selectInputRef = useExternRef(getSelectInputRef);
     var focusOnInputTimerRef = React.useRef();
     var focusOnInput = React.useCallback(function() {
         clearTimeout(focusOnInputTimerRef.current);
@@ -42588,14 +42553,11 @@ var filter = function(options, inputValue, filterFn) {
         selectInputRef
     ]);
     var preventInputBlurWhenClickInsideFocusedSelectArea = function(e) {
-        var _selectInputRef_current;
         // Так как инпут больше не оборачивается пустым лэйблом, то клик внутри обертки,
         // но вне инпута (например по иконке дропдауна), будет убирать фокус с инпута.
         // Чтобы в такой ситуации отключить blur инпута мы превентим mousedown событие обёртки
         var isInputFocused = document && document.activeElement === selectInputRef.current;
-        var clickTarget = e.target;
-        var inputClicked = (_selectInputRef_current = selectInputRef.current) === null || _selectInputRef_current === void 0 ? void 0 : _selectInputRef_current.contains(clickTarget);
-        if (isInputFocused && !inputClicked) {
+        if (isInputFocused) {
             e.preventDefault();
         }
     };
@@ -42604,19 +42566,23 @@ var filter = function(options, inputValue, filterFn) {
     var selectInputAriaProps = {
         'role': 'combobox',
         'aria-controls': popupAriaId,
+        'aria-owns': popupAriaId,
         'aria-expanded': opened,
         'aria-activedescendant': ariaActiveDescendantId && opened ? "".concat(popupAriaId, "-").concat(ariaActiveDescendantId) : undefined,
         'aria-labelledby': ariaLabelledBy,
         'aria-haspopup': 'listbox',
         'aria-autocomplete': 'none'
     };
+    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
-    }, /*#__PURE__*/ React.createElement(CustomSelectInput, CustomSelect_object_spread_props(CustomSelect_object_spread({
+    }, focusWithin && selected && !opened && /*#__PURE__*/ React.createElement(VisuallyHidden, {
+        "aria-live": "polite"
+    }, selected.label), /*#__PURE__*/ React.createElement(CustomSelectInput, CustomSelect_object_spread_props(CustomSelect_object_spread({
         autoComplete: "off",
         autoCapitalize: "none",
         autoCorrect: "off",
@@ -42626,7 +42592,7 @@ var filter = function(options, inputValue, filterFn) {
         onFocus: onFocus,
         onBlur: onBlur,
         className: openedClassNames,
-        searchable: searchable,
+        readOnly: !searchable,
         fetching: fetching,
         value: inputValue,
         onKeyUp: handleKeyUp,
@@ -42635,9 +42601,8 @@ var filter = function(options, inputValue, filterFn) {
         onClick: onClick,
         before: before,
         after: afterIcons,
-        selectType: selectType,
-        selectedOptionLabel: selected === null || selected === void 0 ? void 0 : selected.label
-    })), /*#__PURE__*/ React.createElement("select", {
+        selectType: selectType
+    }), selected === null || selected === void 0 ? void 0 : selected.label), /*#__PURE__*/ React.createElement("select", {
         ref: selectElRef,
         name: name,
         onChange: onNativeSelectChange,
@@ -42993,10 +42958,11 @@ function Select_object_without_properties_loose(source, excluded) {
     }, props)), deviceType.mobile && /*#__PURE__*/ React.createElement(NativeSelect, Select_object_spread({
         className: classNames(className, deviceType.mobile.className)
     }, nativeProps), options.map(function(param) {
-        var label = param.label, value = param.value;
+        var label = param.label, value = param.value, disabled = param.disabled;
         return /*#__PURE__*/ React.createElement("option", {
             value: value,
-            key: "".concat(value)
+            key: "".concat(value),
+            disabled: disabled
         }, label);
     })));
 };

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "6.7.0",
+  "version": "6.7.2",
   "name": "@vkontakte/vkui",
   "description": "VKUI library",
   "main": "dist/cjs/index.js",

package/src/components/AppRoot/AppRoot.tsx

@@ -198,20 +198,23 @@ export const AppRoot = ({
     [scroll],
   );
 
+  const contextValue = React.useMemo(
+    () => ({
+      appRoot: appRootRef,
+      portalRoot: portalRootRef,
+      embedded: mode === 'embedded',
+      mode,
+      disablePortal,
+      layout,
+      get keyboardInput() {
+        return isKeyboardInputActiveRef.current;
+      },
+    }),
+    [disablePortal, isKeyboardInputActiveRef, layout, mode],
+  );
+
   const content = (
-    <AppRootContext.Provider
-      value={{
-        appRoot: appRootRef,
-        portalRoot: portalRootRef,
-        embedded: mode === 'embedded',
-        mode,
-        disablePortal,
-        layout,
-        get keyboardInput() {
-          return isKeyboardInputActiveRef.current;
-        },
-      }}
-    >
+    <AppRootContext.Provider value={contextValue}>
       <ScrollController elRef={appRootRef}>{children}</ScrollController>
     </AppRootContext.Provider>
   );

package/src/components/BaseGallery/CarouselBase/CarouselBase.tsx

@@ -11,7 +11,12 @@ import { RootComponent } from '../../RootComponent/RootComponent';
 import { ScrollArrow } from '../../ScrollArrow/ScrollArrow';
 import { type CustomTouchEvent, Touch } from '../../Touch/Touch';
 import { type BaseGalleryProps, type GallerySlidesState } from '../types';
-import { ANIMATION_DURATION, CONTROL_ELEMENTS_STATE, SLIDES_MANAGER_STATE } from './constants';
+import {
+  ANIMATION_DURATION,
+  CONTROL_ELEMENTS_STATE,
+  SLIDE_THRESHOLD,
+  SLIDES_MANAGER_STATE,
+} from './constants';
 import { calculateIndent, getLoopPoints, getTargetIndex } from './helpers';
 import { useSlideAnimation } from './hooks';
 import type { ControlElementsState, SlidesManagerState } from './types';
@@ -253,7 +258,14 @@ export const CarouselBase = ({
 
   useIsomorphicLayoutEffect(initializeSlides, [align, slideWidth]);
 
+  const calculateMinDeltaXToSlide = () => {
+    return slidesManager.current.slides[slideIndex].width * SLIDE_THRESHOLD;
+  };
+
   const slideLeft = (event: React.MouseEvent) => {
+    if (slideIndex > 0) {
+      shiftXCurrentRef.current += calculateMinDeltaXToSlide();
+    }
     onChange?.(
       (slideIndex - 1 + slidesManager.current.slides.length) % slidesManager.current.slides.length,
     );
@@ -261,6 +273,9 @@ export const CarouselBase = ({
   };
 
   const slideRight = (event: React.MouseEvent) => {
+    if (slideIndex < slidesManager.current.slides.length - 1) {
+      shiftXCurrentRef.current -= calculateMinDeltaXToSlide();
+    }
     onChange?.((slideIndex + 1) % slidesManager.current.slides.length);
     onNextClick?.(event);
   };

package/src/components/CellButton/CellButton.module.css

@@ -38,7 +38,11 @@
 
 /* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
 .CellButton--centered :global(.vkuiIcon) {
-  padding-inline-end: 8px;
+  /* компенсируем отступ заданные в SimpleCell__before */
+  margin-inline-end: calc(
+    -1 * var(--vkui_internal--SimpleCell-before-inline-padding-end, var(--vkui--spacing_size_xl))
+  );
+  padding-inline-end: var(--vkui--spacing_size_m);
 }
 
 .CellButton {