@ncds/ui-admin-mcp 1.0.0-alpha.10

package/data/vertical-tab.json

@@ -0,0 +1,314 @@
+{
+  "name": "vertical-tab",
+  "exportName": "VerticalTab",
+  "importPath": "@ncds/ui-admin",
+  "jsRequired": true,
+  "category": "navigation",
+  "description": "VerticalTab은 동일한 계층 구조의 관련 콘텐츠를 그룹화하여 동일 화면 내에서 콘텐츠를 전환하는 내비게이션 UI 컴포넌트입니다.",
+  "aliases": [
+    "VerticalTab",
+    "세로탭",
+    "탭",
+    "Tab",
+    "수직탭",
+    "콘텐츠전환",
+    "설정페이지",
+    "좌측네비게이션",
+    "Badge",
+    "SPA",
+    "네비게이션",
+    "NCDS",
+    "breakPoint",
+    "반응형",
+    "Select전환"
+  ],
+  "hasChildren": false,
+  "whenToUse": [
+    "좌측 영역에서 수직 방향으로 콘텐츠를 전환하는 내비게이션",
+    "설정 페이지, 계정 관리, 관리자 메뉴 등 좌측 네비게이션 성격의 콘텐츠 그룹 전환",
+    "SPA 기준 라우팅 변경으로 동작"
+  ],
+  "forbiddenRules": [
+    "1개 항목만 있는 경우 사용 금지",
+    "좌측 네비게이션과 혼동되도록 과도한 확장 금지",
+    "페이지 이동용 GNB처럼 사용 금지",
+    "이미지 사용 금지",
+    "장식 아이콘 사용 금지",
+    "서로 다른 계층 혼합 금지",
+    "페이지 리로드 금지",
+    "과도한 컬러 사용 금지"
+  ],
+  "seeAlso": [
+    "horizontal-tab",
+    "badge"
+  ],
+  "props": {
+    "activeTab": {
+      "type": "string",
+      "required": false
+    },
+    "breakPoint": {
+      "type": "enum",
+      "required": false,
+      "values": [
+        "mobile",
+        "pc"
+      ],
+      "default": "pc"
+    },
+    "menus": {
+      "type": "object",
+      "required": false,
+      "rawType": "import(\"/Users/nhncommerce/Desktop/company/ai-driven-ncds/packages/ui-admin/src/components/tab/TabButton\").TabButtonProps[] | undefined",
+      "properties": {
+        "id": {
+          "type": "string",
+          "required": false
+        },
+        "label": {
+          "type": "string",
+          "required": false
+        },
+        "size": {
+          "type": "enum",
+          "required": false,
+          "values": [
+            "lg",
+            "md",
+            "sm"
+          ]
+        },
+        "tabButtonType": {
+          "type": "enum",
+          "required": false,
+          "values": [
+            "button-primary",
+            "button-white",
+            "line-vertical",
+            "underline",
+            "underline-fill"
+          ]
+        },
+        "isActive": {
+          "type": "boolean",
+          "required": false
+        },
+        "badgeInfo": {
+          "type": "object",
+          "required": false,
+          "rawType": "import(\"/Users/nhncommerce/Desktop/company/ai-driven-ncds/packages/ui-admin/src/components/badge/Badge\").BadgeProps | undefined",
+          "properties": {
+            "label": {
+              "type": "string",
+              "required": true
+            },
+            "type": {
+              "type": "enum",
+              "required": false,
+              "values": [
+                "pill-dark-color",
+                "pill-outline"
+              ]
+            },
+            "color": {
+              "type": "enum",
+              "required": false,
+              "values": [
+                "blue",
+                "disabled",
+                "error",
+                "neutral",
+                "pink",
+                "success",
+                "warning"
+              ]
+            },
+            "className": {
+              "type": "string",
+              "required": false
+            },
+            "leadingIcon": {
+              "type": "object",
+              "required": false,
+              "rawType": "import(\"/Users/nhncommerce/Desktop/company/ai-driven-ncds/packages/ui-admin/src/types/side-slot\").SideSlotType | undefined",
+              "properties": {
+                "type": {
+                  "type": "string",
+                  "required": true,
+                  "rawType": "\"icon\""
+                },
+                "icon": {
+                  "type": "function",
+                  "required": false
+                },
+                "color": {
+                  "type": "enum",
+                  "required": false,
+                  "values": [
+                    "black",
+                    "blue500",
+                    "blue600",
+                    "currentColor",
+                    "gray100",
+                    "gray200",
+                    "gray300",
+                    "gray400",
+                    "gray500",
+                    "gray600",
+                    "gray700",
+                    "green500",
+                    "green600",
+                    "orange500",
+                    "orange600",
+                    "pink100",
+                    "pink600",
+                    "red500",
+                    "red600",
+                    "secondary-gray-blue-100",
+                    "secondary-gray-blue-200",
+                    "secondary-gray-blue-300",
+                    "secondary-gray-blue-400",
+                    "secondary-gray-blue-450",
+                    "secondary-gray-blue-50",
+                    "secondary-gray-blue-500",
+                    "secondary-gray-blue-600",
+                    "secondary-gray-blue-700",
+                    "violet300",
+                    "violet600",
+                    "white",
+                    "yellow600"
+                  ]
+                },
+                "size": {
+                  "type": "number",
+                  "required": false
+                },
+                "children": {
+                  "type": "ReactNode",
+                  "required": false
+                }
+              }
+            },
+            "trailingIcon": {
+              "type": "object",
+              "required": false,
+              "rawType": "import(\"/Users/nhncommerce/Desktop/company/ai-driven-ncds/packages/ui-admin/src/types/side-slot\").SideSlotType | undefined",
+              "properties": {
+                "type": {
+                  "type": "string",
+                  "required": true,
+                  "rawType": "\"icon\""
+                },
+                "icon": {
+                  "type": "function",
+                  "required": false
+                },
+                "color": {
+                  "type": "enum",
+                  "required": false,
+                  "values": [
+                    "black",
+                    "blue500",
+                    "blue600",
+                    "currentColor",
+                    "gray100",
+                    "gray200",
+                    "gray300",
+                    "gray400",
+                    "gray500",
+                    "gray600",
+                    "gray700",
+                    "green500",
+                    "green600",
+                    "orange500",
+                    "orange600",
+                    "pink100",
+                    "pink600",
+                    "red500",
+                    "red600",
+                    "secondary-gray-blue-100",
+                    "secondary-gray-blue-200",
+                    "secondary-gray-blue-300",
+                    "secondary-gray-blue-400",
+                    "secondary-gray-blue-450",
+                    "secondary-gray-blue-50",
+                    "secondary-gray-blue-500",
+                    "secondary-gray-blue-600",
+                    "secondary-gray-blue-700",
+                    "violet300",
+                    "violet600",
+                    "white",
+                    "yellow600"
+                  ]
+                },
+                "size": {
+                  "type": "number",
+                  "required": false
+                },
+                "children": {
+                  "type": "ReactNode",
+                  "required": false
+                }
+              }
+            },
+            "size": {
+              "type": "enum",
+              "required": false,
+              "values": [
+                "md",
+                "sm",
+                "xs"
+              ]
+            }
+          }
+        },
+        "className": {
+          "type": "string",
+          "required": false
+        },
+        "children": {
+          "type": "ReactNode",
+          "required": false
+        },
+        "onClick": {
+          "type": "function",
+          "required": false
+        }
+      }
+    },
+    "onSelect": {
+      "type": "function",
+      "required": false
+    },
+    "type": {
+      "type": "enum",
+      "required": false,
+      "values": [
+        "button-primary",
+        "button-white",
+        "line-vertical"
+      ],
+      "default": "button-primary"
+    }
+  },
+  "html": {},
+  "bemClasses": [
+    "ncua-vertical-tab",
+    "ncua-vertical-tab--button-primary",
+    "ncua-vertical-tab--button-white",
+    "ncua-vertical-tab--line-vertical",
+    "ncua-vertical-tab--mobile",
+    "ncua-vertical-tab--pc"
+  ],
+  "usage": {
+    "import": "import { VerticalTab } from '@ncds/ui-admin';",
+    "react": {
+      "default": "<VerticalTab />",
+      "breakPoint:mobile": "<VerticalTab breakPoint=\"mobile\" />",
+      "breakPoint:pc": "<VerticalTab breakPoint=\"pc\" />",
+      "type:button-primary": "<VerticalTab type=\"button-primary\" />",
+      "type:button-white": "<VerticalTab type=\"button-white\" />",
+      "type:line-vertical": "<VerticalTab type=\"line-vertical\" />"
+    }
+  }
+}

package/package.json

@@ -0,0 +1,61 @@
+{
+  "name": "@ncds/ui-admin-mcp",
+  "version": "1.0.0-alpha.10",
+  "description": "NCDS UI Admin MCP 서버 — AI 에이전트가 NCUA 컴포넌트를 조회하고 HTML을 검증할 수 있는 MCP 서버",
+  "bin": {
+    "ncua-mcp": "./bin/server.mjs"
+  },
+  "files": [
+    "bin",
+    "data",
+    "templates",
+    "README.md"
+  ],
+  "engines": {
+    "node": ">=20"
+  },
+  "scripts": {
+    "extract": "tsx scripts/extract-mcp-data.ts",
+    "extract:icons": "tsx scripts/extract-icons.ts",
+    "extract:tokens": "tsx scripts/extract-design-tokens.ts",
+    "generate:cdn-meta": "tsx scripts/generate-cdn-meta.ts",
+    "build:bundle": "tsx scripts/build-bundle.ts",
+    "build:server": "tsc --project tsconfig.json && rm -rf bin/definitions && cp -r src/definitions bin/definitions",
+    "build": "yarn extract && yarn extract:icons && yarn extract:tokens && yarn generate:cdn-meta && yarn build:bundle && yarn build:server",
+    "test": "vitest run --config vitest.config.ts",
+    "test:coverage": "vitest run --coverage --config vitest.config.ts",
+    "publish:npm": "npm publish --access=public"
+  },
+  "keywords": [
+    "ncds",
+    "nhn-commerce",
+    "design-system",
+    "mcp",
+    "model-context-protocol"
+  ],
+  "license": "SEE LICENSE IN LICENSE",
+  "private": false,
+  "dependencies": {
+    "@modelcontextprotocol/sdk": "^1.27.1",
+    "@ncds/types-common": "^1.0.0",
+    "@ncds/types-layout": "^1.0.0",
+    "@ncds/ui-admin-icon": "0.1.6",
+    "classnames": "^2.3.2",
+    "flatpickr": "4.6.13",
+    "jsdom": "^26.1.0",
+    "lodash": "^4.17.21",
+    "lodash-es": "^4.17.21",
+    "moment": "^2.30.1",
+    "node-html-parser": "^7.1.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-flatpickr": "^4.0.10",
+    "swiper": "^11.1.1",
+    "zod": "^4.3.6"
+  },
+  "devDependencies": {
+    "@types/node": "^25.5.0",
+    "@types/react": "^18.3.20",
+    "ts-morph": "^27.0.2"
+  }
+}

package/templates/.mcp.json.example

@@ -0,0 +1,8 @@
+{
+  "mcpServers": {
+    "ncds-ui-admin": {
+      "command": "npx",
+      "args": ["-y", "@ncds/ui-admin-mcp"]
+    }
+  }
+}

package/templates/README.md

@@ -0,0 +1,30 @@
+# NCUA MCP 서버 설정 템플릿
+
+## 빠른 시작
+
+프로젝트 루트에 `.mcp.json` 파일을 생성하고 아래 내용을 추가합니다.
+
+```json
+{
+  "mcpServers": {
+    "ncds-ui-admin": {
+      "command": "npx",
+      "args": ["-y", "@ncds/ui-admin-mcp"]
+    }
+  }
+}
+```
+
+또는 이 디렉토리의 `.mcp.json.example` 파일을 프로젝트 루트로 복사합니다.
+
+```bash
+cp node_modules/@ncds/ui-admin-mcp/templates/.mcp.json.example .mcp.json
+```
+
+## 요구사항
+
+- Node.js 20 이상
+
+## 확인 방법
+
+설정 후 Claude Desktop 또는 Claude Code를 재시작하면 `ncds-ui-admin` MCP 서버가 자동으로 인식됩니다.