@ncds/ui-admin-mcp 1.0.0-alpha.25 → 1.0.0-alpha.27

package/bin/utils/tokenValidator.js

@@ -1,194 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.extractAllCss = exports.detectTokenIssues = exports.buildTokenValueMap = void 0;
-// ── server.ts 사전 계산용 ───────────────────────────────────────────────
-/** hex 값(lowercase) → 토큰 CSS 변수명 배열 역방향 매핑 빌드 — server.ts에서 1회 호출 */
-const buildTokenValueMap = (tokenData) => {
-    const map = new Map();
-    for (const group of tokenData.groups) {
-        if (group.category !== 'color')
-            continue;
-        for (const token of group.tokens) {
-            const hex = token.value.toLowerCase();
-            const existing = map.get(hex);
-            if (existing)
-                existing.push(token.name);
-            else
-                map.set(hex, [token.name]);
-        }
-    }
-    return map;
-};
-exports.buildTokenValueMap = buildTokenValueMap;
-// ── 상수 ─────────────────────────────────────────────────────────────────
-const HEX_PATTERN_SOURCE = /#([0-9a-fA-F]{3,8})\b/g.source;
-const RGB_PATTERN_SOURCE = /rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/g.source;
-const VAR_PATTERN_SOURCE = /var\(\s*(--[a-zA-Z0-9-]+)(?:\s*,\s*[^)]+)?\s*\)/g.source;
-// ── 순수 헬퍼 ────────────────────────────────────────────────────────────
-const HEX_RADIX = 16;
-const HEX_BYTE_LENGTH = 2;
-const HEX_SHORT_LENGTH = 3;
-const HEX_FULL_LENGTH = 6;
-/** rgb(r,g,b) → #rrggbb hex 변환 */
-const rgbToHex = (r, g, b) => `#${[r, g, b].map((v) => v.toString(HEX_RADIX).padStart(HEX_BYTE_LENGTH, '0')).join('')}`;
-/** 3자리 hex를 6자리로 정규화 */
-const normalizeHex = (hex) => {
-    const h = hex.toLowerCase().replace('#', '');
-    if (h.length === HEX_SHORT_LENGTH)
-        return `#${h[0]}${h[0]}${h[1]}${h[1]}${h[2]}${h[2]}`;
-    return `#${h.slice(0, HEX_FULL_LENGTH)}`;
-};
-/** var()의 prefix가 토큰 시스템에 속하는지 확인 */
-const hasKnownTokenPrefix = (varName, prefixSet) => {
-    for (const prefix of prefixSet) {
-        if (varName.startsWith(prefix))
-            return true;
-    }
-    return false;
-};
-/** tokenData에 등록된 토큰명 prefix Set — 커스텀 변수 제외용 */
-const buildTokenPrefixSet = (tokenData) => {
-    const prefixes = new Set();
-    for (const group of tokenData.groups) {
-        for (const token of group.tokens) {
-            const stripped = token.name.replace(/^--/, '');
-            const segments = stripped.split('-');
-            if (segments.length >= 2)
-                prefixes.add(`--${segments.slice(0, 2).join('-')}`);
-            if (segments.length >= 1)
-                prefixes.add(`--${segments[0]}`);
-        }
-    }
-    return prefixes;
-};
-/** 모든 토큰명을 Set으로 수집 */
-const buildTokenNameSet = (tokenData) => {
-    const names = new Set();
-    for (const group of tokenData.groups) {
-        for (const token of group.tokens)
-            names.add(token.name);
-    }
-    return names;
-};
-/** token prefix → 카테고리 역방향 맵 — invalid_token suggestion에 카테고리 명시용 */
-const buildPrefixCategoryMap = (tokenData) => {
-    const map = new Map();
-    for (const group of tokenData.groups) {
-        for (const token of group.tokens) {
-            const stripped = token.name.replace(/^--/, '');
-            const segments = stripped.split('-');
-            if (segments.length >= 2)
-                map.set(`--${segments.slice(0, 2).join('-')}`, group.category);
-            if (segments.length >= 1)
-                map.set(`--${segments[0]}`, group.category);
-        }
-    }
-    return map;
-};
-/** var 이름의 prefix에서 카테고리 추론 — 더 긴 prefix 우선 */
-const inferCategoryFromVarName = (varName, prefixCategoryMap) => {
-    const stripped = varName.replace(/^--/, '');
-    const segments = stripped.split('-');
-    if (segments.length >= 2) {
-        const cat = prefixCategoryMap.get(`--${segments.slice(0, 2).join('-')}`);
-        if (cat)
-            return cat;
-    }
-    return prefixCategoryMap.get(`--${segments[0]}`);
-};
-/** inline style + <style> 블록의 CSS 텍스트를 하나로 합침 */
-const extractAllCss = (root) => {
-    const parts = [];
-    for (const el of root.querySelectorAll('[style]')) {
-        const style = el.getAttribute('style');
-        if (style)
-            parts.push(style);
-    }
-    for (const styleEl of root.querySelectorAll('style')) {
-        parts.push(styleEl.textContent ?? '');
-    }
-    return parts.join(' ');
-};
-exports.extractAllCss = extractAllCss;
-/** CSS 텍스트에서 하드코딩된 색상값(hex/rgb)을 추출 */
-const collectHardcodedColors = (css) => {
-    const colors = [];
-    const hexPattern = new RegExp(HEX_PATTERN_SOURCE, 'g');
-    for (const match of css.matchAll(hexPattern)) {
-        colors.push({ raw: match[0], normalized: normalizeHex(match[0]) });
-    }
-    const rgbPattern = new RegExp(RGB_PATTERN_SOURCE, 'g');
-    for (const match of css.matchAll(rgbPattern)) {
-        colors.push({
-            raw: match[0],
-            normalized: rgbToHex(Number.parseInt(match[1], 10), Number.parseInt(match[2], 10), Number.parseInt(match[3], 10)),
-        });
-    }
-    return colors;
-};
-/** token_not_used suggestion 생성 */
-const buildTokenSuggestion = (raw, tokenNames) => tokenNames.length === 1
-    ? `Use var(${tokenNames[0]}) instead of ${raw}`
-    : `Possible tokens: ${tokenNames.map((t) => `var(${t})`).join(', ')}`;
-// ── 검증 함수 ────────────────────────────────────────────────────────────
-/** 하드코딩 색상 → token_not_used 에러 수집 */
-const collectTokenNotUsedErrors = (css, tokenValueMap) => {
-    const errors = [];
-    let missing = 0;
-    for (const color of collectHardcodedColors(css)) {
-        const tokenNames = tokenValueMap.get(color.normalized);
-        if (!tokenNames)
-            continue;
-        missing++;
-        errors.push({
-            type: 'token_not_used',
-            target: color.raw,
-            component: '(inline-style)',
-            message: `Hardcoded color '${color.raw}' should use a design token.`,
-            suggestion: buildTokenSuggestion(color.raw, tokenNames),
-        });
-    }
-    return { errors, missing };
-};
-/** var() 참조 → invalid_token 에러 수집 + correct 카운트 */
-const collectInvalidTokenErrors = (css, tokenNameSet, tokenPrefixSet, prefixCategoryMap) => {
-    const errors = [];
-    let correct = 0;
-    let invalid = 0;
-    const varPattern = new RegExp(VAR_PATTERN_SOURCE, 'g');
-    for (const varMatch of css.matchAll(varPattern)) {
-        const varName = varMatch[1];
-        if (!hasKnownTokenPrefix(varName, tokenPrefixSet))
-            continue;
-        if (tokenNameSet.has(varName)) {
-            correct++;
-        }
-        else {
-            invalid++;
-            const category = inferCategoryFromVarName(varName, prefixCategoryMap);
-            const suggestion = category
-                ? `Call get_design_tokens('${category}') to see available ${category} tokens.`
-                : 'Call get_design_tokens to see available tokens.';
-            errors.push({
-                type: 'invalid_token',
-                target: `var(${varName})`,
-                component: '(inline-style)',
-                message: `Token '${varName}' does not exist in the design system.`,
-                suggestion,
-            });
-        }
-    }
-    return { errors, correct, invalid };
-};
-/** 토큰 미사용 + 무효 토큰 감지 */
-const detectTokenIssues = (params) => {
-    const { root, tokenData, tokenValueMap } = params;
-    const allCss = extractAllCss(root);
-    const notUsed = collectTokenNotUsedErrors(allCss, tokenValueMap);
-    const invalidResult = collectInvalidTokenErrors(allCss, buildTokenNameSet(tokenData), buildTokenPrefixSet(tokenData), buildPrefixCategoryMap(tokenData));
-    return {
-        errors: [...notUsed.errors, ...invalidResult.errors],
-        tokenUsage: { correct: invalidResult.correct, missing: notUsed.missing, invalid: invalidResult.invalid },
-    };
-};
-exports.detectTokenIssues = detectTokenIssues;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.extractAllCss=exports.detectTokenIssues=exports.buildTokenValueMap=void 0;const e=e=>{const t=new Map;for(const o of e.groups)if("color"===o.category)for(const e of o.tokens){const o=e.value.toLowerCase(),s=t.get(o);s?s.push(e.name):t.set(o,[e.name])}return t};exports.buildTokenValueMap=e;const t=/#([0-9a-fA-F]{3,8})\b/g.source,o=/rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/g.source,s=/var\(\s*(--[a-zA-Z0-9-]+)(?:\s*,\s*[^)]+)?\s*\)/g.source,n=16,r=2,a=3,c=6,l=(e,t,o)=>`#${[e,t,o].map(e=>e.toString(n).padStart(2,"0")).join("")}`,i=e=>{const t=e.toLowerCase().replace("#","");return 3===t.length?`#${t[0]}${t[0]}${t[1]}${t[1]}${t[2]}${t[2]}`:`#${t.slice(0,6)}`},u=(e,t)=>{for(const o of t)if(e.startsWith(o))return!0;return!1},g=e=>{const t=new Set;for(const o of e.groups)for(const e of o.tokens){const o=e.name.replace(/^--/,"").split("-");o.length>=2&&t.add(`--${o.slice(0,2).join("-")}`),o.length>=1&&t.add(`--${o[0]}`)}return t},p=e=>{const t=new Set;for(const o of e.groups)for(const e of o.tokens)t.add(e.name);return t},f=e=>{const t=new Map;for(const o of e.groups)for(const e of o.tokens){const s=e.name.replace(/^--/,"").split("-");s.length>=2&&t.set(`--${s.slice(0,2).join("-")}`,o.category),s.length>=1&&t.set(`--${s[0]}`,o.category)}return t},d=(e,t)=>{const o=e.replace(/^--/,"").split("-");if(o.length>=2){const e=t.get(`--${o.slice(0,2).join("-")}`);if(e)return e}return t.get(`--${o[0]}`)},m=e=>{const t=[];for(const o of e.querySelectorAll("[style]")){const e=o.getAttribute("style");e&&t.push(e)}for(const o of e.querySelectorAll("style"))t.push(o.textContent??"");return t.join(" ")};exports.extractAllCss=m;const $=e=>{const s=[],n=new RegExp(t,"g");for(const t of e.matchAll(n))s.push({raw:t[0],normalized:i(t[0])});const r=new RegExp(o,"g");for(const t of e.matchAll(r))s.push({raw:t[0],normalized:l(Number.parseInt(t[1],10),Number.parseInt(t[2],10),Number.parseInt(t[3],10))});return s},h=(e,t)=>1===t.length?`Use var(${t[0]}) instead of ${e}`:`Possible tokens: ${t.map(e=>`var(${e})`).join(", ")}`,k=(e,t)=>{const o=[];let s=0;for(const n of $(e)){const e=t.get(n.normalized);e&&(s++,o.push({type:"token_not_used",target:n.raw,component:"(inline-style)",message:`Hardcoded color '${n.raw}' should use a design token.`,suggestion:h(n.raw,e)}))}return{errors:o,missing:s}},w=(e,t,o,n)=>{const r=[];let a=0,c=0;const l=new RegExp(s,"g");for(const s of e.matchAll(l)){const e=s[1];if(u(e,o))if(t.has(e))a++;else{c++;const t=d(e,n),o=t?`Call get_design_tokens('${t}') to see available ${t} tokens.`:"Call get_design_tokens to see available tokens.";r.push({type:"invalid_token",target:`var(${e})`,component:"(inline-style)",message:`Token '${e}' does not exist in the design system.`,suggestion:o})}}return{errors:r,correct:a,invalid:c}},x=e=>{const{root:t,tokenData:o,tokenValueMap:s}=e,n=m(t),r=k(n,s),a=w(n,p(o),g(o),f(o));return{errors:[...r.errors,...a.errors],tokenUsage:{correct:a.correct,missing:r.missing,invalid:a.invalid}}};exports.detectTokenIssues=x;

package/bin/version.d.ts

@@ -3,4 +3,4 @@
  * scripts/generate-version-ts.ts 가 ui-admin/package.json 의 version 으로부터 자동 생성한다.
  * 수동 편집 금지 — 빌드(`pnpm generate:version-ts` 또는 `pnpm build`) 시 덮어쓰여진다.
  */
-export declare const VERSION = "1.8.13";
+export declare const VERSION = "1.8.14";

package/bin/version.js

@@ -1,9 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.VERSION = void 0;
-/**
- * NCDS UI Admin MCP 서버가 노출하는 ui-admin 정합 기준 버전.
- * scripts/generate-version-ts.ts 가 ui-admin/package.json 의 version 으로부터 자동 생성한다.
- * 수동 편집 금지 — 빌드(`pnpm generate:version-ts` 또는 `pnpm build`) 시 덮어쓰여진다.
- */
-exports.VERSION = '1.8.13';
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.VERSION=void 0,exports.VERSION="1.8.14";

package/data/_tokens.json

@@ -10,7 +10,7 @@
     {
       "name": "primary-red",
       "category": "color",
-      "description": "브랜드 Primary. 450이 CTA 기본색.",
+      "description": "브랜드 Primary. 강한 환기력 때문에 행동 트리거 전용. 450~500은 CTA·핵심 행동 트리거(450이 기본), 600~700은 에러·주의(Destructive)로 의미가 갈린다. 트리거와 상태 색을 섞지 않는다.",
       "tokens": [
         {
           "name": "--primary-red-50",
@@ -178,7 +178,7 @@
     {
       "name": "blue",
       "category": "color",
-      "description": "Info / 링크 상태.",
+      "description": "정보·기능 영역의 기본색. 행동을 재촉하지 않는 중립·신뢰 기반 강조에 넓게 사용(Info·링크 포함). 그레이스케일을 압도하지 않는다.",
       "tokens": [
         {
           "name": "--blue-50",
@@ -319,7 +319,7 @@
     {
       "name": "violet",
       "category": "color",
-      "description": "Accent / 장식 포인트.",
+      "description": "선택적 Accent. 행동 유도와 무관한 시각적 강조·데이터 시각화 전용. 파랑과 같은 위계로 섞지 않으며, 어떤 경우에도 파랑의 비중을 넘지 않는다.",
       "tokens": [
         {
           "name": "--violet-50",

package/data/select-box.json

@@ -145,6 +145,11 @@
       "required": false,
       "default": "선택하세요"
     },
+    "readOnly": {
+      "type": "boolean",
+      "required": false,
+      "default": false
+    },
     "register": {
       "type": "object",
       "required": false,
@@ -187,6 +192,7 @@
     "ncua-selectbox--disabled",
     "ncua-selectbox--multiple",
     "ncua-selectbox--open",
+    "ncua-selectbox--readonly",
     "ncua-selectbox--simple",
     "ncua-selectbox__arrow",
     "ncua-selectbox__arrow--up",

package/data/select.json

@@ -80,6 +80,11 @@
       "type": "string",
       "required": false
     },
+    "readOnly": {
+      "type": "boolean",
+      "required": false,
+      "default": false
+    },
     "register": {
       "type": "object",
       "required": false,
@@ -109,6 +114,7 @@
   "bemClasses": [
     "ncua-hint-text",
     "ncua-select",
+    "ncua-select--readonly",
     "ncua-select--simple",
     "ncua-select__content",
     "ncua-select__tag"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ncds/ui-admin-mcp",
-  "version": "1.0.0-alpha.25",
+  "version": "1.0.0-alpha.27",
   "description": "NCDS UI Admin MCP 서버 — AI 에이전트가 NCUA 컴포넌트를 조회하고 HTML을 검증할 수 있는 MCP 서버",
   "bin": {
     "ncua-mcp": "./bin/server.mjs"
@@ -22,7 +22,8 @@
     "generate:version-ts": "tsx scripts/generate-version-ts.ts",
     "build:bundle": "tsx scripts/build-bundle.ts",
     "build:server": "mkdir -p bin && rm -rf bin/definitions bin/overrides && cp -r src/definitions bin/definitions && cp -r src/overrides bin/overrides && find bin/definitions -name '*.ts' -delete && tsc --project tsconfig.json",
-    "build": "pnpm extract && pnpm extract:icons && pnpm extract:tokens && pnpm generate:cdn-meta && pnpm generate:version-ts && pnpm build:bundle && pnpm build:server",
+    "build": "pnpm extract && pnpm extract:icons && pnpm extract:tokens && pnpm generate:cdn-meta && pnpm generate:version-ts && pnpm build:bundle && pnpm build:server && pnpm minify:compiled",
+    "minify:compiled": "tsx scripts/minify-compiled.ts",
     "check-meta": "tsx scripts/check-meta-coherence.ts",
     "test": "vitest run --config vitest.config.ts",
     "test:coverage": "vitest run --coverage --config vitest.config.ts",
@@ -62,6 +63,8 @@
   "devDependencies": {
     "@ncds/ui-admin": "workspace:*",
     "@types/lodash": "^4.17.24",
+    "glob": "^10.3.0",
+    "terser": "^5.28.0",
     "@types/node": "^25.5.0",
     "@types/react": "^18.3.20",
     "esbuild": "^0.28.0",