diff --git a/src/components/MapView/responder/index.ts b/src/components/MapView/responder/index.ts index 422d6c1b496..c4c325444f7 100644 --- a/src/components/MapView/responder/index.ts +++ b/src/components/MapView/responder/index.ts @@ -1,8 +1,3 @@ -import {PanResponder} from 'react-native'; +import SwipeInterceptPanResponder from '../../SwipeInterceptPanResponder'; -const responder = PanResponder.create({ - onMoveShouldSetPanResponder: () => true, - onPanResponderTerminationRequest: () => false, -}); - -export default responder; +export default SwipeInterceptPanResponder; diff --git a/src/components/OptionsSelector/BaseOptionsSelector.js b/src/components/OptionsSelector/BaseOptionsSelector.js index aa02701b1c9..dee568f2cdf 100755 --- a/src/components/OptionsSelector/BaseOptionsSelector.js +++ b/src/components/OptionsSelector/BaseOptionsSelector.js @@ -364,6 +364,7 @@ class BaseOptionsSelector extends Component { selectTextOnFocus blurOnSubmit={Boolean(this.state.allOptions.length)} spellCheck={false} + shouldInterceptSwipe={this.props.shouldTextInputInterceptSwipe} /> ); const optionsList = ( diff --git a/src/components/OptionsSelector/index.js b/src/components/OptionsSelector/index.js index 9f7c924e427..eba3e656bc2 100644 --- a/src/components/OptionsSelector/index.js +++ b/src/components/OptionsSelector/index.js @@ -6,6 +6,7 @@ const OptionsSelector = forwardRef((props, ref) => ( // eslint-disable-next-line react/jsx-props-no-spreading {...props} ref={ref} + shouldTextInputInterceptSwipe /> )); diff --git a/src/components/OptionsSelector/optionsSelectorPropTypes.js b/src/components/OptionsSelector/optionsSelectorPropTypes.js index ca336c32467..8a715809296 100644 --- a/src/components/OptionsSelector/optionsSelectorPropTypes.js +++ b/src/components/OptionsSelector/optionsSelectorPropTypes.js @@ -124,6 +124,9 @@ const propTypes = { /** Initial focused index value */ initialFocusedIndex: PropTypes.number, + + /** Whether the text input should intercept swipes or not */ + shouldTextInputInterceptSwipe: PropTypes.bool, }; const defaultProps = { @@ -160,6 +163,7 @@ const defaultProps = { shouldUseStyleForChildren: true, isRowMultilineSupported: false, initialFocusedIndex: undefined, + shouldTextInputInterceptSwipe: false, }; export {propTypes, defaultProps}; diff --git a/src/components/RoomNameInput/index.js b/src/components/RoomNameInput/index.js index 4546e83ef76..37d131108e9 100644 --- a/src/components/RoomNameInput/index.js +++ b/src/components/RoomNameInput/index.js @@ -62,6 +62,7 @@ function RoomNameInput({isFocused, autoFocus, disabled, errorText, forwardedRef, autoFocus={isFocused && autoFocus} maxLength={CONST.REPORT.MAX_ROOM_NAME_LENGTH} spellCheck={false} + shouldInterceptSwipe /> ); } diff --git a/src/components/SwipeInterceptPanResponder.js b/src/components/SwipeInterceptPanResponder.js new file mode 100644 index 00000000000..fe1545d2f14 --- /dev/null +++ b/src/components/SwipeInterceptPanResponder.js @@ -0,0 +1,8 @@ +import {PanResponder} from 'react-native'; + +const SwipeInterceptPanResponder = PanResponder.create({ + onMoveShouldSetPanResponder: () => true, + onPanResponderTerminationRequest: () => false, +}); + +export default SwipeInterceptPanResponder; diff --git a/src/components/TextInput/BaseTextInput.js b/src/components/TextInput/BaseTextInput.js index b469f39c703..b91fa20c229 100644 --- a/src/components/TextInput/BaseTextInput.js +++ b/src/components/TextInput/BaseTextInput.js @@ -22,6 +22,7 @@ import PressableWithoutFeedback from '../Pressable/PressableWithoutFeedback'; import withLocalize from '../withLocalize'; import useNativeDriver from '../../libs/useNativeDriver'; import * as Browser from '../../libs/Browser'; +import SwipeInterceptPanResponder from '../SwipeInterceptPanResponder'; function BaseTextInput(props) { const inputValue = props.value || props.defaultValue || ''; @@ -257,7 +258,11 @@ function BaseTextInput(props) { return ( <> - +