run-prompt-button.md
基本信息
- 类型: React Client 组件
- 路径:
./src/components/prompts/run-prompt-button.tsx
功能描述
运行Prompt按钮组件,用于在AI平台中打开和运行Prompt。支持多种平台(ChatGPT、Claude、VS Code、Cursor等),支持Chat和Code两种模式切换,支持变量填充和移动端底部弹窗。
导出内容
RunPromptButton- 主组件RunPromptButtonProps- Props接口
Props 接口
| 属性 | 类型 | 说明 | |||||
|---|---|---|---|---|---|---|---|
| content | string | Prompt内容 | |||||
| title | string | Prompt标题(可选) | |||||
| description | string | Prompt描述(可选) | |||||
| variant | "default" \ | "ghost" \ | "outline" | 按钮样式 | |||
| size | "default" \ | "sm" \ | "icon" | 按钮尺寸 | |||
| className | string | 自定义类名 | |||||
| unfilledVariables | UnfilledVariable[] | 未填充的变量 | |||||
| onVariablesFilled | (values) => void | 变量填充回调 | |||||
| getContentWithVariables | (values) => string | 获取填充后内容 | |||||
| promptId | string | Prompt ID(用于分析) | |||||
| categoryName | string | 分类名称 | |||||
| parentCategoryName | string | 父分类名称 | |||||
| emphasized | boolean | 是否高亮显示 | |||||
| promptType | "TEXT" \ | "IMAGE" \ | "VIDEO" \ | "AUDIO" \ | "STRUCTURED" \ | "SKILL" | Prompt类型 |
支持的平台
Chat平台
ChatGPT、Claude、Copilot、DeepSeek、Grok、Gemini、Perplexity、Phind等
Code平台
Windsurf、VS Code、VS Code Insiders、Cursor、Goose、GitHub Copilot、Bolt、Lovable、v0等
媒体平台
Mitte.ai(图片/视频生成)
依赖
react- React核心next-intl- 国际化lucide-react- 图标库@/components/ui/button- 按钮组件@/components/ui/dialog- 对话框组件@/components/ui/dropdown-menu- 下拉菜单组件@/components/ui/sheet- 底部弹窗组件@/lib/analytics- 分析工具@/hooks/use-mobile- 移动端检测@/components/providers/branding-provider- 品牌配置
相关组件
PromptCard- 集成运行按钮VariableFillModal- 变量填充弹窗