Fix select input styles

src/Popover.jsx

@@ -1,15 +1,14 @@
-import React, { forwardRef } from "react";
-import {
-  DismissButton,
-  useOverlay,
-  OverlayContainer,
-} from "@react-aria/overlays";
+import React, { forwardRef, useRef } from "react";
+import { DismissButton, useOverlay } from "@react-aria/overlays";
 import { FocusScope } from "@react-aria/focus";
 import classNames from "classnames";
 import styles from "./Popover.module.css";
 
 export const Popover = forwardRef(
   ({ isOpen = true, onClose, className, children, ...rest }, ref) => {
+    const fallbackRef = useRef();
+    const popoverRef = ref || fallbackRef;
+
     const { overlayProps } = useOverlay(
       {
         isOpen,
@@ -17,23 +16,21 @@ export const Popover = forwardRef(
         shouldCloseOnBlur: true,
         isDismissable: true,
       },
-      ref
+      popoverRef
     );
 
     return (
-      <OverlayContainer>
-        <FocusScope restoreFocus>
-          <div
-            {...overlayProps}
-            {...rest}
-            className={classNames(styles.popover, className)}
-            ref={ref}
-          >
-            {children}
-            <DismissButton onDismiss={onClose} />
-          </div>
-        </FocusScope>
-      </OverlayContainer>
+      <FocusScope restoreFocus>
+        <div
+          {...overlayProps}
+          {...rest}
+          className={classNames(styles.popover, className)}
+          ref={popoverRef}
+        >
+          {children}
+          <DismissButton onDismiss={onClose} />
+        </div>
+      </FocusScope>
     );
   }
 );