3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-07-31 23:40:39 +02:00
Code Issues Projects Releases Packages Wiki Activity

fix(v2): fix search input blur on desktop (#1874)

Browse source
This commit is contained in:
Alexey Pyltsyn 2019-10-24 08:00:51 +03:00 • committed by Yangshun Tay
parent 262dca387a
commit 0e66c908a9
1 changed files with 10 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

18
packages/docusaurus-theme-search-algolia/src/theme/SearchBar/index.js
View file

@ -48,15 +48,16 @@ const Search = props => {
} }
}, []); }, []);
const toggleSearchIconClick = useCallback(() => { const toggleSearchIconClick = useCallback(
props.handleSearchBarToggle(!props.isSearchBarExpanded); e => {
}, [props.isSearchBarExpanded]); if (!searchBarRef.current.contains(e.target)) {
searchBarRef.current.focus();
}
useEffect(() => { props.handleSearchBarToggle(!props.isSearchBarExpanded);
if (props.isSearchBarExpanded) { },
searchBarRef.current.focus(); [props.isSearchBarExpanded],
} );
}, [props.isSearchBarExpanded]);
return isEnabled ? ( return isEnabled ? (
<Fragment> <Fragment>
@ -78,6 +79,7 @@ const Search = props => {
{'search-bar-expanded': props.isSearchBarExpanded}, {'search-bar-expanded': props.isSearchBarExpanded},
{'search-bar': !props.isSearchBarExpanded}, {'search-bar': !props.isSearchBarExpanded},
)} )}
onFocus={toggleSearchIconClick}
onBlur={toggleSearchIconClick} onBlur={toggleSearchIconClick}
ref={searchBarRef} ref={searchBarRef}
/> />