Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-04-01 01:18:10 +02:00
Code Issues Projects Releases Wiki Activity

feat: hide command bar when losing focus (#7544)

Browse Source
This commit is contained in:
David Leek 2024-07-05 11:22:46 +02:00 committed by GitHub
parent cad8a3c2df
commit 51a2b3aa0e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 18 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
frontend/src/component/commandBar/CommandBar.tsx
View File

@ -213,6 +213,16 @@ export const CommandBar = () => {
searchInputRef.current?.focus(); searchInputRef.current?.focus();
} }
}; };
const onBlur = (evt: React.FocusEvent) => {
if (
evt.relatedTarget === null ||
!searchContainerRef.current?.contains(evt.relatedTarget)
) {
hideSuggestions();
}
};
return ( return (
<StyledContainer ref={searchContainerRef} active={showSuggestions}> <StyledContainer ref={searchContainerRef} active={showSuggestions}>
<RecentlyVisitedRecorder /> <RecentlyVisitedRecorder />
@ -279,7 +289,10 @@ export const CommandBar = () => {
<ConditionallyRender <ConditionallyRender
condition={Boolean(value) && showSuggestions} condition={Boolean(value) && showSuggestions}
show={ show={
<CommandResultsPaper onKeyDownCapture={onKeyDown}> <CommandResultsPaper
onKeyDownCapture={onKeyDown}
onBlur={onBlur}
>
{searchString !== undefined && ( {searchString !== undefined && (
<CommandSearchFeatures <CommandSearchFeatures
searchString={searchString} searchString={searchString}
@ -309,7 +322,10 @@ export const CommandBar = () => {
} }
elseShow={ elseShow={
showSuggestions && ( showSuggestions && (
<CommandResultsPaper onKeyDownCapture={onKeyDown}> <CommandResultsPaper
onKeyDownCapture={onKeyDown}
onBlur={onBlur}
>
<CommandQuickSuggestions <CommandQuickSuggestions
routes={allRoutes} routes={allRoutes}
onClick={clearSearchValue} onClick={clearSearchValue}