fix: empty composite field input (#8451)

Fixes: #7225

---------

Co-authored-by: bosiraphael <raphael.bosi@gmail.com>
This commit is contained in:
Harsh Singh 2024-11-20 20:09:55 +05:30 committed by GitHub
parent 24c0b0f873
commit 96c8673278
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 16 additions and 7 deletions

View File

@ -19,9 +19,8 @@ import { toSpliced } from '~/utils/array/toSpliced';
import { turnIntoEmptyStringIfWhitespacesOnly } from '~/utils/string/turnIntoEmptyStringIfWhitespacesOnly';
const StyledDropdownMenu = styled(DropdownMenu)`
margin-left: -1px;
margin: -1px;
position: relative;
margin-top: -1px;
`;
type MultiItemFieldInputProps<T> = {
@ -65,8 +64,12 @@ export const MultiItemFieldInput = <T,>({
};
const handleDropdownCloseOutside = (event: MouseEvent | TouchEvent) => {
onCancel?.();
event.stopImmediatePropagation();
if (inputValue?.trim().length > 0) {
handleSubmitInput();
} else {
onCancel?.();
}
};
useListenClickOutside({
@ -202,10 +205,12 @@ export const MultiItemFieldInput = <T,>({
}
onEnter={handleSubmitInput}
rightComponent={
<LightIconButton
Icon={isAddingNewItem ? IconPlus : IconCheck}
onClick={handleSubmitInput}
/>
items.length ? (
<LightIconButton
Icon={isAddingNewItem ? IconPlus : IconCheck}
onClick={handleSubmitInput}
/>
) : null
}
/>
) : (

View File

@ -36,6 +36,10 @@ const StyledInputContainer = styled.div`
box-sizing: border-box;
position: relative;
width: 100%;
&:not(:first-of-type) {
padding: ${({ theme }) => theme.spacing(1)};
}
`;
const StyledRightContainer = styled.div`