用途:@veltra/directives 面向 Vue 项目提供自定义指令,覆盖自动聚焦、点击外部关闭浮层和按钮水波纹三类常见交互。
主要能力:vFocus 在挂载时聚焦,可直接用于 <input v-focus />,也可用在容器上由指令内部查找 input;vClickOutside 在元素外按下并点击时触发回调,格式为 <div v-click-outside="handleClose">...</div>,常用于关闭浮层;vRipple 默认启用,<button v-ripple>,可用 <button v-ripple="false"> 禁用,用指令 arg 自定义动画时长(毫秒)如 <button v-ripple:300>,也可用 <button v-ripple="'my-ripple-class'"> 自定义波纹元素类名。
注册方式:全局注册通常在消费项目中引入 UltraUI 后 app.use(UltraUI),会注册组件与附带指令;在 monorepo 内联 @veltra/desktop 时以当前应用的安装入口为准。按需注册写法为:import { vFocus, vClickOutside, vRipple } from '@veltra/directives',再 app.directive('focus', vFocus)、app.directive('click-outside', vClickOutside)、app.directive('ripple', vRipple),模板中 v-focus 对应注册名 focus,依此类推。
样式依赖与生成:vRipple 依赖波纹样式,按需构建时需单独引入 import '@veltra/directives/ripple/style',否则波纹无视觉样式;走 UltraUI 全量安装并已引入全量样式时,一般已包含波纹样式链路。生成的文档位于 generated/index.md(指令组索引)、generated/groups/(每组一篇,含包入口、vFocus、vClickOutside、vRipple 等)和 generated/manifest.json(同步时间与文件列表),根目录执行 bun run sync-veltra-directives 或 bun run sync-skills 可重新生成 generated/。
限制:资料未提供支持版本、浏览器兼容性、错误处理或与其他指令冲突等细节,暂未提供。