카테고리 기능 구현

frontend/lib/registry/components/category-manager.tsx

@@ -0,0 +1,69 @@
+import { ComponentDefinition, ComponentCategory } from "@/types/component";
+import { FolderTree } from "lucide-react";
+import { CategoryWidget } from "@/components/screen/widgets/CategoryWidget";
+
+/**
+ * 카테고리 관리 컴포넌트 정의
+ * - 메뉴 스코프 기반 카테고리 값 관리
+ * - 좌우 분할 UI (컬럼 목록 + 값 관리)
+ */
+export const categoryManagerDefinition: ComponentDefinition = {
+  // 기본 정보
+  id: "category-manager",
+  name: "카테고리 관리",
+  nameEng: "Category Manager",
+  description: "메뉴 스코프 기반 카테고리 값 관리 (좌우 분할 UI)",
+  category: ComponentCategory.DISPLAY,
+  webType: "category" as any,
+
+  // 컴포넌트
+  component: CategoryWidget,
+
+  // 아이콘
+  icon: FolderTree,
+
+  // 기본 크기
+  defaultSize: {
+    width: 1000,
+    height: 600,
+  },
+
+  // 태그
+  tags: ["category", "reference", "manager", "scope"],
+
+  // 작성자
+  author: "system",
+
+  // 속성
+  properties: {
+    menuId: {
+      type: "number",
+      label: "메뉴 ID",
+      description: "현재 화면의 메뉴 ID (자동 설정)",
+      required: true,
+    },
+    tableName: {
+      type: "string",
+      label: "테이블명",
+      description: "현재 화면의 테이블명 (자동 설정)",
+      required: true,
+    },
+  },
+
+  // 특징
+  features: [
+    "메뉴 스코프 기반 카테고리 관리",
+    "좌우 분할 UI (컬럼 목록 + 값 관리)",
+    "실시간 검색 및 필터링",
+    "CRUD 기능 (추가, 수정, 삭제)",
+    "색상 및 아이콘 설정",
+    "계층 구조 지원 (부모-자식)",
+  ],
+
+  // 제약사항
+  constraints: {
+    minSize: { width: 800, height: 400 },
+    maxSize: { width: 1400, height: 1000 },
+  },
+};
+