king-design-analyzer 2.1.7 → 2.2.0

package/components/actions.json

@@ -0,0 +1,101 @@
+{
+    "id": "actions",
+    "name": "Actions",
+    "displayName": "操作按钮集",
+    "category": "feedback",
+    "description": "用于组织主操作和次操作的按钮集合组件，常放在表格操作列、详情页头部和工具栏右侧，避免页面出现过多平铺按钮。",
+    "importStatement": "import { Actions } from '@ksyun-internal/versatile';",
+    "props": [
+        {
+            "name": "primaries",
+            "description": "一级操作按钮列表",
+            "type": {
+                "raw": "ActionConfig[]",
+                "kind": "array"
+            },
+            "required": false,
+            "default": "[]"
+        },
+        {
+            "name": "secondaries",
+            "description": "二级操作按钮列表，通常展示在“更多”菜单中",
+            "type": {
+                "raw": "ActionConfig[]",
+                "kind": "array"
+            },
+            "required": false,
+            "default": "[]"
+        }
+    ],
+    "events": [],
+    "slots": [
+        {
+            "name": "btnText",
+            "description": "自定义按钮文案渲染",
+            "vueTemplate": "<template #btnText=\"{ action }\">...</template>"
+        }
+    ],
+    "methods": [],
+    "examples": [
+        {
+            "id": "actions_table_row",
+            "title": "表格操作列中的主次操作",
+            "description": "将高频操作直接展示，低频操作折叠到更多菜单中。",
+            "difficulty": "easy",
+            "code": "<script setup lang=\"ts\">\nimport { Actions } from '@ksyun-internal/versatile';\n\nconst primaries = [\n  { text: '重启', type: 'primary', onClick: () => console.log('restart') },\n];\nconst secondaries = [\n  { text: '续费', onClick: () => console.log('renew') },\n  { text: '释放', danger: true, onClick: () => console.log('delete') },\n];\n</script>\n\n<template>\n  <Actions :primaries=\"primaries\" :secondaries=\"secondaries\" />\n</template>",
+            "tags": [
+                "actions",
+                "table"
+            ],
+            "usedProps": [
+                "primaries",
+                "secondaries"
+            ],
+            "usedEvents": [],
+            "usedMethods": [],
+            "scenario": "在列表行内同时承载高频与低频操作，减少操作列拥挤。"
+        },
+        {
+            "id": "actions_slot_btn_text",
+            "title": "自定义操作按钮文案",
+            "description": "使用 btnText 插槽为危险操作补充风险提示。",
+            "difficulty": "medium",
+            "code": "<script setup lang=\"ts\">\nimport { Actions } from '@ksyun-internal/versatile';\n\nconst primaries = [{ text: '启动', onClick: () => console.log('start') }];\nconst secondaries = [{ text: '释放', danger: true, onClick: () => console.log('release') }];\n</script>\n\n<template>\n  <Actions :primaries=\"primaries\" :secondaries=\"secondaries\">\n    <template #btnText=\"{ action }\">\n      {{ action.danger ? action.text + '（高风险）' : action.text }}\n    </template>\n  </Actions>\n</template>",
+            "tags": [
+                "actions",
+                "slot"
+            ],
+            "usedProps": [
+                "primaries",
+                "secondaries"
+            ],
+            "usedEvents": [],
+            "usedMethods": [],
+            "scenario": "在操作区给危险动作补充更明确的文案提示。"
+        }
+    ],
+    "searchKeywords": [
+        "actions",
+        "action buttons",
+        "操作按钮集",
+        "更多操作",
+        "主次操作",
+        "操作列按钮"
+    ],
+    "useCases": [
+        "表格操作列",
+        "页面头部操作区",
+        "主次操作分层展示"
+    ],
+    "typeDefinitions": [
+        {
+            "name": "ActionItem",
+            "definition": "interface ActionItem { label: string; key?: string; disabled?: boolean; type?: string }",
+            "description": "操作项配置类型，用于描述操作按钮文案、唯一标识和禁用状态。"
+        }
+    ],
+    "relatedComponents": [
+        "ButtonLink",
+        "IconTooltip"
+    ]
+}

package/components/advancedset.json

@@ -0,0 +1,127 @@
+{
+    "id": "advancedset",
+    "name": "AdvancedSet",
+    "displayName": "高级设置开关",
+    "category": "form",
+    "description": "用于折叠和展开高级配置区域的业务组件，适合购买页、创建页中把非高频参数收进“高级设置”。",
+    "importStatement": "import { AdvancedSet } from '@ksyun-internal/versatile';",
+    "props": [
+        {
+            "name": "modelValue",
+            "description": "是否展开高级设置",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false
+        },
+        {
+            "name": "label",
+            "description": "标题文案",
+            "type": {
+                "raw": "string",
+                "kind": "string"
+            },
+            "required": false
+        },
+        {
+            "name": "appendTip",
+            "description": "追加提示文案",
+            "type": {
+                "raw": "string",
+                "kind": "string"
+            },
+            "required": false
+        }
+    ],
+    "events": [
+        {
+            "name": "update:modelValue",
+            "vueEventName": "@update:modelValue",
+            "description": "用户展开或收起高级设置区域时触发，可用于同步表单状态或埋点。",
+            "params": [
+                {
+                    "name": "value",
+                    "type": "boolean",
+                    "description": "当前高级设置区域的展开状态。",
+                    "optional": true
+                }
+            ]
+        }
+    ],
+    "slots": [
+        {
+            "name": "default",
+            "description": "高级设置内容区域",
+            "vueTemplate": "<AdvancedSet>...</AdvancedSet>"
+        }
+    ],
+    "methods": [],
+    "examples": [
+        {
+            "id": "advancedset_purchase",
+            "title": "购买页中的高级设置折叠区",
+            "description": "默认收起高级参数，只在用户主动展开后展示额外配置。",
+            "difficulty": "easy",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { AdvancedSet, FormItemInput, FormItemSpinner } from '@ksyun-internal/versatile';\n\nconst advanced = ref(false);\nconst hostname = ref('web-01');\nconst bandwidth = ref(20);\n</script>\n\n<template>\n  <AdvancedSet v-model=\"advanced\" label=\"高级设置\" append-tip=\"修改后将影响实例网络配置\">\n    <FormItemInput v-model=\"hostname\" label=\"主机名\" />\n    <FormItemSpinner v-model=\"bandwidth\" label=\"带宽峰值\" unit=\"Mbps\" />\n  </AdvancedSet>\n</template>",
+            "tags": [
+                "advanced",
+                "form"
+            ],
+            "usedProps": [
+                "modelValue",
+                "label",
+                "appendTip"
+            ],
+            "usedEvents": [
+                "update:modelValue"
+            ],
+            "usedMethods": [],
+            "scenario": "创建实例时把网络、命名等低频参数收纳到高级设置区。"
+        },
+        {
+            "id": "advancedset_open_default",
+            "title": "默认展开高级设置",
+            "description": "在编辑已有配置时直接展开高级区域，减少额外点击。",
+            "difficulty": "medium",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { AdvancedSet, FormItemSwitch } from '@ksyun-internal/versatile';\n\nconst advanced = ref(true);\nconst enableMonitor = ref(false);\n</script>\n\n<template>\n  <AdvancedSet v-model=\"advanced\" label=\"高级设置\" append-tip=\"修改后即时生效\">\n    <FormItemSwitch v-model=\"enableMonitor\" label=\"开启监控增强\" />\n  </AdvancedSet>\n</template>",
+            "tags": [
+                "advanced",
+                "toggle"
+            ],
+            "usedProps": [
+                "modelValue",
+                "label",
+                "appendTip"
+            ],
+            "usedEvents": [
+                "update:modelValue"
+            ],
+            "usedMethods": [],
+            "scenario": "在编辑页面中默认展开高级参数，方便用户快速核对设置。"
+        }
+    ],
+    "searchKeywords": [
+        "advanced set",
+        "advanced options",
+        "高级设置",
+        "折叠配置区",
+        "高级参数"
+    ],
+    "useCases": [
+        "高级参数开关",
+        "可折叠配置区",
+        "编辑页默认展开高级设置"
+    ],
+    "typeDefinitions": [
+        {
+            "name": "AdvancedSetModelValue",
+            "definition": "type AdvancedSetModelValue = boolean",
+            "description": "高级设置展开状态类型，`true` 表示默认展开高级配置区域。"
+        }
+    ],
+    "relatedComponents": [
+        "FormItemInput",
+        "FormItemSpinner"
+    ]
+}

package/components/affix.json

@@ -174,5 +174,12 @@
     "底部操作栏固定",
     "悬浮按钮"
   ],
+  "typeDefinitions": [
+    {
+      "name": "AffixOffset",
+      "definition": "type AffixOffset = string | number",
+      "description": "Affix 偏移量类型，可传数字或带单位字符串。"
+    }
+  ],
   "relatedComponents": []
 }

package/components/aksk.json

@@ -0,0 +1,172 @@
+{
+    "id": "aksk",
+    "name": "AKSK",
+    "displayName": "AK/SK 配置",
+    "category": "form",
+    "description": "用于录入 AccessKey / SecretKey 并控制是否沿用原始凭证的业务表单组件，常见于任务同步、数据接入和跨账号授权场景。",
+    "importStatement": "import { AKSK } from '@ksyun-internal/versatile';",
+    "props": [
+        {
+            "name": "ak",
+            "description": "当前 AccessKey",
+            "type": {
+                "raw": "string | null",
+                "kind": "union"
+            },
+            "required": false
+        },
+        {
+            "name": "sk",
+            "description": "当前 SecretKey",
+            "type": {
+                "raw": "string | null",
+                "kind": "union"
+            },
+            "required": false
+        },
+        {
+            "name": "isUseOriginal",
+            "description": "是否使用原始 AK/SK",
+            "type": {
+                "raw": "boolean | null",
+                "kind": "union"
+            },
+            "required": false,
+            "default": "false"
+        },
+        {
+            "name": "isShowUseOriginal",
+            "description": "是否展示“使用原始凭证”选项",
+            "type": {
+                "raw": "boolean | null",
+                "kind": "union"
+            },
+            "required": false,
+            "default": "false"
+        },
+        {
+            "name": "inDataSet",
+            "description": "是否处于数据集场景",
+            "type": {
+                "raw": "boolean | null",
+                "kind": "union"
+            },
+            "required": false
+        }
+    ],
+    "events": [
+        {
+            "name": "update:ak",
+            "vueEventName": "@update:ak",
+            "description": "AccessKey 变更时触发，便于和父级表单状态保持同步。",
+            "params": [
+                {
+                    "name": "value",
+                    "type": "string | null",
+                    "description": "当前输入的 AccessKey 值。",
+                    "optional": true
+                }
+            ]
+        },
+        {
+            "name": "update:sk",
+            "vueEventName": "@update:sk",
+            "description": "SecretKey 变更时触发，通常用于同步加密存储前的表单值。",
+            "params": [
+                {
+                    "name": "value",
+                    "type": "string | null",
+                    "description": "当前输入的 SecretKey 值。",
+                    "optional": true
+                }
+            ]
+        },
+        {
+            "name": "update:isUseOriginal",
+            "vueEventName": "@update:isUseOriginal",
+            "description": "“使用原始凭证”开关变化时触发，可据此切换输入项显隐。",
+            "params": [
+                {
+                    "name": "value",
+                    "type": "boolean | null",
+                    "description": "当前是否使用原始凭证。",
+                    "optional": true
+                }
+            ]
+        }
+    ],
+    "slots": [],
+    "methods": [],
+    "examples": [
+        {
+            "id": "aksk_credentials",
+            "title": "任务配置中的 AK/SK 凭证录入",
+            "description": "通过多个 v-model 同步 AccessKey、SecretKey 和原始凭证开关。",
+            "difficulty": "easy",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { AKSK } from '@ksyun-internal/versatile';\n\nconst ak = ref('AKLTxxxxxxxx');\nconst sk = ref('********');\nconst isUseOriginal = ref(false);\n</script>\n\n<template>\n  <AKSK\n    v-model:ak=\"ak\"\n    v-model:sk=\"sk\"\n    v-model:isUseOriginal=\"isUseOriginal\"\n    :is-show-use-original=\"true\"\n  />\n</template>",
+            "tags": [
+                "credentials",
+                "security"
+            ],
+            "usedProps": [
+                "ak",
+                "sk",
+                "isUseOriginal",
+                "isShowUseOriginal"
+            ],
+            "usedEvents": [
+                "update:ak",
+                "update:sk",
+                "update:isUseOriginal"
+            ],
+            "usedMethods": [],
+            "scenario": "录入任务访问外部对象存储或服务所需的访问凭证。"
+        },
+        {
+            "id": "aksk_toggle_original",
+            "title": "切换是否沿用原始凭证",
+            "description": "结合 update:isUseOriginal 在不同凭证来源之间切换。",
+            "difficulty": "medium",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { AKSK } from '@ksyun-internal/versatile';\n\nconst ak = ref('AKLTxxxx');\nconst sk = ref('******');\nconst isUseOriginal = ref(true);\nconst handleToggle = (value: boolean) => {\n  console.log('use original credentials:', value);\n};\n</script>\n\n<template>\n  <AKSK\n    v-model:ak=\"ak\"\n    v-model:sk=\"sk\"\n    v-model:isUseOriginal=\"isUseOriginal\"\n    :is-show-use-original=\"true\"\n    :in-data-set=\"true\"\n    @update:isUseOriginal=\"handleToggle\"\n  />\n</template>",
+            "tags": [
+                "credentials",
+                "toggle"
+            ],
+            "usedProps": [
+                "ak",
+                "sk",
+                "isUseOriginal",
+                "isShowUseOriginal",
+                "inDataSet"
+            ],
+            "usedEvents": [
+                "update:isUseOriginal"
+            ],
+            "usedMethods": [],
+            "scenario": "在数据同步任务中切换使用系统默认凭证或自定义凭证。"
+        }
+    ],
+    "searchKeywords": [
+        "aksk",
+        "access key",
+        "secret key",
+        "凭证配置",
+        "ak sk",
+        "云服务凭证"
+    ],
+    "useCases": [
+        "云服务凭证录入",
+        "数据集或任务凭证配置",
+        "切换原始凭证或自定义凭证"
+    ],
+    "typeDefinitions": [
+        {
+            "name": "AKSKMode",
+            "definition": "type AKSKMode = 'original' | 'custom'",
+            "description": "凭证模式枚举，用于区分沿用原始凭证还是填写自定义 AK/SK。"
+        }
+    ],
+    "relatedComponents": [
+        "FormItemInput"
+    ]
+}

package/components/az.json

@@ -78,9 +78,22 @@
     "az",
     "zone",
     "可用区",
-    "机房"
+    "机房",
+    "availability zone",
+    "az select",
+    "可用区选择"
   ],
   "useCases": [
-    "购买页选择可用区"
+    "购买页选择可用区",
+    "与地域联动切换机房",
+    "资源部署位置选择",
+    "高可用架构中选择目标可用区"
+  ],
+  "typeDefinitions": [
+    {
+      "name": "AZItem",
+      "definition": "type AZItem = {\\n  code: string\\n  name: string\\n  regionCode?: string\\n}",
+      "description": "可用区配置项结构，包含可用区编码、名称和所属地域。"
+    }
   ]
 }

package/components/badge.json

@@ -158,5 +158,12 @@
     "新功能标记",
     "状态点"
   ],
+  "typeDefinitions": [
+    {
+      "name": "BadgeText",
+      "definition": "type BadgeText = string | number",
+      "description": "Badge 展示内容类型，可用于数字计数或短文本标识。"
+    }
+  ],
   "relatedComponents": []
 }

package/components/billtypes.json

@@ -82,9 +82,21 @@
     "price",
     "charge",
     "计费",
-    "价格"
+    "价格",
+    "计费模式",
+    "按量付费",
+    "包年包月"
   ],
   "useCases": [
-    "购买页选择计费模式"
+    "购买页选择计费模式",
+    "切换按量和包年包月",
+    "试用与正式计费方式选择"
+  ],
+  "typeDefinitions": [
+    {
+      "name": "BillTypeItem",
+      "definition": "type BillTypeItem = {\\n  id: number\\n  name: string\\n  trial?: boolean\\n}",
+      "description": "计费类型配置项结构，描述计费模式的标识、文案和试用态。"
+    }
   ]
 }

package/components/breadcrumb.json

@@ -213,6 +213,13 @@
     "多级分类导航",
     "后台管理系统导航"
   ],
+  "typeDefinitions": [
+    {
+      "name": "BreadcrumbLink",
+      "definition": "type BreadcrumbLink = string | { path?: string; name?: string }",
+      "description": "面包屑节点的跳转目标类型，可传字符串路径或路由对象。"
+    }
+  ],
   "relatedComponents": [
     "BreadcrumbItem",
     "Menu"