"use client";

import React from "react";
import { createComponentDefinition } from "../../utils/createComponentDefinition";
import { ComponentCategory } from "@/types/component";
import type { WebType } from "@/types/screen";
import { ToggleSwitchWrapper } from "./ToggleSwitchComponent";
import { ToggleSwitchConfigPanel } from "./ToggleSwitchConfigPanel";
import { ToggleSwitchConfig } from "./types";

/**
 * ToggleSwitch 컴포넌트 정의
 * toggle-switch 컴포넌트입니다
 */
export const ToggleSwitchDefinition = createComponentDefinition({
  id: "toggle-switch",
  name: "토글 스위치",
  nameEng: "ToggleSwitch Component",
  description: "ON/OFF 상태 전환을 위한 토글 스위치 컴포넌트",
  category: ComponentCategory.FORM,
  webType: "boolean",
  component: ToggleSwitchWrapper,
  defaultConfig: {
    placeholder: "입력하세요",
  },
  defaultSize: { width: 180, height: 40 },
  configPanel: ToggleSwitchConfigPanel,
  icon: "Edit",
  tags: [],
  version: "1.0.0",
  author: "Developer",
  documentation: "https://docs.example.com/components/toggle-switch",
});

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

// 컴포넌트 내보내기
export { ToggleSwitchComponent } from "./ToggleSwitchComponent";
export { ToggleSwitchRenderer } from "./ToggleSwitchRenderer";