From 1b67ba6a75f39427ccffae6211ebfc5f992242c3 Mon Sep 17 00:00:00 2001
From: neo773 <62795688+neo773@users.noreply.github.com>
Date: Mon, 2 Mar 2026 16:34:30 +0530
Subject: [PATCH] Draft emails fix onblur on text input and callout banner
 component overflow (#18310)

Before

<img width="396" height="759" alt="SCR-20260301-daft"
src="https://github.com/user-attachments/assets/c3fb3a19-3456-424d-9fd2-dd13ed0d2ad5"
/>

After

<img width="391" height="752" alt="SCR-20260301-daio"
src="https://github.com/user-attachments/assets/80a64991-6e69-4ddf-b968-bdc788af02cd"
/>
---
 .../ui/form-types/hooks/useMultiItemFieldEditor.ts         | 7 +++++++
 .../utils/__tests__/mergeWorkflowDiagrams.test.ts          | 2 ++
 .../workflow-diagram/utils/mergeWorkflowDiagrams.ts        | 5 ++++-
 packages/twenty-ui/src/display/callout/Callout.tsx         | 1 -
 4 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/form-types/hooks/useMultiItemFieldEditor.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/form-types/hooks/useMultiItemFieldEditor.ts
index e5ded5ec6f..6b99770a56 100644
--- a/packages/twenty-front/src/modules/object-record/record-field/ui/form-types/hooks/useMultiItemFieldEditor.ts
+++ b/packages/twenty-front/src/modules/object-record/record-field/ui/form-types/hooks/useMultiItemFieldEditor.ts
@@ -149,6 +149,13 @@ export const useMultiItemFieldEditor = ({
     onUpdate: ({ editor }) => {
       onUpdate(editor);
     },
+    onBlur: ({ editor }) => {
+      const textBefore = getTextBeforeCursor(editor);
+
+      if (textBefore.trim().length > 0) {
+        convertTextToTag(editor, textBefore);
+      }
+    },
     enableInputRules: false,
     enablePasteRules: false,
     injectCSS: false,
diff --git a/packages/twenty-front/src/modules/workflow/workflow-diagram/utils/__tests__/mergeWorkflowDiagrams.test.ts b/packages/twenty-front/src/modules/workflow/workflow-diagram/utils/__tests__/mergeWorkflowDiagrams.test.ts
index 0a882417ae..6ecd4c1812 100644
--- a/packages/twenty-front/src/modules/workflow/workflow-diagram/utils/__tests__/mergeWorkflowDiagrams.test.ts
+++ b/packages/twenty-front/src/modules/workflow/workflow-diagram/utils/__tests__/mergeWorkflowDiagrams.test.ts
@@ -56,6 +56,7 @@ it('Preserves the properties defined in the previous version but not in the next
         "stepId": "",
       },
       "id": "1",
+      "measured": undefined,
       "position": {
         "x": 0,
         "y": 0,
@@ -121,6 +122,7 @@ it('Replaces duplicated properties with the next value', () => {
         "stepId": "",
       },
       "id": "1",
+      "measured": undefined,
       "position": {
         "x": 0,
         "y": 0,
diff --git a/packages/twenty-front/src/modules/workflow/workflow-diagram/utils/mergeWorkflowDiagrams.ts b/packages/twenty-front/src/modules/workflow/workflow-diagram/utils/mergeWorkflowDiagrams.ts
index 3bfb9105ba..196a990d78 100644
--- a/packages/twenty-front/src/modules/workflow/workflow-diagram/utils/mergeWorkflowDiagrams.ts
+++ b/packages/twenty-front/src/modules/workflow/workflow-diagram/utils/mergeWorkflowDiagrams.ts
@@ -3,7 +3,10 @@ import {
   type WorkflowDiagramNode,
 } from '@/workflow/workflow-diagram/types/WorkflowDiagram';
 
-const nodePropertiesToPreserve: Array<keyof WorkflowDiagramNode> = ['selected'];
+const nodePropertiesToPreserve: Array<keyof WorkflowDiagramNode> = [
+  'selected',
+  'measured',
+];
 
 export const mergeWorkflowDiagrams = (
   previousDiagram: WorkflowDiagram,
diff --git a/packages/twenty-ui/src/display/callout/Callout.tsx b/packages/twenty-ui/src/display/callout/Callout.tsx
index 5f816cc330..dacc3be4af 100644
--- a/packages/twenty-ui/src/display/callout/Callout.tsx
+++ b/packages/twenty-ui/src/display/callout/Callout.tsx
@@ -44,7 +44,6 @@ const StyledCalloutContainer = styled.div<{
   flex-direction: column;
   gap: ${themeCssVariables.spacing[2]};
   max-width: 512px;
-  overflow: hidden;
   padding: ${themeCssVariables.spacing[3]} ${themeCssVariables.spacing[3]}
     ${themeCssVariables.spacing[2]};
   width: 100%;