From 64a906dc78d4c7a20a085bcb5952ee86934b63f5 Mon Sep 17 00:00:00 2001
From: Max Chopart <max.chopart@gmail.com>
Date: Wed, 31 Jan 2024 16:00:02 +0100
Subject: [PATCH 1/2] [New] Add support for keyboard navigation

---
 src/components/IntelligentTreeSelect.js | 1 +
 src/components/Option.js                | 1 +
 src/components/VirtualizedTreeSelect.js | 6 +++++-
 3 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/components/IntelligentTreeSelect.js b/src/components/IntelligentTreeSelect.js
index 23dcee1..23dd335 100644
--- a/src/components/IntelligentTreeSelect.js
+++ b/src/components/IntelligentTreeSelect.js
@@ -502,6 +502,7 @@ class IntelligentTreeSelect extends Component {
   render() {
     let listProps = {};
     listProps.onScroll = this.props.onScroll || this._onScroll;
+    listProps.ref = this.select;
     const valueRenderer = this._valueRenderer;
     const propsToPass = Object.assign({}, this.props);
     delete propsToPass.valueRenderer;
diff --git a/src/components/Option.js b/src/components/Option.js
index b951a05..233bbd8 100644
--- a/src/components/Option.js
+++ b/src/components/Option.js
@@ -8,6 +8,7 @@ const Option = (props) => {
   const classes = classNames("VirtualizedSelectOption", {
     VirtualizedSelectDisabledOption: props.isDisabled,
     VirtualizedSelectSelectedOption: props.isSelected,
+    VirtualizedSelectFocusedOption: props.isFocused,
   });
 
   const events = props.isDisabled
diff --git a/src/components/VirtualizedTreeSelect.js b/src/components/VirtualizedTreeSelect.js
index d3e4867..fc31118 100644
--- a/src/components/VirtualizedTreeSelect.js
+++ b/src/components/VirtualizedTreeSelect.js
@@ -352,10 +352,14 @@ const Menu = (props) => {
           props.selectProps.listProps.onScroll(e.target);
         },
         //Enables option selection even when input is not focused
-        onMouseDown: (event) => {
+        onMouseEnter: (event) => {
           if (event.button !== 0) {
             return;
           }
+          // Focus the Select component to enable keyboard navigation
+          if (props.selectProps.listProps.ref.current) {
+            props.selectProps.listProps.ref.current.focus();
+          }
           event.stopPropagation();
           event.preventDefault();
         },

From 466ac270648ae50c784499beab9928c571b0a7da Mon Sep 17 00:00:00 2001
From: Max Chopart <max.chopart@gmail.com>
Date: Fri, 2 Feb 2024 16:19:51 +0100
Subject: [PATCH 2/2] [Upd] Remove unnecessary custom Menu

---
 src/components/IntelligentTreeSelect.js |  2 --
 src/components/VirtualizedTreeSelect.js | 30 -------------------------
 2 files changed, 32 deletions(-)

diff --git a/src/components/IntelligentTreeSelect.js b/src/components/IntelligentTreeSelect.js
index 23dd335..690ab74 100644
--- a/src/components/IntelligentTreeSelect.js
+++ b/src/components/IntelligentTreeSelect.js
@@ -501,8 +501,6 @@ class IntelligentTreeSelect extends Component {
 
   render() {
     let listProps = {};
-    listProps.onScroll = this.props.onScroll || this._onScroll;
-    listProps.ref = this.select;
     const valueRenderer = this._valueRenderer;
     const propsToPass = Object.assign({}, this.props);
     delete propsToPass.valueRenderer;
diff --git a/src/components/VirtualizedTreeSelect.js b/src/components/VirtualizedTreeSelect.js
index fc31118..e596d78 100644
--- a/src/components/VirtualizedTreeSelect.js
+++ b/src/components/VirtualizedTreeSelect.js
@@ -277,7 +277,6 @@ class VirtualizedTreeSelect extends Component {
         getOptionValue={props.getOptionValue ? props.getOptionValue : (option) => option[props.valueKey]}
         components={{
           Option: optionRenderer,
-          Menu: Menu,
           MenuList: MenuList,
           MultiValueLabel: this.props.valueRenderer,
           SingleValue: this.props.valueRenderer,
@@ -341,35 +340,6 @@ class VirtualizedTreeSelect extends Component {
   }
 }
 
-// Wrapper for MenuList, it doesn't do anything, it is only needed for correct pass of the onScroll prop
-const Menu = (props) => {
-  return (
-    <components.Menu
-      {...props}
-      innerProps={{
-        ...props.innerProps,
-        onScrollCapture: (e) => {
-          props.selectProps.listProps.onScroll(e.target);
-        },
-        //Enables option selection even when input is not focused
-        onMouseEnter: (event) => {
-          if (event.button !== 0) {
-            return;
-          }
-          // Focus the Select component to enable keyboard navigation
-          if (props.selectProps.listProps.ref.current) {
-            props.selectProps.listProps.ref.current.focus();
-          }
-          event.stopPropagation();
-          event.preventDefault();
-        },
-      }}
-    >
-      {props.children}
-    </components.Menu>
-  );
-};
-
 // Component for efficient rendering
 const MenuList = (props) => {
   const {children} = props;