king-design-analyzer 1.0.0

package/components/input.json

@@ -0,0 +1,821 @@
+{
+    "id": "input",
+    "name": "Input",
+    "displayName": "输入框",
+    "category": "form",
+    "description": "用于文本输入的表单组件，支持单行文本、多行文本域，可配合前后缀、清除按钮等功能使用。还提供了 Search 搜索组件。",
+    "importStatement": "import { Input, Search } from '@king-design/vue';",
+    "props": [
+        {
+            "name": "type",
+            "description": "在原生 input 标签的 type 取值的基础上扩展了 textarea 值，当取该值时渲染成 <textarea>",
+            "type": {
+                "raw": "string",
+                "kind": "string"
+            },
+            "required": false,
+            "default": "\"text\"",
+            "allowedValues": [
+                {
+                    "value": "text",
+                    "label": "普通文本输入",
+                    "isDefault": true
+                },
+                {
+                    "value": "password",
+                    "label": "密码输入"
+                },
+                {
+                    "value": "number",
+                    "label": "数字输入"
+                },
+                {
+                    "value": "email",
+                    "label": "邮箱输入"
+                },
+                {
+                    "value": "tel",
+                    "label": "电话输入"
+                },
+                {
+                    "value": "url",
+                    "label": "URL 输入"
+                },
+                {
+                    "value": "textarea",
+                    "label": "多行文本域（扩展值）"
+                }
+            ],
+            "usageExample": "<Input type=\"textarea\" :rows=\"4\" placeholder=\"请输入内容\" />"
+        },
+        {
+            "name": "value",
+            "description": "输入框的值，可用 v-model 进行双向绑定",
+            "type": {
+                "raw": "string",
+                "kind": "string"
+            },
+            "required": false,
+            "default": "undefined",
+            "usageExample": "<Input v-model=\"inputValue\" />"
+        },
+        {
+            "name": "defaultValue",
+            "description": "input 的 defaultValue，首次渲染使用该值",
+            "type": {
+                "raw": "string",
+                "kind": "string"
+            },
+            "required": false,
+            "default": "undefined",
+            "usageExample": "<Input defaultValue=\"初始值\" />"
+        },
+        {
+            "name": "name",
+            "description": "原生 input 标签的 name 属性",
+            "type": {
+                "raw": "string",
+                "kind": "string"
+            },
+            "required": false,
+            "default": "undefined",
+            "usageExample": "<Input name=\"username\" />"
+        },
+        {
+            "name": "placeholder",
+            "description": "占位文案",
+            "type": {
+                "raw": "string",
+                "kind": "string"
+            },
+            "required": false,
+            "default": "undefined",
+            "usageExample": "<Input placeholder=\"请输入内容\" />"
+        },
+        {
+            "name": "readonly",
+            "description": "是否只读",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Input v-model=\"value\" readonly />"
+        },
+        {
+            "name": "clearable",
+            "description": "是否展示快速清除按钮",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Input v-model=\"value\" clearable />"
+        },
+        {
+            "name": "disabled",
+            "description": "是否禁用",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Input disabled placeholder=\"禁用状态\" />"
+        },
+        {
+            "name": "size",
+            "description": "组件尺寸",
+            "type": {
+                "raw": "\"large\" | \"default\" | \"small\" | \"mini\"",
+                "kind": "union",
+                "unionTypes": [
+                    "large",
+                    "default",
+                    "small",
+                    "mini"
+                ]
+            },
+            "required": false,
+            "default": "\"default\"",
+            "allowedValues": [
+                {
+                    "value": "large",
+                    "label": "大尺寸"
+                },
+                {
+                    "value": "default",
+                    "label": "默认尺寸",
+                    "isDefault": true
+                },
+                {
+                    "value": "small",
+                    "label": "小尺寸"
+                },
+                {
+                    "value": "mini",
+                    "label": "迷你尺寸"
+                }
+            ],
+            "usageExample": "<Input size=\"large\" placeholder=\"大尺寸输入框\" />"
+        },
+        {
+            "name": "rows",
+            "description": "当 type=\"textarea\" 时，默认展示文本行数",
+            "type": {
+                "raw": "number | string",
+                "kind": "union"
+            },
+            "required": false,
+            "default": "2",
+            "usageExample": "<Input type=\"textarea\" :rows=\"6\" />"
+        },
+        {
+            "name": "autoWidth",
+            "description": "是否宽度随输入的文本的长度变化而变化",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Input autoWidth placeholder=\"宽度自适应\" />"
+        },
+        {
+            "name": "fluid",
+            "description": "是否宽度 100%",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Input fluid placeholder=\"宽度100%\" />"
+        },
+        {
+            "name": "width",
+            "description": "指定宽度，组件会加上单位 px",
+            "type": {
+                "raw": "string | number",
+                "kind": "union"
+            },
+            "required": false,
+            "default": "undefined",
+            "usageExample": "<Input :width=\"300\" placeholder=\"宽度300px\" />"
+        },
+        {
+            "name": "stackClearIcon",
+            "description": "是否将清空按钮覆盖在 suffix 按钮上展示来节省空间",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Input clearable stackClearIcon />"
+        },
+        {
+            "name": "frozenOnInput",
+            "description": "是否在输入的过程中冻结 value 更新到视图",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Input frozenOnInput />"
+        },
+        {
+            "name": "inline",
+            "description": "是否展示内联模式",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Input inline />"
+        },
+        {
+            "name": "resize",
+            "description": "指定 textarea 输入框拖动调整大小的方向，默认只能垂直方向调整",
+            "type": {
+                "raw": "\"none\" | \"vertical\" | \"horizontal\" | \"both\"",
+                "kind": "union",
+                "unionTypes": [
+                    "none",
+                    "vertical",
+                    "horizontal",
+                    "both"
+                ]
+            },
+            "required": false,
+            "default": "\"vertical\"",
+            "allowedValues": [
+                {
+                    "value": "none",
+                    "label": "禁止调整大小"
+                },
+                {
+                    "value": "vertical",
+                    "label": "只能垂直调整",
+                    "isDefault": true
+                },
+                {
+                    "value": "horizontal",
+                    "label": "只能水平调整"
+                },
+                {
+                    "value": "both",
+                    "label": "可双向调整"
+                }
+            ],
+            "usageExample": "<Input type=\"textarea\" resize=\"both\" />"
+        },
+        {
+            "name": "flat",
+            "description": "是否展示扁平样式",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Input flat placeholder=\"扁平样式\" />"
+        },
+        {
+            "name": "showCount",
+            "description": "是否展示字符长度提示数字",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Input showCount maxlength=\"50\" />"
+        },
+        {
+            "name": "showPassword",
+            "description": "当 type=\"password\" 时，是否展示显隐密码按钮",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Input type=\"password\" showPassword />"
+        }
+    ],
+    "slots": [
+        {
+            "name": "prepend",
+            "description": "输入框前置内容，展示在输入框外部左侧",
+            "vueTemplate": "#prepend",
+            "usageExample": "<Input v-model=\"url\">\n  <template #prepend>http://</template>\n</Input>"
+        },
+        {
+            "name": "append",
+            "description": "输入框后置内容，展示在输入框外部右侧",
+            "vueTemplate": "#append",
+            "usageExample": "<Input v-model=\"email\">\n  <template #append>.com</template>\n</Input>"
+        },
+        {
+            "name": "prefix",
+            "description": "输入框前缀图标或内容，展示在输入框内部左侧",
+            "vueTemplate": "#prefix",
+            "usageExample": "<Input v-model=\"user\">\n  <template #prefix><Icon class=\"k-icon-user\" /></template>\n</Input>"
+        },
+        {
+            "name": "suffix",
+            "description": "输入框后缀图标或内容，展示在输入框内部右侧",
+            "vueTemplate": "#suffix",
+            "usageExample": "<Input v-model=\"search\">\n  <template #suffix><Icon class=\"k-icon-search\" /></template>\n</Input>"
+        }
+    ],
+    "methods": [
+        {
+            "name": "focus",
+            "description": "使输入框获得焦点",
+            "params": [],
+            "returnType": "void",
+            "usageExample": "const inputRef = ref<InstanceType<typeof Input>>();\ninputRef.value?.focus();"
+        },
+        {
+            "name": "blur",
+            "description": "使输入框失去焦点",
+            "params": [],
+            "returnType": "void",
+            "usageExample": "inputRef.value?.blur();"
+        },
+        {
+            "name": "select",
+            "description": "全选输入框中的内容",
+            "params": [],
+            "returnType": "void",
+            "usageExample": "inputRef.value?.select();"
+        }
+    ],
+    "events": [
+        {
+            "name": "clear",
+            "vueEventName": "@clear",
+            "description": "点击清除按钮时触发",
+            "payload": [],
+            "usageExample": "<Input clearable @clear=\"handleClear\" />",
+            "handlerExample": "const handleClear = () => {\n  console.log('内容已清空');\n};"
+        },
+        {
+            "name": "change",
+            "vueEventName": "@change",
+            "description": "原生 change 事件，绑定在组件内部 input 元素上",
+            "payload": [
+                {
+                    "name": "event",
+                    "type": "Event",
+                    "description": "原生 change 事件对象"
+                }
+            ],
+            "usageExample": "<Input @change=\"handleChange\" />",
+            "handlerExample": "const handleChange = (e: Event) => {\n  console.log('值已变化', (e.target as HTMLInputElement).value);\n};"
+        },
+        {
+            "name": "keydown",
+            "vueEventName": "@keydown",
+            "description": "原生 keydown 事件，绑定在组件内部 input 元素上",
+            "payload": [
+                {
+                    "name": "event",
+                    "type": "KeyboardEvent",
+                    "description": "原生键盘事件对象"
+                }
+            ],
+            "usageExample": "<Input @keydown=\"handleKeydown\" />",
+            "handlerExample": "const handleKeydown = (e: KeyboardEvent) => {\n  if (e.key === 'Enter') {\n    console.log('按下回车');\n  }\n};"
+        },
+        {
+            "name": "keyup",
+            "vueEventName": "@keyup",
+            "description": "原生 keyup 事件，绑定在组件内部 input 元素上",
+            "payload": [
+                {
+                    "name": "event",
+                    "type": "KeyboardEvent",
+                    "description": "原生键盘事件对象"
+                }
+            ],
+            "usageExample": "<Input @keyup=\"handleKeyup\" />",
+            "handlerExample": "const handleKeyup = (e: KeyboardEvent) => {\n  console.log('键盘抬起', e.key);\n};"
+        },
+        {
+            "name": "keypress",
+            "vueEventName": "@keypress",
+            "description": "原生 keypress 事件，绑定在组件内部 input 元素上",
+            "payload": [
+                {
+                    "name": "event",
+                    "type": "KeyboardEvent",
+                    "description": "原生键盘事件对象"
+                }
+            ],
+            "usageExample": "<Input @keypress=\"handleKeypress\" />",
+            "handlerExample": "const handleKeypress = (e: KeyboardEvent) => {\n  console.log('按键', e.key);\n};"
+        },
+        {
+            "name": "click",
+            "vueEventName": "@click",
+            "description": "原生 click 事件，绑定在组件最外层元素上",
+            "payload": [
+                {
+                    "name": "event",
+                    "type": "MouseEvent",
+                    "description": "原生鼠标事件对象"
+                }
+            ],
+            "usageExample": "<Input @click=\"handleClick\" />",
+            "handlerExample": "const handleClick = (e: MouseEvent) => {\n  console.log('点击输入框');\n};"
+        },
+        {
+            "name": "mouseenter",
+            "vueEventName": "@mouseenter",
+            "description": "原生 mouseenter 事件，绑定在组件最外层元素上",
+            "payload": [
+                {
+                    "name": "event",
+                    "type": "MouseEvent",
+                    "description": "原生鼠标事件对象"
+                }
+            ],
+            "usageExample": "<Input @mouseenter=\"handleMouseenter\" />",
+            "handlerExample": "const handleMouseenter = (e: MouseEvent) => {\n  console.log('鼠标进入');\n};"
+        },
+        {
+            "name": "mouseleave",
+            "vueEventName": "@mouseleave",
+            "description": "原生 mouseleave 事件，绑定在组件最外层元素上",
+            "payload": [
+                {
+                    "name": "event",
+                    "type": "MouseEvent",
+                    "description": "原生鼠标事件对象"
+                }
+            ],
+            "usageExample": "<Input @mouseleave=\"handleMouseleave\" />",
+            "handlerExample": "const handleMouseleave = (e: MouseEvent) => {\n  console.log('鼠标离开');\n};"
+        }
+    ],
+    "subComponents": [
+        {
+            "name": "Search",
+            "description": "搜索框组件，提供可展开收起的搜索输入框功能",
+            "props": [
+                {
+                    "name": "value",
+                    "description": "组件输入的值",
+                    "type": {
+                        "raw": "string",
+                        "kind": "string"
+                    },
+                    "required": false,
+                    "default": "\"\"",
+                    "usageExample": "<Search v-model=\"keywords\" />"
+                },
+                {
+                    "name": "placeholder",
+                    "description": "占位文案",
+                    "type": {
+                        "raw": "string",
+                        "kind": "string"
+                    },
+                    "required": false,
+                    "default": "\"请输入关键字\"",
+                    "usageExample": "<Search placeholder=\"搜索用户\" />"
+                },
+                {
+                    "name": "type",
+                    "description": "搜索框类型",
+                    "type": {
+                        "raw": "\"default\" | \"line\"",
+                        "kind": "union",
+                        "unionTypes": [
+                            "default",
+                            "line"
+                        ]
+                    },
+                    "required": false,
+                    "default": "\"default\"",
+                    "allowedValues": [
+                        {
+                            "value": "default",
+                            "label": "默认样式",
+                            "isDefault": true
+                        },
+                        {
+                            "value": "line",
+                            "label": "线条样式"
+                        }
+                    ],
+                    "usageExample": "<Search type=\"line\" />"
+                },
+                {
+                    "name": "size",
+                    "description": "尺寸",
+                    "type": {
+                        "raw": "\"large\" | \"default\" | \"small\" | \"mini\"",
+                        "kind": "union",
+                        "unionTypes": [
+                            "large",
+                            "default",
+                            "small",
+                            "mini"
+                        ]
+                    },
+                    "required": false,
+                    "default": "\"default\"",
+                    "allowedValues": [
+                        {
+                            "value": "large",
+                            "label": "大尺寸"
+                        },
+                        {
+                            "value": "default",
+                            "label": "默认尺寸",
+                            "isDefault": true
+                        },
+                        {
+                            "value": "small",
+                            "label": "小尺寸"
+                        },
+                        {
+                            "value": "mini",
+                            "label": "迷你尺寸"
+                        }
+                    ],
+                    "usageExample": "<Search size=\"small\" />"
+                },
+                {
+                    "name": "open",
+                    "description": "是否展开状态",
+                    "type": {
+                        "raw": "boolean",
+                        "kind": "boolean"
+                    },
+                    "required": false,
+                    "default": "false",
+                    "usageExample": "<Search :open=\"isExpanded\" />"
+                }
+            ],
+            "events": [
+                {
+                    "name": "submit",
+                    "vueEventName": "@submit",
+                    "description": "表单提交事件，按回车或点击搜索按钮时触发",
+                    "payload": [
+                        {
+                            "name": "keywords",
+                            "type": "string",
+                            "description": "当前搜索关键字"
+                        }
+                    ],
+                    "usageExample": "<Search @submit=\"handleSearch\" />",
+                    "handlerExample": "const handleSearch = (keywords: string) => {\n  console.log('搜索关键字:', keywords);\n};"
+                }
+            ],
+            "methods": [
+                {
+                    "name": "focus",
+                    "description": "使搜索框获得焦点",
+                    "params": [],
+                    "returnType": "void",
+                    "usageExample": "const searchRef = ref<InstanceType<typeof Search>>();\nsearchRef.value?.focus();"
+                },
+                {
+                    "name": "blur",
+                    "description": "使搜索框失去焦点",
+                    "params": [],
+                    "returnType": "void",
+                    "usageExample": "searchRef.value?.blur();"
+                }
+            ]
+        }
+    ],
+    "examples": [
+        {
+            "id": "input_basic",
+            "title": "基础用法",
+            "description": "基本的输入框用法",
+            "difficulty": "easy",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Input } from '@king-design/vue';\n\nconst value = ref('');\n</script>\n<template>\n  <Input v-model=\"value\" placeholder=\"请输入内容\" />\n</template>",
+            "tags": [
+                "basic",
+                "v-model"
+            ],
+            "usedProps": [
+                "value",
+                "placeholder"
+            ],
+            "usedEvents": [],
+            "usedMethods": [],
+            "scenario": "创建一个基本的输入框，支持双向绑定"
+        },
+        {
+            "id": "input_clearable",
+            "title": "可清空输入框",
+            "description": "带有清除按钮的输入框",
+            "difficulty": "easy",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Input } from '@king-design/vue';\n\nconst value = ref('默认文本');\n\nconst handleClear = () => {\n  console.log('已清空');\n};\n</script>\n<template>\n  <Input v-model=\"value\" clearable @clear=\"handleClear\" />\n</template>",
+            "tags": [
+                "clearable",
+                "clear"
+            ],
+            "usedProps": [
+                "value",
+                "clearable"
+            ],
+            "usedEvents": [
+                "clear"
+            ],
+            "usedMethods": [],
+            "scenario": "创建一个可以快速清空内容的输入框"
+        },
+        {
+            "id": "input_sizes",
+            "title": "不同尺寸",
+            "description": "展示不同尺寸的输入框",
+            "difficulty": "easy",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Input } from '@king-design/vue';\n\nconst value = ref('');\n</script>\n<template>\n  <Input v-model=\"value\" size=\"large\" placeholder=\"大尺寸\" />\n  <Input v-model=\"value\" size=\"default\" placeholder=\"默认尺寸\" />\n  <Input v-model=\"value\" size=\"small\" placeholder=\"小尺寸\" />\n  <Input v-model=\"value\" size=\"mini\" placeholder=\"迷你尺寸\" />\n</template>",
+            "tags": [
+                "size",
+                "large",
+                "small",
+                "mini"
+            ],
+            "usedProps": [
+                "size",
+                "placeholder"
+            ],
+            "usedEvents": [],
+            "usedMethods": [],
+            "scenario": "展示输入框的各种尺寸"
+        },
+        {
+            "id": "input_textarea",
+            "title": "多行文本域",
+            "description": "使用 textarea 类型创建多行输入",
+            "difficulty": "easy",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Input } from '@king-design/vue';\n\nconst content = ref('');\n</script>\n<template>\n  <Input \n    v-model=\"content\" \n    type=\"textarea\" \n    :rows=\"4\" \n    placeholder=\"请输入详细内容\" \n  />\n</template>",
+            "tags": [
+                "textarea",
+                "multiline",
+                "rows"
+            ],
+            "usedProps": [
+                "type",
+                "rows",
+                "placeholder"
+            ],
+            "usedEvents": [],
+            "usedMethods": [],
+            "scenario": "创建多行文本输入框，如备注、描述等场景"
+        },
+        {
+            "id": "input_password",
+            "title": "密码输入框",
+            "description": "使用 password 类型创建密码输入，配合 showPassword 属性可以展示显隐切换按钮。",
+            "difficulty": "easy",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Input } from '@king-design/vue';\n\nconst password = ref('');\n</script>\n<template>\n  <Input \n    v-model=\"password\" \n    type=\"password\" \n    showPassword\n    placeholder=\"请输入密码\" \n  />\n</template>",
+            "tags": [
+                "password",
+                "security",
+                "showPassword"
+            ],
+            "usedProps": [
+                "type",
+                "placeholder",
+                "showPassword"
+            ],
+            "usedEvents": [],
+            "usedMethods": [],
+            "scenario": "用户输入密码并需要核对时使用"
+        },
+        {
+            "id": "input_showcount",
+            "title": "显示字数统计",
+            "description": "展示输入字符数量",
+            "difficulty": "easy",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Input } from '@king-design/vue';\n\nconst value = ref('');\n</script>\n<template>\n  <Input v-model=\"value\" showCount maxlength=\"50\" placeholder=\"最多50字\" />\n  <Input v-model=\"value\" type=\"textarea\" showCount maxlength=\"200\" />\n</template>",
+            "tags": [
+                "showCount",
+                "maxlength",
+                "counter"
+            ],
+            "usedProps": [
+                "showCount"
+            ],
+            "usedEvents": [],
+            "usedMethods": [],
+            "scenario": "显示已输入字符数和最大限制"
+        },
+        {
+            "id": "input_search",
+            "title": "搜索框",
+            "description": "使用 Search 组件创建搜索输入框",
+            "difficulty": "medium",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Search, Message } from '@king-design/vue';\n\nconst keywords = ref('');\n\nconst handleSubmit = (value: string) => {\n  Message.info(`搜索: ${value}`);\n};\n</script>\n<template>\n  <Search v-model=\"keywords\" @submit=\"handleSubmit\" />\n</template>",
+            "tags": [
+                "search",
+                "submit"
+            ],
+            "usedProps": [
+                "value"
+            ],
+            "usedEvents": [
+                "submit"
+            ],
+            "usedMethods": [],
+            "scenario": "创建搜索框，支持回车提交"
+        }
+    ],
+    "commonMistakes": [
+        {
+            "id": "input_textarea_rows",
+            "description": "设置 rows 但未指定 type=\"textarea\"",
+            "wrongCode": "<Input :rows=\"4\" placeholder=\"多行\" />",
+            "correctCode": "<Input type=\"textarea\" :rows=\"4\" placeholder=\"多行\" />",
+            "explanation": "rows 属性只在 type=\"textarea\" 时生效，普通 input 不支持 rows",
+            "relatedProps": [
+                "type",
+                "rows"
+            ]
+        },
+        {
+            "id": "input_size_typo",
+            "description": "使用不存在的 size 值 (Input)",
+            "wrongCode": "<Input size=\"medium\" />",
+            "correctCode": "<Input size=\"default\" />",
+            "explanation": "Input 的 size 只支持 large, default, small, mini。常见错误是使用 medium 值。",
+            "relatedProps": [
+                "size"
+            ]
+        },
+        {
+            "id": "input_resize_without_textarea",
+            "description": "在非 textarea 上使用 resize 属性",
+            "wrongCode": "<Input resize=\"both\" />",
+            "correctCode": "<Input type=\"textarea\" resize=\"both\" />",
+            "explanation": "resize 属性只对 type=\"textarea\" 生效",
+            "relatedProps": [
+                "type",
+                "resize"
+            ]
+        },
+        {
+            "id": "input_hallucinate_textarea",
+            "description": "错误地导入或使用不存在的 Textarea 组件",
+            "wrongCode": "import { Textarea } from '@king-design/vue';\n<Textarea v-model=\"desc\" />",
+            "correctCode": "import { Input } from '@king-design/vue';\n<Input type=\"textarea\" v-model=\"desc\" />",
+            "explanation": "KPC 组件库没有单独的 Textarea 组件，多行输入统一使用 Input 组件并设置 type=\"textarea\"。",
+            "relatedProps": [
+                "type"
+            ]
+        },
+        {
+            "id": "input_show_word_limit_hallucination",
+            "description": "使用 Element UI 的 show-word-limit 属性",
+            "wrongCode": "<Input show-word-limit />",
+            "correctCode": "<Input showCount />",
+            "explanation": "KPC 中展示字数计数的属性是 showCount，不是 show-word-limit。",
+            "relatedProps": [
+                "showCount"
+            ]
+        }
+    ],
+    "searchKeywords": [
+        "输入框",
+        "input",
+        "文本框",
+        "textarea",
+        "搜索",
+        "search",
+        "密码",
+        "password",
+        "表单",
+        "form",
+        "清空",
+        "clearable"
+    ],
+    "useCases": [
+        "表单中的文本输入",
+        "搜索关键字输入",
+        "密码输入",
+        "多行文本/备注输入",
+        "数字/金额输入",
+        "带前后缀的复合输入框"
+    ],
+    "relatedComponents": [
+        "Search",
+        "Form",
+        "FormItem"
+    ]
+}