From c64801cf34e47ee4f74721d926e83dc466569b46 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Francisco=20Javier=20Arribas=20Fern=C3=A1ndez?=
 <arribasjavier@gmail.com>
Date: Mon, 22 Jan 2024 14:09:43 +0100
Subject: [PATCH] fix: use internal member to check if control onMouseDown
 should act

This is intended to be a temporal fix, as I think a better solution must be developed.

Referenced issues: #5833, #5176

Another PRs abaout this: #5842
---
 packages/react-select/src/Select.tsx | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/packages/react-select/src/Select.tsx b/packages/react-select/src/Select.tsx
index 798f6126b..c88c40bd0 100644
--- a/packages/react-select/src/Select.tsx
+++ b/packages/react-select/src/Select.tsx
@@ -657,6 +657,7 @@ export default class Select<
   scrollToFocusedOptionOnUpdate = false;
   userIsDragging?: boolean;
   isAppleDevice = isAppleDevice();
+  mouseDownTriggeredBeyondControl = false;
 
   // Refs
   // ------------------------------
@@ -1293,8 +1294,9 @@ export default class Select<
   onControlMouseDown = (
     event: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>
   ) => {
-    // Event captured by dropdown indicator
-    if (event.defaultPrevented) {
+    // Event captured somewhere deeper in the DOM
+    if (this.mouseDownTriggeredBeyondControl) {
+      this.mouseDownTriggeredBeyondControl = false;
       return;
     }
     const { openMenuOnClick } = this.props;
@@ -1342,6 +1344,7 @@ export default class Select<
     } else {
       this.openMenu('first');
     }
+    this.mouseDownTriggeredBeyondControl = true;
     event.preventDefault();
   };
   onClearIndicatorMouseDown = (
@@ -1356,6 +1359,7 @@ export default class Select<
       return;
     }
     this.clearValue();
+    this.mouseDownTriggeredBeyondControl = true;
     event.preventDefault();
     this.openAfterFocus = false;
     if (event.type === 'touchend') {
@@ -1835,6 +1839,7 @@ export default class Select<
               onClick: () => this.removeValue(opt),
               onTouchEnd: () => this.removeValue(opt),
               onMouseDown: (e) => {
+                this.mouseDownTriggeredBeyondControl = true;
                 e.preventDefault();
               },
             }}