diff options
| author | Hailey <me@haileyok.com> | 2024-10-08 11:45:04 -0700 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2024-10-08 11:45:04 -0700 |
| commit | 3da4f9b170ad8485d8940023081a55ef6478cb18 (patch) | |
| tree | 2e66d42eb1ac3842d5bda9e653d5a3f308e6fb0a /src/components/forms/SearchInput.tsx | |
| parent | 2ab95124dd830ec847b693ca9a483967ead62273 (diff) | |
| download | voidsky-3da4f9b170ad8485d8940023081a55ef6478cb18.tar.zst | |
fix clear button in input (#5650)
Co-authored-by: Eric Bailey <git@esb.lol>
Diffstat (limited to 'src/components/forms/SearchInput.tsx')
| -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, |