3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-07-30 06:50:36 +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(() => {
props.handleSearchBarToggle(!props.isSearchBarExpanded);
}, [props.isSearchBarExpanded]);
const toggleSearchIconClick = useCallback(
e => {
if (!searchBarRef.current.contains(e.target)) {
searchBarRef.current.focus();
}
useEffect(() => {
if (props.isSearchBarExpanded) {
searchBarRef.current.focus();
}
}, [props.isSearchBarExpanded]);
props.handleSearchBarToggle(!props.isSearchBarExpanded);
},
[props.isSearchBarExpanded],
);
return isEnabled ? (
<Fragment>
@ -78,6 +79,7 @@ const Search = props => {
{'search-bar-expanded': props.isSearchBarExpanded},
{'search-bar': !props.isSearchBarExpanded},
)}
onFocus={toggleSearchIconClick}
onBlur={toggleSearchIconClick}
ref={searchBarRef}
/>