1.6 KiB
1.6 KiB
name, description
| name | description |
|---|---|
| component-registry | 리포트 디자이너 컴포넌트 가이드. 리포트 디자이너 내 컴포넌트 구조, 추가/수정 방법. 리포트 디자이너 컴포넌트 작업 시 사용. |
리포트 디자이너 컴포넌트 가이드
수정 범위 제약
frontend/components/report/designer/ 내 파일만 수정.
화면 빌더의 일반 컴포넌트 레지스트리(lib/registry/components/)는 수정하지 않는다.
리포트 디자이너 컴포넌트 구조
frontend/components/report/designer/
├── ReportDesignerCanvas.tsx # 캔버스
├── ReportDesignerToolbar.tsx # 툴바
├── ReportComponentPalette.tsx # 컴포넌트 팔레트
├── properties/ # 속성 패널
│ ├── TextProperties.tsx
│ ├── ImageProperties.tsx
│ ├── TableProperties.tsx
│ ├── CardProperties.tsx
│ └── PageNumberProperties.tsx
└── modals/ # 설정 모달
├── ComponentSettingsModal.tsx
├── SettingsModalShell.tsx
├── TextLayoutTabs.tsx
├── ImageLayoutTabs.tsx
├── TableLayoutTabs.tsx
└── GridCellDropZone.tsx
컴포넌트 추가 시 절차
types/report.ts에 새 컴포넌트 타입 추가designer/properties/에 속성 패널 생성designer/modals/에 설정 모달 생성 (필요 시)ReportDesignerCanvas.tsx에 렌더링 로직 추가ReportComponentPalette.tsx에 팔레트 항목 추가
전역 상태
frontend/contexts/ReportDesignerContext.tsx로 관리:
- 선택된 컴포넌트
- 캔버스 상태
- 저장/불러오기