🐛 (editor) Fix variables dropdown behind modal

Closes #213
baptisteArno · Jan 6, 2023 · b455078 · b455078
1 parent 3f7e1ce
commit b455078
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 1 deletion.
diff --git a/apps/builder/src/components/VariableSearchInput.tsx b/apps/builder/src/components/VariableSearchInput.tsx
@@ -58,7 +58,7 @@ export const VariableSearchInput = ({
   const [keyboardFocusIndex, setKeyboardFocusIndex] = useState<
     number | undefined
   >()
-  const dropdownRef = useRef(null)
+  const dropdownRef = useRef<HTMLDivElement>(null)
   const inputRef = useRef<HTMLInputElement>(null)
   const createVariableItemRef = useRef<HTMLButtonElement | null>(null)
   const itemsRef = useRef<(HTMLButtonElement | null)[]>([])
@@ -70,6 +70,7 @@ export const VariableSearchInput = ({
 
   useEffect(() => {
     if (isDefaultOpen) onOpen()
+
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [])
 

diff --git a/apps/builder/src/lib/theme.ts b/apps/builder/src/lib/theme.ts
@@ -93,6 +93,7 @@ const Popover = createMultiStyleConfigHelpers(
     popper: {
       width: 'fit-content',
       maxWidth: 'fit-content',
+      zIndex: 'popover',
     },
     content: {
       bg: colorMode === 'dark' ? 'gray.800' : 'white',