From 0aaa9575ed7e817841b9c9b494b4bd4dc2247b26 Mon Sep 17 00:00:00 2001
From: robert <robert.kulinski93@gmail.com>
Date: Mon, 28 Feb 2022 20:19:37 +0100
Subject: [PATCH] Add changeset

---
 .changeset/allow-event-bubbling-for-all-controls.md | 5 +++++
 packages/react-select/src/Select.tsx                | 7 ++++++-
 2 files changed, 11 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/allow-event-bubbling-for-all-controls.md

diff --git a/.changeset/allow-event-bubbling-for-all-controls.md b/.changeset/allow-event-bubbling-for-all-controls.md
new file mode 100644
index 0000000000..f184c8fc9a
--- /dev/null
+++ b/.changeset/allow-event-bubbling-for-all-controls.md
@@ -0,0 +1,5 @@
+---
+'react-select': patch
+---
+
+Replace stopPropagation with target check.
diff --git a/packages/react-select/src/Select.tsx b/packages/react-select/src/Select.tsx
index c9048a4ed0..3579bef962 100644
--- a/packages/react-select/src/Select.tsx
+++ b/packages/react-select/src/Select.tsx
@@ -1156,6 +1156,11 @@ export default class Select<
   onControlMouseDown = (
     event: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>
   ) => {
+    // Event captured by dropdown indicator
+    // @ts-ignore
+    if (event.target.closest('.DropdownIndicatorContainer')) {
+      return;
+    }
     const { openMenuOnClick } = this.props;
     if (!this.state.isFocused) {
       if (openMenuOnClick) {
@@ -1202,7 +1207,6 @@ export default class Select<
       this.openMenu('first');
     }
     event.preventDefault();
-    event.stopPropagation();
   };
   onClearIndicatorMouseDown = (
     event: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>
@@ -1776,6 +1780,7 @@ export default class Select<
 
     return (
       <DropdownIndicator
+        className="DropdownIndicatorContainer"
         {...commonProps}
         innerProps={innerProps}
         isDisabled={isDisabled}