diff --git a/src/components/Input/InputTextBase/InputTextBase.tsx b/src/components/Input/InputTextBase/InputTextBase.tsx index 8caac17..55b13b2 100644 --- a/src/components/Input/InputTextBase/InputTextBase.tsx +++ b/src/components/Input/InputTextBase/InputTextBase.tsx @@ -186,14 +186,27 @@ export const InputTextBase = memo< const hasRightContent = loading || showClearButton || showSecureToggle || disabled + const isOnlyButton = useMemo(() => { + return ( + [showClearButton, showSecureToggle].filter((val) => val).length === 1 + ) + }, [showClearButton, showSecureToggle]) + const rightButtonHitSlop = useMemo( () => ({ - top: 0, - bottom: 0, - left: styles.rightContainer.gap / 2, - right: styles.rightContainer.gap / 2, + // Большие вертикальные отступы (100) - чтобы компенсировать возможное + // растягивание инпута по вертикали, при этом область тапа + // гарантированно не выйдет за пределы инпута + top: 100, + bottom: 100, + left: isOnlyButton + ? styles.rightContainer.gap + : styles.rightContainer.gap / 2, + right: isOnlyButton + ? styles.rightContainer.gap + : styles.rightContainer.gap / 2, }), - [styles.rightContainer.gap] + [styles.rightContainer.gap, isOnlyButton] ) const texInputProps = useMemo(