fix: disable closing dropdown on space (#10945)
This commit is contained in:
parent
6e1e2faaac
commit
e4e7c59bc2
|
|
@ -76,6 +76,7 @@ export type DropdownProps = CommonComponentProps &
|
||||||
dropdownHeight?: string;
|
dropdownHeight?: string;
|
||||||
dropdownMaxHeight?: string;
|
dropdownMaxHeight?: string;
|
||||||
showDropIcon?: boolean;
|
showDropIcon?: boolean;
|
||||||
|
closeOnSpace?: boolean;
|
||||||
dropdownTriggerIcon?: React.ReactNode;
|
dropdownTriggerIcon?: React.ReactNode;
|
||||||
containerClassName?: string;
|
containerClassName?: string;
|
||||||
headerLabel?: string;
|
headerLabel?: string;
|
||||||
|
|
@ -793,6 +794,7 @@ export default function Dropdown(props: DropdownProps) {
|
||||||
helperText,
|
helperText,
|
||||||
removeSelectedOption,
|
removeSelectedOption,
|
||||||
hasError,
|
hasError,
|
||||||
|
closeOnSpace = true,
|
||||||
} = { ...props };
|
} = { ...props };
|
||||||
const [isOpen, setIsOpen] = useState<boolean>(false);
|
const [isOpen, setIsOpen] = useState<boolean>(false);
|
||||||
const [selected, setSelected] = useState<DropdownOption | DropdownOption[]>(
|
const [selected, setSelected] = useState<DropdownOption | DropdownOption[]>(
|
||||||
|
|
@ -872,6 +874,12 @@ export default function Dropdown(props: DropdownProps) {
|
||||||
}
|
}
|
||||||
break;
|
break;
|
||||||
case " ":
|
case " ":
|
||||||
|
if (closeOnSpace) {
|
||||||
|
e.preventDefault();
|
||||||
|
if (isOpen && !("length" in selected)) optionClickHandler(selected);
|
||||||
|
else onClickHandler();
|
||||||
|
}
|
||||||
|
break;
|
||||||
case "Enter":
|
case "Enter":
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
if (isOpen && !("length" in selected)) optionClickHandler(selected);
|
if (isOpen && !("length" in selected)) optionClickHandler(selected);
|
||||||
|
|
|
||||||
|
|
@ -156,6 +156,7 @@ export default function CurrencyTypeDropdown(props: CurrencyDropdownProps) {
|
||||||
return (
|
return (
|
||||||
<DropdownContainer>
|
<DropdownContainer>
|
||||||
<Dropdown
|
<Dropdown
|
||||||
|
closeOnSpace={false}
|
||||||
containerClassName="currency-type-filter"
|
containerClassName="currency-type-filter"
|
||||||
dropdownHeight="139px"
|
dropdownHeight="139px"
|
||||||
dropdownTriggerIcon={dropdownTriggerIcon}
|
dropdownTriggerIcon={dropdownTriggerIcon}
|
||||||
|
|
|
||||||
|
|
@ -147,6 +147,7 @@ export default function ISDCodeDropdown(props: ISDCodeDropdownProps) {
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<Dropdown
|
<Dropdown
|
||||||
|
closeOnSpace={false}
|
||||||
containerClassName="country-type-filter"
|
containerClassName="country-type-filter"
|
||||||
dropdownHeight="139px"
|
dropdownHeight="139px"
|
||||||
dropdownTriggerIcon={dropdownTrigger}
|
dropdownTriggerIcon={dropdownTrigger}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user