From 5afe5fe4e7f09aa121648e5bda33620f27ef1af6 Mon Sep 17 00:00:00 2001
From: Jonathan Duarte <jonathan.duarte@rocketmail.com>
Date: Sat, 23 Mar 2024 20:32:41 +0100
Subject: [PATCH] fix: "Enter" keypress when using ExternalInput together with
 ArrayFields

Closes #345

ExternalInput and ArrayFields have button elements which assumed
the default type "submit". This causes the buttons to be automatically
triggered when "Enter" keypress happens on other inputs of the form.

Setting their type as "button" instead, fixes the behaviour.
---
 packages/core/components/ExternalInput/index.tsx                | 1 +
 .../core/components/InputOrGroup/fields/ArrayField/index.tsx    | 2 ++
 2 files changed, 3 insertions(+)

diff --git a/packages/core/components/ExternalInput/index.tsx b/packages/core/components/ExternalInput/index.tsx
index 5e8181a1f6..3d3a09453c 100644
--- a/packages/core/components/ExternalInput/index.tsx
+++ b/packages/core/components/ExternalInput/index.tsx
@@ -96,6 +96,7 @@ export const ExternalInput = ({
     >
       <div className={getClassName("actions")}>
         <button
+          type="button"
           onClick={() => setOpen(true)}
           className={getClassName("button")}
         >
diff --git a/packages/core/components/InputOrGroup/fields/ArrayField/index.tsx b/packages/core/components/InputOrGroup/fields/ArrayField/index.tsx
index 31d416a368..8e102fa16c 100644
--- a/packages/core/components/InputOrGroup/fields/ArrayField/index.tsx
+++ b/packages/core/components/InputOrGroup/fields/ArrayField/index.tsx
@@ -205,6 +205,7 @@ export const ArrayField = ({
                                 <div className={getClassNameItem("actions")}>
                                   <div className={getClassNameItem("action")}>
                                     <IconButton
+                                      type="button"
                                       disabled={
                                         field.min !== undefined &&
                                         field.min >=
@@ -292,6 +293,7 @@ export const ArrayField = ({
                 {provided.placeholder}
 
                 <button
+                  type="button"
                   className={getClassName("addButton")}
                   disabled={
                     field.max !== undefined &&