From 828d686872356b7358856bd55c050a5eb1a5f847 Mon Sep 17 00:00:00 2001
From: Marcos <59671002+Knamer95@users.noreply.github.com>
Date: Thu, 27 Jun 2024 14:07:04 +0200
Subject: [PATCH] [@mantine/core] TagsInput: Fix `onChange` being called twice
 when Enter key is pressed in some cases (#6416)

Previously, when you selected an option from the dropdown with the arrow keys + Enter key, it would cause the onChange to fire twice if there was a search on the input.
---
 .../core/src/components/TagsInput/TagsInput.tsx       | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/packages/@mantine/core/src/components/TagsInput/TagsInput.tsx b/packages/@mantine/core/src/components/TagsInput/TagsInput.tsx
index 28330b1fff5..70c22676070 100644
--- a/packages/@mantine/core/src/components/TagsInput/TagsInput.tsx
+++ b/packages/@mantine/core/src/components/TagsInput/TagsInput.tsx
@@ -285,6 +285,15 @@ export const TagsInput = factory<TagsInputFactory>((_props, ref) => {
 
     if (event.key === 'Enter' && length > 0 && !event.nativeEvent.isComposing) {
       event.preventDefault();
+
+      const hasActiveSelection = !!document.querySelector<HTMLDivElement>(
+        `#${combobox.listId} [data-combobox-option][data-combobox-selected]`
+      );
+
+      if (hasActiveSelection) {
+        return;
+      }
+
       handleValueSelect(inputValue);
     }
 
@@ -362,6 +371,8 @@ export const TagsInput = factory<TagsInputFactory>((_props, ref) => {
           onOptionSubmit?.(val);
           setSearchValue('');
           _value.length < maxTags! && setValue([..._value, optionsLockup[val].label]);
+
+          combobox.resetSelectedOption();
         }}
         {...comboboxProps}
       >