@vkontakte/vkui 6.7.2 → 6.7.4

package/dist/components.js.tmp

@@ -7499,30 +7499,6 @@ function useState_object_spread(target) {
     }
     return target;
 }
-function ownKeys(object, enumerableOnly) {
-    var keys = Object.keys(object);
-    if (Object.getOwnPropertySymbols) {
-        var symbols = Object.getOwnPropertySymbols(object);
-        if (enumerableOnly) {
-            symbols = symbols.filter(function(sym) {
-                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-            });
-        }
-        keys.push.apply(keys, symbols);
-    }
-    return keys;
-}
-function _object_spread_props(target, source) {
-    source = source != null ? source : {};
-    if (Object.getOwnPropertyDescriptors) {
-        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-    } else {
-        ownKeys(Object(source)).forEach(function(key) {
-            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-        });
-    }
-    return target;
-}
 function useState_object_without_properties(source, excluded) {
     if (source == null) return {};
     var target = useState_object_without_properties_loose(source, excluded);
@@ -7575,10 +7551,9 @@ var ACTIVE_DELAY = 70;
     var prevIsHoveredRef = react.useRef(undefined);
     var handleHover = react.useCallback(function(isHover) {
         setHoveredStateLocal(isHover);
-        var isHovered = calculateStateValue({
+        var isHovered = hovered !== null && hovered !== void 0 ? hovered : calculateStateValue({
             hasState: hasHover,
             isLocked: lockState,
-            stateValueControlled: Boolean(hovered),
             stateValueLocal: isHover
         });
         // проверка сделана чтобы реже вызывать обновление состояния
@@ -7602,10 +7577,9 @@ var ACTIVE_DELAY = 70;
     var onPointerLeave = function() {
         handleHover(false);
     };
-    var isHovered = calculateStateValue({
+    var isHovered = hovered !== null && hovered !== void 0 ? hovered : calculateStateValue({
         hasState: hasHover,
         isLocked: lockState,
-        stateValueControlled: Boolean(hovered),
         stateValueLocal: hoveredStateLocal
     });
     return {
@@ -7651,10 +7625,9 @@ var ACTIVE_DELAY = 70;
         setActivated(true);
         setActivated(false, activeEffectDelay);
     };
-    var isActivated = calculateStateValue({
+    var isActivated = activated !== null && activated !== void 0 ? activated : calculateStateValue({
         hasState: hasActive,
         isLocked: lockStateRef.current,
-        stateValueControlled: Boolean(activated),
         stateValueLocal: activatedState
     });
     return {
@@ -7701,13 +7674,8 @@ function useLockRef(setParentStateLockBubbling) {
 }
 /**
  * Управляет состоянием компонента
- */ function useState(_param) {
-    var hovered = _param.hovered, hasHover = _param.hasHover, hasActive = _param.hasActive, unlockParentHover = _param.unlockParentHover, restProps = useState_object_without_properties(_param, [
-        "hovered",
-        "hasHover",
-        "hasActive",
-        "unlockParentHover"
-    ]);
+ */ function useState(param) {
+    var hovered = param.hovered, hasHover = param.hasHover, activated = param.activated, hasActive = param.hasActive, activeEffectDelay = param.activeEffectDelay, unlockParentHover = param.unlockParentHover, hoverClassName = param.hoverClassName, activeClassName = param.activeClassName;
     var _React_useContext = react.useContext(ClickableLockStateContext), _React_useContext_lockHoverStateBubbling = _React_useContext.lockHoverStateBubbling, lockHoverStateBubbling = _React_useContext_lockHoverStateBubbling === void 0 ? functions_noop : _React_useContext_lockHoverStateBubbling, _React_useContext_lockActiveStateBubbling = _React_useContext.lockActiveStateBubbling, lockActiveStateBubbling = _React_useContext_lockActiveStateBubbling === void 0 ? functions_noop : _React_useContext_lockActiveStateBubbling;
     var _useLockState = useState_sliced_to_array(useLockState(unlockParentHover ? functions_noop : lockHoverStateBubbling), 3), lockHoverState = _useLockState[0], setParentStateLockHoverBubbling = _useLockState[1], setLockHoverBubblingImmediate = _useLockState[2];
     var _useLockRef = useState_sliced_to_array(useLockRef(lockActiveStateBubbling), 3), lockActiveStateRef = _useLockRef[0], setParentStateLockActiveBubbling = _useLockRef[1], setLockActiveBubblingImmediate = _useLockRef[2];
@@ -7719,13 +7687,16 @@ function useLockRef(setParentStateLockBubbling) {
     }), isHovered = _useHover.isHovered, hoverEvent = useState_object_without_properties(_useHover, [
         "isHovered"
     ]);
-    var _useActive = useActive(_object_spread_props(useState_object_spread({}, restProps), {
+    var _useActive = useActive({
+        activated: activated,
+        hasActive: hasActive,
+        activeEffectDelay: activeEffectDelay,
         lockStateRef: lockActiveStateRef,
         setParentStateLock: setParentStateLockActiveBubbling
-    })), isActivated = _useActive.isActivated, activeEvent = useState_object_without_properties(_useActive, [
+    }), isActivated = _useActive.isActivated, activeEvent = useState_object_without_properties(_useActive, [
         "isActivated"
     ]);
-    var stateClassName = clsx(isHovered && restProps.hoverClassName, isActivated && restProps.activeClassName);
+    var stateClassName = clsx(isHovered && hoverClassName, isActivated && activeClassName);
     var handlers = mergeCalls(hoverEvent, activeEvent);
     return useState_object_spread({
         stateClassName: stateClassName,
@@ -7735,8 +7706,8 @@ function useLockRef(setParentStateLockBubbling) {
 }
 // Общая функция для определения конечного состояния active/hovered
 function calculateStateValue(param) {
-    var hasState = param.hasState, isLocked = param.isLocked, stateValueControlled = param.stateValueControlled, stateValueLocal = param.stateValueLocal;
-    return hasState && !isLocked && (stateValueControlled || stateValueLocal);
+    var hasState = param.hasState, isLocked = param.isLocked, stateValueLocal = param.stateValueLocal;
+    return hasState && !isLocked && stateValueLocal;
 }
 
 ;// CONCATENATED MODULE: ./src/components/Clickable/Clickable.module.css
@@ -8552,7 +8523,6 @@ var defaultIframeStyles = {
             key: "observeUsingIframe",
             value: function observeUsingIframe(element) {
                 var iframe = element.ownerDocument.createElement('iframe');
-                iframe.src = 'javascript:void(0)';
                 iframe.ariaHidden = 'true';
                 iframe.tabIndex = -1;
                 Object.assign(iframe.style, defaultIframeStyles);
@@ -8697,7 +8667,7 @@ function OnboardingTooltipContainer_object_spread(target) {
     }
     return target;
 }
-function OnboardingTooltipContainer_ownKeys(object, enumerableOnly) {
+function ownKeys(object, enumerableOnly) {
     var keys = Object.keys(object);
     if (Object.getOwnPropertySymbols) {
         var symbols = Object.getOwnPropertySymbols(object);
@@ -8710,12 +8680,12 @@ function OnboardingTooltipContainer_ownKeys(object, enumerableOnly) {
     }
     return keys;
 }
-function OnboardingTooltipContainer_object_spread_props(target, source) {
+function _object_spread_props(target, source) {
     source = source != null ? source : {};
     if (Object.getOwnPropertyDescriptors) {
         Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
     } else {
-        OnboardingTooltipContainer_ownKeys(Object(source)).forEach(function(key) {
+        ownKeys(Object(source)).forEach(function(key) {
             Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
         });
     }
@@ -8756,7 +8726,7 @@ var OnboardingTooltipContainer_OnboardingTooltipContainer = /*#__PURE__*/ react.
         "Component"
     ]);
     var dataProps = OnboardingTooltipContainer_define_property({}, OnboardingTooltipContainer_onboardingTooltipContainerAttr, fixed ? 'fixed' : 'true');
-    return /*#__PURE__*/ react.createElement(Component, OnboardingTooltipContainer_object_spread_props(OnboardingTooltipContainer_object_spread({}, dataProps, props), {
+    return /*#__PURE__*/ react.createElement(Component, _object_spread_props(OnboardingTooltipContainer_object_spread({}, dataProps, props), {
         ref: ref
     }));
 });
@@ -11297,6 +11267,7 @@ function Button_object_without_properties_loose(source, excluded) {
 
 
 
+
 var stylesSize = {
     s: "vkuiButton--size-s",
     m: "vkuiButton--size-m",
@@ -13501,6 +13472,13 @@ function useFloatingWithInteractions_array_with_holes(arr) {
 function useFloatingWithInteractions_array_without_holes(arr) {
     if (Array.isArray(arr)) return useFloatingWithInteractions_array_like_to_array(arr);
 }
+function useFloatingWithInteractions_instanceof(left, right) {
+    if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) {
+        return !!right[Symbol.hasInstance](left);
+    } else {
+        return left instanceof right;
+    }
+}
 function useFloatingWithInteractions_iterable_to_array(iter) {
     if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
 }
@@ -13739,8 +13717,20 @@ var whileElementsMounted = function() {
         commitShownLocalState
     ]);
     var handleRestoreFocus = React.useCallback(function() {
-        return triggerOnFocus ? blockFocusRef.current : true;
+        var restoreFocus = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true;
+        if (!restoreFocus) {
+            return false;
+        }
+        if (restoreFocus === true) {
+            return triggerOnFocus ? blockFocusRef.current : true;
+        } else if (restoreFocus === 'anchor-element') {
+            return refs.reference.current;
+        } else if (useFloatingWithInteractions_instanceof(restoreFocus, HTMLElement)) {
+            return restoreFocus;
+        }
+        return false;
     }, [
+        refs.reference,
         triggerOnFocus
     ]);
     var handleEscapeKeyDown = React.useCallback(function() {
@@ -16964,7 +16954,6 @@ function HorizontalScroll_unsupported_iterable_to_array(o, minLen) {
 
 
 
-
 /**
  * timing method
  */ function now() {
@@ -17123,42 +17112,32 @@ function doScroll(param) {
         setCanScrollStart,
         setCanScrollEnd
     ]);
-    var scrollEvent = useEventListener('scroll', calculateArrowsVisibility);
-    React.useEffect(function addScrollerRefToScrollEvent() {
-        if (!scrollerRef.current) {
-            return noop;
-        }
-        scrollEvent.add(scrollerRef.current);
-        return scrollEvent.remove;
-    }, [
-        scrollEvent,
-        scrollerRef
-    ]);
     React.useEffect(calculateArrowsVisibility, [
         calculateArrowsVisibility,
         children
     ]);
-    /**
-   * Прокрутка с помощью любого колеса мыши
-   */ var onwheel = React.useCallback(function(e) {
+    var _onWheel = React.useCallback(function(e) {
         scrollerRef.current.scrollBy({
             left: e.deltaX + e.deltaY,
             behavior: 'auto'
         });
-        e.preventDefault();
     }, [
         scrollerRef
     ]);
-    var wheelEvent = useEventListener('wheel', onwheel);
-    React.useEffect(function addScrollerRefToWheelEvent() {
-        if (!scrollerRef.current || !scrollOnAnyWheel) {
-            return noop;
+    /**
+   * Прокрутка с помощью любого колеса мыши
+   */ var onScrollWheel = React.useCallback(function(e) {
+        _onWheel(e);
+        e.preventDefault();
+    }, [
+        _onWheel
+    ]);
+    var onArrowWheel = React.useCallback(function(e) {
+        if (e.deltaX || e.deltaY && scrollOnAnyWheel) {
+            _onWheel(e);
         }
-        wheelEvent.add(scrollerRef.current);
-        return wheelEvent.remove;
     }, [
-        wheelEvent,
-        scrollerRef,
+        _onWheel,
         scrollOnAnyWheel
     ]);
     return /*#__PURE__*/ React.createElement(RootComponent, HorizontalScroll_object_spread_props(HorizontalScroll_object_spread({}, restProps), {
@@ -17172,7 +17151,8 @@ function doScroll(param) {
         "aria-hidden": true,
         tabIndex: -1,
         className: classNames("vkuiHorizontalScroll__arrow", "vkuiHorizontalScroll__arrowLeft"),
-        onClick: scrollToLeft
+        onClick: scrollToLeft,
+        onWheel: onArrowWheel
     }), showArrows && (hasPointer || hasPointer === undefined) && canScrollRight && /*#__PURE__*/ React.createElement(ScrollArrow, {
         "data-testid":  false ? 0 : undefined,
         size: arrowSize,
@@ -17181,10 +17161,13 @@ function doScroll(param) {
         "aria-hidden": true,
         tabIndex: -1,
         className: classNames("vkuiHorizontalScroll__arrow", "vkuiHorizontalScroll__arrowRight"),
-        onClick: scrollToRight
+        onClick: scrollToRight,
+        onWheel: onArrowWheel
     }), /*#__PURE__*/ React.createElement("div", {
         className: "vkuiHorizontalScroll__in",
-        ref: scrollerRef
+        ref: scrollerRef,
+        onScroll: calculateArrowsVisibility,
+        onWheel: scrollOnAnyWheel ? onScrollWheel : undefined
     }, /*#__PURE__*/ React.createElement("div", {
         className: "vkuiHorizontalScroll__in-wrapper"
     }, children)));
@@ -18236,7 +18219,52 @@ function FocusTrap_unsupported_iterable_to_array(o, minLen) {
 
 
 
+
 var FOCUSABLE_ELEMENTS = FOCUSABLE_ELEMENTS_LIST.join();
+var useRestoreFocus = function(param) {
+    var restoreFocus = param.restoreFocus, timeout = param.timeout, mount = param.mount, ref = param.ref;
+    var restoreFocusRef = (0,react.useRef)(restoreFocus);
+    restoreFocusRef.current = restoreFocus;
+    var _useState = FocusTrap_sliced_to_array((0,react.useState)(null), 2), restoreFocusTo = _useState[0], setRestoreFocusTo = _useState[1];
+    var restoreFocusImpl = useStableCallback_useStableCallback(function() {
+        var shouldRestoreFocus = typeof restoreFocusRef.current === 'function' ? restoreFocusRef.current() : restoreFocusRef.current;
+        if (!shouldRestoreFocus) {
+            return;
+        }
+        setTimeout(function() {
+            var restoreFocusElement = floating_ui_utils_dom_esm_isHTMLElement(shouldRestoreFocus) && shouldRestoreFocus || floating_ui_utils_dom_esm_isHTMLElement(restoreFocusTo) && restoreFocusTo || null;
+            if (restoreFocusElement) {
+                restoreFocusElement.focus();
+                setRestoreFocusTo(null);
+            }
+        }, timeout);
+    });
+    useIsomorphicLayoutEffect_useIsomorphicLayoutEffect(function calculateRestoreFocusTo() {
+        if (!ref.current || !restoreFocusRef.current || !mount) {
+            setRestoreFocusTo(null);
+            return;
+        }
+        setRestoreFocusTo(dom_getActiveElementByAnotherElement(ref.current));
+    }, [
+        ref,
+        mount
+    ]);
+    useIsomorphicLayoutEffect_useIsomorphicLayoutEffect(function tryToRestoreFocusOnUnmount() {
+        return function() {
+            restoreFocusImpl();
+        };
+    }, [
+        restoreFocusImpl
+    ]);
+    useIsomorphicLayoutEffect_useIsomorphicLayoutEffect(function tryToRestoreFocusWhenFakeUnmount() {
+        if (!mount) {
+            restoreFocusImpl();
+        }
+    }, [
+        mount,
+        restoreFocusImpl
+    ]);
+};
 /**
  * @see https://vkcom.github.io/VKUI/#/FocusTrap
  */ var FocusTrap_FocusTrap = function(_param) {
@@ -18254,7 +18282,12 @@ var FOCUSABLE_ELEMENTS = FOCUSABLE_ELEMENTS_LIST.join();
     var ref = useExternRef_useExternRef(getRootRef);
     var document = dom_useDOM().document;
     var focusableNodesRef = (0,react.useRef)([]);
-    var _useState = FocusTrap_sliced_to_array((0,react.useState)(null), 2), restoreFocusTo = _useState[0], setRestoreFocusTo = _useState[1];
+    useRestoreFocus({
+        restoreFocus: restoreFocus,
+        timeout: timeout,
+        mount: mount,
+        ref: ref
+    });
     var focusNodeByIndex = function(nodeIndex) {
         var element = focusableNodesRef.current[nodeIndex];
         if (element) {
@@ -18326,48 +18359,6 @@ var FOCUSABLE_ELEMENTS = FOCUSABLE_ELEMENTS_LIST.join();
         timeout,
         disabled
     ]);
-    var restoreFocusImpl = (0,react.useCallback)(function() {
-        var shouldRestoreFocus = typeof restoreFocus === 'function' ? restoreFocus() : restoreFocus;
-        if (!restoreFocusTo || !floating_ui_utils_dom_esm_isHTMLElement(restoreFocusTo) || !shouldRestoreFocus) {
-            return;
-        }
-        setTimeout(function() {
-            if (restoreFocusTo) {
-                restoreFocusTo.focus();
-                setRestoreFocusTo(null);
-            }
-        }, timeout);
-    }, [
-        restoreFocus,
-        restoreFocusTo,
-        timeout
-    ]);
-    useIsomorphicLayoutEffect_useIsomorphicLayoutEffect(function calculateRestoreFocusTo() {
-        if (!ref.current || !restoreFocus || !mount) {
-            setRestoreFocusTo(null);
-            return;
-        }
-        setRestoreFocusTo(dom_getActiveElementByAnotherElement(ref.current));
-    }, [
-        ref,
-        mount,
-        restoreFocus
-    ]);
-    useIsomorphicLayoutEffect_useIsomorphicLayoutEffect(function tryToRestoreFocusOnUnmount() {
-        return function() {
-            return restoreFocusImpl();
-        };
-    }, [
-        restoreFocusImpl
-    ]);
-    useIsomorphicLayoutEffect_useIsomorphicLayoutEffect(function tryToRestoreFocusWhenFakeUnmount() {
-        if (!mount) {
-            restoreFocusImpl();
-        }
-    }, [
-        mount,
-        restoreFocusImpl
-    ]);
     useIsomorphicLayoutEffect_useIsomorphicLayoutEffect(function() {
         if (!ref.current) {
             return;
@@ -29385,7 +29376,7 @@ var BaseGallery_BaseGallery = function(_param) {
     };
     var initializeSlides = function() {
         var options = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
-        var _rootRef_current, _viewportRef_current, _layoutState_current_slides_slideIndex, _localSlides_slideIndex;
+        var _rootRef_current, _viewportRef_current, _layoutState_current_slides_slideIndex, _localSlides_slideIndex, _localSlides_slideIndex1;
         var _React_Children_map;
         var localSlides = (_React_Children_map = React.Children.map(children, function(_item, i) {
             var elem = slidesStore.current["slide-".concat(i)];
@@ -29403,6 +29394,9 @@ var BaseGallery_BaseGallery = function(_param) {
             return slide.width + val;
         }, 0);
         var adjustShiftX = localSlides.length <= layoutState.current.slides.length || ((_layoutState_current_slides_slideIndex = layoutState.current.slides[slideIndex]) === null || _layoutState_current_slides_slideIndex === void 0 ? void 0 : _layoutState_current_slides_slideIndex.coordX) !== ((_localSlides_slideIndex = localSlides[slideIndex]) === null || _localSlides_slideIndex === void 0 ? void 0 : _localSlides_slideIndex.coordX);
+        var _localSlides_slideIndex_width;
+        var currentSlideOffsetOnCenterAlignment = (localContainerWidth - ((_localSlides_slideIndex_width = (_localSlides_slideIndex1 = localSlides[slideIndex]) === null || _localSlides_slideIndex1 === void 0 ? void 0 : _localSlides_slideIndex1.width) !== null && _localSlides_slideIndex_width !== void 0 ? _localSlides_slideIndex_width : 0)) / 2;
+        var isFullyVisible = align === 'center' ? localLayerWidth + currentSlideOffsetOnCenterAlignment <= localContainerWidth : localLayerWidth <= localContainerWidth;
         layoutState.current = {
             containerWidth: localContainerWidth,
             viewportOffsetWidth: localViewportOffsetWidth,
@@ -29421,7 +29415,7 @@ var BaseGallery_BaseGallery = function(_param) {
                 align: align
             }),
             slides: localSlides,
-            isFullyVisible: localLayerWidth <= localContainerWidth
+            isFullyVisible: isFullyVisible
         };
         setShiftState(function(prevState) {
             var _options_animation;
@@ -30008,6 +30002,10 @@ var CarouselBase_CarouselBase = function(_param) {
                 width: elem.offsetWidth
             };
         }) || [];
+        if (localSlides.length === 0) {
+            initialized.current = false;
+            return;
+        }
         var containerWidth = rootRef.current.offsetWidth;
         var viewportOffsetWidth = viewportRef.current.offsetWidth;
         var layerWidth = localSlides.reduce(function(val, slide) {
@@ -30215,45 +30213,114 @@ var CarouselBase_CarouselBase = function(_param) {
 };
 
 ;// CONCATENATED MODULE: ./src/components/Gallery/hooks.ts
+function Gallery_hooks_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 Gallery_hooks_array_with_holes(arr) {
+    if (Array.isArray(arr)) return arr;
+}
+function Gallery_hooks_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 Gallery_hooks_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 Gallery_hooks_sliced_to_array(arr, i) {
+    return Gallery_hooks_array_with_holes(arr) || Gallery_hooks_iterable_to_array_limit(arr, i) || Gallery_hooks_unsupported_iterable_to_array(arr, i) || Gallery_hooks_non_iterable_rest();
+}
+function Gallery_hooks_unsupported_iterable_to_array(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return Gallery_hooks_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 Gallery_hooks_array_like_to_array(o, minLen);
+}
 
 
 
-function hooks_useAutoPlay(timeout, slideIndex, callbackFnProp) {
+function hooks_useAutoPlay(param) {
+    var timeout = param.timeout, slideIndex = param.slideIndex, onNext = param.onNext;
     var document = useDOM().document;
-    var callbackFn = useStableCallback(callbackFnProp);
+    var _React_useState = Gallery_hooks_sliced_to_array(React.useState(false), 2), paused = _React_useState[0], setPaused = _React_useState[1];
+    var timeoutRef = React.useRef(null);
+    var callbackFn = useStableCallback(onNext);
+    var pause = React.useCallback(function() {
+        return setPaused(true);
+    }, []);
+    var resume = React.useCallback(function() {
+        return setPaused(false);
+    }, []);
+    // Выносим функции очистки и старта таймера в отдельные функции
+    var clearAutoPlayTimeout = React.useCallback(function() {
+        if (timeoutRef.current) {
+            clearTimeout(timeoutRef.current);
+            timeoutRef.current = null;
+        }
+    }, []);
+    var startAutoPlayTimeout = React.useCallback(function() {
+        if (!document || !timeout || paused) {
+            return;
+        }
+        if (document.visibilityState === 'visible') {
+            clearAutoPlayTimeout();
+            timeoutRef.current = setTimeout(callbackFn, timeout);
+        } else {
+            clearAutoPlayTimeout();
+        }
+    }, [
+        document,
+        timeout,
+        paused,
+        clearAutoPlayTimeout,
+        callbackFn
+    ]);
+    // Основной эффект для управления автопроигрыванием
     React.useEffect(function initializeAutoPlay() {
-        if (!document || !timeout) {
+        if (!document || !timeout || paused) {
             return;
         }
-        var timeoutId = null;
-        var stop = function() {
-            if (timeoutId) {
-                clearTimeout(timeoutId);
-                timeoutId = null;
-            }
-        };
-        var start = function() {
-            switch(document.visibilityState){
-                case 'visible':
-                    stop();
-                    timeoutId = setTimeout(callbackFn, timeout);
-                    break;
-                case 'hidden':
-                    stop();
-            }
-        };
-        start();
-        document.addEventListener('visibilitychange', start);
+        startAutoPlayTimeout();
+        document.addEventListener('visibilitychange', startAutoPlayTimeout);
         return function() {
-            stop();
-            document.removeEventListener('visibilitychange', start);
+            clearAutoPlayTimeout();
+            document.removeEventListener('visibilitychange', startAutoPlayTimeout);
         };
     }, [
         document,
         timeout,
         slideIndex,
-        callbackFn
+        startAutoPlayTimeout,
+        clearAutoPlayTimeout,
+        paused
     ]);
+    return {
+        resume: resume,
+        pause: pause
+    };
 }
 
 ;// CONCATENATED MODULE: ./src/components/Gallery/Gallery.tsx
@@ -30388,16 +30455,19 @@ function Gallery_unsupported_iterable_to_array(o, minLen) {
 
 
 
+
 /**
  * @see https://vkcom.github.io/VKUI/#/Gallery
  */ var Gallery = function(_param) {
-    var _param_initialSlideIndex = _param.initialSlideIndex, initialSlideIndex = _param_initialSlideIndex === void 0 ? 0 : _param_initialSlideIndex, children = _param.children, _param_timeout = _param.timeout, timeout = _param_timeout === void 0 ? 0 : _param_timeout, onChange = _param.onChange, bullets = _param.bullets, looped = _param.looped, props = Gallery_object_without_properties(_param, [
+    var _param_initialSlideIndex = _param.initialSlideIndex, initialSlideIndex = _param_initialSlideIndex === void 0 ? 0 : _param_initialSlideIndex, children = _param.children, _param_timeout = _param.timeout, timeout = _param_timeout === void 0 ? 0 : _param_timeout, onChange = _param.onChange, bullets = _param.bullets, looped = _param.looped, onDragStart = _param.onDragStart, onDragEnd = _param.onDragEnd, props = Gallery_object_without_properties(_param, [
         "initialSlideIndex",
         "children",
         "timeout",
         "onChange",
         "bullets",
-        "looped"
+        "looped",
+        "onDragStart",
+        "onDragEnd"
     ]);
     var _React_useState = Gallery_sliced_to_array(React.useState(initialSlideIndex), 2), localSlideIndex = _React_useState[0], setSlideIndex = _React_useState[1];
     var isControlled = typeof props.slideIndex === 'number';
@@ -30423,8 +30493,12 @@ function Gallery_unsupported_iterable_to_array(o, minLen) {
         onChange,
         slideIndex
     ]);
-    useAutoPlay(timeout, slideIndex, function() {
-        return handleChange((slideIndex + 1) % childCount);
+    var autoPlayControls = useAutoPlay({
+        timeout: timeout,
+        slideIndex: slideIndex,
+        onNext: function() {
+            return handleChange((slideIndex + 1) % childCount);
+        }
     });
     // prevent invalid slideIndex
     // any slide index is invalid with no slides, just keep it as is
@@ -30447,6 +30521,8 @@ function Gallery_unsupported_iterable_to_array(o, minLen) {
     return /*#__PURE__*/ React.createElement(Component, Gallery_object_spread_props(Gallery_object_spread({
         dragDisabled: isControlled && !onChange
     }, props), {
+        onDragStart: callMultiple(onDragStart, autoPlayControls.pause),
+        onDragEnd: callMultiple(onDragEnd, autoPlayControls.resume),
         bullets: childCount > 0 && bullets,
         slideIndex: safeSlideIndex,
         onChange: handleChange
@@ -42465,20 +42541,6 @@ var filter = function(options, inputValue, filterFn) {
         renderOption
     ]);
     var selectInputRef = useExternRef(getSelectInputRef);
-    var focusOnInputTimerRef = React.useRef();
-    var focusOnInput = React.useCallback(function() {
-        clearTimeout(focusOnInputTimerRef.current);
-        focusOnInputTimerRef.current = setTimeout(function() {
-            selectInputRef.current && selectInputRef.current.focus();
-        }, 0);
-    }, [
-        selectInputRef
-    ]);
-    useIsomorphicLayoutEffect(function clearFocusOnInputTimer() {
-        return function() {
-            clearTimeout(focusOnInputTimerRef.current);
-        };
-    }, []);
     var controlledValueSet = isControlledOutside && props.value !== '';
     var uncontrolledValueSet = !isControlledOutside && nativeSelectValue !== '';
     var clearButtonShown = allowClearButton && !opened && (controlledValueSet || uncontrolledValueSet);
@@ -42491,7 +42553,7 @@ var filter = function(options, inputValue, filterFn) {
             onClick: function clearSelectState() {
                 setNativeSelectValue('');
                 setInputValue('');
-                focusOnInput();
+                selectInputRef.current && selectInputRef.current.focus();
             },
             disabled: restProps.disabled,
             "data-testid": clearButtonTestId
@@ -42502,7 +42564,7 @@ var filter = function(options, inputValue, filterFn) {
         iconProp,
         restProps.disabled,
         clearButtonTestId,
-        focusOnInput
+        selectInputRef
     ]);
     var icon = React.useMemo(function() {
         if (iconProp !== undefined) {
@@ -42536,12 +42598,11 @@ var filter = function(options, inputValue, filterFn) {
             selectInputRef.current.click();
             var inputIsNotFocused = document.activeElement !== selectInputRef.current;
             if (inputIsNotFocused) {
-                focusOnInput();
+                selectInputRef.current.focus();
             }
         }
     }, [
         document,
-        focusOnInput,
         selectInputRef
     ]);
     var preventInputBlurWhenClickInsideFocusedSelectArea = function(e) {
@@ -44236,7 +44297,7 @@ function CalendarDay_object_without_properties_loose(source, excluded) {
 
 
 var CalendarDay_CalendarDay = /*#__PURE__*/ react.memo(function(_param) {
-    var day = _param.day, today = _param.today, selected = _param.selected, onChange = _param.onChange, hidden = _param.hidden, disabled = _param.disabled, active = _param.active, selectionStart = _param.selectionStart, selectionEnd = _param.selectionEnd, focused = _param.focused, onEnter = _param.onEnter, onLeave = _param.onLeave, hinted = _param.hinted, hintedSelectionStart = _param.hintedSelectionStart, hintedSelectionEnd = _param.hintedSelectionEnd, sameMonth = _param.sameMonth, size = _param.size, className = _param.className, children = _param.children, renderDayContent = _param.renderDayContent, restProps = CalendarDay_object_without_properties(_param, [
+    var day = _param.day, today = _param.today, selected = _param.selected, onChange = _param.onChange, hidden = _param.hidden, disabled = _param.disabled, active = _param.active, selectionStart = _param.selectionStart, selectionEnd = _param.selectionEnd, focused = _param.focused, onEnter = _param.onEnter, onLeave = _param.onLeave, hinted = _param.hinted, hintedSelectionStart = _param.hintedSelectionStart, hintedSelectionEnd = _param.hintedSelectionEnd, sameMonth = _param.sameMonth, size = _param.size, className = _param.className, children = _param.children, renderDayContent = _param.renderDayContent, testId = _param.testId, restProps = CalendarDay_object_without_properties(_param, [
         "day",
         "today",
         "selected",
@@ -44256,7 +44317,8 @@ var CalendarDay_CalendarDay = /*#__PURE__*/ react.memo(function(_param) {
         "size",
         "className",
         "children",
-        "renderDayContent"
+        "renderDayContent",
+        "testId"
     ]);
     var locale = ConfigProviderContext_useConfigProvider().locale;
     var ref = react.useRef(null);
@@ -44324,7 +44386,8 @@ var CalendarDay_CalendarDay = /*#__PURE__*/ react.memo(function(_param) {
         getRootRef: ref,
         focusVisibleMode: active ? 'outside' : 'inside',
         onPointerEnter: handleEnter,
-        onPointerLeave: handleLeave
+        onPointerLeave: handleLeave,
+        "data-testid": typeof testId === 'string' ? testId : testId === null || testId === void 0 ? void 0 : testId(day)
     }, restProps), /*#__PURE__*/ react.createElement("div", {
         className: clsx("vkuiCalendarDay__hinted", hinted && "vkuiCalendarDay__hinted--active", hintedSelectionStart && "vkuiCalendarDay__hinted--selection-start", hintedSelectionEnd && "vkuiCalendarDay__hinted--selection-end")
     }, /*#__PURE__*/ react.createElement("div", {
@@ -44428,7 +44491,7 @@ function CalendarDays_object_without_properties_loose(source, excluded) {
 
 
 var CalendarDays_CalendarDays = function(_param) {
-    var viewDate = _param.viewDate, value = _param.value, weekStartsOn = _param.weekStartsOn, onDayChange = _param.onDayChange, isDaySelected = _param.isDaySelected, isDayActive = _param.isDayActive, isDaySelectionEnd = _param.isDaySelectionEnd, isDaySelectionStart = _param.isDaySelectionStart, onDayEnter = _param.onDayEnter, onDayLeave = _param.onDayLeave, isDayHinted = _param.isDayHinted, isHintedDaySelectionStart = _param.isHintedDaySelectionStart, isHintedDaySelectionEnd = _param.isHintedDaySelectionEnd, isDayFocused = _param.isDayFocused, isDayDisabled = _param.isDayDisabled, size = _param.size, _param_showNeighboringMonth = _param.showNeighboringMonth, showNeighboringMonth = _param_showNeighboringMonth === void 0 ? false : _param_showNeighboringMonth, dayProps = _param.dayProps, _param_listenDayChangesForUpdate = _param.listenDayChangesForUpdate, listenDayChangesForUpdate = _param_listenDayChangesForUpdate === void 0 ? false : _param_listenDayChangesForUpdate, getRootRef = _param.getRootRef, renderDayContent = _param.renderDayContent, props = CalendarDays_object_without_properties(_param, [
+    var viewDate = _param.viewDate, value = _param.value, weekStartsOn = _param.weekStartsOn, onDayChange = _param.onDayChange, isDaySelected = _param.isDaySelected, isDayActive = _param.isDayActive, isDaySelectionEnd = _param.isDaySelectionEnd, isDaySelectionStart = _param.isDaySelectionStart, onDayEnter = _param.onDayEnter, onDayLeave = _param.onDayLeave, isDayHinted = _param.isDayHinted, isHintedDaySelectionStart = _param.isHintedDaySelectionStart, isHintedDaySelectionEnd = _param.isHintedDaySelectionEnd, isDayFocused = _param.isDayFocused, isDayDisabled = _param.isDayDisabled, size = _param.size, _param_showNeighboringMonth = _param.showNeighboringMonth, showNeighboringMonth = _param_showNeighboringMonth === void 0 ? false : _param_showNeighboringMonth, dayProps = _param.dayProps, _param_listenDayChangesForUpdate = _param.listenDayChangesForUpdate, listenDayChangesForUpdate = _param_listenDayChangesForUpdate === void 0 ? false : _param_listenDayChangesForUpdate, getRootRef = _param.getRootRef, renderDayContent = _param.renderDayContent, dayTestId = _param.dayTestId, props = CalendarDays_object_without_properties(_param, [
         "viewDate",
         "value",
         "weekStartsOn",
@@ -44449,7 +44512,8 @@ var CalendarDays_CalendarDays = function(_param) {
         "dayProps",
         "listenDayChangesForUpdate",
         "getRootRef",
-        "renderDayContent"
+        "renderDayContent",
+        "dayTestId"
     ]);
     var locale = useConfigProvider().locale;
     var ref = useExternRef(getRootRef);
@@ -44510,7 +44574,8 @@ var CalendarDays_CalendarDays = function(_param) {
                 hinted: isDayHinted === null || isDayHinted === void 0 ? void 0 : isDayHinted(day),
                 sameMonth: sameMonth,
                 size: size,
-                renderDayContent: renderDayContent
+                renderDayContent: renderDayContent,
+                testId: dayTestId
             }, dayProps));
         }));
     }));
@@ -44662,7 +44727,7 @@ var CalendarHeader_CalendarHeader = function(_param) {
         className: "vkuiCalendarHeader__nav-icon--accent",
         width: 30,
         height: 30
-    }) : _param_nextMonthIcon, isMonthDisabled = _param.isMonthDisabled, isYearDisabled = _param.isYearDisabled, restProps = CalendarHeader_object_without_properties(_param, [
+    }) : _param_nextMonthIcon, isMonthDisabled = _param.isMonthDisabled, isYearDisabled = _param.isYearDisabled, monthDropdownTestId = _param.monthDropdownTestId, yearDropdownTestId = _param.yearDropdownTestId, prevMonthButtonTestId = _param.prevMonthButtonTestId, nextMonthButtonTestId = _param.nextMonthButtonTestId, restProps = CalendarHeader_object_without_properties(_param, [
         "viewDate",
         "onChange",
         "prevMonthHidden",
@@ -44679,7 +44744,11 @@ var CalendarHeader_CalendarHeader = function(_param) {
         "prevMonthIcon",
         "nextMonthIcon",
         "isMonthDisabled",
-        "isYearDisabled"
+        "isYearDisabled",
+        "monthDropdownTestId",
+        "yearDropdownTestId",
+        "prevMonthButtonTestId",
+        "nextMonthButtonTestId"
     ]);
     var locale = useConfigProvider().locale;
     var onMonthsChange = React.useCallback(function(event) {
@@ -44745,7 +44814,8 @@ var CalendarHeader_CalendarHeader = function(_param) {
         sizeX: "regular"
     }, /*#__PURE__*/ React.createElement(Tappable, CalendarHeader_object_spread({
         className: classNames("vkuiCalendarHeader__nav-icon", "vkuiCalendarHeader__nav-icon-prev", prevMonthClassName),
-        onClick: onPrevMonth
+        onClick: onPrevMonth,
+        "data-testid": prevMonthButtonTestId
     }, restPrevMonthProps), /*#__PURE__*/ React.createElement(VisuallyHidden, null, prevMonthLabel, ", ", formatter.format(subMonths(viewDate, 1))), prevMonthIcon)), disablePickers ? /*#__PURE__*/ React.createElement(Paragraph, {
         className: classNames("vkuiCalendarHeader__pickers", 'vkuiInternalCalendarHeader__pickers'),
         weight: "2"
@@ -44769,7 +44839,8 @@ var CalendarHeader_CalendarHeader = function(_param) {
         onChange: onMonthsChange,
         forceDropdownPortal: false,
         selectType: "accent",
-        "aria-label": changeMonthLabel
+        "aria-label": changeMonthLabel,
+        "data-testid": typeof monthDropdownTestId === 'string' ? monthDropdownTestId : monthDropdownTestId === null || monthDropdownTestId === void 0 ? void 0 : monthDropdownTestId(currentMonth)
     }), /*#__PURE__*/ React.createElement(CustomSelect, {
         className: classNames("vkuiCalendarHeader__picker", 'vkuiInternalCalendarHeader__picker'),
         value: currentYear,
@@ -44780,12 +44851,14 @@ var CalendarHeader_CalendarHeader = function(_param) {
         onChange: onYearChange,
         forceDropdownPortal: false,
         selectType: "accent",
-        "aria-label": changeYearLabel
+        "aria-label": changeYearLabel,
+        "data-testid": yearDropdownTestId
     }))), !nextMonthHidden && /*#__PURE__*/ React.createElement(AdaptivityProvider, {
         sizeX: "regular"
     }, /*#__PURE__*/ React.createElement(Tappable, CalendarHeader_object_spread({
         className: classNames("vkuiCalendarHeader__nav-icon", "vkuiCalendarHeader__nav-icon-next", nextMonthClassName),
-        onClick: onNextMonth
+        onClick: onNextMonth,
+        "data-testid": nextMonthButtonTestId
     }, restNextMonthProps), /*#__PURE__*/ React.createElement(VisuallyHidden, null, nextMonthLabel, ", ", formatter.format(addMonths(viewDate, 1))), nextMonthIcon)));
 };
 
@@ -44851,6 +44924,7 @@ function CalendarTime_object_spread_props(target, source) {
 
 
 
+
 var hours = [];
 for(var i = 0; i < 24; i += 1){
     hours.push({
@@ -44866,7 +44940,7 @@ for(var i1 = 0; i1 < 60; i1 += 1){
     });
 }
 var CalendarTime_CalendarTime = function(param) {
-    var value = param.value, _param_doneButtonText = param.doneButtonText, doneButtonText = _param_doneButtonText === void 0 ? 'Готово' : _param_doneButtonText, onChange = param.onChange, onClose = param.onClose, changeHoursLabel = param.changeHoursLabel, changeMinutesLabel = param.changeMinutesLabel, isDayDisabled = param.isDayDisabled;
+    var value = param.value, onChange = param.onChange, onClose = param.onClose, changeHoursLabel = param.changeHoursLabel, changeMinutesLabel = param.changeMinutesLabel, isDayDisabled = param.isDayDisabled, _param_doneButtonText = param.doneButtonText, doneButtonText = _param_doneButtonText === void 0 ? 'Готово' : _param_doneButtonText, _param_doneButtonDisabled = param.doneButtonDisabled, doneButtonDisabled = _param_doneButtonDisabled === void 0 ? false : _param_doneButtonDisabled, _param_doneButtonShow = param.doneButtonShow, doneButtonShow = _param_doneButtonShow === void 0 ? true : _param_doneButtonShow, minutesTestId = param.minutesTestId, hoursTestId = param.hoursTestId, doneButtonTestId = param.doneButtonTestId;
     var localHours = isDayDisabled ? hours.map(function(hour) {
         return CalendarTime_object_spread_props(CalendarTime_object_spread({}, hour), {
             disabled: isDayDisabled(setHours(value, hour.value), true)
@@ -44890,7 +44964,7 @@ var CalendarTime_CalendarTime = function(param) {
         value
     ]);
     return /*#__PURE__*/ React.createElement("div", {
-        className: "vkuiCalendarTime"
+        className: classNames("vkuiCalendarTime", !doneButtonShow && "vkuiCalendarTime__withoutDone")
     }, /*#__PURE__*/ React.createElement("div", {
         className: "vkuiCalendarTime__picker"
     }, /*#__PURE__*/ React.createElement(AdaptivityProvider, {
@@ -44900,7 +44974,8 @@ var CalendarTime_CalendarTime = function(param) {
         options: localHours,
         onChange: onHoursChange,
         forceDropdownPortal: false,
-        "aria-label": changeHoursLabel
+        "aria-label": changeHoursLabel,
+        "data-testid": hoursTestId
     }))), /*#__PURE__*/ React.createElement("div", {
         className: "vkuiCalendarTime__divider"
     }, ":"), /*#__PURE__*/ React.createElement("div", {
@@ -44912,15 +44987,18 @@ var CalendarTime_CalendarTime = function(param) {
         options: localMinutes,
         onChange: onMinutesChange,
         forceDropdownPortal: false,
-        "aria-label": changeMinutesLabel
-    }))), /*#__PURE__*/ React.createElement("div", {
+        "aria-label": changeMinutesLabel,
+        "data-testid": minutesTestId
+    }))), doneButtonShow && /*#__PURE__*/ React.createElement("div", {
         className: "vkuiCalendarTime__button"
     }, /*#__PURE__*/ React.createElement(AdaptivityProvider, {
         sizeY: "compact"
     }, /*#__PURE__*/ React.createElement(Button, {
         mode: "secondary",
         onClick: onClose,
-        size: "l"
+        size: "l",
+        disabled: doneButtonDisabled,
+        "data-testid": doneButtonTestId
     }, doneButtonText))));
 };
 
@@ -45023,7 +45101,7 @@ var Calendar_warn = warnOnce('Calendar');
 /**
  * @see https://vkcom.github.io/VKUI/#/Calendar
  */ var Calendar_Calendar = function(_param) {
-    var value = _param.value, onChange = _param.onChange, disablePast = _param.disablePast, disableFuture = _param.disableFuture, shouldDisableDate = _param.shouldDisableDate, onClose = _param.onClose, _param_enableTime = _param.enableTime, enableTime = _param_enableTime === void 0 ? false : _param_enableTime, doneButtonText = _param.doneButtonText, _param_weekStartsOn = _param.weekStartsOn, weekStartsOn = _param_weekStartsOn === void 0 ? 1 : _param_weekStartsOn, disablePickers = _param.disablePickers, _param_changeHoursLabel = _param.changeHoursLabel, changeHoursLabel = _param_changeHoursLabel === void 0 ? 'Изменить час' : _param_changeHoursLabel, _param_changeMinutesLabel = _param.changeMinutesLabel, changeMinutesLabel = _param_changeMinutesLabel === void 0 ? 'Изменить минуту' : _param_changeMinutesLabel, _param_prevMonthLabel = _param.prevMonthLabel, prevMonthLabel = _param_prevMonthLabel === void 0 ? 'Предыдущий месяц' : _param_prevMonthLabel, _param_nextMonthLabel = _param.nextMonthLabel, nextMonthLabel = _param_nextMonthLabel === void 0 ? 'Следующий месяц' : _param_nextMonthLabel, _param_changeMonthLabel = _param.changeMonthLabel, changeMonthLabel = _param_changeMonthLabel === void 0 ? 'Изменить месяц' : _param_changeMonthLabel, _param_changeYearLabel = _param.changeYearLabel, changeYearLabel = _param_changeYearLabel === void 0 ? 'Изменить год' : _param_changeYearLabel, showNeighboringMonth = _param.showNeighboringMonth, _param_changeDayLabel = _param.changeDayLabel, changeDayLabel = _param_changeDayLabel === void 0 ? 'Изменить день' : _param_changeDayLabel, _param_size = _param.size, size = _param_size === void 0 ? 'm' : _param_size, externalViewDate = _param.viewDate, onHeaderChange = _param.onHeaderChange, onNextMonth = _param.onNextMonth, onPrevMonth = _param.onPrevMonth, prevMonthIcon = _param.prevMonthIcon, nextMonthIcon = _param.nextMonthIcon, prevMonthProps = _param.prevMonthProps, nextMonthProps = _param.nextMonthProps, dayProps = _param.dayProps, listenDayChangesForUpdate = _param.listenDayChangesForUpdate, renderDayContent = _param.renderDayContent, minDateTime = _param.minDateTime, maxDateTime = _param.maxDateTime, props = Calendar_object_without_properties(_param, [
+    var value = _param.value, onChange = _param.onChange, disablePast = _param.disablePast, disableFuture = _param.disableFuture, shouldDisableDate = _param.shouldDisableDate, onClose = _param.onClose, _param_enableTime = _param.enableTime, enableTime = _param_enableTime === void 0 ? false : _param_enableTime, doneButtonText = _param.doneButtonText, doneButtonDisabled = _param.doneButtonDisabled, doneButtonShow = _param.doneButtonShow, _param_weekStartsOn = _param.weekStartsOn, weekStartsOn = _param_weekStartsOn === void 0 ? 1 : _param_weekStartsOn, disablePickers = _param.disablePickers, _param_changeHoursLabel = _param.changeHoursLabel, changeHoursLabel = _param_changeHoursLabel === void 0 ? 'Изменить час' : _param_changeHoursLabel, _param_changeMinutesLabel = _param.changeMinutesLabel, changeMinutesLabel = _param_changeMinutesLabel === void 0 ? 'Изменить минуту' : _param_changeMinutesLabel, _param_prevMonthLabel = _param.prevMonthLabel, prevMonthLabel = _param_prevMonthLabel === void 0 ? 'Предыдущий месяц' : _param_prevMonthLabel, _param_nextMonthLabel = _param.nextMonthLabel, nextMonthLabel = _param_nextMonthLabel === void 0 ? 'Следующий месяц' : _param_nextMonthLabel, _param_changeMonthLabel = _param.changeMonthLabel, changeMonthLabel = _param_changeMonthLabel === void 0 ? 'Изменить месяц' : _param_changeMonthLabel, _param_changeYearLabel = _param.changeYearLabel, changeYearLabel = _param_changeYearLabel === void 0 ? 'Изменить год' : _param_changeYearLabel, showNeighboringMonth = _param.showNeighboringMonth, _param_changeDayLabel = _param.changeDayLabel, changeDayLabel = _param_changeDayLabel === void 0 ? 'Изменить день' : _param_changeDayLabel, _param_size = _param.size, size = _param_size === void 0 ? 'm' : _param_size, externalViewDate = _param.viewDate, onHeaderChange = _param.onHeaderChange, onNextMonth = _param.onNextMonth, onPrevMonth = _param.onPrevMonth, prevMonthIcon = _param.prevMonthIcon, nextMonthIcon = _param.nextMonthIcon, prevMonthProps = _param.prevMonthProps, nextMonthProps = _param.nextMonthProps, dayProps = _param.dayProps, listenDayChangesForUpdate = _param.listenDayChangesForUpdate, renderDayContent = _param.renderDayContent, minDateTime = _param.minDateTime, maxDateTime = _param.maxDateTime, minutesTestId = _param.minutesTestId, hoursTestId = _param.hoursTestId, doneButtonTestId = _param.doneButtonTestId, prevMonthButtonTestId = _param.prevMonthButtonTestId, nextMonthButtonTestId = _param.nextMonthButtonTestId, monthDropdownTestId = _param.monthDropdownTestId, yearDropdownTestId = _param.yearDropdownTestId, dayTestId = _param.dayTestId, props = Calendar_object_without_properties(_param, [
         "value",
         "onChange",
         "disablePast",
@@ -45032,6 +45110,8 @@ var Calendar_warn = warnOnce('Calendar');
         "onClose",
         "enableTime",
         "doneButtonText",
+        "doneButtonDisabled",
+        "doneButtonShow",
         "weekStartsOn",
         "disablePickers",
         "changeHoursLabel",
@@ -45055,7 +45135,15 @@ var Calendar_warn = warnOnce('Calendar');
         "listenDayChangesForUpdate",
         "renderDayContent",
         "minDateTime",
-        "maxDateTime"
+        "maxDateTime",
+        "minutesTestId",
+        "hoursTestId",
+        "doneButtonTestId",
+        "prevMonthButtonTestId",
+        "nextMonthButtonTestId",
+        "monthDropdownTestId",
+        "yearDropdownTestId",
+        "dayTestId"
     ]);
     var _useCalendar = useCalendar({
         value: value,
@@ -45136,7 +45224,11 @@ var Calendar_warn = warnOnce('Calendar');
         prevMonthProps: prevMonthProps,
         nextMonthProps: nextMonthProps,
         isMonthDisabled: isMonthDisabled,
-        isYearDisabled: isYearDisabled
+        isYearDisabled: isYearDisabled,
+        nextMonthButtonTestId: nextMonthButtonTestId,
+        prevMonthButtonTestId: prevMonthButtonTestId,
+        monthDropdownTestId: monthDropdownTestId,
+        yearDropdownTestId: yearDropdownTestId
     }), /*#__PURE__*/ React.createElement(CalendarDays, {
         viewDate: externalViewDate || viewDate,
         value: value,
@@ -45155,7 +45247,8 @@ var Calendar_warn = warnOnce('Calendar');
         size: size,
         dayProps: dayProps,
         listenDayChangesForUpdate: listenDayChangesForUpdate,
-        renderDayContent: renderDayContent
+        renderDayContent: renderDayContent,
+        dayTestId: dayTestId
     }), enableTime && value && size !== 's' && /*#__PURE__*/ React.createElement("div", {
         className: "vkuiCalendar__time"
     }, /*#__PURE__*/ React.createElement(CalendarTime, {
@@ -45163,9 +45256,14 @@ var Calendar_warn = warnOnce('Calendar');
         onChange: onChange,
         onClose: onClose,
         doneButtonText: doneButtonText,
+        doneButtonDisabled: doneButtonDisabled,
+        doneButtonShow: doneButtonShow,
         changeHoursLabel: changeHoursLabel,
         changeMinutesLabel: changeMinutesLabel,
-        isDayDisabled: minDateTime || maxDateTime ? isDayDisabled : undefined
+        isDayDisabled: minDateTime || maxDateTime ? isDayDisabled : undefined,
+        minutesTestId: minutesTestId,
+        hoursTestId: hoursTestId,
+        doneButtonTestId: doneButtonTestId
     })));
 };
 
@@ -45318,7 +45416,7 @@ var getIsDaySelected = function(day, value) {
 /**
  * @see https://vkcom.github.io/VKUI/#/CalendarRange
  */ var CalendarRange_CalendarRange = function(_param) {
-    var value = _param.value, onChange = _param.onChange, disablePast = _param.disablePast, disableFuture = _param.disableFuture, shouldDisableDate = _param.shouldDisableDate, onClose = _param.onClose, _param_weekStartsOn = _param.weekStartsOn, weekStartsOn = _param_weekStartsOn === void 0 ? 1 : _param_weekStartsOn, disablePickers = _param.disablePickers, _param_prevMonthLabel = _param.prevMonthLabel, prevMonthLabel = _param_prevMonthLabel === void 0 ? 'Предыдущий месяц' : _param_prevMonthLabel, _param_nextMonthLabel = _param.nextMonthLabel, nextMonthLabel = _param_nextMonthLabel === void 0 ? 'Следующий месяц' : _param_nextMonthLabel, _param_changeMonthLabel = _param.changeMonthLabel, changeMonthLabel = _param_changeMonthLabel === void 0 ? 'Изменить месяц' : _param_changeMonthLabel, _param_changeYearLabel = _param.changeYearLabel, changeYearLabel = _param_changeYearLabel === void 0 ? 'Изменить год' : _param_changeYearLabel, _param_changeDayLabel = _param.changeDayLabel, changeDayLabel = _param_changeDayLabel === void 0 ? 'Изменить день' : _param_changeDayLabel, prevMonthIcon = _param.prevMonthIcon, nextMonthIcon = _param.nextMonthIcon, listenDayChangesForUpdate = _param.listenDayChangesForUpdate, renderDayContent = _param.renderDayContent, props = CalendarRange_object_without_properties(_param, [
+    var value = _param.value, onChange = _param.onChange, disablePast = _param.disablePast, disableFuture = _param.disableFuture, shouldDisableDate = _param.shouldDisableDate, onClose = _param.onClose, _param_weekStartsOn = _param.weekStartsOn, weekStartsOn = _param_weekStartsOn === void 0 ? 1 : _param_weekStartsOn, disablePickers = _param.disablePickers, _param_prevMonthLabel = _param.prevMonthLabel, prevMonthLabel = _param_prevMonthLabel === void 0 ? 'Предыдущий месяц' : _param_prevMonthLabel, _param_nextMonthLabel = _param.nextMonthLabel, nextMonthLabel = _param_nextMonthLabel === void 0 ? 'Следующий месяц' : _param_nextMonthLabel, _param_changeMonthLabel = _param.changeMonthLabel, changeMonthLabel = _param_changeMonthLabel === void 0 ? 'Изменить месяц' : _param_changeMonthLabel, _param_changeYearLabel = _param.changeYearLabel, changeYearLabel = _param_changeYearLabel === void 0 ? 'Изменить год' : _param_changeYearLabel, _param_changeDayLabel = _param.changeDayLabel, changeDayLabel = _param_changeDayLabel === void 0 ? 'Изменить день' : _param_changeDayLabel, prevMonthIcon = _param.prevMonthIcon, nextMonthIcon = _param.nextMonthIcon, listenDayChangesForUpdate = _param.listenDayChangesForUpdate, renderDayContent = _param.renderDayContent, dayTestId = _param.dayTestId, leftPartHeaderTestsData = _param.leftPartHeaderTestsData, rightPartHeaderTestsData = _param.rightPartHeaderTestsData, props = CalendarRange_object_without_properties(_param, [
         "value",
         "onChange",
         "disablePast",
@@ -45335,7 +45433,10 @@ var getIsDaySelected = function(day, value) {
         "prevMonthIcon",
         "nextMonthIcon",
         "listenDayChangesForUpdate",
-        "renderDayContent"
+        "renderDayContent",
+        "dayTestId",
+        "leftPartHeaderTestsData",
+        "rightPartHeaderTestsData"
     ]);
     var _useCalendar = useCalendar({
         value: value,
@@ -45457,7 +45558,7 @@ var getIsDaySelected = function(day, value) {
         baseClassName: "vkuiCalendarRange"
     }), /*#__PURE__*/ React.createElement("div", {
         className: "vkuiCalendarRange__inner"
-    }, /*#__PURE__*/ React.createElement(CalendarHeader, {
+    }, /*#__PURE__*/ React.createElement(CalendarHeader, CalendarRange_object_spread({
         viewDate: viewDate,
         onChange: setViewDate,
         nextMonthHidden: true,
@@ -45471,7 +45572,7 @@ var getIsDaySelected = function(day, value) {
         prevMonthIcon: prevMonthIcon,
         isMonthDisabled: isMonthDisabled,
         isYearDisabled: isYearDisabled
-    }), /*#__PURE__*/ React.createElement(CalendarDays, {
+    }, leftPartHeaderTestsData)), /*#__PURE__*/ React.createElement(CalendarDays, {
         viewDate: viewDate,
         value: value,
         weekStartsOn: weekStartsOn,
@@ -45490,10 +45591,11 @@ var getIsDaySelected = function(day, value) {
         isDayDisabled: isDayDisabled,
         listenDayChangesForUpdate: listenDayChangesForUpdate,
         renderDayContent: renderDayContent,
-        "aria-label": changeDayLabel
+        "aria-label": changeDayLabel,
+        dayTestId: dayTestId
     })), /*#__PURE__*/ React.createElement("div", {
         className: "vkuiCalendarRange__inner"
-    }, /*#__PURE__*/ React.createElement(CalendarHeader, {
+    }, /*#__PURE__*/ React.createElement(CalendarHeader, CalendarRange_object_spread({
         viewDate: secondViewDate,
         onChange: onRightPartViewDateChange,
         prevMonthHidden: true,
@@ -45507,7 +45609,7 @@ var getIsDaySelected = function(day, value) {
         nextMonthIcon: nextMonthIcon,
         isMonthDisabled: isMonthDisabled,
         isYearDisabled: isYearDisabled
-    }), /*#__PURE__*/ React.createElement(CalendarDays, {
+    }, rightPartHeaderTestsData)), /*#__PURE__*/ React.createElement(CalendarDays, {
         viewDate: secondViewDate,
         value: value,
         weekStartsOn: weekStartsOn,
@@ -45528,7 +45630,8 @@ var getIsDaySelected = function(day, value) {
         listenDayChangesForUpdate: listenDayChangesForUpdate,
         renderDayContent: renderDayContent,
         tabIndex: 0,
-        onBlur: resetSelectedDay
+        onBlur: resetSelectedDay,
+        dayTestId: dayTestId
     })));
 };
 
@@ -45595,8 +45698,9 @@ function useDateInput_unsupported_iterable_to_array(o, minLen) {
 
 
 
+
 function useDateInput_useDateInput(param) {
-    var maxElement = param.maxElement, refs = param.refs, autoFocus = param.autoFocus, disabled = param.disabled, elementsConfig = param.elementsConfig, onChange = param.onChange, onInternalValueChange = param.onInternalValueChange, getInternalValue = param.getInternalValue, value = param.value;
+    var maxElement = param.maxElement, refs = param.refs, autoFocus = param.autoFocus, disabled = param.disabled, elementsConfig = param.elementsConfig, onChange = param.onChange, onInternalValueChange = param.onInternalValueChange, getInternalValue = param.getInternalValue, value = param.value, onCalendarOpenChanged = param.onCalendarOpenChanged;
     var document = useDOM().document;
     var _useBooleanState = useBooleanState(false), open = _useBooleanState.value, openCalendar = _useBooleanState.setTrue, closeCalendar = _useBooleanState.setFalse;
     var rootRef = React.useRef(null);
@@ -45604,20 +45708,40 @@ function useDateInput_useDateInput(param) {
     var _React_useState = useDateInput_sliced_to_array(React.useState([]), 2), internalValue = _React_useState[0], setInternalValue = _React_useState[1];
     var _React_useState1 = useDateInput_sliced_to_array(React.useState(null), 2), focusedElement = _React_useState1[0], setFocusedElement = _React_useState1[1];
     var window = useDOM().window;
+    var _onCalendarClose = useCallback(function() {
+        if (open) {
+            closeCalendar();
+            onCalendarOpenChanged === null || onCalendarOpenChanged === void 0 ? void 0 : onCalendarOpenChanged(false);
+        }
+    }, [
+        closeCalendar,
+        onCalendarOpenChanged,
+        open
+    ]);
+    var _onCalendarOpen = useCallback(function() {
+        if (!open) {
+            openCalendar();
+            onCalendarOpenChanged === null || onCalendarOpenChanged === void 0 ? void 0 : onCalendarOpenChanged(true);
+        }
+    }, [
+        onCalendarOpenChanged,
+        open,
+        openCalendar
+    ]);
     var removeFocusFromField = React.useCallback(function() {
         if (focusedElement !== null) {
             var _window_getSelection;
             setFocusedElement(null);
-            closeCalendar();
+            _onCalendarClose();
             (_window_getSelection = window.getSelection()) === null || _window_getSelection === void 0 ? void 0 : _window_getSelection.removeAllRanges();
             setInternalValue(getInternalValue(value));
         }
     }, [
         focusedElement,
-        closeCalendar,
+        _onCalendarClose,
+        window,
         getInternalValue,
-        value,
-        window
+        value
     ]);
     var handleClickOutside = React.useCallback(function(e) {
         var _rootRef_current, _calendarRef_current;
@@ -45655,7 +45779,7 @@ function useDateInput_useDateInput(param) {
         var element = refs[focusedElement].current;
         if (element) {
             element.focus();
-            openCalendar();
+            _onCalendarOpen();
             range.selectNodeContents(element);
             var selection = window.getSelection();
             selection === null || selection === void 0 ? void 0 : selection.removeAllRanges();
@@ -45664,7 +45788,7 @@ function useDateInput_useDateInput(param) {
     }, [
         disabled,
         focusedElement,
-        openCalendar,
+        _onCalendarOpen,
         refs,
         window
     ]);
@@ -45737,8 +45861,8 @@ function useDateInput_useDateInput(param) {
         rootRef: rootRef,
         calendarRef: calendarRef,
         open: open,
-        openCalendar: openCalendar,
-        closeCalendar: closeCalendar,
+        openCalendar: _onCalendarOpen,
+        closeCalendar: _onCalendarClose,
         internalValue: internalValue,
         focusedElement: focusedElement,
         setFocusedElement: setFocusedElement,
@@ -46190,6 +46314,7 @@ function DateInput_object_without_properties_loose(source, excluded) {
 
 
 
+
  // Reorder css
 
 var DateInput_sizeYClassNames = {
@@ -46245,7 +46370,7 @@ var getInternalValue = function(value) {
 /**
  * @see https://vkcom.github.io/VKUI/#/DateInput
  */ var DateInput = function(_param) {
-    var enableTime = _param.enableTime, shouldDisableDate = _param.shouldDisableDate, disableFuture = _param.disableFuture, disablePast = _param.disablePast, minDateTime = _param.minDateTime, maxDateTime = _param.maxDateTime, value = _param.value, onChange = _param.onChange, _param_calendarPlacement = _param.calendarPlacement, calendarPlacement = _param_calendarPlacement === void 0 ? 'bottom-start' : _param_calendarPlacement, style = _param.style, className = _param.className, doneButtonText = _param.doneButtonText, _param_closeOnChange = _param.closeOnChange, closeOnChange = _param_closeOnChange === void 0 ? true : _param_closeOnChange, disablePickers = _param.disablePickers, getRootRef = _param.getRootRef, name = _param.name, autoFocus = _param.autoFocus, disabled = _param.disabled, onClick = _param.onClick, onFocus = _param.onFocus, _param_prevMonthLabel = _param.prevMonthLabel, prevMonthLabel = _param_prevMonthLabel === void 0 ? 'Предыдущий месяц' : _param_prevMonthLabel, _param_nextMonthLabel = _param.nextMonthLabel, nextMonthLabel = _param_nextMonthLabel === void 0 ? 'Следующий месяц' : _param_nextMonthLabel, showNeighboringMonth = _param.showNeighboringMonth, size = _param.size, _param_changeMonthLabel = _param.changeMonthLabel, changeMonthLabel = _param_changeMonthLabel === void 0 ? 'Изменить месяц' : _param_changeMonthLabel, _param_changeYearLabel = _param.changeYearLabel, changeYearLabel = _param_changeYearLabel === void 0 ? 'Изменить год' : _param_changeYearLabel, _param_changeDayLabel = _param.changeDayLabel, changeDayLabel = _param_changeDayLabel === void 0 ? 'Изменить день' : _param_changeDayLabel, _param_changeHoursLabel = _param.changeHoursLabel, changeHoursLabel = _param_changeHoursLabel === void 0 ? 'Изменить час' : _param_changeHoursLabel, _param_changeMinutesLabel = _param.changeMinutesLabel, changeMinutesLabel = _param_changeMinutesLabel === void 0 ? 'Изменить минуту' : _param_changeMinutesLabel, _param_clearFieldLabel = _param.clearFieldLabel, clearFieldLabel = _param_clearFieldLabel === void 0 ? 'Очистить поле' : _param_clearFieldLabel, _param_showCalendarLabel = _param.showCalendarLabel, showCalendarLabel = _param_showCalendarLabel === void 0 ? 'Показать календарь' : _param_showCalendarLabel, viewDate = _param.viewDate, onHeaderChange = _param.onHeaderChange, onNextMonth = _param.onNextMonth, onPrevMonth = _param.onPrevMonth, prevMonthIcon = _param.prevMonthIcon, nextMonthIcon = _param.nextMonthIcon, _param_disableCalendar = _param.disableCalendar, disableCalendar = _param_disableCalendar === void 0 ? false : _param_disableCalendar, renderDayContent = _param.renderDayContent, props = DateInput_object_without_properties(_param, [
+    var enableTime = _param.enableTime, shouldDisableDate = _param.shouldDisableDate, disableFuture = _param.disableFuture, disablePast = _param.disablePast, minDateTime = _param.minDateTime, maxDateTime = _param.maxDateTime, value = _param.value, onChange = _param.onChange, _param_calendarPlacement = _param.calendarPlacement, calendarPlacement = _param_calendarPlacement === void 0 ? 'bottom-start' : _param_calendarPlacement, style = _param.style, className = _param.className, doneButtonText = _param.doneButtonText, _param_closeOnChange = _param.closeOnChange, closeOnChange = _param_closeOnChange === void 0 ? true : _param_closeOnChange, disablePickers = _param.disablePickers, getRootRef = _param.getRootRef, name = _param.name, autoFocus = _param.autoFocus, disabled = _param.disabled, onClick = _param.onClick, onFocus = _param.onFocus, _param_prevMonthLabel = _param.prevMonthLabel, prevMonthLabel = _param_prevMonthLabel === void 0 ? 'Предыдущий месяц' : _param_prevMonthLabel, _param_nextMonthLabel = _param.nextMonthLabel, nextMonthLabel = _param_nextMonthLabel === void 0 ? 'Следующий месяц' : _param_nextMonthLabel, showNeighboringMonth = _param.showNeighboringMonth, size = _param.size, _param_changeMonthLabel = _param.changeMonthLabel, changeMonthLabel = _param_changeMonthLabel === void 0 ? 'Изменить месяц' : _param_changeMonthLabel, _param_changeYearLabel = _param.changeYearLabel, changeYearLabel = _param_changeYearLabel === void 0 ? 'Изменить год' : _param_changeYearLabel, _param_changeDayLabel = _param.changeDayLabel, changeDayLabel = _param_changeDayLabel === void 0 ? 'Изменить день' : _param_changeDayLabel, _param_changeHoursLabel = _param.changeHoursLabel, changeHoursLabel = _param_changeHoursLabel === void 0 ? 'Изменить час' : _param_changeHoursLabel, _param_changeMinutesLabel = _param.changeMinutesLabel, changeMinutesLabel = _param_changeMinutesLabel === void 0 ? 'Изменить минуту' : _param_changeMinutesLabel, _param_clearFieldLabel = _param.clearFieldLabel, clearFieldLabel = _param_clearFieldLabel === void 0 ? 'Очистить поле' : _param_clearFieldLabel, _param_showCalendarLabel = _param.showCalendarLabel, showCalendarLabel = _param_showCalendarLabel === void 0 ? 'Показать календарь' : _param_showCalendarLabel, viewDate = _param.viewDate, onHeaderChange = _param.onHeaderChange, onNextMonth = _param.onNextMonth, onPrevMonth = _param.onPrevMonth, prevMonthIcon = _param.prevMonthIcon, nextMonthIcon = _param.nextMonthIcon, _param_disableCalendar = _param.disableCalendar, disableCalendar = _param_disableCalendar === void 0 ? false : _param_disableCalendar, renderDayContent = _param.renderDayContent, onCalendarOpenChanged = _param.onCalendarOpenChanged, calendarTestsProps = _param.calendarTestsProps, dayFieldTestId = _param.dayFieldTestId, monthFieldTestId = _param.monthFieldTestId, yearFieldTestId = _param.yearFieldTestId, hourFieldTestId = _param.hourFieldTestId, minuteFieldTestId = _param.minuteFieldTestId, props = DateInput_object_without_properties(_param, [
         "enableTime",
         "shouldDisableDate",
         "disableFuture",
@@ -46284,7 +46409,14 @@ var getInternalValue = function(value) {
         "prevMonthIcon",
         "nextMonthIcon",
         "disableCalendar",
-        "renderDayContent"
+        "renderDayContent",
+        "onCalendarOpenChanged",
+        "calendarTestsProps",
+        "dayFieldTestId",
+        "monthFieldTestId",
+        "yearFieldTestId",
+        "hourFieldTestId",
+        "minuteFieldTestId"
     ]);
     var daysRef = React.useRef(null);
     var monthsRef = React.useRef(null);
@@ -46305,7 +46437,8 @@ var getInternalValue = function(value) {
             mask += ' HH:mm';
         }
         if (isMatch(formattedValue, mask)) {
-            onChange === null || onChange === void 0 ? void 0 : onChange(parse(formattedValue, mask, value !== null && value !== void 0 ? value : new Date()));
+            var now = new Date();
+            onChange === null || onChange === void 0 ? void 0 : onChange(parse(formattedValue, mask, value !== null && value !== void 0 ? value : enableTime ? startOfMinute(now) : startOfDay(now)));
         }
     }, [
         enableTime,
@@ -46337,7 +46470,8 @@ var getInternalValue = function(value) {
         onChange: onChange,
         onInternalValueChange: onInternalValueChange,
         getInternalValue: getInternalValue,
-        value: value
+        value: value,
+        onCalendarOpenChanged: onCalendarOpenChanged
     }), rootRef = _useDateInput.rootRef, calendarRef = _useDateInput.calendarRef, open = _useDateInput.open, openCalendar = _useDateInput.openCalendar, internalValue = _useDateInput.internalValue, handleKeyDown = _useDateInput.handleKeyDown, setFocusedElement = _useDateInput.setFocusedElement, handleFieldEnter = _useDateInput.handleFieldEnter, clear = _useDateInput.clear, removeFocusFromField = _useDateInput.removeFocusFromField;
     var _useAdaptivity = useAdaptivity(), _useAdaptivity_sizeY = _useAdaptivity.sizeY, sizeY = _useAdaptivity_sizeY === void 0 ? 'none' : _useAdaptivity_sizeY;
     var handleRootRef = useExternRef(rootRef, getRootRef);
@@ -46385,21 +46519,24 @@ var getInternalValue = function(value) {
         index: 0,
         onElementSelect: setFocusedElement,
         value: internalValue[0],
-        label: changeDayLabel
+        label: changeDayLabel,
+        "data-testid": dayFieldTestId
     }), /*#__PURE__*/ React.createElement(InputLikeDivider, null, "."), /*#__PURE__*/ React.createElement(InputLike, {
         length: 2,
         getRootRef: monthsRef,
         index: 1,
         onElementSelect: setFocusedElement,
         value: internalValue[1],
-        label: changeMonthLabel
+        label: changeMonthLabel,
+        "data-testid": monthFieldTestId
     }), /*#__PURE__*/ React.createElement(InputLikeDivider, null, "."), /*#__PURE__*/ React.createElement(InputLike, {
         length: 4,
         getRootRef: yearsRef,
         index: 2,
         onElementSelect: setFocusedElement,
         value: internalValue[2],
-        label: changeYearLabel
+        label: changeYearLabel,
+        "data-testid": yearFieldTestId
     }), enableTime && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(InputLikeDivider, {
         className: "vkuiDateInput__input--time-divider"
     }, ' '), /*#__PURE__*/ React.createElement(InputLike, {
@@ -46408,20 +46545,22 @@ var getInternalValue = function(value) {
         index: 3,
         onElementSelect: setFocusedElement,
         value: internalValue[3],
-        label: changeHoursLabel
+        label: changeHoursLabel,
+        "data-testid": hourFieldTestId
     }), /*#__PURE__*/ React.createElement(InputLikeDivider, null, ":"), /*#__PURE__*/ React.createElement(InputLike, {
         length: 2,
         getRootRef: minutesRef,
         index: 4,
         onElementSelect: setFocusedElement,
         value: internalValue[4],
-        label: changeMinutesLabel
+        label: changeMinutesLabel,
+        "data-testid": minuteFieldTestId
     }))), open && !disableCalendar && /*#__PURE__*/ React.createElement(Popper, {
         targetRef: rootRef,
         offsetByMainAxis: 8,
         placement: calendarPlacement,
         autoUpdateOnTargetResize: true
-    }, /*#__PURE__*/ React.createElement(Calendar, {
+    }, /*#__PURE__*/ React.createElement(Calendar, DateInput_object_spread({
         value: value,
         onChange: onCalendarChange,
         enableTime: enableTime,
@@ -46450,7 +46589,7 @@ var getInternalValue = function(value) {
         nextMonthIcon: nextMonthIcon,
         minDateTime: minDateTime,
         maxDateTime: maxDateTime
-    })));
+    }, calendarTestsProps))));
 };
 
 ;// CONCATENATED MODULE: ./src/components/DateRangeInput/DateRangeInput.module.css
@@ -46585,7 +46724,7 @@ var DateRangeInput_getInternalValue = function(value) {
 /**
  * @see https://vkcom.github.io/VKUI/#/DateRangeInput
  */ var DateRangeInput = function(_param) {
-    var shouldDisableDate = _param.shouldDisableDate, disableFuture = _param.disableFuture, disablePast = _param.disablePast, value = _param.value, onChange = _param.onChange, _param_calendarPlacement = _param.calendarPlacement, calendarPlacement = _param_calendarPlacement === void 0 ? 'bottom-start' : _param_calendarPlacement, style = _param.style, className = _param.className, _param_closeOnChange = _param.closeOnChange, closeOnChange = _param_closeOnChange === void 0 ? true : _param_closeOnChange, disablePickers = _param.disablePickers, getRootRef = _param.getRootRef, name = _param.name, autoFocus = _param.autoFocus, disabled = _param.disabled, onClick = _param.onClick, onFocus = _param.onFocus, _param_prevMonthLabel = _param.prevMonthLabel, prevMonthLabel = _param_prevMonthLabel === void 0 ? 'Предыдущий месяц' : _param_prevMonthLabel, _param_nextMonthLabel = _param.nextMonthLabel, nextMonthLabel = _param_nextMonthLabel === void 0 ? 'Следующий месяц' : _param_nextMonthLabel, _param_changeDayLabel = _param.changeDayLabel, changeDayLabel = _param_changeDayLabel === void 0 ? 'Изменить день' : _param_changeDayLabel, _param_changeMonthLabel = _param.changeMonthLabel, changeMonthLabel = _param_changeMonthLabel === void 0 ? 'Изменить месяц' : _param_changeMonthLabel, _param_changeYearLabel = _param.changeYearLabel, changeYearLabel = _param_changeYearLabel === void 0 ? 'Изменить год' : _param_changeYearLabel, _param_changeStartDayLabel = _param.changeStartDayLabel, changeStartDayLabel = _param_changeStartDayLabel === void 0 ? 'Изменить день начала' : _param_changeStartDayLabel, _param_changeStartMonthLabel = _param.changeStartMonthLabel, changeStartMonthLabel = _param_changeStartMonthLabel === void 0 ? 'Изменить месяц начала' : _param_changeStartMonthLabel, _param_changeStartYearLabel = _param.changeStartYearLabel, changeStartYearLabel = _param_changeStartYearLabel === void 0 ? 'Изменить год начала' : _param_changeStartYearLabel, _param_changeEndDayLabel = _param.changeEndDayLabel, changeEndDayLabel = _param_changeEndDayLabel === void 0 ? 'Изменить день окончания' : _param_changeEndDayLabel, _param_changeEndMonthLabel = _param.changeEndMonthLabel, changeEndMonthLabel = _param_changeEndMonthLabel === void 0 ? 'Изменить месяц окончания' : _param_changeEndMonthLabel, _param_changeEndYearLabel = _param.changeEndYearLabel, changeEndYearLabel = _param_changeEndYearLabel === void 0 ? 'Изменить год окончания' : _param_changeEndYearLabel, _param_clearFieldLabel = _param.clearFieldLabel, clearFieldLabel = _param_clearFieldLabel === void 0 ? 'Очистить поле' : _param_clearFieldLabel, _param_showCalendarLabel = _param.showCalendarLabel, showCalendarLabel = _param_showCalendarLabel === void 0 ? 'Показать календарь' : _param_showCalendarLabel, prevMonthIcon = _param.prevMonthIcon, nextMonthIcon = _param.nextMonthIcon, _param_disableCalendar = _param.disableCalendar, disableCalendar = _param_disableCalendar === void 0 ? false : _param_disableCalendar, renderDayContent = _param.renderDayContent, props = DateRangeInput_object_without_properties(_param, [
+    var shouldDisableDate = _param.shouldDisableDate, disableFuture = _param.disableFuture, disablePast = _param.disablePast, value = _param.value, onChange = _param.onChange, _param_calendarPlacement = _param.calendarPlacement, calendarPlacement = _param_calendarPlacement === void 0 ? 'bottom-start' : _param_calendarPlacement, style = _param.style, className = _param.className, _param_closeOnChange = _param.closeOnChange, closeOnChange = _param_closeOnChange === void 0 ? true : _param_closeOnChange, disablePickers = _param.disablePickers, getRootRef = _param.getRootRef, name = _param.name, autoFocus = _param.autoFocus, disabled = _param.disabled, onClick = _param.onClick, onFocus = _param.onFocus, _param_prevMonthLabel = _param.prevMonthLabel, prevMonthLabel = _param_prevMonthLabel === void 0 ? 'Предыдущий месяц' : _param_prevMonthLabel, _param_nextMonthLabel = _param.nextMonthLabel, nextMonthLabel = _param_nextMonthLabel === void 0 ? 'Следующий месяц' : _param_nextMonthLabel, _param_changeDayLabel = _param.changeDayLabel, changeDayLabel = _param_changeDayLabel === void 0 ? 'Изменить день' : _param_changeDayLabel, _param_changeMonthLabel = _param.changeMonthLabel, changeMonthLabel = _param_changeMonthLabel === void 0 ? 'Изменить месяц' : _param_changeMonthLabel, _param_changeYearLabel = _param.changeYearLabel, changeYearLabel = _param_changeYearLabel === void 0 ? 'Изменить год' : _param_changeYearLabel, _param_changeStartDayLabel = _param.changeStartDayLabel, changeStartDayLabel = _param_changeStartDayLabel === void 0 ? 'Изменить день начала' : _param_changeStartDayLabel, _param_changeStartMonthLabel = _param.changeStartMonthLabel, changeStartMonthLabel = _param_changeStartMonthLabel === void 0 ? 'Изменить месяц начала' : _param_changeStartMonthLabel, _param_changeStartYearLabel = _param.changeStartYearLabel, changeStartYearLabel = _param_changeStartYearLabel === void 0 ? 'Изменить год начала' : _param_changeStartYearLabel, _param_changeEndDayLabel = _param.changeEndDayLabel, changeEndDayLabel = _param_changeEndDayLabel === void 0 ? 'Изменить день окончания' : _param_changeEndDayLabel, _param_changeEndMonthLabel = _param.changeEndMonthLabel, changeEndMonthLabel = _param_changeEndMonthLabel === void 0 ? 'Изменить месяц окончания' : _param_changeEndMonthLabel, _param_changeEndYearLabel = _param.changeEndYearLabel, changeEndYearLabel = _param_changeEndYearLabel === void 0 ? 'Изменить год окончания' : _param_changeEndYearLabel, _param_clearFieldLabel = _param.clearFieldLabel, clearFieldLabel = _param_clearFieldLabel === void 0 ? 'Очистить поле' : _param_clearFieldLabel, _param_showCalendarLabel = _param.showCalendarLabel, showCalendarLabel = _param_showCalendarLabel === void 0 ? 'Показать календарь' : _param_showCalendarLabel, prevMonthIcon = _param.prevMonthIcon, nextMonthIcon = _param.nextMonthIcon, _param_disableCalendar = _param.disableCalendar, disableCalendar = _param_disableCalendar === void 0 ? false : _param_disableCalendar, onCalendarOpenChanged = _param.onCalendarOpenChanged, renderDayContent = _param.renderDayContent, calendarTestsProps = _param.calendarTestsProps, startDateTestsProps = _param.startDateTestsProps, endDateTestsProps = _param.endDateTestsProps, props = DateRangeInput_object_without_properties(_param, [
         "shouldDisableDate",
         "disableFuture",
         "disablePast",
@@ -46618,7 +46757,11 @@ var DateRangeInput_getInternalValue = function(value) {
         "prevMonthIcon",
         "nextMonthIcon",
         "disableCalendar",
-        "renderDayContent"
+        "onCalendarOpenChanged",
+        "renderDayContent",
+        "calendarTestsProps",
+        "startDateTestsProps",
+        "endDateTestsProps"
     ]);
     var daysStartRef = React.useRef(null);
     var monthsStartRef = React.useRef(null);
@@ -46691,7 +46834,8 @@ var DateRangeInput_getInternalValue = function(value) {
         onChange: onChange,
         onInternalValueChange: onInternalValueChange,
         getInternalValue: DateRangeInput_getInternalValue,
-        value: value
+        value: value,
+        onCalendarOpenChanged: onCalendarOpenChanged
     }), rootRef = _useDateInput.rootRef, calendarRef = _useDateInput.calendarRef, open = _useDateInput.open, openCalendar = _useDateInput.openCalendar, closeCalendar = _useDateInput.closeCalendar, internalValue = _useDateInput.internalValue, handleKeyDown = _useDateInput.handleKeyDown, setFocusedElement = _useDateInput.setFocusedElement, handleFieldEnter = _useDateInput.handleFieldEnter, clear = _useDateInput.clear, removeFocusFromField = _useDateInput.removeFocusFromField;
     var _useAdaptivity = useAdaptivity(), _useAdaptivity_sizeY = _useAdaptivity.sizeY, sizeY = _useAdaptivity_sizeY === void 0 ? 'none' : _useAdaptivity_sizeY;
     var handleRootRef = useExternRef(rootRef, getRootRef);
@@ -46733,47 +46877,53 @@ var DateRangeInput_getInternalValue = function(value) {
         index: 0,
         onElementSelect: setFocusedElement,
         value: internalValue[0],
-        label: changeStartDayLabel
+        label: changeStartDayLabel,
+        "data-testid": startDateTestsProps === null || startDateTestsProps === void 0 ? void 0 : startDateTestsProps.day
     }), /*#__PURE__*/ React.createElement(InputLikeDivider, null, "."), /*#__PURE__*/ React.createElement(InputLike, {
         length: 2,
         getRootRef: monthsStartRef,
         index: 1,
         onElementSelect: setFocusedElement,
         value: internalValue[1],
-        label: changeStartMonthLabel
+        label: changeStartMonthLabel,
+        "data-testid": startDateTestsProps === null || startDateTestsProps === void 0 ? void 0 : startDateTestsProps.month
     }), /*#__PURE__*/ React.createElement(InputLikeDivider, null, "."), /*#__PURE__*/ React.createElement(InputLike, {
         length: 4,
         getRootRef: yearsStartRef,
         index: 2,
         onElementSelect: setFocusedElement,
         value: internalValue[2],
-        label: changeStartYearLabel
+        label: changeStartYearLabel,
+        "data-testid": startDateTestsProps === null || startDateTestsProps === void 0 ? void 0 : startDateTestsProps.year
     }), /*#__PURE__*/ React.createElement(InputLikeDivider, null, ' — '), /*#__PURE__*/ React.createElement(InputLike, {
         length: 2,
         getRootRef: daysEndRef,
         index: 3,
         onElementSelect: setFocusedElement,
         value: internalValue[3],
-        label: changeEndDayLabel
+        label: changeEndDayLabel,
+        "data-testid": endDateTestsProps === null || endDateTestsProps === void 0 ? void 0 : endDateTestsProps.day
     }), /*#__PURE__*/ React.createElement(InputLikeDivider, null, "."), /*#__PURE__*/ React.createElement(InputLike, {
         length: 2,
         getRootRef: monthsEndRef,
         index: 4,
         onElementSelect: setFocusedElement,
         value: internalValue[4],
-        label: changeEndMonthLabel
+        label: changeEndMonthLabel,
+        "data-testid": endDateTestsProps === null || endDateTestsProps === void 0 ? void 0 : endDateTestsProps.month
     }), /*#__PURE__*/ React.createElement(InputLikeDivider, null, "."), /*#__PURE__*/ React.createElement(InputLike, {
         length: 4,
         getRootRef: yearsEndRef,
         index: 5,
         onElementSelect: setFocusedElement,
         value: internalValue[5],
-        label: changeEndYearLabel
+        label: changeEndYearLabel,
+        "data-testid": endDateTestsProps === null || endDateTestsProps === void 0 ? void 0 : endDateTestsProps.year
     })), open && !disableCalendar && /*#__PURE__*/ React.createElement(Popper, {
         targetRef: rootRef,
         offsetByMainAxis: 8,
         placement: calendarPlacement
-    }, /*#__PURE__*/ React.createElement(CalendarRange, {
+    }, /*#__PURE__*/ React.createElement(CalendarRange, DateRangeInput_object_spread({
         value: value,
         onChange: onCalendarChange,
         disablePast: disablePast,
@@ -46790,7 +46940,7 @@ var DateRangeInput_getInternalValue = function(value) {
         prevMonthIcon: prevMonthIcon,
         nextMonthIcon: nextMonthIcon,
         renderDayContent: renderDayContent
-    })));
+    }, calendarTestsProps))));
 };
 
 ;// CONCATENATED MODULE: ./src/components/Skeleton/Skeleton.module.css
@@ -47900,7 +48050,9 @@ function Popover_unsupported_iterable_to_array(o, minLen) {
             mount: !hidden,
             disabled: hidden,
             autoFocus: disableInteractive ? false : autoFocus,
-            restoreFocus: restoreFocus ? onRestoreFocus : false,
+            restoreFocus: restoreFocus ? function() {
+                return onRestoreFocus(restoreFocus);
+            } : false,
             onClose: onEscapeKeyDown
         }), arrow, typeof content === 'function' ? content({
             onClose: onClose