@ncds/ui-admin-mcp 1.0.0-alpha.14 → 1.0.0-alpha.15

package/bin/definitions/external/editor.d.ts

@@ -0,0 +1,50 @@
+/**
+ * Story 5.10: editor 외부 분기 정의
+ *
+ * froala 기반 에디터(`@ncds/editor-html`)의 응답 메타·CDN URL·props·cdnDefaults·methods.
+ * `tools/external/editor.ts` 의 `buildEditorResponse` 가 본 정의를 읽어 응답 조립.
+ * (json 대신 ts — tsconfig `module: Node16` 환경에서 import 단순화. 빌드 시 자동 포함.)
+ */
+export declare const editorDefinition: {
+    readonly name: "editor";
+    readonly className: "NcdsEditor";
+    readonly category: "form";
+    readonly description: "froala 기반 WYSIWYG 에디터. textarea 를 in-place 변환.";
+    readonly cdn: {
+        readonly version: "0.0";
+        readonly css: "https://fe-sdk.cdn-nhncommerce.com/@ncds/editor/0.0/ncds-editor.css";
+        readonly js: "https://fe-sdk.cdn-nhncommerce.com/@ncds/editor/0.0/ncds-editor.js";
+    };
+    readonly props: readonly [{
+        readonly name: "heightMin";
+        readonly type: "number";
+        readonly default: 300;
+        readonly description: "최소 높이 (px)";
+    }, {
+        readonly name: "heightMax";
+        readonly type: "number";
+        readonly default: 600;
+        readonly description: "최대 높이 (px)";
+    }, {
+        readonly name: "heightResize";
+        readonly type: "boolean";
+        readonly default: false;
+        readonly description: "높이 조정 가능 여부";
+    }, {
+        readonly name: "placeholderText";
+        readonly type: "string";
+        readonly default: "내용을 입력하세요.";
+        readonly description: "플레이스홀더 텍스트";
+    }, {
+        readonly name: "imageUploadCallback";
+        readonly type: "function";
+        readonly description: "이미지 업로드 콜백 함수명 (전역 함수). 외부 분기에서 stripFunctionProps 로 자동 제외 — data-* 직렬화 대상 아님";
+    }];
+    readonly cdnDefaults: {
+        heightMin: number;
+        heightMax: number;
+        heightResize: boolean;
+        placeholderText: string;
+    };
+    readonly methods: readonly ["getHTML()", "setHTML(html)", "getText()", "focus()", "blur()", "enable()", "disable()", "destroy()", "insertImage(src, alt, link)", "insertLink(href, text)", "insertTable(rows, cols)", "on(event, handler)", "off(event)"];
+};

package/bin/definitions/external/editor.js

@@ -0,0 +1,53 @@
+"use strict";
+/**
+ * Story 5.10: editor 외부 분기 정의
+ *
+ * froala 기반 에디터(`@ncds/editor-html`)의 응답 메타·CDN URL·props·cdnDefaults·methods.
+ * `tools/external/editor.ts` 의 `buildEditorResponse` 가 본 정의를 읽어 응답 조립.
+ * (json 대신 ts — tsconfig `module: Node16` 환경에서 import 단순화. 빌드 시 자동 포함.)
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.editorDefinition = void 0;
+exports.editorDefinition = {
+    name: 'editor',
+    className: 'NcdsEditor',
+    category: 'form',
+    description: 'froala 기반 WYSIWYG 에디터. textarea 를 in-place 변환.',
+    cdn: {
+        version: '0.0',
+        css: 'https://fe-sdk.cdn-nhncommerce.com/@ncds/editor/0.0/ncds-editor.css',
+        js: 'https://fe-sdk.cdn-nhncommerce.com/@ncds/editor/0.0/ncds-editor.js',
+    },
+    props: [
+        { name: 'heightMin', type: 'number', default: 300, description: '최소 높이 (px)' },
+        { name: 'heightMax', type: 'number', default: 600, description: '최대 높이 (px)' },
+        { name: 'heightResize', type: 'boolean', default: false, description: '높이 조정 가능 여부' },
+        { name: 'placeholderText', type: 'string', default: '내용을 입력하세요.', description: '플레이스홀더 텍스트' },
+        {
+            name: 'imageUploadCallback',
+            type: 'function',
+            description: '이미지 업로드 콜백 함수명 (전역 함수). 외부 분기에서 stripFunctionProps 로 자동 제외 — data-* 직렬화 대상 아님',
+        },
+    ],
+    cdnDefaults: {
+        heightMin: 300,
+        heightMax: 600,
+        heightResize: false,
+        placeholderText: '내용을 입력하세요.',
+    },
+    methods: [
+        'getHTML()',
+        'setHTML(html)',
+        'getText()',
+        'focus()',
+        'blur()',
+        'enable()',
+        'disable()',
+        'destroy()',
+        'insertImage(src, alt, link)',
+        'insertLink(href, text)',
+        'insertTable(rows, cols)',
+        'on(event, handler)',
+        'off(event)',
+    ],
+};

package/bin/definitions/js-api.json

@@ -60,10 +60,10 @@
     "constructorParams": {
       "wrapper": "HTMLElement — container element",
       "options.size": "'xs' | 'sm'",
-      "options.static": "boolean",
-      "options.datePickerOptions": "Array<{ element: string, placeholder?: string, options: FlatpickrOptions }>",
-      "options.buttons": "Array<{ text: string, period: number, unit: 'days'|'months', isCurrent: boolean }>",
-      "options.onValidationError": "(error) => void"
+      "options.datePickerOptions": "Array<{ element: string, attrName?: string, placeholder?: string, options: FlatpickrOptions }>",
+      "options.buttons": "Array<{ text: string, period: number, unit: 'days'|'weeks'|'months'|'years', isCurrent: boolean }>",
+      "options.onValidationError": "(error: ValidationError) => void",
+      "options.autoComplete": "'on' | 'off'"
     },
     "methods": ["getDates()", "setDate(dates: string[])", "setMultipleDates(dates: string[])"],
     "example": "const dp = new window.ncua.DatePicker(document.getElementById('my-dp'), {\n  size: 'xs',\n  datePickerOptions: [{ element: 'date-input', placeholder: 'Select date', options: { dateFormat: 'Y-m-d' } }]\n});",
@@ -94,7 +94,8 @@
       "options.step": "number (default: 1)",
       "options.value": "number | [number, number]",
       "options.onChange": "(value) => void",
-      "options.disabled": "boolean"
+      "options.disabled": "boolean",
+      "options.labelPosition": "'bottom' | 'top-floating'"
     },
     "methods": ["getValue()", "setValue(value)", "enable()", "disable()", "destroy()"],
     "example": "const slider = new window.ncua.Slider(document.getElementById('my-slider'), {\n  min: 0, max: 100, value: 50,\n  onChange: (v) => console.log(v)\n});",
@@ -121,7 +122,15 @@
     "constructorParams": {
       "title": "string",
       "content": "string (HTML supported)",
-      "options.position": "'top' | 'bottom' | 'left' | 'right' (default: 'top')"
+      "options.position": "'top' | 'bottom' | 'left' | 'right' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'auto' (default: 'auto')",
+      "options.type": "'long' | 'short'",
+      "options.tooltipType": "'white' | 'black'",
+      "options.iconType": "'stroke' | 'fill'",
+      "options.size": "'sm' | 'md'",
+      "options.hideArrow": "boolean",
+      "options.zIndex": "number",
+      "options.useShadowDOM": "boolean",
+      "options.className": "string"
     },
     "methods": ["getElement()", "showTooltip()", "hideTooltip()", "destroy()"],
     "example": "const tip = window.ncua.Tooltip.createShort('Help', 'Tooltip content');\ndocument.getElementById('container').appendChild(tip.getElement());",
@@ -129,7 +138,6 @@
       "type": "short",
       "tooltipType": "black",
       "iconType": "stroke",
-      "iconStyle": "help-circle",
       "position": "auto",
       "size": "sm"
     }
@@ -146,7 +154,14 @@
     "constructorParams": {
       "title": "string",
       "supportingText": "string",
-      "options.autoClose": "number (ms, 0 = no auto-close)"
+      "options.autoClose": "number (ms, 0 = no auto-close)",
+      "options.type": "'floating' | 'message' | 'full-width'",
+      "options.color": "'neutral' | 'success' | 'error' | 'warning' | 'info'",
+      "options.actions": "Array<NotificationAction>",
+      "options.onClose": "() => void",
+      "options.className": "string",
+      "options.supportTextLink": "string — full-width 전용 supportingText 링크 URL",
+      "options.onHidePermanently": "() => void — full-width/message 다시보지 않기 핸들러"
     },
     "methods": ["show(parent?)", "remove()", "destroy()"],
     "staticMethods": ["success()", "error()", "warning()", "info()", "neutral()"],
@@ -158,7 +173,10 @@
     "constructor": "new window.ncua.ProgressBar(options?)",
     "constructorParams": {
       "options.value": "number (0-100)",
-      "options.label": "'right' | 'bottom' | 'top-float' | 'bottom-float'"
+      "options.label": "'right' | 'bottom' | 'top-float' | 'bottom-float'",
+      "options.segments": "ProgressSegment[] — 멀티 세그먼트 진행률",
+      "options.showZeroLabel": "boolean — 0% 라벨 표시 여부",
+      "options.valueToPercent": "boolean — value 를 % 환산 표시"
     },
     "methods": ["getElement()", "updateOptions(newOptions)", "toHTML()"],
     "example": "const bar = new window.ncua.ProgressBar({ value: 65, label: 'right' });\ndocument.getElementById('container').appendChild(bar.getElement());",
@@ -174,7 +192,10 @@
       "options.text": "string",
       "options.size": "'sm' | 'md' (default: 'sm')",
       "options.close": "boolean — show close button",
-      "options.onButtonClick": "() => void — close handler"
+      "options.onButtonClick": "(event: MouseEvent) => void — close handler",
+      "options.count": "string — 카운트 표시",
+      "options.icon": "SideSlotType — 좌측 아이콘 슬롯",
+      "options.maxLength": "number — 최대 텍스트 길이 (default: 20)"
     },
     "methods": ["getElement()", "setText(text)", "setCount(count)", "destroy()"],
     "example": "const tag = new window.ncua.Tag({ text: 'Label', close: true, onButtonClick: () => tag.destroy() });\ndocument.getElementById('container').appendChild(tag.getElement());",
@@ -190,7 +211,21 @@
       "options.container": "HTMLElement | string — auto-append target",
       "options.onChange": "(files: File[]) => void",
       "options.onFail": "(invalidFiles: File[]) => void",
-      "options.disabled": "boolean"
+      "options.disabled": "boolean",
+      "options.size": "'xs' | 'sm'",
+      "options.accept": "string — e.g. '.jpg,.png' or 'image/*'",
+      "options.multiple": "boolean",
+      "options.maxFileCount": "number",
+      "options.maxFileSize": "number — bytes",
+      "options.buttonLabel": "string",
+      "options.label": "string",
+      "options.hintItems": "string[]",
+      "options.isRequired": "boolean",
+      "options.showHelpIcon": "boolean",
+      "options.hintText": "string",
+      "options.validation": "boolean",
+      "options.destructive": "boolean",
+      "options.className": "string"
     },
     "methods": ["getElement()", "setDisabled(boolean)", "destroy()"],
     "example": "const fi = new window.ncua.FileInput({\n  container: 'file-container',\n  onChange: (files) => console.log(files)\n});",
@@ -204,10 +239,27 @@
     "constructor": "new window.ncua.ImageFileInput(options)",
     "constructorParams": {
       "options.container": "HTMLElement | string — auto-append target",
-      "options.onChange": "(files: File[]) => void",
+      "options.onChange": "(files: File[]) => void — controlled mode",
+      "options.onFileSelect": "(files: File[]) => void — uncontrolled mode",
+      "options.onFail": "(files: InvalidFile[]) => void",
+      "options.value": "File[] — initial files (controlled mode)",
+      "options.disabled": "boolean",
+      "options.size": "'xs' | 'sm'",
+      "options.accept": "string — e.g. '.jpg,.png' or 'image/*'",
+      "options.multiple": "boolean",
       "options.maxFileCount": "number",
-      "options.acceptedFileTypes": "string[]",
-      "options.maxFileSize": "number"
+      "options.maxFileSize": "number — bytes",
+      "options.buttonLabel": "string",
+      "options.imagePreviewTooltipLabel": "string",
+      "options.label": "string",
+      "options.hintItems": "string[]",
+      "options.isRequired": "boolean",
+      "options.showHelpIcon": "boolean",
+      "options.hintText": "string",
+      "options.validation": "boolean",
+      "options.destructive": "boolean",
+      "options.fileInputName": "string — name attr (PHP form 제출용)",
+      "options.className": "string"
     },
     "cdnDefaults": {
       "buttonLabel": "파일 찾기"
@@ -222,7 +274,8 @@
       "options.svgString": "string — SVG content",
       "options.theme": "'light-circle' | 'dark-circle' | 'outline-circle' | 'square-outline'",
       "options.color": "'neutral' | 'error' | 'warning' | 'success'",
-      "options.size": "'sm' | 'md' | 'lg' | 'xl'"
+      "options.size": "'sm' | 'md' | 'lg' | 'xl'",
+      "options.className": "string"
     },
     "methods": ["getElement()", "updateColor(color)", "updateSize(size)", "destroy()"],
     "example": "const icon = new window.ncua.FeaturedIcon({ svgString: '<svg>...</svg>', color: 'success', size: 'md' });\ndocument.getElementById('container').appendChild(icon.getElement());"

package/bin/tools/renderToHtml.d.ts

@@ -19,5 +19,20 @@ export interface RenderToHtmlParams {
      */
     instanceId: string;
 }
+/** Story 5.9: 사용자 props 에서 함수 prop 재귀 제거 (JSON 직렬화·deep merge 안전).
+ *  cdnDefaults 는 JSON 이라 함수 없음 → 사용자 props 만 정리.
+ *  Story 5.10: 외부 분기 모듈(`tools/external/editor.ts`)에서도 재사용 → export. */
+export declare const stripFunctionProps: (obj: unknown) => unknown;
+/** Story 5.9: cdnDefaults 와 사용자 props 를 deep merge.
+ *  - 사용자 값 우선 (lodash merge 의 두 번째 인자가 우선)
+ *  - 함수 prop 은 사용자 props 에서 stripFunctionProps 로 사전 제거
+ *  - DatePicker `datePickerOptions` 배열 한정: 각 항목의 `options` 에 cdnDefaults 의 첫 항목 options 를 per-element 부분 merge
+ *  - 다른 배열(`buttons` 등) 은 사용자 값 그대로
+ *  반환: { merged, defaultsApplied } — defaultsApplied 는 cdnDefaults 에 있고 사용자 props 에 없는 top-level 키 (defaultsUsed 응답용)
+ *  Story 5.10: 외부 분기 모듈(`tools/external/editor.ts`)에서도 재사용 → export. */
+export declare const mergeCdnDefaults: (componentName: string, cdnDefaults: Record<string, unknown> | undefined, userProps: Record<string, unknown>) => {
+    merged: Record<string, unknown>;
+    defaultsApplied: string[];
+};
 /** render_to_html tool — props로 React 컴포넌트를 렌더링하여 HTML + React 매핑 반환 */
 export declare const renderToHtml: (params: RenderToHtmlParams) => McpToolResponse;

package/bin/tools/renderToHtml.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.renderToHtml = void 0;
+exports.renderToHtml = exports.mergeCdnDefaults = exports.stripFunctionProps = void 0;
 /**
  * render_to_html tool — 컴포넌트 속성을 전달하면 정확한 HTML + React 매핑을 반환 (순수 함수)
  *
@@ -14,6 +14,7 @@ exports.renderToHtml = void 0;
 // biome-ignore-all lint/style/useTemplate: 기존 attrsPrefix 문자열 결합 (Story 5.8 scope 외)
 const lodash_1 = require("lodash");
 const response_js_1 = require("../utils/response.js");
+const editor_js_1 = require("./external/editor.js");
 // ── 상수 ──────────────────────────────────────────────────────────
 /** React 특수 props 차단 — injection 방지 */
 const BLOCKED_PROPS = new Set(['dangerouslySetInnerHTML', 'ref', '__self', '__source']);
@@ -444,30 +445,33 @@ const normalizeCdnInputProps = (componentName, cdnConfig) => {
     return { normalized: { ...cdnConfig, options: normalizedOptions }, warnings };
 };
 /** Story 5.9: 사용자 props 에서 함수 prop 재귀 제거 (JSON 직렬화·deep merge 안전).
- *  cdnDefaults 는 JSON 이라 함수 없음 → 사용자 props 만 정리 */
+ *  cdnDefaults 는 JSON 이라 함수 없음 → 사용자 props 만 정리.
+ *  Story 5.10: 외부 분기 모듈(`tools/external/editor.ts`)에서도 재사용 → export. */
 const stripFunctionProps = (obj) => {
     if (typeof obj === 'function')
         return undefined;
     if (Array.isArray(obj)) {
-        return obj.map((item) => stripFunctionProps(item)).filter((item) => item !== undefined);
+        return obj.map((item) => (0, exports.stripFunctionProps)(item)).filter((item) => item !== undefined);
     }
     if (typeof obj === 'object' && obj !== null) {
         return Object.fromEntries(Object.entries(obj)
             .filter(([, value]) => typeof value !== 'function')
-            .map(([key, value]) => [key, stripFunctionProps(value)]));
+            .map(([key, value]) => [key, (0, exports.stripFunctionProps)(value)]));
     }
     return obj;
 };
+exports.stripFunctionProps = stripFunctionProps;
 /** Story 5.9: cdnDefaults 와 사용자 props 를 deep merge.
  *  - 사용자 값 우선 (lodash merge 의 두 번째 인자가 우선)
  *  - 함수 prop 은 사용자 props 에서 stripFunctionProps 로 사전 제거
  *  - DatePicker `datePickerOptions` 배열 한정: 각 항목의 `options` 에 cdnDefaults 의 첫 항목 options 를 per-element 부분 merge
  *  - 다른 배열(`buttons` 등) 은 사용자 값 그대로
- *  반환: { merged, defaultsApplied } — defaultsApplied 는 cdnDefaults 에 있고 사용자 props 에 없는 top-level 키 (defaultsUsed 응답용) */
+ *  반환: { merged, defaultsApplied } — defaultsApplied 는 cdnDefaults 에 있고 사용자 props 에 없는 top-level 키 (defaultsUsed 응답용)
+ *  Story 5.10: 외부 분기 모듈(`tools/external/editor.ts`)에서도 재사용 → export. */
 const mergeCdnDefaults = (componentName, cdnDefaults, userProps) => {
     if (!cdnDefaults)
         return { merged: userProps, defaultsApplied: [] };
-    const userPropsClean = stripFunctionProps(userProps);
+    const userPropsClean = (0, exports.stripFunctionProps)(userProps);
     const baseMerged = (0, lodash_1.merge)((0, lodash_1.cloneDeep)(cdnDefaults), userPropsClean);
     const merged = componentName === 'date-picker' && Array.isArray(userPropsClean.datePickerOptions)
         ? {
@@ -484,6 +488,7 @@ const mergeCdnDefaults = (componentName, cdnDefaults, userProps) => {
     const defaultsApplied = Object.keys(cdnDefaults).filter((key) => !(key in userPropsClean));
     return { merged, defaultsApplied };
 };
+exports.mergeCdnDefaults = mergeCdnDefaults;
 /** CDN config(에이전트 입력) → React props (buildReactOutput 입력) 번역.
  *  단순 컴포넌트는 identity, 차이가 있는 컴포넌트는 별도 룰. */
 const translateCdnToReactProps = (componentName, cdnConfig) => {
@@ -648,6 +653,10 @@ const buildJsField = (componentData, jsApiMap) => {
 const renderToHtml = (params) => {
     const { componentMap, bundle, iconBundle, cdnMeta, iconMeta, reactRuntime, jsApiMap, name, props, instanceId } = params;
     const normalized = (0, response_js_1.normalizeName)(name);
+    // Story 5.10: editor alias 검출 시 ui-admin 흐름 우회 — 외부 분기에서 응답 직접 조립
+    if ((0, editor_js_1.isEditorAlias)(normalized)) {
+        return (0, editor_js_1.buildEditorResponse)(props ?? {}, instanceId);
+    }
     const componentData = componentMap.get(normalized);
     if (!componentData)
         return (0, response_js_1.componentNotFoundResponse)(normalized);
@@ -670,7 +679,7 @@ const renderToHtml = (params) => {
         const normalizedCdnProps = cdnNormalization.normalized;
         // Story 5.9: cdnDefaults 와 deep merge (사용자 props 우선, 함수 prop skip, datePickerOptions per-element 부분 merge)
         const cdnMergeResult = isCdnInput && jsApi
-            ? mergeCdnDefaults(normalized, jsApi.cdnDefaults, normalizedCdnProps)
+            ? (0, exports.mergeCdnDefaults)(normalized, jsApi.cdnDefaults, normalizedCdnProps)
             : { merged: normalizedCdnProps, defaultsApplied: [] };
         const mergedCdnProps = cdnMergeResult.merged;
         const reactInput = isCdnInput ? translateCdnToReactProps(normalized, mergedCdnProps) : mergedCdnProps;

package/data/badge-group.json

@@ -3,7 +3,7 @@
   "exportName": "BadgeGroup",
   "importPath": "@ncds/ui-admin",
   "jsRequired": false,
-  "category": "feedback",
+  "category": "feedback-and-status",
   "description": "BadgeGroup은 Badge 컴포넌트를 그룹화하여 표시하는 컴포넌트입니다. 주로 Badge와 함께 추가적인 라벨과 아이콘을 표시하여 액션유도할 수 있는 아이템으로 활용할 수 있습니다.",
   "aliases": [
     "BadgeGroup",

package/data/badge.json

@@ -3,7 +3,7 @@
   "exportName": "Badge",
   "importPath": "@ncds/ui-admin",
   "jsRequired": false,
-  "category": "data-display",
+  "category": "feedback-and-status",
   "description": "Badge는 상태나 중요성 및 이벤트 강조를 나타내는 레이블이며 빠른 인식을 제공해야 합니다.",
   "aliases": [
     "Badge",

package/data/bread-crumb.json

@@ -57,7 +57,7 @@
     "items": {
       "type": "object",
       "required": true,
-      "rawType": "import(\"/Users/nhncommerce/Desktop/project/ncds/packages/ui-admin/src/components/bread-crumb/BreadCrumb\").BreadcrumbItemProps[]",
+      "rawType": "import(\"/Users/nhncommerce/Desktop/project/ncds/packages/ui-admin/src/components/navigation/bread-crumb/BreadCrumb\").BreadcrumbItemProps[]",
       "properties": {
         "href": {
           "type": "string",

package/data/carousel-arrow.json

@@ -3,7 +3,7 @@
   "exportName": "CarouselArrow",
   "importPath": "@ncds/ui-admin",
   "jsRequired": false,
-  "category": "feedback",
+  "category": "feedback-and-status",
   "description": "CarouselArrow는 캐러셀의 이전/다음 페이지로 이동할 수 있는 화살표 버튼 컴포넌트입니다.",
   "aliases": [
     "CarouselArrow",

package/data/carousel-number-group.json

@@ -3,7 +3,7 @@
   "exportName": "CarouselNumberGroup",
   "importPath": "@ncds/ui-admin",
   "jsRequired": false,
-  "category": "feedback",
+  "category": "feedback-and-status",
   "description": "CarouselNumberGroup은 캐러셀의 현재 페이지와 전체 페이지 수를 표시하는 컴포넌트입니다.",
   "aliases": [
     "CarouselNumberGroup",

package/data/checkbox.json

@@ -3,7 +3,7 @@
   "exportName": "Checkbox",
   "importPath": "@ncds/ui-admin",
   "jsRequired": false,
-  "category": "input",
+  "category": "forms-and-input",
   "description": "체크박스는 사용자가 목록에서 하나 이상의 항목을 선택하거나 옵션을 활성화/비활성화할 때 사용하는 핵심 Selection 컴포넌트입니다.",
   "aliases": [
     "체크박스",

package/data/combo-box.json

@@ -3,7 +3,7 @@
   "exportName": "ComboBox",
   "importPath": "@ncds/ui-admin",
   "jsRequired": true,
-  "category": "input",
+  "category": "forms-and-input",
   "description": "ComboBox는 여러 개의 데이터에서 검색(입력)하거나 리스트에서 옵션을 골라 빠르게 선택하는 복합 선택 컴포넌트입니다.",
   "aliases": [
     "콤보박스",

package/data/date-picker.json

@@ -3,7 +3,7 @@
   "exportName": "DatePicker",
   "importPath": "@ncds/ui-admin",
   "jsRequired": true,
-  "category": "input",
+  "category": "forms-and-input",
   "description": "DatePicker는 등록일, 노출일, 검색 기간 등 날짜 또는 시간 설정이 필요한 경우 사용하는 선택 위젯입니다.",
   "aliases": [
     "날짜선택위젯",

package/data/divider.json

@@ -3,7 +3,7 @@
   "exportName": "Divider",
   "importPath": "@ncds/ui-admin",
   "jsRequired": false,
-  "category": "data-display",
+  "category": "layout",
   "description": "콘텐츠 영역을 시각적으로 구분하는 수평 또는 수직 구분선 컴포넌트입니다.",
   "aliases": [
     "Divider",

package/data/dot.json

@@ -3,7 +3,7 @@
   "exportName": "Dot",
   "importPath": "@ncds/ui-admin",
   "jsRequired": false,
-  "category": "icon",
+  "category": "image-and-icons",
   "description": "Dot 컴포넌트는 상태나 알림을 시각적으로 표시하기 위한 작은 원형 표시기입니다",
   "aliases": [
     "Dot",

package/data/dropdown.json

@@ -3,7 +3,7 @@
   "exportName": "Dropdown",
   "importPath": "@ncds/ui-admin",
   "jsRequired": false,
-  "category": "overlay",
+  "category": "overlays",
   "description": "Dropdown(메뉴형)은 버튼, 아이콘, 아바타 등 트리거 요소를 통해 숨겨진 메뉴 또는 작업(Action) 목록을 레이어 형태로 노출하는 컴포넌트입니다.",
   "aliases": [
     "Dropdown",
@@ -97,32 +97,25 @@
       "values": [
         "left",
         "right"
-      ],
-      "default": "left"
+      ]
     },
     "className": {
       "type": "string",
       "required": false
     },
-    "closeOnClickItem": {
-      "type": "boolean",
-      "required": false,
-      "default": true
-    },
     "closeOnClickOutside": {
       "type": "boolean",
-      "required": false,
-      "default": true
+      "required": false
     },
     "groups": {
       "type": "object",
       "required": true,
-      "rawType": "import(\"/Users/nhncommerce/Desktop/project/ncds/packages/ui-admin/src/components/dropdown/Dropdown\").DropdownGroup[]",
+      "rawType": "import(\"/Users/nhncommerce/Desktop/project/ncds/packages/ui-admin/src/components/overlays/dropdown/Dropdown\").DropdownGroup[]",
       "properties": {
         "items": {
           "type": "object",
           "required": true,
-          "rawType": "import(\"/Users/nhncommerce/Desktop/project/ncds/packages/ui-admin/src/components/dropdown/Dropdown\").DropdownItemType[]",
+          "rawType": "import(\"/Users/nhncommerce/Desktop/project/ncds/packages/ui-admin/src/components/overlays/dropdown/Dropdown\").DropdownItemType[]",
           "properties": {
             "id": {
               "type": "string",
@@ -160,15 +153,27 @@
             "className": {
               "type": "string",
               "required": false
+            },
+            "visible": {
+              "type": "boolean",
+              "required": false
+            },
+            "required": {
+              "type": "boolean",
+              "required": false
             }
           }
+        },
+        "sortable": {
+          "type": "boolean",
+          "required": false
         }
       }
     },
     "header": {
       "type": "object",
       "required": false,
-      "rawType": "import(\"/Users/nhncommerce/Desktop/project/ncds/packages/ui-admin/src/components/dropdown/Dropdown\").DropdownHeaderType | undefined",
+      "rawType": "import(\"/Users/nhncommerce/Desktop/project/ncds/packages/ui-admin/src/components/overlays/dropdown/Dropdown\").DropdownHeaderType | undefined",
       "properties": {
         "type": {
           "type": "string",
@@ -191,13 +196,12 @@
     },
     "opened": {
       "type": "boolean",
-      "required": false,
-      "default": false
+      "required": false
     },
     "trigger": {
       "type": "object",
       "required": true,
-      "rawType": "import(\"/Users/nhncommerce/Desktop/project/ncds/packages/ui-admin/src/components/dropdown/Dropdown\").AvatarTrigger | import(\"/Users/nhncommerce/Desktop/project/ncds/packages/ui-admin/src/components/dropdown/Dropdown\").ButtonTrigger | import(\"/Users/nhncommerce/Desktop/project/ncds/packages/ui-admin/src/components/dropdown/Dropdown\").IconTrigger | import(\"/Users/nhncommerce/Desktop/project/ncds/packages/ui-admin/src/components/dropdown/Dropdown\").CustomTrigger",
+      "rawType": "import(\"/Users/nhncommerce/Desktop/project/ncds/packages/ui-admin/src/components/overlays/dropdown/Dropdown\").AvatarTrigger | import(\"/Users/nhncommerce/Desktop/project/ncds/packages/ui-admin/src/components/overlays/dropdown/Dropdown\").ButtonTrigger | import(\"/Users/nhncommerce/Desktop/project/ncds/packages/ui-admin/src/components/overlays/dropdown/Dropdown\").IconTrigger | import(\"/Users/nhncommerce/Desktop/project/ncds/packages/ui-admin/src/components/overlays/dropdown/Dropdown\").CustomTrigger",
       "properties": {
         "type": {
           "type": "string",
@@ -222,13 +226,23 @@
           "required": false
         }
       }
+    },
+    "variant": {
+      "type": "enum",
+      "required": false,
+      "values": [
+        "action",
+        "config"
+      ]
     }
   },
   "html": {},
   "bemClasses": [
     "ncua-dropdown",
+    "ncua-dropdown-",
     "ncua-dropdown--right",
     "ncua-dropdown__avatar",
+    "ncua-dropdown__footer",
     "ncua-dropdown__group",
     "ncua-dropdown__header",
     "ncua-dropdown__header-avatar-group",
@@ -236,12 +250,16 @@
     "ncua-dropdown__header-text",
     "ncua-dropdown__header-title",
     "ncua-dropdown__item",
-    "ncua-dropdown__item-clickable-layer",
+    "ncua-dropdown__item--config",
+    "ncua-dropdown__item--drag-preview",
     "ncua-dropdown__item-content",
+    "ncua-dropdown__item-drag-handle",
+    "ncua-dropdown__item-drop-indicator",
     "ncua-dropdown__item-icon",
     "ncua-dropdown__item-shortcut",
     "ncua-dropdown__item-text",
     "ncua-dropdown__item-text-group",
+    "ncua-dropdown__item-visibility",
     "ncua-dropdown__menu",
     "ncua-dropdown__menu-items",
     "ncua-dropdown__trigger",
@@ -254,7 +272,9 @@
     "react": {
       "default": "<Dropdown groups=\"\" trigger=\"\" />",
       "align:left": "<Dropdown align=\"left\" groups=\"\" trigger=\"\" />",
-      "align:right": "<Dropdown align=\"right\" groups=\"\" trigger=\"\" />"
+      "align:right": "<Dropdown align=\"right\" groups=\"\" trigger=\"\" />",
+      "variant:action": "<Dropdown variant=\"action\" groups=\"\" trigger=\"\" />",
+      "variant:config": "<Dropdown variant=\"config\" groups=\"\" trigger=\"\" />"
     }
   }
 }