SuperAPI AI 工具集

syncfusion-javascript-inline-ai-assist

编程与开发

查看项目

更新于 10-16 02:59

技能介绍

用途

Syncfusion JavaScript Inline AI Assist 是一个基于弹出窗口的 AI 组件,用于在界面元素附近提供上下文相关的 AI 辅助。它通过一个紧凑的弹出界面呈现智能文本处理、内容转换和 AI 建议,并配备命令快捷方式、响应操作与可自定义的工作流。

主要能力

  • 元素相对弹窗:通过 relateTo 属性将 AI 辅助弹窗定位到任意元素附近。
  • 命令操作弹窗:提供快捷 AI 命令(如 Summarize、Shorten、Translate 等)。
  • 响应操作:支持对 AI 生成响应的接受/拒绝工作流。
  • 内联工具栏:紧凑工具栏,包含发送按钮和自定义项。
  • 提示词管理:提示词文本、占位符以及提示-响应对集合。
  • AI 服务集成:内置对 OpenAI、Gemini、Ollama、LiteLLM 的支持。
  • 响应流式传输:支持 AI 输出的实时流式响应。
  • 模板:可用自定义提示输入 UI 定制编辑器区域。
  • 方法:显示/隐藏弹窗、添加响应、以程序方式执行提示。
  • 事件:created、open、close、promptRequest,用于生命周期管理。
  • 全球化:支持 RTL 和面向国际应用的本地化。

使用方式

组件从 @syncfusion/ej2-interactive-chat 包导入 InlineAIAssist,并需引入 CSS 与主题配置。基本流程包括:初始化组件并设置 relateTo 指向触发元素,配置 placeholder 占位符,在 promptRequest 事件中连接自己的 AI 服务并调用 addResponse 添加响应,通过 responseSettings.itemSelect 处理接受/拒绝操作,最后使用 appendTo 挂载并通过 showPopup 显示弹窗。

文档涵盖以下主题:快速开始(包安装、CSS 导入、基本初始化、relateTo 属性、首次渲染与 promptRequest 事件基础、宽高与 z-index 配置);内联辅助配置(prompt、placeholder、prompts、popupWidth、popupHeight、zIndex、target、cssClass、enableStreaming、responseMode、持久化、RTL);命令设置(commandSettings.commands 数组及 id、label、prompt、iconCss、disabled 属性、groupBy 分组、工具提示、itemSelect 事件);内联工具栏设置(内置发送按钮、自定义项、对齐、template、toolbarPosition、itemClick 事件);响应设置(内置接受/拒绝项、自定义响应操作项、itemSelect 事件、接受/拒绝处理模式);AI 服务集成(promptRequest 事件详解、OpenAI 与 Azure OpenAI、Google Gemini、Ollama 本地模型、LiteLLM 代理、响应格式化与错误处理、流式与标准响应模式);模板(editorTemplate 自定义提示输入 UI、responseTemplate 自定义 AI 响应渲染、自定义页脚/提示区域设计、模板上下文与数据绑定、配合自定义 UI 使用 executePrompt、响应中的语法高亮与 Markdown 渲染);方法(addResponse、showPopup、hidePopup、showCommandPopup、hideCommandPopup、executePrompt、destroy 及 appendTo、dataBind、refresh 等标准框架方法);事件与全球化(created、open、close、promptRequest、L10n 本地化、enableRtl、locale 配置)。

关键属性包括:relateTo(字符串,定位元素的 CSS 选择器)、placeholder(字符串,默认 'Ask or generate AI content..')、prompt(预设提示文本)、prompts(提示-响应集合)、popupWidth(默认 '400px')、popupHeight(默认 'auto')、zIndex(默认 1000)、commandSettings、inlineToolbarSettings、responseSettings、editorTemplate、enableStreaming(默认 false)、cssClass、enableRtl、locale(默认 'en-US')、enablePersistence。

适用场景

  • 内容摘要:在文本内容旁添加 Summarize 按钮,打开 AI 辅助弹窗进行快速摘要并提供接受/拒绝工作流。
  • 文本编辑器增强:将 AI 驱动的文本改进命令(语法、语气、长度)通过弹窗界面集成到现有文本编辑器中。
  • 翻译工具:提供带语言选择命令和响应预览的即时翻译弹窗,应用前可先预览。
  • 内容生成:为空白字段生成 AI 内容,并提供针对不同内容类型(正式、随意、技术)的命令快捷方式。
  • 代码助手:为代码生成、解释或优化添加 AI 辅助,弹窗相对代码块定位。

限制

资料未提供关于收费、价格、平台支持范围、性能效果或具体使用步骤之外的其他限制信息,相关内容暂未提供。