From 4ded26073f4b4c268e1412f057270610587de543 Mon Sep 17 00:00:00 2001
From: qichunren <whyruby@gmail.com>
Date: Sat, 19 Nov 2022 14:16:38 +0800
Subject: [PATCH] When mouse move on an option item, it should be selected.

---
 src/autocomplete.js | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/src/autocomplete.js b/src/autocomplete.js
index 126e930..00ddc98 100644
--- a/src/autocomplete.js
+++ b/src/autocomplete.js
@@ -30,6 +30,7 @@ export default class Autocomplete extends Controller {
     this.inputTarget.addEventListener("blur", this.onInputBlur)
     this.inputTarget.addEventListener("input", this.onInputChange)
     this.resultsTarget.addEventListener("mousedown", this.onResultsMouseDown)
+    this.resultsTarget.addEventListener("mouseover", this.onResultsMouseOver)
     this.resultsTarget.addEventListener("click", this.onResultsClick)
 
     if (this.inputTarget.hasAttribute("autofocus")) {
@@ -169,6 +170,12 @@ export default class Autocomplete extends Controller {
     }, { once: true })
   }
 
+  onResultsMouseOver = (event) => {
+    if (!(event.target instanceof Element)) return;
+    const selected = event.target.closest(optionSelector);
+    if (selected) this.select(selected);
+  }
+
   onInputChange = () => {
     this.element.removeAttribute("value")
     if (this.hasHiddenTarget) this.hiddenTarget.value = ""