"use client";

import { createComponentDefinition } from "../../utils/createComponentDefinition";
import { ComponentCategory } from "@/types/component";
import { LocationSwapSelectorComponent } from "./LocationSwapSelectorComponent";
import { V2LocationSwapSelectorConfigPanel as LocationSwapSelectorConfigPanel } from "@/components/v2/config-panels/V2LocationSwapSelectorConfigPanel";

/**
 * LocationSwapSelector 컴포넌트 정의
 * 출발지/도착지 선택 및 교환 기능을 제공하는 컴포넌트
 */
export const V2LocationSwapSelectorDefinition = createComponentDefinition({
  id: "v2-location-swap-selector",
  name: "출발지/도착지 선택",
  nameEng: "Location Swap Selector",
  description: "출발지와 도착지를 선택하고 교환할 수 있는 컴포넌트 (모바일 최적화)",
  category: ComponentCategory.INPUT,
  webType: "form",
  component: LocationSwapSelectorComponent,
  defaultConfig: {
    // 데이터 소스 설정
    dataSource: {
      type: "static", // "table" | "code" | "static"
      tableName: "", // 장소 테이블명
      valueField: "location_code", // 값 필드
      labelField: "location_name", // 표시 필드
      codeCategory: "", // 코드 관리 카테고리 (type이 "code"일 때)
      staticOptions: [
        { value: "포항", label: "포항" },
        { value: "광양", label: "광양" },
      ], // 정적 옵션 (type이 "static"일 때) - 한글로 저장
    },
    // 필드 매핑
    departureField: "departure", // 출발지 저장 필드
    destinationField: "destination", // 도착지 저장 필드
    departureLabelField: "departure_name", // 출발지명 저장 필드 (선택)
    destinationLabelField: "destination_name", // 도착지명 저장 필드 (선택)
    // UI 설정
    departureLabel: "출발지",
    destinationLabel: "도착지",
    showSwapButton: true,
    swapButtonPosition: "center", // "center" | "right"
    // 스타일
    variant: "card", // "card" | "inline" | "minimal"
  },
  defaultSize: { width: 400, height: 100 },
  configPanel: LocationSwapSelectorConfigPanel,
  icon: "ArrowLeftRight",
  tags: ["출발지", "도착지", "교환", "스왑", "위치", "모바일"],
  version: "1.0.0",
  author: "개발팀",
});

// 컴포넌트 내보내기
export { LocationSwapSelectorComponent } from "./LocationSwapSelectorComponent";
export { LocationSwapSelectorRenderer } from "./LocationSwapSelectorRenderer";

