From 29e1ed5f288b5bf4dd44f30debbb3987fbe2206a Mon Sep 17 00:00:00 2001
From: "bojie.hbj" <1119302165@qq.com>
Date: Wed, 6 May 2026 00:46:18 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E8=AE=BE=E8=AE=A1?=
 =?UTF-8?q?=E6=96=87=E4=BB=B6=E5=88=97=E8=A1=A8=E8=A1=8C=E8=8F=9C=E5=8D=95?=
 =?UTF-8?q?=E8=A2=AB=E8=A3=81=E5=89=AA=E7=9A=84=E9=97=AE=E9=A2=98=20(#561)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/web/src/components/DesignFilesPanel.tsx | 26 ++++++++++++++++++--
 1 file changed, 24 insertions(+), 2 deletions(-)

diff --git a/apps/web/src/components/DesignFilesPanel.tsx b/apps/web/src/components/DesignFilesPanel.tsx
index 67221d15c..c9b2d8905 100644
--- a/apps/web/src/components/DesignFilesPanel.tsx
+++ b/apps/web/src/components/DesignFilesPanel.tsx
@@ -61,6 +61,8 @@ export function DesignFilesPanel({
   const dragDepthRef = useRef(0);
   const [hover, setHover] = useState<string | null>(null);
   const [menuPos, setMenuPos] = useState<{ name: string; top: number; left: number } | null>(null);
+  const MENU_ESTIMATED_HEIGHT = 115;
+  const MENU_SAFE_PADDING = 8;
   const [preview, setPreview] = useState<string | null>(null);
   const [sectionLimits, setSectionLimits] = useState<Partial<Record<Section, number>>>({});
   const [isSectionExpansionPending, startSectionExpansion] = useTransition();
@@ -379,10 +381,30 @@ export function DesignFilesPanel({
                             const rect = (e.target as HTMLElement)
                               .closest('.df-row-menu')
                               ?.getBoundingClientRect();
+                            if (!rect) return;
+                            
+                            const viewportHeight = window.innerHeight;
+                            const spaceBelow = viewportHeight - rect.bottom;
+                            const spaceAbove = rect.top;
+                            
+                            let top: number;
+                            if (spaceBelow >= MENU_ESTIMATED_HEIGHT + MENU_SAFE_PADDING) {
+                              top = rect.bottom + 4;
+                            } else if (spaceAbove >= MENU_ESTIMATED_HEIGHT + MENU_SAFE_PADDING) {
+                              top = rect.top - MENU_ESTIMATED_HEIGHT - 4;
+                            } else {
+                              top = Math.max(
+                                MENU_SAFE_PADDING,
+                                viewportHeight - MENU_ESTIMATED_HEIGHT - MENU_SAFE_PADDING,
+                              );
+                            }
+                            
+                            const left = Math.max(MENU_SAFE_PADDING, rect.right - 160);
+                            
                             setMenuPos({
                               name: f.name,
-                              top: (rect?.bottom ?? 0) + 4,
-                              left: (rect?.right ?? 0) - 160,
+                              top,
+                              left,
                             });
                           }}
                         >