From 9b8cdab1231d325bcdc3897ab13a5269dfbddf14 Mon Sep 17 00:00:00 2001
From: Alex Khomenko <Clarity-89@users.noreply.github.com>
Date: Thu, 5 May 2022 13:37:04 +0300
Subject: [PATCH] TagsInput: Do not trigger submit on Enter (#48743)

* TagsInput: Do not trigger submit on Enter

* Comment
---
 packages/grafana-ui/src/components/TagsInput/TagsInput.tsx | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/packages/grafana-ui/src/components/TagsInput/TagsInput.tsx b/packages/grafana-ui/src/components/TagsInput/TagsInput.tsx
index 5e1246e09a3..017b1bc8364 100644
--- a/packages/grafana-ui/src/components/TagsInput/TagsInput.tsx
+++ b/packages/grafana-ui/src/components/TagsInput/TagsInput.tsx
@@ -85,6 +85,13 @@ export const TagsInput: FC<Props> = ({
           onChange={onNameChange}
           value={newTagName}
           onKeyUp={onKeyboardAdd}
+          onKeyDown={(e) => {
+            // onKeyDown is triggered before onKeyUp, triggering submit behaviour on Enter press if this component
+            // is used inside forms. Moving onKeyboardAdd callback here doesn't work since text input is not captured in onKeyDown
+            if (e.key === 'Enter') {
+              e.preventDefault();
+            }
+          }}
           onBlur={onBlur}
           invalid={invalid}
           suffix={