리포트 저장 구현

frontend/components/report/designer/CanvasComponent.tsx

@@ -47,6 +47,8 @@ export function CanvasComponent({ component }: CanvasComponentProps) {
 
   // 마우스 이동 핸들러 (전역)
   useEffect(() => {
+    if (!isDragging && !isResizing) return;
+
     const handleMouseMove = (e: MouseEvent) => {
       if (isDragging) {
         const newX = Math.max(0, e.clientX - dragStart.x);
@@ -66,15 +68,25 @@ export function CanvasComponent({ component }: CanvasComponentProps) {
       setIsResizing(false);
     };
 
-    if (isDragging || isResizing) {
-      document.addEventListener("mousemove", handleMouseMove);
-      document.addEventListener("mouseup", handleMouseUp);
-      return () => {
-        document.removeEventListener("mousemove", handleMouseMove);
-        document.removeEventListener("mouseup", handleMouseUp);
-      };
-    }
-  }, [isDragging, isResizing, dragStart, resizeStart, component.id, updateComponent]);
+    document.addEventListener("mousemove", handleMouseMove);
+    document.addEventListener("mouseup", handleMouseUp);
+
+    return () => {
+      document.removeEventListener("mousemove", handleMouseMove);
+      document.removeEventListener("mouseup", handleMouseUp);
+    };
+  }, [
+    isDragging,
+    isResizing,
+    dragStart.x,
+    dragStart.y,
+    resizeStart.x,
+    resizeStart.y,
+    resizeStart.width,
+    resizeStart.height,
+    component.id,
+    updateComponent,
+  ]);
 
   // 표시할 값 결정
   const getDisplayValue = (): string => {