From 4908fa419589049dbebebe3d1972f6516adc6f6a Mon Sep 17 00:00:00 2001 From: waleed Date: Wed, 1 Jul 2026 10:30:36 -0700 Subject: [PATCH 1/2] fix(custom-tool): restore modal body scroll so Save stays reachable The Edit/Create Agent Tool modal clipped its footer (Save/Update) and could not scroll with long code or schema content. Root cause: #4354 migrated the modal to ChipModal and changed the body from a scroll region (flex-1 overflow-y-auto) to flex-none overflow-visible so the hand-positioned EnvVar/Tag autocompletes could spill past it. That removed the scroll region, so tall content grew the body past the modal's max-h-[84vh] cap and the overflow-hidden surface clipped the footer. Restore ChipModalBody as the scroll region (its documented behavior) and switch the EnvVar/Tag dropdowns to portaled inputRef caret-anchoring, matching the canonical Function-block editor, so they anchor to the caret in a portal and are never clipped by the scroll boundary. --- .../custom-tool-modal/custom-tool-modal.tsx | 29 +++++++++---------- 1 file changed, 14 insertions(+), 15 deletions(-) diff --git a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/tool-input/components/custom-tool-modal/custom-tool-modal.tsx b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/tool-input/components/custom-tool-modal/custom-tool-modal.tsx index 0dca34ea4ce..4ab995b66e8 100644 --- a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/tool-input/components/custom-tool-modal/custom-tool-modal.tsx +++ b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/tool-input/components/custom-tool-modal/custom-tool-modal.tsx @@ -832,12 +832,13 @@ try { {/* - flex-none + overflow-visible opt this body out of the chrome's - scroll container: the caret-anchored EnvVar/Tag autocomplete - dropdowns are absolute-positioned inside it and must spill past - the body's bounds rather than clip against a scroll boundary. + The body is the scroll region so tall schema/code content stays inside + the modal and the footer (Next/Save) is always reachable. The EnvVar, + Tag, and schema-param autocompletes anchor to the textarea caret and + render in portaled popovers, so they aren't clipped by this scroll + boundary — see the `inputRef` wiring below. */} - + )} @@ -1066,11 +1066,10 @@ try { setShowTags(false) setActiveSourceBlockId(null) }} - className='w-64' - style={{ - position: 'absolute', - top: `${dropdownPosition.top}px`, - left: `${dropdownPosition.left}px`, + inputRef={{ + current: codeEditorRef.current?.querySelector( + 'textarea' + ) as HTMLTextAreaElement, }} /> )} From d90dde91d27a261ef2928bcd04046954e7d367a5 Mon Sep 17 00:00:00 2001 From: waleed Date: Wed, 1 Jul 2026 10:38:45 -0700 Subject: [PATCH 2/2] fix(custom-tool): keep dropdown anchors content-relative on body scroll Review follow-up. The autocomplete popovers already portal their menus (never clipped by the body's scroll boundary), so the fix is only to restore the body as the scroll region. Reverting the dropdowns to their content-relative absolute anchors keeps them glued to the caret while the body scrolls; the caret-viewport inputRef anchoring used fixed viewport coordinates that only refreshed on edits, detaching the menu on scroll. --- .../custom-tool-modal/custom-tool-modal.tsx | 25 +++++++++++-------- 1 file changed, 14 insertions(+), 11 deletions(-) diff --git a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/tool-input/components/custom-tool-modal/custom-tool-modal.tsx b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/tool-input/components/custom-tool-modal/custom-tool-modal.tsx index 4ab995b66e8..ab399baa0de 100644 --- a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/tool-input/components/custom-tool-modal/custom-tool-modal.tsx +++ b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/tool-input/components/custom-tool-modal/custom-tool-modal.tsx @@ -834,9 +834,10 @@ try { {/* The body is the scroll region so tall schema/code content stays inside the modal and the footer (Next/Save) is always reachable. The EnvVar, - Tag, and schema-param autocompletes anchor to the textarea caret and - render in portaled popovers, so they aren't clipped by this scroll - boundary — see the `inputRef` wiring below. + Tag, and schema-param autocompletes render their menus in portaled + popovers (never clipped by this scroll boundary) and anchor to a + caret-positioned element inside the editor wrapper, so the menus track + the caret as the body scrolls. */} )} @@ -1066,10 +1068,11 @@ try { setShowTags(false) setActiveSourceBlockId(null) }} - inputRef={{ - current: codeEditorRef.current?.querySelector( - 'textarea' - ) as HTMLTextAreaElement, + className='w-64' + style={{ + position: 'absolute', + top: `${dropdownPosition.top}px`, + left: `${dropdownPosition.left}px`, }} /> )}