king-design-analyzer 2.1.9 → 2.2.0

package/components/description.json

@@ -0,0 +1,98 @@
+{
+    "id": "description",
+    "name": "Description",
+    "displayName": "描述输入",
+    "category": "form",
+    "description": "面向资源描述、备注和说明信息的简化输入组件，适合需要统一长度和校验规则的描述类字段。",
+    "importStatement": "import { Description } from '@ksyun-internal/versatile';",
+    "props": [
+        {
+            "name": "modelValue",
+            "description": "描述内容",
+            "type": {
+                "raw": "string | null",
+                "kind": "union"
+            },
+            "required": false
+        }
+    ],
+    "events": [
+        {
+            "name": "update:modelValue",
+            "vueEventName": "@update:modelValue",
+            "description": "描述内容变化时触发，可直接同步备注或说明字段。",
+            "params": [
+                {
+                    "name": "value",
+                    "type": "string | null",
+                    "description": "当前备注或描述文本。",
+                    "optional": true
+                }
+            ]
+        }
+    ],
+    "slots": [],
+    "methods": [],
+    "examples": [
+        {
+            "id": "description_instance_remark",
+            "title": "实例备注录入",
+            "description": "使用 Description 统一承载资源备注或用途说明。",
+            "difficulty": "easy",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Description } from '@ksyun-internal/versatile';\n\nconst remark = ref('用于支付链路的核心应用实例');\n</script>\n\n<template>\n  <Description v-model=\"remark\" />\n</template>",
+            "tags": [
+                "description",
+                "remark"
+            ],
+            "usedProps": [
+                "modelValue"
+            ],
+            "usedEvents": [
+                "update:modelValue"
+            ],
+            "usedMethods": [],
+            "scenario": "在创建或编辑资源时填写用途说明和备注信息。"
+        },
+        {
+            "id": "description_edit_remark",
+            "title": "编辑资源备注",
+            "description": "在编辑表单中回填已有备注并持续同步到父级状态。",
+            "difficulty": "medium",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Description } from '@ksyun-internal/versatile';\n\nconst remark = ref('部署于金融业务生产环境');\n</script>\n\n<template>\n  <Description v-model=\"remark\" />\n  <div>预览：{{ remark }}</div>\n</template>",
+            "tags": [
+                "description",
+                "edit"
+            ],
+            "usedProps": [
+                "modelValue"
+            ],
+            "usedEvents": [
+                "update:modelValue"
+            ],
+            "usedMethods": [],
+            "scenario": "在编辑资源信息时实时预览备注字段内容。"
+        }
+    ],
+    "searchKeywords": [
+        "description",
+        "remark input",
+        "描述输入",
+        "备注填写",
+        "说明文本"
+    ],
+    "useCases": [
+        "资源描述录入",
+        "备注信息填写",
+        "编辑页备注预览"
+    ],
+    "typeDefinitions": [
+        {
+            "name": "DescriptionValue",
+            "definition": "type DescriptionValue = string",
+            "description": "描述或备注字段的文本值类型。"
+        }
+    ],
+    "relatedComponents": [
+        "FormItemInput"
+    ]
+}