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 1/2] 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 798f6126b2..c88c40bd0e 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();
               },
             }}

From 3cde18e73e022bd14d28dd4d8479a6b7a7068e95 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:35:54 +0100
Subject: [PATCH 2/2] chore: add changeset

---
 .changeset/selfish-timers-add.md | 11 +++++++++++
 1 file changed, 11 insertions(+)
 create mode 100644 .changeset/selfish-timers-add.md

diff --git a/.changeset/selfish-timers-add.md b/.changeset/selfish-timers-add.md
new file mode 100644
index 0000000000..7175f14d54
--- /dev/null
+++ b/.changeset/selfish-timers-add.md
@@ -0,0 +1,11 @@
+---
+'react-select': patch
+---
+
+Use an internal member to check if control onMouseDown should act and remove logic to bail out from an event if someone else listening to the event (usually in a capture phase) has called preventDefault().
+
+This change was initiated to fix the interop between react-select and react-beautiful-dnd.
+But has meaning on its own because it is pretty clear that using the `defaultPrevented` event property for custom logic is a really bad practice.
+So, another way to filter when we want to trigger control onMouseDown normal logic has to be better defined and developed.
+
+Nothing to update from the consumers.