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

package/data/dropdown.json

@@ -0,0 +1,123 @@
+{
+  "name": "dropdown",
+  "exportName": "Dropdown",
+  "importPath": "@ncds/ui-admin",
+  "jsRequired": false,
+  "category": "overlay",
+  "description": "Dropdown(메뉴형)은 버튼, 아이콘, 아바타 등 트리거 요소를 통해 숨겨진 메뉴 또는 작업(Action) 목록을 레이어 형태로 노출하는 컴포넌트입니다.",
+  "aliases": [
+    "Dropdown",
+    "드롭다운",
+    "Trigger",
+    "Layer",
+    "Menu",
+    "IconTrigger",
+    "AvatarTrigger",
+    "ButtonTrigger",
+    "TextTrigger",
+    "CustomTrigger",
+    "DropdownGroup",
+    "DropdownItem",
+    "Header",
+    "Divider",
+    "Danger",
+    "align",
+    "closeOnClickItem",
+    "NCDS"
+  ],
+  "hasChildren": true,
+  "whenToUse": [
+    "Dropdown은 값 선택이 아닌 액션 실행 컴포넌트입니다",
+    "제한된 화면 공간에서 다수의 작업을 구조적으로 제공할 때 사용합니다"
+  ],
+  "forbiddenRules": [
+    "메뉴명 말줄임 처리 금지",
+    "10개 이상 메뉴 구성 지양",
+    "내부 스크롤 지양",
+    "값 선택 용도 사용 금지",
+    "별도 전용 버튼 생성 금지",
+    "Danger 스타일 남용 금지"
+  ],
+  "seeAlso": [
+    "button",
+    "selectbox",
+    "icon",
+    "icon-button"
+  ],
+  "props": {
+    "align": {
+      "type": "enum",
+      "required": false,
+      "values": [
+        "left",
+        "right"
+      ],
+      "default": "left"
+    },
+    "className": {
+      "type": "string",
+      "required": false
+    },
+    "closeOnClickItem": {
+      "type": "boolean",
+      "required": false,
+      "default": true
+    },
+    "closeOnClickOutside": {
+      "type": "boolean",
+      "required": false,
+      "default": true
+    },
+    "groups": {
+      "type": "string",
+      "required": true,
+      "rawType": "import(\"/Users/nhncommerce/Desktop/company/ai-driven-ncds/packages/ui-admin/src/components/dropdown/Dropdown\").DropdownGroup[]"
+    },
+    "header": {
+      "type": "object",
+      "required": false
+    },
+    "opened": {
+      "type": "boolean",
+      "required": false,
+      "default": false
+    },
+    "trigger": {
+      "type": "object",
+      "required": true
+    }
+  },
+  "html": {},
+  "bemClasses": [
+    "ncua-dropdown",
+    "ncua-dropdown--right",
+    "ncua-dropdown__avatar",
+    "ncua-dropdown__group",
+    "ncua-dropdown__header",
+    "ncua-dropdown__header-avatar-group",
+    "ncua-dropdown__header-subtitle",
+    "ncua-dropdown__header-text",
+    "ncua-dropdown__header-title",
+    "ncua-dropdown__item",
+    "ncua-dropdown__item-clickable-layer",
+    "ncua-dropdown__item-content",
+    "ncua-dropdown__item-icon",
+    "ncua-dropdown__item-shortcut",
+    "ncua-dropdown__item-text",
+    "ncua-dropdown__item-text-group",
+    "ncua-dropdown__menu",
+    "ncua-dropdown__menu-items",
+    "ncua-dropdown__trigger",
+    "ncua-dropdown__trigger ncua-dropdown__trigger--avatar",
+    "ncua-dropdown__trigger ncua-dropdown__trigger--button",
+    "ncua-dropdown__trigger ncua-dropdown__trigger--icon"
+  ],
+  "usage": {
+    "import": "import { Dropdown } from '@ncds/ui-admin';",
+    "react": {
+      "default": "<Dropdown groups=\"\" trigger=\"\" />",
+      "align:left": "<Dropdown align=\"left\" groups=\"\" trigger=\"\" />",
+      "align:right": "<Dropdown align=\"right\" groups=\"\" trigger=\"\" />"
+    }
+  }
+}

package/data/empty-state.json

@@ -0,0 +1,64 @@
+{
+  "name": "empty-state",
+  "exportName": "EmptyState",
+  "importPath": "@ncds/ui-admin",
+  "jsRequired": false,
+  "category": "feedback",
+  "description": "EmptyState는 앱에서 사용자에게 표시할 데이터가 없거나 검색어가 0개의 결과를 반환하는 순간을 표시하는 컴포넌트입니다.",
+  "aliases": [
+    "EmptyState",
+    "빈상태",
+    "빈화면",
+    "검색결과없음",
+    "데이터없음",
+    "안내메시지",
+    "title",
+    "description",
+    "buttons",
+    "액션버튼",
+    "NCDS"
+  ],
+  "hasChildren": false,
+  "whenToUse": [
+    "빈 상태의 이유를 명확하게 설명하고 사용자가 취할 수 있는 다음 단계와 명확한 작업에 대한 지침을 제공",
+    "충분한 지침이 있으면 작업이 예상대로 작동하지 않을 때에도 원활한 경험을 보장"
+  ],
+  "forbiddenRules": [
+    "빈 상태 무시 금지(반드시 EmptyState로 안내 메시지 제공)",
+    "모호한 메시지 금지",
+    "과도한 버튼 사용 금지",
+    "장식 용도 금지",
+    "로딩 중 표시 금지"
+  ],
+  "seeAlso": [
+    "spinner"
+  ],
+  "props": {
+    "buttons": {
+      "type": "string",
+      "required": false,
+      "rawType": "import(\"/Users/nhncommerce/Desktop/company/ai-driven-ncds/packages/ui-admin/src/components/empty-state/EmptyState\").ButtonOptions | import(\"/Users/nhncommerce/Desktop/company/ai-driven-ncds/packages/ui-admin/src/components/empty-state/EmptyState\").ButtonOptions[] | undefined"
+    },
+    "description": {
+      "type": "string",
+      "required": true
+    },
+    "title": {
+      "type": "string",
+      "required": true
+    }
+  },
+  "html": {},
+  "bemClasses": [
+    "ncua-empty-state",
+    "ncua-empty-state__button-group",
+    "ncua-empty-state__description",
+    "ncua-empty-state__title"
+  ],
+  "usage": {
+    "import": "import { EmptyState } from '@ncds/ui-admin';",
+    "react": {
+      "default": "<EmptyState description=\"\" title=\"\" />"
+    }
+  }
+}

package/data/featured-icon.json

@@ -0,0 +1,125 @@
+{
+  "name": "featured-icon",
+  "exportName": "FeaturedIcon",
+  "importPath": "@ncds/ui-admin",
+  "jsRequired": true,
+  "category": "icon",
+  "description": "FeaturedIcon은 상태(Status), 결과(Result), 중요 액션(Action)을 시각적으로 강조하기 위한 아이콘 강조 컴포넌트입니다",
+  "aliases": [
+    "FeaturedIcon",
+    "피처드아이콘",
+    "아이콘강조",
+    "상태아이콘",
+    "light-circle",
+    "dark-circle",
+    "outline-circle",
+    "square-outline",
+    "neutral",
+    "error",
+    "warning",
+    "success",
+    "컨테이너아이콘",
+    "NCDS"
+  ],
+  "hasChildren": false,
+  "whenToUse": [
+    "상태 결과 페이지",
+    "에러 페이지",
+    "단독 메시지 영역",
+    "알림/승인 결과",
+    "시스템 메시지"
+  ],
+  "forbiddenRules": [
+    "버튼 트리거로 사용 금지",
+    "임의 색상 사용 금지",
+    "의미와 맞지 않는 색상 사용 금지",
+    "Interactive 사용 지양",
+    "반복적 나열 지양"
+  ],
+  "seeAlso": [
+    "icon",
+    "icon-button",
+    "badge",
+    "dot"
+  ],
+  "htmlElement": "div",
+  "props": {
+    "className": {
+      "type": "string",
+      "required": false
+    },
+    "color": {
+      "type": "enum",
+      "required": false,
+      "values": [
+        "error",
+        "neutral",
+        "success",
+        "warning"
+      ],
+      "default": "neutral"
+    },
+    "icon": {
+      "type": "object",
+      "required": true
+    },
+    "size": {
+      "type": "enum",
+      "required": false,
+      "values": [
+        "lg",
+        "md",
+        "sm",
+        "xl"
+      ],
+      "default": "md"
+    },
+    "theme": {
+      "type": "enum",
+      "required": false,
+      "values": [
+        "dark-circle",
+        "light-circle",
+        "outline-circle",
+        "square-outline"
+      ],
+      "default": "light-circle"
+    }
+  },
+  "html": {},
+  "bemClasses": [
+    "ncua-featured-icon",
+    "ncua-featured-icon--dark-circle",
+    "ncua-featured-icon--error",
+    "ncua-featured-icon--lg",
+    "ncua-featured-icon--light-circle",
+    "ncua-featured-icon--md",
+    "ncua-featured-icon--neutral",
+    "ncua-featured-icon--outline-circle",
+    "ncua-featured-icon--sm",
+    "ncua-featured-icon--square-outline",
+    "ncua-featured-icon--success",
+    "ncua-featured-icon--warning",
+    "ncua-featured-icon--xl",
+    "ncua-featured-icon__outline ncua-featured-icon__outline--inner",
+    "ncua-featured-icon__outline ncua-featured-icon__outline--outer"
+  ],
+  "usage": {
+    "import": "import { FeaturedIcon } from '@ncds/ui-admin';",
+    "react": {
+      "default": "<FeaturedIcon icon=\"\" />",
+      "color:error": "<FeaturedIcon color=\"error\" icon=\"\" />",
+      "color:neutral": "<FeaturedIcon color=\"neutral\" icon=\"\" />",
+      "color:success": "<FeaturedIcon color=\"success\" icon=\"\" />",
+      "color:warning": "<FeaturedIcon color=\"warning\" icon=\"\" />",
+      "size:lg": "<FeaturedIcon size=\"lg\" icon=\"\" />",
+      "size:md": "<FeaturedIcon size=\"md\" icon=\"\" />",
+      "size:sm": "<FeaturedIcon size=\"sm\" icon=\"\" />",
+      "size:xl": "<FeaturedIcon size=\"xl\" icon=\"\" />",
+      "theme:dark-circle": "<FeaturedIcon theme=\"dark-circle\" icon=\"\" />",
+      "theme:light-circle": "<FeaturedIcon theme=\"light-circle\" icon=\"\" />",
+      "theme:outline-circle": "<FeaturedIcon theme=\"outline-circle\" icon=\"\" />",
+      "theme:square-outline": "<FeaturedIcon theme=\"square-outline\" icon=\"\" />"
+    }
+  }
+}

package/data/file-input.json

@@ -0,0 +1,161 @@
+{
+  "name": "file-input",
+  "exportName": "FileInput",
+  "importPath": "@ncds/ui-admin",
+  "jsRequired": true,
+  "category": "input",
+  "description": "File Upload가 필요한 영역에서 공통 UI/UX를 적용하는 입력 컴포넌트입니다",
+  "aliases": [
+    "파일인풋",
+    "FileInput",
+    "파일업로드",
+    "파일첨부",
+    "파일찾기",
+    "업로드",
+    "accept",
+    "maxFileCount",
+    "maxFileSize",
+    "onFail",
+    "multiple",
+    "hintText",
+    "hintItems",
+    "destructive",
+    "NCDS"
+  ],
+  "hasChildren": false,
+  "whenToUse": [
+    "제한 정책 안내문을 항상 노출하며 파일명 텍스트 중심 UI를 기본으로 하고 삭제 기능을 필수 제공해야 하는 경우",
+    "단일 파일 또는 다중 파일 업로드가 필요한 경우",
+    "이미지가 아닌 일반 파일 업로드 영역"
+  ],
+  "forbiddenRules": [
+    "제한 정책 안내 없이 업로드 허용 금지",
+    "최대 등록 수 초과 시 무반응 처리 금지",
+    "파일명 34자 초과 그대로 노출 금지",
+    "단일 파일 영역에서 다중 파일 누적 금지",
+    "삭제 기능 없는 업로드 UI 제공 금지"
+  ],
+  "seeAlso": [
+    "image-file-input"
+  ],
+  "props": {
+    "accept": {
+      "type": "string",
+      "required": false
+    },
+    "buttonLabel": {
+      "type": "string",
+      "required": false,
+      "default": "파일 찾기"
+    },
+    "destructive": {
+      "type": "boolean",
+      "required": false
+    },
+    "disabled": {
+      "type": "boolean",
+      "required": false
+    },
+    "hintItems": {
+      "type": "string",
+      "required": false,
+      "rawType": "string[] | undefined"
+    },
+    "hintText": {
+      "type": "string",
+      "required": false
+    },
+    "isRequired": {
+      "type": "boolean",
+      "required": false
+    },
+    "label": {
+      "type": "string",
+      "required": false
+    },
+    "leadingElement": {
+      "type": "object",
+      "required": false
+    },
+    "maxFileCount": {
+      "type": "number",
+      "required": false
+    },
+    "maxFileSize": {
+      "type": "number",
+      "required": false
+    },
+    "maxLength": {
+      "type": "number",
+      "required": false
+    },
+    "onChange": {
+      "type": "function",
+      "required": false
+    },
+    "onFail": {
+      "type": "function",
+      "required": false
+    },
+    "onFileSelect": {
+      "type": "function",
+      "required": false
+    },
+    "required": {
+      "type": "boolean",
+      "required": false
+    },
+    "showHelpIcon": {
+      "type": "boolean",
+      "required": false
+    },
+    "showTextCount": {
+      "type": "boolean",
+      "required": false
+    },
+    "size": {
+      "type": "enum",
+      "required": false,
+      "values": [
+        "sm",
+        "xs"
+      ],
+      "default": "xs"
+    },
+    "trailingElement": {
+      "type": "object",
+      "required": false
+    },
+    "validation": {
+      "type": "boolean",
+      "required": false
+    },
+    "value": {
+      "type": "string",
+      "required": false,
+      "rawType": "File[] | undefined"
+    }
+  },
+  "html": {},
+  "bemClasses": [
+    "ncua-file-input",
+    "ncua-file-input--sm",
+    "ncua-file-input--xs",
+    "ncua-file-input__file-image",
+    "ncua-file-input__file-tag-container",
+    "ncua-file-input__file-tags",
+    "ncua-file-input__hint-item",
+    "ncua-file-input__hint-list",
+    "ncua-file-input__input-container",
+    "ncua-file-input__label",
+    "ncua-input__help-icon"
+  ],
+  "usage": {
+    "import": "import { FileInput } from '@ncds/ui-admin';",
+    "react": {
+      "default": "<FileInput />",
+      "size:sm": "<FileInput size=\"sm\" />",
+      "size:xs": "<FileInput size=\"xs\" />"
+    }
+  }
+}

package/data/horizontal-tab.json

@@ -0,0 +1,114 @@
+{
+  "name": "horizontal-tab",
+  "exportName": "HorizontalTab",
+  "importPath": "@ncds/ui-admin",
+  "jsRequired": true,
+  "category": "navigation",
+  "description": "HorizontalTab은 동일한 계층 구조의 관련 콘텐츠를 그룹화하여 탭 메뉴 사이를 전환하는 내비게이션 UI 컴포넌트입니다.",
+  "aliases": [
+    "HorizontalTab",
+    "가로탭",
+    "탭",
+    "Tab",
+    "수평탭",
+    "콘텐츠전환",
+    "Underline",
+    "Button",
+    "Badge",
+    "Closable",
+    "Slider",
+    "SPA",
+    "네비게이션",
+    "NCDS"
+  ],
+  "hasChildren": false,
+  "whenToUse": [
+    "동일 페이지 내에서 콘텐츠를 전환하는 수평 내비게이션",
+    "페이지 리로드 없이 SPA 기준 라우팅 변경으로 동작",
+    "동등한 중요도의 섹션을 구분"
+  ],
+  "forbiddenRules": [
+    "아이콘 장식 사용 금지",
+    "이미지 사용 금지",
+    "서로 다른 계층 혼합 금지",
+    "과도한 개수 구성 지양(7개 이상 지양, 권장 2~6개)",
+    "페이지 리로드 금지",
+    "1개 탭 단독 노출 금지",
+    "탭 높이 변형 금지",
+    "배지를 클릭 액션으로 사용 금지",
+    "New 배지 영구 고정 금지",
+    "일반 페이지 구조 탭에 Close Button 사용 금지"
+  ],
+  "seeAlso": [
+    "badge",
+    "vertical-tab"
+  ],
+  "props": {
+    "activeTab": {
+      "type": "string",
+      "required": false
+    },
+    "className": {
+      "type": "string",
+      "required": false
+    },
+    "fullWidth": {
+      "type": "boolean",
+      "required": false,
+      "default": false
+    },
+    "menus": {
+      "type": "string",
+      "required": false,
+      "rawType": "import(\"/Users/nhncommerce/Desktop/company/ai-driven-ncds/packages/ui-admin/src/components/tab/TabButton\").TabButtonProps[] | undefined",
+      "default": "[]"
+    },
+    "size": {
+      "type": "enum",
+      "required": false,
+      "values": [
+        "lg",
+        "md",
+        "sm"
+      ],
+      "default": "sm"
+    },
+    "type": {
+      "type": "enum",
+      "required": false,
+      "values": [
+        "button-primary",
+        "button-white",
+        "underline",
+        "underline-fill"
+      ],
+      "default": "button-primary"
+    }
+  },
+  "html": {},
+  "bemClasses": [
+    "ncua-horizontal-tab",
+    "ncua-horizontal-tab--button-primary",
+    "ncua-horizontal-tab--button-white",
+    "ncua-horizontal-tab--fullWidth",
+    "ncua-horizontal-tab--lg",
+    "ncua-horizontal-tab--md",
+    "ncua-horizontal-tab--sm",
+    "ncua-horizontal-tab--underline",
+    "ncua-horizontal-tab--underline-fill",
+    "ncua-horizontal-tab__item"
+  ],
+  "usage": {
+    "import": "import { HorizontalTab } from '@ncds/ui-admin';",
+    "react": {
+      "default": "<HorizontalTab />",
+      "size:lg": "<HorizontalTab size=\"lg\" />",
+      "size:md": "<HorizontalTab size=\"md\" />",
+      "size:sm": "<HorizontalTab size=\"sm\" />",
+      "type:button-primary": "<HorizontalTab type=\"button-primary\" />",
+      "type:button-white": "<HorizontalTab type=\"button-white\" />",
+      "type:underline": "<HorizontalTab type=\"underline\" />",
+      "type:underline-fill": "<HorizontalTab type=\"underline-fill\" />"
+    }
+  }
+}