Merge pull request #302 from lschlesinger/v3-is-disabled-fix

Fix for V3: Prevent a selected option from being removed when isDisabled is passed

Author: csandman

src/chakra-components/containers.tsx

@@ -31,10 +31,7 @@ export const SelectContainer = <
   const initialStyles: SystemStyleObject = {
     position: "relative",
     direction: isRtl ? "rtl" : undefined,
-    // When disabled, react-select sets the pointer-state to none which prevents
-    // the `not-allowed` cursor style from chakra from getting applied to the
-    // Control when it is disabled
-    pointerEvents: "auto",
+    ...(isDisabled ? { cursor: "not-allowed" } : {}),
   };
 
   const sx: SystemStyleObject = chakraStyles?.container

src/chakra-components/control.tsx

@@ -50,6 +50,7 @@ const Control = <
     overflow: "hidden",
     height: "auto",
     minHeight: heights[size as Size],
+    ...(isDisabled ? { pointerEvents: "none" } : {}),
   };
 
   const sx: SystemStyleObject = chakraStyles?.control