"use client";

import React from "react";
import { createComponentDefinition } from "../../utils/createComponentDefinition";
import { ComponentCategory } from "@/types/component";
import type { WebType } from "@/types/screen";
import { SelectedItemsDetailInputWrapper } from "./SelectedItemsDetailInputComponent";
import { SelectedItemsDetailInputConfigPanel } from "./SelectedItemsDetailInputConfigPanel";
import { SelectedItemsDetailInputConfig } from "./types";

/**
 * SelectedItemsDetailInput 컴포넌트 정의
 * 선택된 항목들의 상세 정보를 입력하는 컴포넌트
 */
export const SelectedItemsDetailInputDefinition = createComponentDefinition({
  id: "selected-items-detail-input",
  name: "선택 항목 상세입력",
  nameEng: "SelectedItemsDetailInput Component",
  description: "선택된 항목들의 상세 정보를 입력하는 컴포넌트",
  category: ComponentCategory.INPUT,
  webType: "text",
  component: SelectedItemsDetailInputWrapper,
  defaultConfig: {
    dataSourceId: "",
    displayColumns: [],
    additionalFields: [],
    targetTable: "",
    layout: "grid",
    showIndex: true,
    allowRemove: false,
    emptyMessage: "전달받은 데이터가 없습니다.",
    disabled: false,
    readonly: false,
  } as SelectedItemsDetailInputConfig,
  defaultSize: { width: 800, height: 400 },
  configPanel: SelectedItemsDetailInputConfigPanel,
  icon: "Table",
  tags: ["선택", "상세입력", "반복", "테이블", "데이터전달"],
  version: "1.0.0",
  author: "개발팀",
  documentation: "https://docs.example.com/components/selected-items-detail-input",
});

// 컴포넌트는 SelectedItemsDetailInputRenderer에서 자동 등록됩니다

// 타입 내보내기
export type { SelectedItemsDetailInputConfig, AdditionalFieldDefinition } from "./types";