SuperAPI AI 工具集

agentation-visual-feedback

智能体与模型

查看项目

更新于 10-15 23:40

技能介绍

用途:Agentation 是面向 AI 编程代理的可视化反馈工具,与具体代理无关。开发者在网页上点击、选词或多选 UI 元素并写入备注,即可生成包含选择器、位置、类名、文本内容和上下文的结构化 Markdown,供 AI 代理据此定位代码并修改。

主要能力:点击标注;自动识别选择器;文本选择模式;多选模式;区域选择(标注空白或区域);动画暂停,可冻结 CSS 动画与过渡、requestAnimationFrame 循环、视频和 GIF 以便捕获特定状态。输出为结构化反馈报告,含选择器、位置、类名、文本等内容。

安装与使用:npm install agentation -D;也可用 yarn add agentation -D 或 pnpm add agentation -D。React 中在应用中渲染 <Agentation /> 组件;Next.js 需包一层带 'use client' 的客户端组件再放入 layout 或页面;可仅在开发环境加载。支持 position、theme、defaultOpen 等属性以及自定义 style,默认 z-index 为 999999。提供 TypeScript 类型定义。

适用场景:需要把界面调整意见准确传达给 AI 代理的前端开发环节,尤其是组件级样式、文案、交互状态修改。

限制:仅支持桌面端现代浏览器(Chrome、Firefox、Safari、Edge),无移动端支持,需启用 JavaScript。选择器可能过于泛化,深层 DOM 可能带来性能问题,主题可能与应用不一致。许可为 PolyForm Shield 1.0.0,非商业用途免费,商业使用条款需查看许可。