행 이동 화면 할당한 상황에서도 가능하게, 코드병합 버튼액션에 추가

frontend/components/screen/RealtimePreview.tsx

@@ -63,6 +63,10 @@ interface RealtimePreviewProps {
   children?: React.ReactNode; // 그룹 내 자식 컴포넌트들
   // 플로우 선택 데이터 전달용
   onFlowSelectedDataChange?: (selectedData: any[], stepId: number | null) => void;
+  // 테이블 정렬 정보 전달용
+  sortBy?: string;
+  sortOrder?: "asc" | "desc";
+  [key: string]: any; // 추가 props 허용
 }
 
 // 영역 레이아웃에 따른 아이콘 반환
@@ -225,6 +229,9 @@ export const RealtimePreviewDynamic: React.FC<RealtimePreviewProps> = ({
   onGroupToggle,
   children,
   onFlowSelectedDataChange,
+  sortBy,
+  sortOrder,
+  ...restProps
 }) => {
   const { user } = useAuth();
   const { type, id, position, size, style = {} } = component;
@@ -545,7 +552,13 @@ export const RealtimePreviewDynamic: React.FC<RealtimePreviewProps> = ({
         {/* 위젯 타입 - 동적 렌더링 (파일 컴포넌트 제외) */}
         {type === "widget" && !isFileComponent(component) && (
           <div className="pointer-events-none h-full w-full">
-            <WidgetRenderer component={component} isDesignMode={isDesignMode} />
+            <WidgetRenderer 
+              component={component} 
+              isDesignMode={isDesignMode}
+              sortBy={sortBy}
+              sortOrder={sortOrder}
+              {...restProps}
+            />
           </div>
         )}
 

frontend/components/screen/RealtimePreviewDynamic.tsx

@@ -54,6 +54,11 @@ interface RealtimePreviewProps {
   // 폼 데이터 관련 props
   formData?: Record<string, any>;
   onFormDataChange?: (fieldName: string, value: any) => void;
+  
+  // 테이블 정렬 정보
+  sortBy?: string;
+  sortOrder?: "asc" | "desc";
+  columnOrder?: string[];
 }
 
 // 동적 위젯 타입 아이콘 (레지스트리에서 조회)
@@ -109,6 +114,9 @@ export const RealtimePreviewDynamic: React.FC<RealtimePreviewProps> = ({
   onFlowSelectedDataChange,
   refreshKey,
   onRefresh,
+  sortBy,
+  sortOrder,
+  columnOrder,
   flowRefreshKey,
   onFlowRefresh,
   formData,
@@ -395,6 +403,9 @@ export const RealtimePreviewDynamic: React.FC<RealtimePreviewProps> = ({
           onFlowRefresh={onFlowRefresh}
           formData={formData}
           onFormDataChange={onFormDataChange}
+          sortBy={sortBy}
+          sortOrder={sortOrder}
+          columnOrder={columnOrder}
         />
       </div>
 

frontend/components/screen/config-panels/ButtonConfigPanel.tsx

@@ -270,6 +270,7 @@ export const ButtonConfigPanel: React.FC<ButtonConfigPanelProps> = ({
             <SelectItem value="excel_download">엑셀 다운로드</SelectItem>
             <SelectItem value="excel_upload">엑셀 업로드</SelectItem>
             <SelectItem value="barcode_scan">바코드 스캔</SelectItem>
+            <SelectItem value="code_merge">코드 병합</SelectItem>
           </SelectContent>
         </Select>
       </div>
@@ -838,6 +839,53 @@ export const ButtonConfigPanel: React.FC<ButtonConfigPanelProps> = ({
         </div>
       )}
 
+      {/* 코드 병합 액션 설정 */}
+      {(component.componentConfig?.action?.type || "save") === "code_merge" && (
+        <div className="mt-4 space-y-4 rounded-lg border bg-muted/50 p-4">
+          <h4 className="text-sm font-medium text-foreground">🔀 코드 병합 설정</h4>
+
+          <div>
+            <Label htmlFor="merge-column-name">
+              병합할 컬럼명 <span className="text-destructive">*</span>
+            </Label>
+            <Input
+              id="merge-column-name"
+              placeholder="예: item_code, product_id"
+              value={config.action?.mergeColumnName || ""}
+              onChange={(e) => onUpdateProperty("componentConfig.action.mergeColumnName", e.target.value)}
+              className="h-8 text-xs"
+            />
+            <p className="mt-1 text-xs text-muted-foreground">
+              병합할 컬럼명 (예: item_code). 이 컬럼이 있는 모든 테이블에 병합이 적용됩니다.
+            </p>
+          </div>
+
+          <div className="flex items-center justify-between">
+            <div className="space-y-0.5">
+              <Label htmlFor="merge-show-preview">병합 전 미리보기</Label>
+              <p className="text-xs text-muted-foreground">영향받을 테이블과 행 수를 미리 확인합니다</p>
+            </div>
+            <Switch
+              id="merge-show-preview"
+              checked={config.action?.mergeShowPreview !== false}
+              onCheckedChange={(checked) => onUpdateProperty("componentConfig.action.mergeShowPreview", checked)}
+            />
+          </div>
+
+          <div className="rounded-md bg-blue-50 p-3 dark:bg-blue-950">
+            <p className="text-xs text-blue-900 dark:text-blue-100">
+              <strong>사용 방법:</strong>
+              <br />
+              1. 테이블에서 병합할 두 개의 행을 선택합니다
+              <br />
+              2. 이 버튼을 클릭하면 병합 방향을 선택할 수 있습니다
+              <br />
+              3. 데이터는 삭제되지 않고, 컬럼 값만 변경됩니다
+            </p>
+          </div>
+        </div>
+      )}
+
       {/* 제어 기능 섹션 */}
       <div className="mt-8 border-t border-border pt-6">
         <ImprovedButtonControlConfigPanel component={component} onUpdateProperty={onUpdateProperty} />