diff options
| -rw-r--r-- | src/components/forms/SearchInput.tsx | 10 |
1 files changed, 9 insertions, 1 deletions
diff --git a/src/components/forms/SearchInput.tsx b/src/components/forms/SearchInput.tsx index 30791d005..97540d0bc 100644 --- a/src/components/forms/SearchInput.tsx +++ b/src/components/forms/SearchInput.tsx @@ -23,6 +23,7 @@ export const SearchInput = React.forwardRef<TextInput, SearchInputProps>( function SearchInput({value, label, onClearText, ...rest}, ref) { const t = useTheme() const {_} = useLingui() + const showClear = value && value.length > 0 return ( <View style={[a.w_full, a.relative]}> @@ -41,11 +42,18 @@ export const SearchInput = React.forwardRef<TextInput, SearchInputProps>( autoCorrect={false} autoComplete="off" autoCapitalize="none" + style={[ + showClear + ? { + paddingRight: 24, + } + : {}, + ]} {...rest} /> </TextField.Root> - {value && value.length > 0 && ( + {showClear && ( <View style={[ a.absolute, |