king-design-analyzer 2.1.7 → 2.2.0

package/components/formitemtableconfigs.json

@@ -0,0 +1,210 @@
+{
+    "id": "formitemtableconfigs",
+    "name": "FormItemTableConfigs",
+    "displayName": "表格配置表单项",
+    "category": "form",
+    "description": "通过表格方式维护一组配置项的表单组件，适合批量录入实例规格、节点列表、挂载配置等多行数据。",
+    "importStatement": "import { FormItemTableConfigs } from '@ksyun-internal/versatile';",
+    "props": [
+        {
+            "name": "modelValue",
+            "description": "当前配置项数组",
+            "type": {
+                "raw": "any[]",
+                "kind": "array"
+            },
+            "required": false,
+            "default": "[]"
+        },
+        {
+            "name": "label",
+            "description": "表单项标题",
+            "type": {
+                "raw": "string",
+                "kind": "string"
+            },
+            "required": false
+        },
+        {
+            "name": "maxInstanceNum",
+            "description": "允许添加的最大实例数",
+            "type": {
+                "raw": "number",
+                "kind": "number"
+            },
+            "required": false
+        },
+        {
+            "name": "minInstanceNum",
+            "description": "允许保留的最小实例数",
+            "type": {
+                "raw": "number",
+                "kind": "number"
+            },
+            "required": false,
+            "default": "1"
+        },
+        {
+            "name": "initInstanceModels",
+            "description": "初始化一条实例配置的工厂函数",
+            "type": {
+                "raw": "() => Record<string, any>",
+                "kind": "function"
+            },
+            "required": true
+        },
+        {
+            "name": "addBtnText",
+            "description": "新增按钮文案",
+            "type": {
+                "raw": "string",
+                "kind": "string"
+            },
+            "required": false
+        },
+        {
+            "name": "showAddBtnLabel",
+            "description": "是否显示新增按钮标签",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false"
+        },
+        {
+            "name": "helper",
+            "description": "辅助说明文案",
+            "type": {
+                "raw": "string",
+                "kind": "string"
+            },
+            "required": false
+        },
+        {
+            "name": "info",
+            "description": "信息提示文案",
+            "type": {
+                "raw": "string",
+                "kind": "string"
+            },
+            "required": false
+        },
+        {
+            "name": "fixHeader",
+            "description": "固定表头高度阈值",
+            "type": {
+                "raw": "number",
+                "kind": "number"
+            },
+            "required": false
+        },
+        {
+            "name": "infinite",
+            "description": "是否启用无限模式",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false
+        },
+        {
+            "name": "readonly",
+            "description": "是否为只读模式",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false
+        }
+    ],
+    "events": [
+        {
+            "name": "update:modelValue",
+            "vueEventName": "@update:modelValue",
+            "description": "配置项数组变化时触发，新增、删除或编辑行后都会返回最新列表。",
+            "params": [
+                {
+                    "name": "value",
+                    "type": "any[]",
+                    "description": "当前配置项列表数组。",
+                    "optional": true
+                }
+            ]
+        }
+    ],
+    "slots": [],
+    "methods": [],
+    "examples": [
+        {
+            "id": "formitemtableconfigs_nodes",
+            "title": "节点配置列表维护",
+            "description": "在表单中维护多条节点或实例配置。",
+            "difficulty": "easy",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { FormItemTableConfigs } from '@ksyun-internal/versatile';\n\nconst nodes = ref([\n  { name: 'worker-01', spec: '2C4G' },\n]);\n</script>\n\n<template>\n  <FormItemTableConfigs\n    v-model=\"nodes\"\n    label=\"节点配置\"\n    add-btn-text=\"新增节点\"\n    :max-instance-num=\"5\"\n  />\n</template>",
+            "tags": [
+                "form",
+                "table"
+            ],
+            "usedProps": [
+                "modelValue",
+                "label",
+                "addBtnText",
+                "maxInstanceNum"
+            ],
+            "usedEvents": [
+                "update:modelValue"
+            ],
+            "usedMethods": [],
+            "scenario": "在集群创建页面中维护多条节点或实例配置。"
+        },
+        {
+            "id": "formitemtableconfigs_readonly",
+            "title": "只读模式展示配置列表",
+            "description": "在审核或确认步骤中仅展示配置列表，不允许再编辑。",
+            "difficulty": "medium",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { FormItemTableConfigs } from '@ksyun-internal/versatile';\n\nconst instances = ref([\n  { name: 'node-01', spec: '4C8G' },\n  { name: 'node-02', spec: '4C8G' },\n]);\n</script>\n\n<template>\n  <FormItemTableConfigs v-model=\"instances\" label=\"实例配置\" :readonly=\"true\" />\n</template>",
+            "tags": [
+                "form",
+                "readonly"
+            ],
+            "usedProps": [
+                "modelValue",
+                "label",
+                "readonly"
+            ],
+            "usedEvents": [],
+            "usedMethods": [],
+            "scenario": "在提交前确认页只读展示用户已填写的表格配置。"
+        }
+    ],
+    "searchKeywords": [
+        "form item table configs",
+        "config table form",
+        "配置表格",
+        "实例配置",
+        "批量表单行",
+        "节点配置",
+        "多行表单",
+        "表格型表单项"
+    ],
+    "useCases": [
+        "多实例配置表单",
+        "批量节点配置",
+        "确认步骤只读展示配置列表",
+        "通过表格维护一组配置项"
+    ],
+    "relatedComponents": [
+        "InstanceList",
+        "InstanceNum",
+        "FormItemInput",
+        "FormItemSpinner"
+    ],
+    "typeDefinitions": [
+        {
+            "name": "InstanceConfigItem",
+            "definition": "type InstanceConfigItem = Record<string, any>",
+            "description": "单条实例或节点配置对象，具体字段由业务表单自行约定。"
+        }
+    ]
+}

package/components/grid.json

@@ -370,6 +370,13 @@
     "列表网格排列",
     "响应式内容展示"
   ],
+  "typeDefinitions": [
+    {
+      "name": "GridSpan",
+      "definition": "type GridSpan = number",
+      "description": "栅格列宽度类型，基于 24 栅格系统取值。"
+    }
+  ],
   "relatedComponents": [
     "Space",
     "Divider"

package/components/header.json

@@ -0,0 +1,161 @@
+{
+    "id": "header",
+    "name": "Header",
+    "displayName": "顶部栏",
+    "category": "layout",
+    "description": "页面级顶部栏组件，整合标题、返回、面包屑和文档入口，常用于列表页、详情页以及购买链路页的统一页头。",
+    "importStatement": "import { Header } from '@ksyun-internal/versatile';",
+    "props": [
+        {
+            "name": "title",
+            "description": "左侧标题文案",
+            "type": {
+                "raw": "string",
+                "kind": "string"
+            },
+            "required": false,
+            "default": "\"\""
+        },
+        {
+            "name": "back",
+            "description": "返回配置，支持函数或路由跳转参数",
+            "type": {
+                "raw": "() => any | RouteLocationRaw",
+                "kind": "custom"
+            },
+            "required": false,
+            "default": "undefined"
+        },
+        {
+            "name": "doc",
+            "description": "相关文档配置，通常包含中英文文档地址",
+            "type": {
+                "raw": "DocParams",
+                "kind": "object"
+            },
+            "required": false,
+            "default": "undefined"
+        },
+        {
+            "name": "docText",
+            "description": "文档入口文案",
+            "type": {
+                "raw": "string",
+                "kind": "string"
+            },
+            "required": false,
+            "default": "\"相关文档\""
+        },
+        {
+            "name": "newable",
+            "description": "是否启用购买链路顶部栏样式",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false"
+        },
+        {
+            "name": "breadcrumb",
+            "description": "面包屑导航配置，元素格式为 { to, label }",
+            "type": {
+                "raw": "Array<{ to: string, label: string }>",
+                "kind": "array"
+            },
+            "required": false,
+            "default": "undefined"
+        }
+    ],
+    "events": [],
+    "slots": [
+        {
+            "name": "title",
+            "description": "扩展顶部栏左侧标题处内容",
+            "vueTemplate": "<template #title>...</template>"
+        },
+        {
+            "name": "titleAppend",
+            "description": "扩展顶部栏左侧标题后的追加内容",
+            "vueTemplate": "<template #titleAppend>...</template>"
+        },
+        {
+            "name": "docPrepend",
+            "description": "扩展右侧文档入口前的内容",
+            "vueTemplate": "<template #docPrepend>...</template>"
+        },
+        {
+            "name": "doc",
+            "description": "自定义右侧文档区域",
+            "vueTemplate": "<template #doc>...</template>"
+        }
+    ],
+    "methods": [],
+    "examples": [
+        {
+            "id": "header_detail_page",
+            "title": "详情页头部信息",
+            "description": "同时展示标题、面包屑和文档入口，形成统一的页面头部。",
+            "difficulty": "easy",
+            "code": "<script setup lang=\"ts\">\nimport { Header } from '@ksyun-internal/versatile';\n\nconst breadcrumb = [\n  { to: '/instance', label: '云服务器' },\n  { to: '/instance/list', label: '实例列表' },\n  { to: '/instance/detail', label: '实例详情' },\n];\nconst doc = {\n  zh: 'https://docs.ksyun.com/documents/instance',\n};\n</script>\n\n<template>\n  <Header title=\"实例详情\" :breadcrumb=\"breadcrumb\" :doc=\"doc\" />\n</template>",
+            "tags": [
+                "header",
+                "breadcrumb"
+            ],
+            "usedProps": [
+                "title",
+                "breadcrumb",
+                "doc"
+            ],
+            "usedEvents": [],
+            "usedMethods": [],
+            "scenario": "在详情页统一展示返回路径和文档入口。"
+        },
+        {
+            "id": "header_slot_append",
+            "title": "通过插槽扩展头部操作",
+            "description": "使用 titleAppend 和 docPrepend 插槽扩展状态展示和快捷入口。",
+            "difficulty": "medium",
+            "code": "<script setup lang=\"ts\">\nimport { Header } from '@ksyun-internal/versatile';\n</script>\n\n<template>\n  <Header title=\"实例详情\" doc-text=\"帮助文档\">\n    <template #titleAppend>\n      <span style=\"margin-left: 8px; color: #18a058;\">运行中</span>\n    </template>\n    <template #docPrepend>\n      <a href=\"/monitor\">监控图表</a>\n    </template>\n  </Header>\n</template>",
+            "tags": [
+                "header",
+                "slots"
+            ],
+            "usedProps": [
+                "title",
+                "docText"
+            ],
+            "usedEvents": [],
+            "usedMethods": [],
+            "scenario": "在页面头部追加状态标识和右侧快捷入口。"
+        }
+    ],
+    "searchKeywords": [
+        "header",
+        "page header",
+        "顶部栏",
+        "面包屑",
+        "文档入口"
+    ],
+    "useCases": [
+        "详情页顶部栏",
+        "列表页顶部栏",
+        "购买链路页面头部"
+    ],
+    "relatedComponents": [
+        "LayoutContent",
+        "LayoutListContent"
+    ],
+    "typeDefinitions": [
+        {
+            "name": "BreadcrumbItem",
+            "definition": "type BreadcrumbItem = {\n  to: string\n  label: string\n}",
+            "description": "面包屑节点配置，包含跳转地址和展示文案。"
+        },
+        {
+            "name": "DocParams",
+            "definition": "type DocParams = {\n  zh?: string\n  en?: string\n}",
+            "description": "文档入口配置，可分别提供中文和英文文档链接。"
+        }
+    ]
+}

package/components/icon.json

@@ -436,7 +436,19 @@
         "加载旋转动画",
         "表格操作列图标"
     ],
+    "typeDefinitions": [
+        {
+            "name": "IconSize",
+            "definition": "type IconSize = number | string",
+            "description": "图标尺寸类型，可传预设值或自定义数字。"
+        },
+        {
+            "name": "IconColorPreset",
+            "definition": "type IconColorPreset = 'default' | 'primary' | 'danger' | 'warning' | 'success'",
+            "description": "图标预设颜色枚举。"
+        }
+    ],
     "relatedComponents": [
         "Button"
     ]
-}
+}

package/components/icontooltip.json

@@ -101,6 +101,17 @@
             "required": false,
             "default": "\"\"",
             "usageExample": "<IconTooltip icon=\"k-icon-refresh\" tooltipText=\"刷新\" />"
+        },
+        {
+            "name": "color",
+            "description": "自定义图标颜色，适用于普通图标和按钮图标",
+            "type": {
+                "raw": "string",
+                "kind": "string"
+            },
+            "required": false,
+            "default": "undefined",
+            "usageExample": "<IconTooltip icon=\"k-icon-information\" color=\"#1890ff\" tooltipText=\"信息\" />"
         }
     ],
     "events": [],
@@ -222,9 +233,16 @@
         "信息提示图标",
         "设置入口"
     ],
+    "typeDefinitions": [
+        {
+            "name": "IconTooltipType",
+            "definition": "type IconTooltipType = 'default' | 'button'",
+            "description": "图标提示组件展示模式枚举，控制普通图标或按钮态样式。"
+        }
+    ],
     "relatedComponents": [
         "Icon",
         "Tooltip",
         "ButtonLink"
     ]
-}
+}

package/components/input.json

@@ -79,7 +79,10 @@
       },
       "required": false,
       "default": "undefined",
-      "usageExample": "<Input name=\"username\" />"
+      "usageExample": "<Input name=\"username\" />",
+      "tags": [
+        "native"
+      ]
     },
     {
       "name": "placeholder",
@@ -90,7 +93,10 @@
       },
       "required": false,
       "default": "undefined",
-      "usageExample": "<Input placeholder=\"请输入内容\" />"
+      "usageExample": "<Input placeholder=\"请输入内容\" />",
+      "tags": [
+        "native"
+      ]
     },
     {
       "name": "readonly",
@@ -101,7 +107,94 @@
       },
       "required": false,
       "default": "false",
-      "usageExample": "<Input v-model=\"value\" readonly />"
+      "usageExample": "<Input v-model=\"value\" readonly />",
+      "tags": [
+        "native"
+      ]
+    },
+    {
+      "name": "autocomplete",
+      "description": "原生 autocomplete 属性，指定浏览器自动补全行为",
+      "type": {
+        "raw": "string",
+        "kind": "string"
+      },
+      "required": false,
+      "default": "undefined",
+      "usageExample": "<Input autocomplete=\"username\" />",
+      "tags": [
+        "native"
+      ]
+    },
+    {
+      "name": "autofocus",
+      "description": "原生 autofocus 属性，页面加载后自动聚焦输入框",
+      "type": {
+        "raw": "boolean",
+        "kind": "boolean"
+      },
+      "required": false,
+      "default": "undefined",
+      "usageExample": "<Input autofocus />",
+      "tags": [
+        "native"
+      ]
+    },
+    {
+      "name": "form",
+      "description": "原生 form 属性，指定输入框关联的表单 id",
+      "type": {
+        "raw": "string",
+        "kind": "string"
+      },
+      "required": false,
+      "default": "undefined",
+      "usageExample": "<Input form=\"searchForm\" />",
+      "tags": [
+        "native"
+      ]
+    },
+    {
+      "name": "maxlength",
+      "description": "原生 maxlength 属性，限制最大输入长度",
+      "type": {
+        "raw": "number | string",
+        "kind": "union"
+      },
+      "required": false,
+      "default": "undefined",
+      "usageExample": "<Input :maxlength=\"50\" showCount />",
+      "tags": [
+        "native"
+      ]
+    },
+    {
+      "name": "pattern",
+      "description": "原生 pattern 属性，指定输入值需要匹配的正则模式",
+      "type": {
+        "raw": "string",
+        "kind": "string"
+      },
+      "required": false,
+      "default": "undefined",
+      "usageExample": "<Input pattern=\"[0-9]{6}\" placeholder=\"请输入6位数字\" />",
+      "tags": [
+        "native"
+      ]
+    },
+    {
+      "name": "required",
+      "description": "原生 required 属性，标记为必填输入项",
+      "type": {
+        "raw": "boolean",
+        "kind": "boolean"
+      },
+      "required": false,
+      "default": "undefined",
+      "usageExample": "<Input required placeholder=\"必填项\" />",
+      "tags": [
+        "native"
+      ]
     },
     {
       "name": "clearable",
@@ -170,7 +263,70 @@
       },
       "required": false,
       "default": "2",
-      "usageExample": "<Input type=\"textarea\" :rows=\"6\" />"
+      "usageExample": "<Input type=\"textarea\" :rows=\"6\" />",
+      "tags": [
+        "native"
+      ]
+    },
+    {
+      "name": "cols",
+      "description": "原生 cols 属性，当 type=\"textarea\" 时指定可见宽度",
+      "type": {
+        "raw": "number",
+        "kind": "number"
+      },
+      "required": false,
+      "default": "undefined",
+      "usageExample": "<Input type=\"textarea\" :cols=\"40\" />",
+      "tags": [
+        "native"
+      ]
+    },
+    {
+      "name": "datalist",
+      "description": "原生 datalist 属性，关联 datalist 元素 id",
+      "type": {
+        "raw": "string",
+        "kind": "string"
+      },
+      "required": false,
+      "default": "undefined",
+      "usageExample": "<Input datalist=\"city-list\" />",
+      "tags": [
+        "native"
+      ]
+    },
+    {
+      "name": "dirname",
+      "description": "原生 dirname 属性，提交时附带输入方向信息",
+      "type": {
+        "raw": "string",
+        "kind": "string"
+      },
+      "required": false,
+      "default": "undefined",
+      "usageExample": "<Input dirname=\"comment.dir\" />",
+      "tags": [
+        "native"
+      ]
+    },
+    {
+      "name": "wrap",
+      "description": "原生 wrap 属性，当 type=\"textarea\" 时指定换行提交方式",
+      "type": {
+        "raw": "\"hard\" | \"soft\"",
+        "kind": "union",
+        "unionTypes": [
+          "hard",
+          "soft"
+        ]
+      },
+      "required": false,
+      "default": "undefined",
+      "usageExample": "<Input type=\"textarea\" wrap=\"hard\" />",
+      "tags": [
+        "native"
+      ]
     },
     {
       "name": "autoWidth",
@@ -238,6 +394,17 @@
       "default": "false",
       "usageExample": "<Input inline />"
     },
+    {
+      "name": "waveDisabled",
+      "description": "是否禁用点击波纹效果",
+      "type": {
+        "raw": "boolean",
+        "kind": "boolean"
+      },
+      "required": false,
+      "default": "false",
+      "usageExample": "<Input waveDisabled />"
+    },
     {
       "name": "resize",
       "description": "指定 textarea 输入框拖动调整大小的方向，默认只能垂直方向调整",
@@ -813,6 +980,23 @@
     "数字/金额输入",
     "带前后缀的复合输入框"
   ],
+  "typeDefinitions": [
+    {
+      "name": "InputType",
+      "definition": "type InputType = 'text' | 'password' | 'number' | 'email' | 'tel' | 'url' | 'textarea'",
+      "description": "输入框类型定义，除原生 input 类型外还扩展了 textarea。"
+    },
+    {
+      "name": "InputSize",
+      "definition": "type InputSize = 'large' | 'default' | 'small' | 'mini'",
+      "description": "输入框尺寸枚举，用于控制组件高度和内边距。"
+    },
+    {
+      "name": "TextareaResize",
+      "definition": "type TextareaResize = 'none' | 'both' | 'horizontal' | 'vertical'",
+      "description": "文本域 resize 方向配置，仅在 type=\"textarea\" 时生效。"
+    }
+  ],
   "relatedComponents": [
     "Search",
     "Form",