pipeline/.cursor/skills/component-dev/SKILL.md

name, description

name	description
component-dev	리포트 뷰어 V2 컴포넌트 개발 가이드. v2-report-viewer 등 리포트 관련 V2 컴포넌트 개발 시 사용.

리포트 V2 컴포넌트 개발 가이드

수정 범위 제약

리포트 관련 V2 컴포넌트만 수정:

• v2-report-viewer/
• 리포트 연동 컴포넌트

다른 V2 컴포넌트(v2-table-list, v2-input 등)는 수정하지 않는다.

V2 컴포넌트 핵심 규칙

• v2- 접두사 필수 (원본 폴더 수정 금지)
• 저장: component_url + overrides (차이값만)
• Zod 스키마에 .passthrough() 필수
• isDesignMode 체크하여 API 호출 스킵
• beforeFormSave 이벤트로 느슨한 결합
• autoFilter로 멀티테넌시 필터링

표준 파일 구조

frontend/lib/registry/components/v2-report-viewer/
├── index.ts
├── ReportViewerRenderer.tsx
├── ReportViewerComponent.tsx
├── ReportViewerConfigPanel.tsx
└── types.ts

표준 Props

interface StandardComponentProps {
  component: ComponentData;
  isDesignMode?: boolean;
  formData?: Record<string, any>;
  onFormDataChange?: (fieldName: string, value: any) => void;
  companyCode?: string;
  refreshKey?: number;
}