SuperAPI AI 工具集

widgets-ui

前端与建站

查看项目

更新于 10-16 08:42

技能介绍

用途:widgets-ui 是一个面向 React/Next.js 的声明式 UI 渲染技能,通过 ui.inference.sh 提供的 JSON 结构把智能体返回的结构化数据渲染成丰富的交互界面,例如表单、信息卡片等。

主要能力:支持布局组件(row、col、box)、排版组件(title、text、caption、label)、交互组件(button、input、textarea、select、checkbox)以及展示组件(badge、icon、image、divider)。box 支持渐变背景(如 gradient-ocean、gradient-sunset、gradient-purple、gradient-cool、gradient-midnight)、内边距和圆角。组件支持 asForm 表单模式,并通过 onAction 回调处理 submit、click 等动作及表单数据。

使用方式:先安装技能 npx skills add belt-sh/cli,再通过 npx shadcn@latest add https://ui.inference.sh/r/widgets.json 添加组件。随后从 @/registry/blocks/widgets/widget-renderer 引入 WidgetRenderer,从 @/registry/blocks/widgets/types 引入 Widget、WidgetAction 类型,将符合 schema 的 widget 对象传入 widget 并绑定 onAction 回调即可。

适用场景:适合需要让智能体生成动态 UI 的场景,如对话式表单收集、航班信息卡片、联系表单等生成式界面。

限制:资料未提供收费、价格、平台兼容范围及性能等细节;组件依赖 ui.inference.sh 与 shadcn 注册表,具体 schema 与组件文档需参考 ui.inference.sh/blocks/widgets。