From 8fde69e2ed159feb49c0f3f463b5f09bb2d1f0a1 Mon Sep 17 00:00:00 2001
From: Alexey Pyltsyn <lex61rus@gmail.com>
Date: Sun, 7 Feb 2021 17:05:36 +0300
Subject: [PATCH] fix(v2): prepend docsearch modal to body element

---
 .../src/theme/SearchBar/index.js                         | 9 ++++++++-
 .../src/theme/SearchBar/styles.css                       | 4 ++++
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/packages/docusaurus-theme-search-algolia/src/theme/SearchBar/index.js b/packages/docusaurus-theme-search-algolia/src/theme/SearchBar/index.js
index c3d6f557442f..6cd6ea993fad 100644
--- a/packages/docusaurus-theme-search-algolia/src/theme/SearchBar/index.js
+++ b/packages/docusaurus-theme-search-algolia/src/theme/SearchBar/index.js
@@ -53,6 +53,7 @@ function DocSearch({contextualSearch, ...props}) {
 
   const {withBaseUrl} = useBaseUrlUtils();
   const history = useHistory();
+  const searchContainer = useRef(null);
   const searchButtonRef = useRef(null);
   const [isOpen, setIsOpen] = useState(false);
   const [initialQuery, setInitialQuery] = useState(null);
@@ -73,12 +74,18 @@ function DocSearch({contextualSearch, ...props}) {
 
   const onOpen = useCallback(() => {
     importDocSearchModalIfNeeded().then(() => {
+      searchContainer.current = document.createElement('div');
+      document.body.insertBefore(
+        searchContainer.current,
+        document.body.firstChild,
+      );
       setIsOpen(true);
     });
   }, [importDocSearchModalIfNeeded, setIsOpen]);
 
   const onClose = useCallback(() => {
     setIsOpen(false);
+    searchContainer.current.remove();
   }, [setIsOpen]);
 
   const onInput = useCallback(
@@ -172,7 +179,7 @@ function DocSearch({contextualSearch, ...props}) {
             {...props}
             searchParameters={searchParameters}
           />,
-          document.body,
+          searchContainer.current,
         )}
     </>
   );
diff --git a/packages/docusaurus-theme-search-algolia/src/theme/SearchBar/styles.css b/packages/docusaurus-theme-search-algolia/src/theme/SearchBar/styles.css
index c1b6c743b300..e57bb046de21 100644
--- a/packages/docusaurus-theme-search-algolia/src/theme/SearchBar/styles.css
+++ b/packages/docusaurus-theme-search-algolia/src/theme/SearchBar/styles.css
@@ -14,3 +14,7 @@
   transition: all var(--ifm-transition-fast)
     var(--ifm-transition-timing-default);
 }
+
+.DocSearch-Container {
+  z-index: calc(var(--ifm-z-index-fixed) + 1);
+}