diff --git a/packages/react/src/components/ComboBox/ComboBox.tsx b/packages/react/src/components/ComboBox/ComboBox.tsx index aeec22bcc52a..9574c5a763e1 100644 --- a/packages/react/src/components/ComboBox/ComboBox.tsx +++ b/packages/react/src/components/ComboBox/ComboBox.tsx @@ -480,6 +480,14 @@ const ComboBox = React.forwardRef((props: ComboBoxProps, ref) => { if (match(event, keys.Enter) && !inputValue) { toggleMenu(); } + + if (match(event, keys.Escape) && inputValue) { + if (event.target === textInput.current && isOpen) { + toggleMenu(); + event.preventDownshiftDefault = true; + event.persist(); + } + } }, }); diff --git a/packages/react/src/components/MultiSelect/FilterableMultiSelect.js b/packages/react/src/components/MultiSelect/FilterableMultiSelect.js index 203e8e359b04..8a2b54c07f63 100644 --- a/packages/react/src/components/MultiSelect/FilterableMultiSelect.js +++ b/packages/react/src/components/MultiSelect/FilterableMultiSelect.js @@ -303,14 +303,11 @@ const FilterableMultiSelect = React.forwardRef(function FilterableMultiSelect( if (match(event, keys.Delete) || match(event, keys.Escape)) { if (isOpen) { handleOnMenuChange(true); + clearInputValue(); event.stopPropagation(); } else if (!isOpen) { - clearInputValue(); + clearSelection(); event.stopPropagation(); - if (event.target.value === '') { - clearSelection(); - event.stopPropagation(); - } } } }