diff --git a/.changeset/sharp-planets-type.md b/.changeset/sharp-planets-type.md new file mode 100644 index 0000000000..85bb4b931f --- /dev/null +++ b/.changeset/sharp-planets-type.md @@ -0,0 +1,5 @@ +--- +"@rocket.chat/fuselage": patch +--- + +Handle `onBlur` prop on AutoComplete diff --git a/.husky/pre-commit b/.husky/pre-commit index 7486fddf77..3a48504855 100755 --- a/.husky/pre-commit +++ b/.husky/pre-commit @@ -2,4 +2,4 @@ . "$(dirname "$0")/_/husky.sh" yarn update-readme -yarn lint-staged \ No newline at end of file +yarn lint-staged --allow-empty diff --git a/packages/fuselage/src/components/AutoComplete/AutoComplete.tsx b/packages/fuselage/src/components/AutoComplete/AutoComplete.tsx index f8b7e907f1..a40dd6471e 100644 --- a/packages/fuselage/src/components/AutoComplete/AutoComplete.tsx +++ b/packages/fuselage/src/components/AutoComplete/AutoComplete.tsx @@ -69,6 +69,7 @@ export function AutoComplete({ error, disabled, multiple, + onBlur: onBlurAction = () => {}, ...props }: AutoCompleteProps): ReactElement { const ref = useRef(); @@ -121,6 +122,11 @@ export function AutoComplete({ const [cursor, handleKeyDown, , reset, [optionsAreVisible, hide, show]] = useCursor(value, memoizedOptions, handleSelect); + const handleOnBlur = useMutableCallback((event) => { + hide(); + onBlurAction(event); + }); + useEffect(reset, [filter]); return ( @@ -148,7 +154,7 @@ export function AutoComplete({ onChange={useMutableCallback((e) => setFilter(e.currentTarget.value) )} - onBlur={hide} + onBlur={handleOnBlur} onFocus={show} onKeyDown={handleKeyDown} placeholder={