diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/ComponentSettingsPanel.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/ComponentSettingsPanel.svelte
index 400bafa588..7eb71ac826 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/ComponentSettingsPanel.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/ComponentSettingsPanel.svelte
@@ -14,6 +14,7 @@
   } from "builderStore/dataBinding"
   import { ActionButton } from "@budibase/bbui"
   import { capitalise } from "helpers"
+  import { lowerCase } from "lodash"
 
   const onUpdateName = async value => {
     try {
@@ -55,12 +56,14 @@
           value={title}
           {title}
           placeholder={getComponentText(componentInstance)}
-          on:change={e => {
-            onUpdateName(e.target.value)
-            if (e.target === document.activeElement) {
+          on:keypress={e => {
+            if (e.key.toLowerCase() === "enter") {
               e.target.blur()
             }
           }}
+          on:change={e => {
+            onUpdateName(e.target.value)
+          }}
         />
       </span>
       <span slot="panel-header-content">