From 8b1aafaa3e9a76b747e37d03f8018e62c5688311 Mon Sep 17 00:00:00 2001
From: Hab abere <habbuya@gmail.com>
Date: Fri, 4 Oct 2024 11:30:26 +0200
Subject: [PATCH] fix(select): select menu shadow and borderRadius fix

---
 src/components/Select/Select.tsx | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/Select/Select.tsx b/src/components/Select/Select.tsx
index fc122bf..66318ee 100644
--- a/src/components/Select/Select.tsx
+++ b/src/components/Select/Select.tsx
@@ -162,6 +162,7 @@ export const BoemlySelect: React.FC<BoemlySelectProps> = ({
         if (onClose) onClose();
       }}
       matchWidth
+      data-testid="select-menu"
     >
       {({ isOpen }) => (
         <>
@@ -184,6 +185,7 @@ export const BoemlySelect: React.FC<BoemlySelectProps> = ({
             role="combobox"
             width={isFullWidth ? '100%' : 'auto'}
             tabIndex={isDisabled ? -1 : 0}
+            data-testid="select-menu-button"
           >
             <Flex alignItems="center" justifyContent="space-between">
               <Text
@@ -195,6 +197,7 @@ export const BoemlySelect: React.FC<BoemlySelectProps> = ({
                 overflow="hidden"
                 textOverflow="ellipsis"
                 flexShrink={1}
+                data-testid="select-menu-item-input"
               >
                 {selectedOptions.length > 0 && isMultiple ? (
                   <>
@@ -239,12 +242,12 @@ export const BoemlySelect: React.FC<BoemlySelectProps> = ({
               mt="2"
               p="2"
               borderRadius="lg"
-              boxShadow="md"
               role="listbox"
               bg="white"
               maxHeight={dynamicMaxHeight}
               overflowY="auto"
               zIndex="popover"
+              data-testid="select-menu-list"
             >
               {isSearchable && (
                 <InputGroup mb="4">
@@ -304,9 +307,10 @@ export const BoemlySelect: React.FC<BoemlySelectProps> = ({
                         key={value}
                         onClick={() => handleOptionSelect(value, disabled)}
                         isDisabled={disabled}
-                        borderRadius={CustomizedSelect.variants[variant].borderRadius}
+                        borderRadius="md"
                         icon={null}
                         iconSpacing="0"
+                        data-testid="select-menu-item-option"
                       >
                         <Flex justify="space-between" align="center" width="100%">
                           <Text fontSize={CustomizedSelect.sizes[size].fontSize}>