ep-craft 0.1.42 → 0.2.0

package/dist-ai/components/autocomplete.md

@@ -0,0 +1,140 @@
+# EpAutocomplete
+
+`ep-autocomplete` · form（表单） · `component:autocomplete`
+
+## 摘要
+
+自动补全输入框，表单数据录入控件
+
+## 适用场景
+
+- 适用：表单中收集或编辑自动补全输入框数据
+- 适用：与 EpForm、EpFormItem 组合完成校验
+- 不适用：仅展示静态文本或只读数据时
+
+## 关键词
+
+- 中文：自动补全输入框、表单
+- English: autocomplete, suggest, form
+
+## Props
+
+- id (unknown，默认 见文档)
+- size (unknown)
+- disabled (unknown，默认 见文档)
+- modelValue（别名 v-model） (string | number，默认 '')：绑定值
+- modelModifiers (unknown，默认 见文档)
+- maxlength (unknown)
+- minlength (unknown)
+- type (unknown，默认 见文档)
+- resize (unknown)
+- autosize (unknown，默认 见文档)
+- autocomplete (unknown，默认 见文档)
+- formatter (unknown)
+- parser (unknown)
+- placeholder (unknown)
+- form (unknown)
+- readonly (unknown)
+- clearable (unknown)
+- clearIcon (unknown，默认 见文档)
+- showPassword (unknown)
+- showWordLimit (unknown)
+- wordLimitPosition (unknown，默认 见文档)
+- suffixIcon (unknown)
+- prefixIcon (unknown)
+- containerRole (unknown，默认 见文档)
+- tabindex (unknown，默认 见文档)
+- validateEvent (unknown，默认 见文档)
+- inputStyle (unknown，默认 见文档)
+- countGraphemes (unknown)
+- autofocus (unknown)
+- rows (unknown，默认 见文档)
+- ariaLabel (unknown)
+- inputmode (unknown，默认 见文档)
+- name (unknown)
+- floatLabel (unknown，默认 见文档)
+- valueKey (string，默认 value)：建议项中用于展示的键名
+- debounce (number，默认 300)：输入防抖延迟，单位 ms
+- placement ('top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end'，默认 bottom-start)：弹出菜单位置
+- fetchSuggestions ((queryString, cb) => Awaitable<Data[] | void> | Data[]，默认 见文档)：获取建议项的方法，可用 callback 回传数据，也可直接返回数据
+- popperClass (string)：下拉菜单自定义类名
+- popperStyle (string | object，默认 见文档)：下拉菜单自定义样式
+- popperOptions (Partial<Options>，默认 见文档)：popper.js 配置项
+- showArrow (boolean，默认 true)：是否显示箭头
+- triggerOnFocus (boolean，默认 true)：聚焦时是否显示建议
+- selectWhenUnmatched (boolean)：无匹配项时回车是否触发 select 事件
+- hideLoading (boolean)：远程搜索时是否隐藏加载图标
+- teleported (boolean，默认 见文档)：是否将下拉菜单 teleport 到 body
+- appendTo (string | HTMLElement)：下拉菜单挂载的容器
+- highlightFirstItem (boolean)：远程搜索时是否默认高亮第一项
+- fitInputWidth (boolean)：下拉菜单宽度是否与输入框一致
+- loopNavigation (boolean，默认 true)：键盘导航是否从末尾循环到开头
+
+## Events
+
+- update:modelValue((value: string | number))：绑定值变化时触发
+- input((value: string | number))：输入时触发
+- change((value: string | number))：值变化时触发
+- focus((evt: FocusEvent))：聚焦时触发
+- blur((evt: FocusEvent))：失焦时触发
+- clear(—)：清空时触发
+- select((item: Record<string, any>))：选中建议项时触发
+
+## Slots
+
+- default：自定义建议项内容，参数为 `{ item }`
+- prefix：输入框前缀内容
+- suffix：输入框后缀内容
+- prepend：输入框前置内容
+- append：输入框后置内容
+- loading：自定义加载中内容
+- header：下拉菜单头部
+- footer：下拉菜单底部
+
+## Exposes
+
+- highlightedIndex(Ref<number>)：当前高亮建议项的索引
+- activated(Ref<boolean>)：自动补全是否激活
+- loading(Ref<boolean>)：远程搜索加载状态
+- inputRef(Ref<InputInstance | undefined>)：内部 ep-input 实例
+
+## 视觉提示
+
+- 形状：矩形输入框
+- 密度：中等
+- 插槽内容：default：自定义建议项内容，参数为 `{ item }`；prefix：输入框前缀内容；suffix：输入框后缀内容
+- CSS 变量：--el-border-color、--el-border-radius-base、--el-color-primary、--el-font-size-base
+
+## 示例
+
+### 输入建议
+
+```vue
+<script setup lang="ts">
+import { ref } from 'vue'
+import { EpAutocomplete } from 'ep-craft'
+
+const value = ref('')
+const options = ['Vue', 'React', 'Svelte', 'Solid']
+
+const fetchSuggestions = (query: string) =>
+  options.filter((item) => item.toLowerCase().includes(query.toLowerCase())).map((item) => ({ value: item }))
+</script>
+
+<template>
+  <ep-autocomplete
+    v-model="value"
+    :fetch-suggestions="fetchSuggestions"
+    placeholder="输入前端框架"
+  />
+</template>
+```
+
+## 相关条目
+
+- EpInput
+- EpSelect
+
+---
+
+ep-craft 0.2.0

package/dist-ai/components/avatar.json

@@ -0,0 +1,163 @@
+{
+  "entry": {
+    "category": "basic",
+    "events": [
+      {
+        "description": "图片加载失败时触发",
+        "name": "error",
+        "params": "(e: Event)"
+      }
+    ],
+    "exampleOmittedReason": null,
+    "examples": [
+      {
+        "code": "<script setup lang=\"ts\">\nimport { EpAvatar } from 'ep-craft'\n</script>\n\n<template>\n  <ep-avatar :size=\"48\">张</ep-avatar>\n</template>",
+        "id": "avatar-1",
+        "language": "vue",
+        "title": "文字头像"
+      },
+      {
+        "code": "<script setup lang=\"ts\">\nimport { EpAvatar } from 'ep-craft'\n</script>\n\n<template>\n  <ep-avatar :size=\"48\" shape=\"square\">李</ep-avatar>\n  <ep-avatar :size=\"32\">王</ep-avatar>\n</template>",
+        "id": "avatar-2",
+        "language": "vue",
+        "title": "形状与尺寸"
+      }
+    ],
+    "exposes": [],
+    "hot": true,
+    "id": "component:avatar",
+    "keywords": {
+      "en": [
+        "avatar",
+        "user",
+        "profile",
+        "basic"
+      ],
+      "zh": [
+        "头像",
+        "用户",
+        "标识",
+        "基础"
+      ]
+    },
+    "kind": "component",
+    "name": "EpAvatar",
+    "nonUseCases": [
+      "需要完全自定义原生行为或视觉时"
+    ],
+    "props": [
+      {
+        "alias": null,
+        "defaultText": "default",
+        "description": "Avatar 大小",
+        "hasDefault": false,
+        "name": "size",
+        "required": false,
+        "type": "number | \"large\" | \"default\" | \"small\""
+      },
+      {
+        "alias": null,
+        "defaultText": "circle",
+        "description": "Avatar 形状",
+        "hasDefault": false,
+        "name": "shape",
+        "required": false,
+        "type": "'circle' | 'square'"
+      },
+      {
+        "alias": null,
+        "defaultText": null,
+        "description": "设置 Avatar 的图标类型",
+        "hasDefault": false,
+        "name": "icon",
+        "required": false,
+        "type": "string | Component"
+      },
+      {
+        "alias": null,
+        "defaultText": null,
+        "description": "Avatar 图片的源地址",
+        "hasDefault": true,
+        "name": "src",
+        "required": false,
+        "type": "string"
+      },
+      {
+        "alias": null,
+        "defaultText": null,
+        "description": "图片 alt",
+        "hasDefault": false,
+        "name": "alt",
+        "required": false,
+        "type": "string"
+      },
+      {
+        "alias": null,
+        "defaultText": null,
+        "description": "图片 srcSet",
+        "hasDefault": false,
+        "name": "srcSet",
+        "required": false,
+        "type": "string"
+      },
+      {
+        "alias": null,
+        "defaultText": "cover",
+        "description": "当展示类型为图片时，设置图片如何适应容器",
+        "hasDefault": true,
+        "name": "fit",
+        "required": false,
+        "type": "'fill' | 'contain' | 'cover' | 'none' | 'scale-down'"
+      }
+    ],
+    "related": [
+      "EpBadge",
+      "EpTag"
+    ],
+    "relations": {
+      "children": [],
+      "combos": [],
+      "parents": [],
+      "requiredChildren": []
+    },
+    "slots": [
+      {
+        "description": "自定义头像展示内容",
+        "name": "default"
+      }
+    ],
+    "slug": "avatar",
+    "summary": "头像，展示用户或对象标识图像",
+    "tag": "ep-avatar",
+    "useCases": [
+      "用户信息展示",
+      "列表与评论中的身份标识"
+    ],
+    "variants": [
+      {
+        "dimension": "size",
+        "values": [
+          "large",
+          "default",
+          "small"
+        ],
+        "when": "按容器空间与信息密度选择尺寸"
+      }
+    ],
+    "visual": {
+      "cssVars": [
+        "--el-color-primary",
+        "--el-border-radius-base",
+        "--el-font-size-base"
+      ],
+      "density": "中等",
+      "shape": "圆形或圆角矩形",
+      "slotContent": [
+        "default：自定义头像展示内容"
+      ]
+    }
+  },
+  "generatedAt": "2026-11-03T03:09:12.050Z",
+  "libraryVersion": "0.2.0",
+  "schemaVersion": 1
+}

package/dist-ai/components/avatar.md

@@ -0,0 +1,83 @@
+# EpAvatar
+
+`ep-avatar` · basic（基础） · `component:avatar`
+
+## 摘要
+
+头像，展示用户或对象标识图像
+
+## 适用场景
+
+- 适用：用户信息展示
+- 适用：列表与评论中的身份标识
+- 不适用：需要完全自定义原生行为或视觉时
+
+## 关键词
+
+- 中文：头像、用户、标识、基础
+- English: avatar, user, profile, basic
+
+## 变体
+
+- size: large/default/small（按容器空间与信息密度选择尺寸）
+
+## Props
+
+- size (number | "large" | "default" | "small")：Avatar 大小
+- shape ('circle' | 'square')：Avatar 形状
+- icon (string | Component)：设置 Avatar 的图标类型
+- src (string，默认 见文档)：Avatar 图片的源地址
+- alt (string)：图片 alt
+- srcSet (string)：图片 srcSet
+- fit ('fill' | 'contain' | 'cover' | 'none' | 'scale-down'，默认 cover)：当展示类型为图片时，设置图片如何适应容器
+
+## Events
+
+- error((e: Event))：图片加载失败时触发
+
+## Slots
+
+- default：自定义头像展示内容
+
+## 视觉提示
+
+- 形状：圆形或圆角矩形
+- 密度：中等
+- 插槽内容：default：自定义头像展示内容
+- CSS 变量：--el-color-primary、--el-border-radius-base、--el-font-size-base
+
+## 示例
+
+### 文字头像
+
+```vue
+<script setup lang="ts">
+import { EpAvatar } from 'ep-craft'
+</script>
+
+<template>
+  <ep-avatar :size="48">张</ep-avatar>
+</template>
+```
+
+### 形状与尺寸
+
+```vue
+<script setup lang="ts">
+import { EpAvatar } from 'ep-craft'
+</script>
+
+<template>
+  <ep-avatar :size="48" shape="square">李</ep-avatar>
+  <ep-avatar :size="32">王</ep-avatar>
+</template>
+```
+
+## 相关条目
+
+- EpBadge
+- EpTag
+
+---
+
+ep-craft 0.2.0

package/dist-ai/components/backtop.json

@@ -0,0 +1,118 @@
+{
+  "entry": {
+    "category": "basic",
+    "events": [
+      {
+        "description": "点击按钮时触发",
+        "name": "click",
+        "params": "(event: MouseEvent)"
+      }
+    ],
+    "exampleOmittedReason": null,
+    "examples": [
+      {
+        "code": "<script setup lang=\"ts\">\nimport { EpBacktop } from 'ep-craft'\n</script>\n\n<template>\n  <div id=\"backtop-demo\" style=\"height: 200px; overflow: auto\">\n    <div style=\"height: 700px\">向下滚动后，右下角出现回到顶部按钮</div>\n  </div>\n  <ep-backtop target=\"#backtop-demo\" :right=\"20\" :bottom=\"20\" />\n</template>",
+        "id": "backtop-1",
+        "language": "vue",
+        "title": "回到顶部"
+      }
+    ],
+    "exposes": [],
+    "hot": false,
+    "id": "component:backtop",
+    "keywords": {
+      "en": [
+        "backtop",
+        "back-to-top",
+        "scroll-top",
+        "basic"
+      ],
+      "zh": [
+        "回到顶部",
+        "基础"
+      ]
+    },
+    "kind": "component",
+    "name": "EpBacktop",
+    "nonUseCases": [
+      "需要完全自定义原生行为或视觉时"
+    ],
+    "props": [
+      {
+        "alias": null,
+        "defaultText": "200",
+        "description": "滚动高度达到该值后才显示回到顶部按钮",
+        "hasDefault": true,
+        "name": "visibilityHeight",
+        "required": false,
+        "type": "number"
+      },
+      {
+        "alias": null,
+        "defaultText": "''",
+        "description": "触发滚动的目标元素选择器",
+        "hasDefault": true,
+        "name": "target",
+        "required": false,
+        "type": "string"
+      },
+      {
+        "alias": null,
+        "defaultText": "40",
+        "description": "按钮距离页面右侧的距离，单位 px",
+        "hasDefault": true,
+        "name": "right",
+        "required": false,
+        "type": "number"
+      },
+      {
+        "alias": null,
+        "defaultText": "40",
+        "description": "按钮距离页面底部的距离，单位 px",
+        "hasDefault": true,
+        "name": "bottom",
+        "required": false,
+        "type": "number"
+      }
+    ],
+    "related": [
+      "EpScrollbar",
+      "EpAffix"
+    ],
+    "relations": {
+      "children": [],
+      "combos": [],
+      "parents": [],
+      "requiredChildren": []
+    },
+    "slots": [
+      {
+        "description": "自定义按钮内容",
+        "name": "default"
+      }
+    ],
+    "slug": "backtop",
+    "summary": "回到顶部，基础交互与展示元素",
+    "tag": "ep-backtop",
+    "useCases": [
+      "页面中的回到顶部展示与交互",
+      "为回到顶部提供统一视觉与状态"
+    ],
+    "variants": [],
+    "visual": {
+      "cssVars": [
+        "--el-color-primary",
+        "--el-border-radius-base",
+        "--el-font-size-base"
+      ],
+      "density": "中等",
+      "shape": "圆角矩形",
+      "slotContent": [
+        "default：自定义按钮内容"
+      ]
+    }
+  },
+  "generatedAt": "2026-11-03T03:09:12.050Z",
+  "libraryVersion": "0.2.0",
+  "schemaVersion": 1
+}

package/dist-ai/components/backtop.md

@@ -0,0 +1,66 @@
+# EpBacktop
+
+`ep-backtop` · basic（基础） · `component:backtop`
+
+## 摘要
+
+回到顶部，基础交互与展示元素
+
+## 适用场景
+
+- 适用：页面中的回到顶部展示与交互
+- 适用：为回到顶部提供统一视觉与状态
+- 不适用：需要完全自定义原生行为或视觉时
+
+## 关键词
+
+- 中文：回到顶部、基础
+- English: backtop, back-to-top, scroll-top, basic
+
+## Props
+
+- visibilityHeight (number，默认 200)：滚动高度达到该值后才显示回到顶部按钮
+- target (string，默认 '')：触发滚动的目标元素选择器
+- right (number，默认 40)：按钮距离页面右侧的距离，单位 px
+- bottom (number，默认 40)：按钮距离页面底部的距离，单位 px
+
+## Events
+
+- click((event: MouseEvent))：点击按钮时触发
+
+## Slots
+
+- default：自定义按钮内容
+
+## 视觉提示
+
+- 形状：圆角矩形
+- 密度：中等
+- 插槽内容：default：自定义按钮内容
+- CSS 变量：--el-color-primary、--el-border-radius-base、--el-font-size-base
+
+## 示例
+
+### 回到顶部
+
+```vue
+<script setup lang="ts">
+import { EpBacktop } from 'ep-craft'
+</script>
+
+<template>
+  <div id="backtop-demo" style="height: 200px; overflow: auto">
+    <div style="height: 700px">向下滚动后，右下角出现回到顶部按钮</div>
+  </div>
+  <ep-backtop target="#backtop-demo" :right="20" :bottom="20" />
+</template>
+```
+
+## 相关条目
+
+- EpScrollbar
+- EpAffix
+
+---
+
+ep-craft 0.2.0