From b95d7716e2ac8afb8a7e43be582ee125fbf76620 Mon Sep 17 00:00:00 2001
From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com>
Date: Mon, 22 Jul 2024 16:45:09 +0530
Subject: [PATCH] fix: editor focus after mentioning (#5187)

---
 .../editor/src/core/extensions/mentions/mentions-list.tsx  | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/packages/editor/src/core/extensions/mentions/mentions-list.tsx b/packages/editor/src/core/extensions/mentions/mentions-list.tsx
index 6ca6ba8eb..279567a20 100644
--- a/packages/editor/src/core/extensions/mentions/mentions-list.tsx
+++ b/packages/editor/src/core/extensions/mentions/mentions-list.tsx
@@ -146,10 +146,11 @@ export const MentionList = forwardRef((props: MentionListProps, ref) => {
         <div className="text-center text-custom-text-400">Loading...</div>
       ) : items.length ? (
         items.map((item, index) => (
-          <div
+          <button
             key={item.id}
+            type="button"
             className={cn(
-              "flex cursor-pointer items-center gap-2 rounded px-1 py-1.5 hover:bg-custom-background-80 text-custom-text-200",
+              "w-full text-left flex cursor-pointer items-center gap-2 rounded px-1 py-1.5 hover:bg-custom-background-80 text-custom-text-200",
               {
                 "bg-custom-background-80": index === selectedIndex,
               }
@@ -158,7 +159,7 @@ export const MentionList = forwardRef((props: MentionListProps, ref) => {
           >
             <Avatar name={item?.title} src={item?.avatar} />
             <span className="flex-grow truncate">{item.title}</span>
-          </div>
+          </button>
         ))
       ) : (
         <div className="text-center text-custom-text-400">No results</div>