// 레이아웃 관련 타입 정의

// 레이아웃 타입
export type LayoutType =
  | "grid"
  | "flexbox"
  | "split"
  | "card"
  | "tabs"
  | "accordion"
  | "sidebar"
  | "header-footer"
  | "three-column"
  | "dashboard"
  | "form"
  | "table"
  | "custom";

// 레이아웃 카테고리
export type LayoutCategory =
  | "basic"
  | "form"
  | "table"
  | "dashboard"
  | "navigation"
  | "content"
  | "business";

// 레이아웃 존 정의
export interface LayoutZone {
  id: string;
  name: string;
  position: {
    row?: number;
    column?: number;
    x?: number;
    y?: number;
  };
  size: {
    width: number | string;
    height: number | string;
    minWidth?: number;
    minHeight?: number;
    maxWidth?: number;
    maxHeight?: number;
  };
  style?: Record<string, any>;
  allowedComponents?: string[];
  isResizable?: boolean;
  isRequired?: boolean;
}

// 레이아웃 설정
export interface LayoutConfig {
  grid?: {
    rows: number;
    columns: number;
    gap: number;
    rowGap?: number;
    columnGap?: number;
    autoRows?: string;
    autoColumns?: string;
  };

  flexbox?: {
    direction: "row" | "column" | "row-reverse" | "column-reverse";
    justify:
      | "flex-start"
      | "flex-end"
      | "center"
      | "space-between"
      | "space-around"
      | "space-evenly";
    align: "flex-start" | "flex-end" | "center" | "stretch" | "baseline";
    wrap: "nowrap" | "wrap" | "wrap-reverse";
    gap: number;
  };

  split?: {
    direction: "horizontal" | "vertical";
    ratio: number[];
    minSize: number[];
    resizable: boolean;
    splitterSize: number;
  };

  tabs?: {
    position: "top" | "bottom" | "left" | "right";
    variant: "default" | "pills" | "underline";
    size: "sm" | "md" | "lg";
    defaultTab: string;
    closable: boolean;
  };

  accordion?: {
    multiple: boolean;
    defaultExpanded: string[];
    collapsible: boolean;
  };

  sidebar?: {
    position: "left" | "right";
    width: number | string;
    collapsible: boolean;
    collapsed: boolean;
    overlay: boolean;
  };

  headerFooter?: {
    headerHeight: number | string;
    footerHeight: number | string;
    stickyHeader: boolean;
    stickyFooter: boolean;
  };

  dashboard?: {
    columns: number;
    rowHeight: number;
    margin: [number, number];
    padding: [number, number];
    isDraggable: boolean;
    isResizable: boolean;
  };

  custom?: {
    cssProperties: Record<string, string>;
    className: string;
    template: string;
  };
}

// 레이아웃 표준 정의
export interface LayoutStandard {
  layoutCode: string;
  layoutName: string;
  layoutNameEng?: string;
  description?: string;
  layoutType: LayoutType;
  category: LayoutCategory;
  iconName?: string;
  defaultSize?: { width: number; height: number };
  layoutConfig: LayoutConfig;
  zonesConfig: LayoutZone[];
  previewImage?: string;
  sortOrder?: number;
  isActive?: string;
  isPublic?: string;
  companyCode: string;
  createdDate?: Date;
  createdBy?: string;
  updatedDate?: Date;
  updatedBy?: string;
}

// 레이아웃 생성 요청
export interface CreateLayoutRequest {
  layoutName: string;
  layoutNameEng?: string;
  description?: string;
  layoutType: LayoutType;
  category: LayoutCategory;
  iconName?: string;
  defaultSize?: { width: number; height: number };
  layoutConfig: LayoutConfig;
  zonesConfig: LayoutZone[];
  isPublic?: boolean;
}

// 레이아웃 수정 요청
export interface UpdateLayoutRequest extends Partial<CreateLayoutRequest> {
  layoutCode: string;
}

// 레이아웃 목록 조회 요청
export interface GetLayoutsRequest {
  page?: number;
  size?: number;
  category?: LayoutCategory;
  layoutType?: LayoutType;
  searchTerm?: string;
  includePublic?: boolean;
}

// 레이아웃 목록 응답
export interface GetLayoutsResponse {
  data: LayoutStandard[];
  total: number;
  page: number;
  size: number;
  totalPages: number;
}

// 레이아웃 복제 요청
export interface DuplicateLayoutRequest {
  layoutCode: string;
  newName: string;
}

