108af2a68b
새로운 그룹화 레이아웃 컴포넌트 2종 추가: - Section Card: 제목+테두리 기반 명확한 섹션 구분 - Section Paper: 배경색 기반 미니멀한 섹션 구분 주요 변경사항: - 새 컴포넌트 등록 (각 4개 파일: Component, ConfigPanel, Renderer, index) - UnifiedPropertiesPanel에 인라인 설정 UI 추가 (280줄) - DetailSettingsPanel ConfigPanel 인터페이스 통일화 (config → componentConfig) - getComponentConfigPanel에 동적 import 매핑 추가 - 기존 컴포넌트 타입 정리 (autocomplete, entity-search, modal-repeater) 특징: - shadcn/ui 기반 일관된 디자인 시스템 준수 - 중첩 박스 금지 원칙 적용 - 반응형 지원 (모바일 우선) - collapsible 기능 지원 (Section Card)
41 lines
1.3 KiB
TypeScript
41 lines
1.3 KiB
TypeScript
"use client";
|
|
|
|
import { createComponentDefinition } from "../../utils/createComponentDefinition";
|
|
import { ComponentCategory } from "@/types/component";
|
|
import { SectionPaperComponent } from "./SectionPaperComponent";
|
|
import { SectionPaperConfigPanel } from "./SectionPaperConfigPanel";
|
|
|
|
/**
|
|
* Section Paper 컴포넌트 정의
|
|
* 배경색 기반의 미니멀한 그룹화 컨테이너 (색종이 컨셉)
|
|
*/
|
|
export const SectionPaperDefinition = createComponentDefinition({
|
|
id: "section-paper",
|
|
name: "Section Paper",
|
|
nameEng: "Section Paper",
|
|
description: "배경색 기반의 미니멀한 그룹화 컨테이너 (색종이 컨셉)",
|
|
category: ComponentCategory.LAYOUT,
|
|
webType: "custom",
|
|
component: SectionPaperComponent,
|
|
defaultConfig: {
|
|
backgroundColor: "default",
|
|
padding: "md",
|
|
roundedCorners: "md",
|
|
shadow: "none",
|
|
showBorder: false,
|
|
},
|
|
defaultSize: { width: 800, height: 200 },
|
|
configPanel: SectionPaperConfigPanel,
|
|
icon: "Square",
|
|
tags: ["섹션", "그룹", "배경", "컨테이너", "색종이", "paper"],
|
|
version: "1.0.0",
|
|
author: "WACE",
|
|
});
|
|
|
|
// 컴포넌트는 SectionPaperRenderer에서 자동 등록됩니다
|
|
|
|
export { SectionPaperComponent } from "./SectionPaperComponent";
|
|
export { SectionPaperConfigPanel } from "./SectionPaperConfigPanel";
|
|
export { SectionPaperRenderer } from "./SectionPaperRenderer";
|
|
|