智能聊天输入框本地交互预览新对话今天想完成什么?▧产品需求.pdfPDF · 本地示例×把这份需求整理成三个清晰的产品方案Enter 发送,Shift + Enter 换行。Live Demo在线预览查看模块 ↗智能聊天输入框Prompt Composer♡AI 对话React · TypeScript
智能文件上传区本地状态预览文件不会离开浏览器,仅用于演示选择、校验、进度和完成反馈。↑拖入文件,或点击选择支持图片和 PDF · 单个不超过 10 MB选择文件等待选择文件Live Demo在线预览查看模块 ↗智能文件上传区File Upload Dropzone♡多模态React · TypeScript
连接光束 · Connection Beam响应式路径输入提示词数据知识库工具API处理AI输出结果速度 2.4s弯曲 45%方向:向内Live Demo在线预览查看模块 ↗连接光束Connection Beam♡Agent 工作流React · SVG
文本选区工具栏选择 · 定位 · 保留AI 写作工作台选中文字查看操作优秀的编辑工具会把操作放在内容附近,让用户保持当前阅读节奏。选中这段文字,工具栏会跟随选区出现;取消选择以后,它会自动隐藏。真正接入模型时,请在业务层处理请求、取消、错误和内容写回。请在文稿中选中一段文字。 当前预览只演示交互,不调用模型。Live Demo在线预览查看模块 ↗文本选区工具栏Text Selection Toolbar♡内容工具React · TypeScript
命令面板 · Command Palette键盘完整操作打开命令面板⌘ K支持鼠标与键盘操作⌕ESC项目新建项目创建一个空白工作区N最近项目打开最近编辑的项目R搜索全局搜索查找页面、文件和知识条目S界面切换主题切换浅色与深色外观T系统打开设置进入偏好与账户设置⌘ ,Live Demo在线预览查看模块 ↗命令面板Command Palette♡Agent 工作流React · TypeScript
图片 → 配色本地预览+拖入图片,提取主要颜色或点击选择图片#506f88#d3b89c#f5efe6Live Demo在线预览查看模块 ↗图片取色Color Extraction♡多模态Canvas · React
堆叠通知新增 · 展开 · 补位添加通知展开通知✓成功内容已保存3 个页面已经同步到当前项目。×i通知正在生成预览背景任务仍在继续,可以先处理其他内容。×!提醒有 1 个文件需要处理请确认图片尺寸后重新上传。查看×这是本地交互预览,不会发送网络请求。Live Demo在线预览查看模块 ↗堆叠通知Toast Stack♡FoundationReact · TypeScript
AI 操作授权确认卡 · AI Action Approval Card本地状态演示AI 工作台清理本次任务产生的临时文件高风险动作执行前,先把范围和影响说清楚。!需要你的确认AI 准备执行一个不可自动撤销的动作。准备执行删除临时导出文件影响对象/exports/draft-preview.png风险说明删除后无法从当前任务中恢复等待你的确认拒绝允许一次当前页面只模拟交互状态,不会删除文件或执行真实操作。Live Demo在线预览查看模块 ↗AI 操作授权确认卡AI Action Approval Card♡Free UIReact · TypeScript
AI 思考过程面板 · AI Reasoning Panel本地状态演示用户问题帮我把这份需求整理成发布计划。处理过程摘要等待开始↓正在整理问题范围、相关信息和答案结构。·识别问题范围等待中·整理可公开信息等待中·组织答案结构等待中仅展示可公开的处理摘要,不展示模型私密思维链。开始演示预览只模拟公开状态,不调用模型,也不展示私密思维链。Live Demo在线预览查看模块 ↗AI 思考过程面板AI Reasoning Panel♡AI 对话React · TypeScript
卡片变形弹窗 · Morphing Dialog点击卡片AI MODULEAI 回复结构把输入、检索和生成状态放进同一张详情卡。↗支持 Esc、点按外部、焦点循环与减少动画。Live Demo在线预览查看模块 ↗卡片变形弹窗Morphing Dialog♡Free UIReact · TypeScript
圆形主题切换 · Circular Theme Reveal点击右上角第 014 期 · 圆形主题切换让主题跟着点击展开。点击右上角按钮,观察变化从操作位置扩张到四个角。今日任务12完成进度68%运行状态正常☾深色当前为浅色主题 · 支持键盘与减少动画Live Demo在线预览查看模块 ↗圆形主题切换Circular Theme Reveal♡Visual EffectsReact · TypeScript