From 2a4666bb89421ffce9b6c98b83ac8a1f1ccc1338 Mon Sep 17 00:00:00 2001
From: shrimbly <falloon.willie@gmail.com>
Date: Tue, 3 Mar 2026 20:42:49 +1300
Subject: [PATCH] fix: resolve clipped handles on full-bleed nodes

Use overflow-visible instead of overflow-clip for fullBleed nodes so
handle circles and labels extend beyond the node boundary. Add
overflow-hidden rounded-lg to image/video content containers to
preserve rounded corners on media.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/components/nodes/BaseNode.tsx          | 2 +-
 src/components/nodes/GenerateImageNode.tsx | 2 +-
 src/components/nodes/GenerateVideoNode.tsx | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/nodes/BaseNode.tsx b/src/components/nodes/BaseNode.tsx
index 6958818c..1cea947c 100644
--- a/src/components/nodes/BaseNode.tsx
+++ b/src/components/nodes/BaseNode.tsx
@@ -74,7 +74,7 @@ export function BaseNode({
       />
       <div
         className={`
-          h-full w-full flex flex-col overflow-clip
+          h-full w-full flex flex-col ${fullBleed ? "overflow-visible" : "overflow-clip"}
           ${fullBleed ? "rounded-lg" : "bg-neutral-800 rounded-lg shadow-lg border"}
           ${fullBleed ? "" : (isCurrentlyExecuting || isExecuting ? "border-blue-500 ring-1 ring-blue-500/20" : "border-neutral-700/60")}
           ${fullBleed ? "" : (hasError ? "border-red-500" : "")}
diff --git a/src/components/nodes/GenerateImageNode.tsx b/src/components/nodes/GenerateImageNode.tsx
index 9168a829..fd6d0eb7 100644
--- a/src/components/nodes/GenerateImageNode.tsx
+++ b/src/components/nodes/GenerateImageNode.tsx
@@ -551,7 +551,7 @@ export function GenerateImageNode({ id, data, selected }: NodeProps<NanoBananaNo
         Image
       </div>
 
-      <div className="relative w-full h-full min-h-0">
+      <div className="relative w-full h-full min-h-0 overflow-hidden rounded-lg">
         {/* Preview area */}
         {nodeData.outputImage ? (
           <>
diff --git a/src/components/nodes/GenerateVideoNode.tsx b/src/components/nodes/GenerateVideoNode.tsx
index c8800163..0925fbce 100644
--- a/src/components/nodes/GenerateVideoNode.tsx
+++ b/src/components/nodes/GenerateVideoNode.tsx
@@ -609,7 +609,7 @@ export function GenerateVideoNode({ id, data, selected }: NodeProps<GenerateVide
         Video
       </div>
 
-      <div className="relative w-full h-full min-h-0">
+      <div className="relative w-full h-full min-h-0 overflow-hidden rounded-lg">
         {/* Preview area */}
         {nodeData.outputVideo ? (
           <>