V2 컴포넌트 규칙 추가 및 기존 컴포넌트 자동 등록 개선: 화면 컴포넌트 개발 가이드에 V2 컴포넌트 사용 규칙을 명시하고, ComponentsPanel에서 수동으로 추가하던 table-list 컴포넌트를 자동 등록으로 변경하여 관리 효율성을 높였습니다. 또한, V2 컴포넌트 목록과 수정/개발 시 규칙을 추가하여 일관된 개발 환경을 조성하였습니다.

frontend/lib/registry/components/v2-split-panel-layout/README.md

@@ -0,0 +1,80 @@
+# SplitPanelLayout 컴포넌트
+
+마스터-디테일 패턴의 좌우 분할 레이아웃 컴포넌트입니다.
+
+## 특징
+
+- 🔄 **마스터-디테일 패턴**: 좌측에서 항목 선택 시 우측에 상세 정보 표시
+- 📏 **크기 조절 가능**: 드래그하여 좌우 패널 크기 조정
+- 🔍 **검색 기능**: 각 패널에 독립적인 검색 기능
+- 🔗 **관계 설정**: JOIN, DETAIL, CUSTOM 관계 타입 지원
+- ⚙️ **유연한 설정**: 다양한 옵션으로 커스터마이징 가능
+
+## 사용 사례
+
+### 1. 코드 관리
+
+- 좌측: 코드 카테고리 목록
+- 우측: 선택된 카테고리의 코드 목록
+
+### 2. 테이블 조인 설정
+
+- 좌측: 기본 테이블 목록
+- 우측: 선택된 테이블의 조인 조건 설정
+
+### 3. 메뉴 관리
+
+- 좌측: 메뉴 트리 구조
+- 우측: 선택된 메뉴의 상세 설정
+
+## 설정 옵션
+
+### 좌측 패널 (leftPanel)
+
+- `title`: 패널 제목
+- `tableName`: 데이터베이스 테이블명
+- `showSearch`: 검색 기능 표시 여부
+- `showAdd`: 추가 버튼 표시 여부
+
+### 우측 패널 (rightPanel)
+
+- `title`: 패널 제목
+- `tableName`: 데이터베이스 테이블명
+- `showSearch`: 검색 기능 표시 여부
+- `showAdd`: 추가 버튼 표시 여부
+- `relation`: 좌측 항목과의 관계 설정
+  - `type`: "join" | "detail" | "custom"
+  - `foreignKey`: 외래키 컬럼명
+
+### 레이아웃 설정
+
+- `splitRatio`: 좌측 패널 너비 비율 (0-100, 기본 30)
+- `resizable`: 크기 조절 가능 여부 (기본 true)
+- `minLeftWidth`: 좌측 최소 너비 (기본 200px)
+- `minRightWidth`: 우측 최소 너비 (기본 300px)
+- `autoLoad`: 자동 데이터 로드 (기본 true)
+
+## 예시
+
+```typescript
+const config: SplitPanelLayoutConfig = {
+  leftPanel: {
+    title: "코드 카테고리",
+    tableName: "code_category",
+    showSearch: true,
+    showAdd: true,
+  },
+  rightPanel: {
+    title: "코드 목록",
+    tableName: "code_info",
+    showSearch: true,
+    showAdd: true,
+    relation: {
+      type: "detail",
+      foreignKey: "category_id",
+    },
+  },
+  splitRatio: 30,
+  resizable: true,
+};
+```