"use client";

import React from "react";
import { createComponentDefinition } from "../../utils/createComponentDefinition";
import { ComponentCategory } from "@/types/component";
import type { WebType } from "@/types/screen";
import { DividerLineWrapper } from "./DividerLineComponent";
import { InvLegacyDividerConfigPanel } from "@/components/v2/config-panels/InvLegacyDividerConfigPanel";
import { DividerLineConfig } from "./types";

/**
 * DividerLine 컴포넌트 정의
 * divider-line 컴포넌트입니다
 */
export const V2DividerLineDefinition = createComponentDefinition({
  id: "v2-divider-line",
  name: "구분선",
  name_eng: "DividerLine Component",
  description: "영역 구분을 위한 구분선 컴포넌트",
  category: ComponentCategory.LAYOUT,
  web_type: "text",
  component: DividerLineWrapper,
  default_config: {
    placeholder: "텍스트를 입력하세요",
    maxLength: 255,
  },
  default_size: { width: 400, height: 2 },
  config_panel: InvLegacyDividerConfigPanel,
  icon: "Layout",
  tags: [],
  version: "1.0.0",
  author: "Developer",
  documentation: "https://docs.example.com/components/divider-line",
  // ★ 2026-04-11: 통합 `divider` 컴포넌트로 흡수됨. 팔레트에서 숨김.
  //   기존 저장 화면의 v2-divider-line 은 계속 렌더되지만, 신규 배치는 `divider`.
  hidden: true,
});

// 타입 내보내기
export type { DividerLineConfig } from "./types";

// 컴포넌트 내보내기
export { DividerLineComponent } from "./DividerLineComponent";
export { DividerLineRenderer } from "./DividerLineRenderer";
