"use client";

import React from "react";
import { createComponentDefinition } from "../../utils/createComponentDefinition";
import { ComponentCategory } from "@/types/component";
import { CustomerItemMappingComponent } from "./CustomerItemMappingComponent";
import { CustomerItemMappingConfigPanel } from "./CustomerItemMappingConfigPanel";
import { CustomerItemMappingConfig } from "./types";

export const CustomerItemMappingDefinition = createComponentDefinition({
  id: "customer-item-mapping",
  name: "거래처별 품목정보",
  nameEng: "Customer Item Mapping",
  description: "거래처별 품목 정보를 표시하고 선택하는 컴포넌트",
  category: ComponentCategory.DISPLAY,
  webType: "text",
  component: CustomerItemMappingComponent,
  defaultConfig: {
    selectedTable: undefined,
    columns: [],
    checkbox: {
      enabled: true,
      multiple: true,
      selectAll: true,
    },
    showSearchArea: true, // 기본적으로 검색 영역 표시
    searchAreaHeight: 80,
    searchPlaceholder: "품목코드, 품목명, 규격 검색",
    enableCategoryFilter: true, // 기본적으로 카테고리 필터 표시
    categoryColumn: undefined,
    categories: ["전체", "원자재", "반도체", "완제품"],
    showCompanyName: false,
    companyNameColumn: undefined,
    emptyMessage: "데이터가 없습니다",
    emptyDescription: "품목 데이터가 추가되면 여기에 표시됩니다",
  } as CustomerItemMappingConfig,
  defaultSize: { width: 800, height: 600 },
  configPanel: CustomerItemMappingConfigPanel,
  icon: "Package",
  tags: ["거래처", "품목", "매핑", "목록"],
  version: "1.0.0",
  author: "개발팀",
});

export type { CustomerItemMappingConfig } from "./types";