"use client";

import React from "react";
import { createComponentDefinition } from "../../utils/createComponentDefinition";
import { ComponentCategory } from "@/types/component";
import { SplitLineWrapper } from "./SplitLineComponent";
import { V2SplitLineConfigPanel } from "@/components/v2/config-panels/V2SplitLineConfigPanel";
import { SplitLineConfig } from "./types";

/**
 * SplitLine 컴포넌트 정의
 * 캔버스를 좌우로 분할하는 드래그 가능한 세로 분할선
 */
export const V2SplitLineDefinition = createComponentDefinition({
  id: "v2-split-line",
  name: "스플릿선",
  name_eng: "SplitLine Component",
  description: "캔버스를 좌우로 분할하는 드래그 가능한 분할선",
  category: ComponentCategory.LAYOUT,
  web_type: "text",
  component: SplitLineWrapper,
  default_config: {
    resizable: true,
    lineColor: "#e2e8f0",
    lineWidth: 4,
  } as SplitLineConfig,
  default_size: { width: 8, height: 600 },
  config_panel: V2SplitLineConfigPanel,
  icon: "SeparatorVertical",
  tags: ["스플릿", "분할", "분할선", "레이아웃"],
  version: "1.0.0",
  author: "개발팀",
  documentation: "",
  // ★ 2026-04-11: 통합 `divider` 로 흡수 예정. 팔레트에서 숨김.
  //   drag-resize 기능은 다음 Phase 에서 divider 의 vertical+resizable 옵션으로
  //   복구 예정. 기존 저장 화면은 계속 작동.
  hidden: true,
});

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

// 컴포넌트 내보내기
export { SplitLineComponent } from "./SplitLineComponent";
export { SplitLineRenderer } from "./SplitLineRenderer";
