import { ComponentRegistryItem } from "../../types";

export const formLayoutRegistry: ComponentRegistryItem = {
  name: "form-layout",
  displayName: "Form Layout",
  description: "shadcn/ui 스타일의 자동 폼 레이아웃 - 필드를 추가하고 정갈한 입력 폼을 만드세요",
  category: "form",
  icon: "FileText",
  component: () => import("./FormLayoutComponent").then((m) => m.FormLayoutComponent),
  configPanel: () => import("./FormLayoutConfigPanel").then((m) => m.FormLayoutConfigPanel),
  defaultProps: {
    fields: [
      {
        id: "field-example-1",
        name: "name",
        label: "이름",
        type: "text",
        placeholder: "이름을 입력하세요",
        required: true,
        gridColumn: "half",
      },
      {
        id: "field-example-2",
        name: "email",
        label: "이메일",
        type: "email",
        placeholder: "example@domain.com",
        required: true,
        gridColumn: "half",
      },
      {
        id: "field-example-3",
        name: "description",
        label: "설명",
        type: "textarea",
        placeholder: "상세 설명을 입력하세요",
        required: false,
        gridColumn: "full",
      },
    ],
    submitButtonText: "제출",
    cancelButtonText: "취소",
    columns: 2,
  },
  previewImage: "/registry/form-layout-preview.png",
};