54 lines
1.8 KiB
TypeScript
54 lines
1.8 KiB
TypeScript
"use client";
|
|
|
|
import React from "react";
|
|
import { createComponentDefinition } from "../../utils/createComponentDefinition";
|
|
import { ComponentCategory } from "@/types/component";
|
|
import type { WebType } from "@/types/screen";
|
|
import { CardDisplayComponent } from "./CardDisplayComponent";
|
|
import { CardDisplayConfigPanel } from "./CardDisplayConfigPanel";
|
|
import { CardDisplayConfig } from "./types";
|
|
|
|
/**
|
|
* CardDisplay 컴포넌트 정의
|
|
* 테이블 데이터를 카드 형태로 표시하는 컴포넌트
|
|
*/
|
|
export const CardDisplayDefinition = createComponentDefinition({
|
|
id: "card-display",
|
|
name: "카드 디스플레이",
|
|
nameEng: "CardDisplay Component",
|
|
description: "테이블 데이터를 카드 형태로 표시하는 컴포넌트",
|
|
category: ComponentCategory.DISPLAY,
|
|
webType: "text",
|
|
component: CardDisplayComponent,
|
|
defaultConfig: {
|
|
cardsPerRow: 3, // 기본값 3 (한 행당 카드 수)
|
|
cardSpacing: 16,
|
|
cardStyle: {
|
|
showTitle: true,
|
|
showSubtitle: true,
|
|
showDescription: true,
|
|
showImage: false,
|
|
showActions: true,
|
|
maxDescriptionLength: 100,
|
|
imagePosition: "top",
|
|
imageSize: "medium",
|
|
},
|
|
columnMapping: {},
|
|
dataSource: "table",
|
|
staticData: [],
|
|
},
|
|
defaultSize: { width: 800, height: 400 },
|
|
configPanel: CardDisplayConfigPanel,
|
|
icon: "Grid3x3",
|
|
tags: ["card", "display", "table", "grid"],
|
|
version: "1.0.0",
|
|
author: "개발팀",
|
|
documentation:
|
|
"테이블 데이터를 카드 형태로 표시하는 컴포넌트입니다. 레이아웃과 다르게 컴포넌트로서 재사용 가능하며, 다양한 설정이 가능합니다.",
|
|
});
|
|
|
|
// 컴포넌트는 CardDisplayRenderer에서 자동 등록됩니다
|
|
|
|
// 타입 내보내기
|
|
export type { CardDisplayConfig } from "./types";
|