/**
 * ConditionalContainer 컴포넌트 타입 정의
 * 제어 셀렉트박스 값에 따라 다른 UI를 표시하는 조건부 컨테이너
 */

import { ComponentData } from "@/types/screen";

export interface ConditionalSection {
  id: string; // 고유 ID
  condition: string; // 조건 값 (예: "customer_first", "quotation")
  label: string; // 조건 라벨 (예: "거래처 우선", "견적서 기반")
  screenId: number | null; // 이 조건일 때 표시할 화면 ID
  screenName?: string; // 화면 이름 (표시용)
}

export interface ConditionalContainerConfig {
  // 제어 셀렉트박스 설정
  controlField: string; // 제어할 필드명 (예: "inputMode")
  controlLabel: string; // 셀렉트박스 라벨 (예: "입력 방식")
  
  // 조건별 섹션
  sections: ConditionalSection[];
  
  // 기본 선택 값
  defaultValue?: string;
  
  // 스타일
  showBorder?: boolean; // 섹션별 테두리 표시
  spacing?: "tight" | "normal" | "loose"; // 섹션 간격
}

export interface ConditionalContainerProps {
  config?: ConditionalContainerConfig;
  
  // 개별 props (config 우선)
  controlField?: string;
  controlLabel?: string;
  sections?: ConditionalSection[];
  defaultValue?: string;
  showBorder?: boolean;
  spacing?: "tight" | "normal" | "loose";
  
  // 폼 데이터 연동
  value?: any; // 현재 선택된 값
  onChange?: (value: string) => void;
  formData?: Record<string, any>;
  onFormDataChange?: (fieldName: string, value: any) => void;
  groupedData?: Record<string, any>[]; // 🆕 그룹 데이터 (EditModal → ModalRepeaterTable)
  onSave?: () => Promise<void>; // 🆕 EditModal의 handleSave 콜백
  initialData?: Record<string, any>; // 🆕 수정 모드: 초기 데이터 (발주일, 담당자, 메모 등)
  
  // 화면 편집기 관련
  isDesignMode?: boolean; // 디자인 모드 여부
  onUpdateComponent?: (componentId: string, updates: Partial<ComponentData>) => void;
  onDeleteComponent?: (componentId: string) => void;
  onSelectComponent?: (componentId: string) => void;
  selectedComponentId?: string;
  
  // 높이 변화 알림 (아래 컴포넌트 재배치용)
  onHeightChange?: (newHeight: number) => void;
  componentId?: string; // 자신의 컴포넌트 ID
  
  // 스타일
  style?: React.CSSProperties;
  className?: string;
}

// 조건부 섹션 뷰어 Props
export interface ConditionalSectionViewerProps {
  sectionId: string;
  condition: string;
  label: string;
  screenId: number | null; // 표시할 화면 ID
  screenName?: string; // 화면 이름
  isActive: boolean; // 현재 조건이 활성화되어 있는지
  isDesignMode: boolean;
  showBorder?: boolean;
  // 폼 데이터 전달
  formData?: Record<string, any>;
  onFormDataChange?: (fieldName: string, value: any) => void;
  groupedData?: Record<string, any>[]; // 🆕 그룹 데이터
  onSave?: () => Promise<void>; // 🆕 EditModal의 handleSave 콜백
  // 🆕 조건부 컨테이너 정보 (자식 화면에 전달)
  controlField?: string; // 제어 필드명 (예: "inbound_type")
  selectedCondition?: string; // 현재 선택된 조건 값 (예: "PURCHASE_IN")
  // 🆕 수정 모드: 초기 데이터 전달 (발주일, 담당자, 메모 등)
  initialData?: Record<string, any>;
}

