/**
 * V2Date 컴포넌트 정의
 *
 * 날짜, 시간, 날짜시간, 날짜범위 등 다양한 날짜/시간 입력을 지원하는 통합 컴포넌트
 */

import { ComponentCategory } from "@/types/component";
import { createComponentDefinition } from "../../utils/createComponentDefinition";
import { V2DateConfigPanel } from "@/components/v2/config-panels/V2DateConfigPanel";
import { V2Date } from "@/components/v2/V2Date";

export const V2DateDefinition = createComponentDefinition({
  id: "v2-date",
  name: "V2 날짜",
  description: "날짜, 시간, 날짜시간, 날짜범위 등 다양한 날짜/시간 입력 지원",
  category: ComponentCategory.INPUT,
  webType: "date",
  version: "2.0.0",
  component: V2Date,

  // 기본 속성
  defaultProps: {
    config: {
      dateType: "date",
      format: "YYYY-MM-DD",
      placeholder: "날짜 선택",
      required: false,
      readonly: false,
      disabled: false,
      showTime: false,
      use24Hours: true,
    },
  },

  // 설정 스키마
  configSchema: {
    dateType: {
      type: "select",
      label: "날짜 타입",
      options: [
        { value: "date", label: "날짜" },
        { value: "datetime", label: "날짜시간" },
        { value: "time", label: "시간" },
        { value: "daterange", label: "날짜 범위" },
        { value: "month", label: "월" },
        { value: "year", label: "연도" },
      ],
    },
    format: {
      type: "text",
      label: "표시 형식",
      placeholder: "YYYY-MM-DD",
    },
    required: {
      type: "boolean",
      label: "필수 입력",
    },
    showTime: {
      type: "boolean",
      label: "시간 표시",
    },
  },

  // 이벤트
  events: ["onChange", "onClear"],

  // 아이콘
  icon: "Calendar",

  // 태그
  tags: ["date", "time", "datetime", "calendar", "v2"],

  // 설정 패널
  configPanel: V2DateConfigPanel,
});

export default V2DateDefinition;