@huyooo/ai-chat-frontend-react 0.1.6 → 0.2.0

package/dist/index.d.ts

@@ -1,6 +1,9 @@
-import { ChatMode as ChatMode$1, ThinkingMode, ChatAdapter, ModelConfig as ModelConfig$1, SessionRecord as SessionRecord$1 } from '@huyooo/ai-chat-bridge-electron/renderer';
-export { ChatAdapter, ChatMode, ChatOptions, ChatProgress, ChatProgressType, MessageRecord, ModelConfig, ModelProvider, SessionRecord, ThinkingMode } from '@huyooo/ai-chat-bridge-electron/renderer';
-import { FC, ReactNode } from 'react';
+import { ChatMode as ChatMode$1, ThinkingMode, ModelOption as ModelOption$1, SessionRecord as SessionRecord$1, ChatAdapter, AutoRunConfig } from '@huyooo/ai-chat-bridge-electron/renderer';
+export { ChatAdapter, ChatEvent, ChatEventType, ChatMode, ChatOptions, MessageRecord, ModelOption, ProviderType, SessionRecord, ThinkingMode } from '@huyooo/ai-chat-bridge-electron/renderer';
+import * as react from 'react';
+import { FC, ReactNode, ComponentType } from 'react';
+import { ContentBlock, ToolRendererProps, TextBlock as TextBlock$1, CodeBlock as CodeBlock$1 } from '@huyooo/ai-chat-shared';
+export { CodeBlock as CodeBlockType, ContentBlock, ContentBlockType, SearchResultItem, TextBlock as TextBlockType, ToolRendererProps, WeatherData, getLanguageDisplayName, highlightCode, parseContent, renderMarkdown } from '@huyooo/ai-chat-shared';
 
 /**
  * Chat Adapter 辅助类型和工具
@@ -32,6 +35,7 @@ interface SendMessageOptions {
     mode: ChatMode$1;
     model: string;
     enableWebSearch: boolean;
+    /** 深度思考开关（每个 provider 内部使用最优参数） */
     thinkingMode: ThinkingMode;
 }
 /** 创建会话选项 */
@@ -51,114 +55,170 @@ interface SaveMessageOptions {
     sessionId: string;
     role: 'user' | 'assistant';
     content: string;
-    thinking?: string;
-    toolCalls?: string;
-    searchResults?: string;
+    /** 执行步骤列表 JSON */
+    steps?: string;
+    operationIds?: string;
 }
-/**
- * 创建空 Adapter（用于测试或无后端场景）
- * 返回一个最小实现的 ChatAdapter
- */
-declare function createNullAdapter(): ChatAdapter;
 
 /**
  * AI Chat 前端类型定义
- * 核心类型（ChatAdapter, SessionRecord, MessageRecord 等）从 bridge-electron 导出
- * 这里只定义前端特有的类型
+ * 核心类型从 bridge-electron 导出，保持类型一致性
+ *
+ * 架构：消息内容使用 ContentPart 数组，支持流式渲染和自定义 UI
  */
 
 type ChatMode = ChatMode$1;
-type ModelConfig = ModelConfig$1;
 type SessionRecord = SessionRecord$1;
+type ModelOption = ModelOption$1;
 /** 搜索结果 */
 interface SearchResult {
     title: string;
     url: string;
     snippet: string;
 }
-/** 工具调用 */
-interface ToolCall {
+/** 文本内容 Part */
+interface TextPart {
+    type: 'text';
+    text: string;
+}
+/** 思考过程 Part */
+interface ThinkingPart {
+    type: 'thinking';
+    text: string;
+    status: 'running' | 'done';
+    duration?: number;
+}
+/** 搜索 Part */
+interface SearchPart {
+    type: 'search';
+    query?: string;
+    results?: SearchResult[];
+    status: 'running' | 'done';
+}
+/** 工具调用 Part */
+interface ToolCallPart {
+    type: 'tool_call';
+    id: string;
+    name: string;
+    args?: Record<string, unknown>;
+    status: 'pending' | 'running' | 'done' | 'error' | 'cancelled' | 'skipped';
+    result: unknown | null;
+}
+/** 工具结果 Part - 用于自定义 UI 渲染（备用，主要使用 ToolCallPart） */
+interface ToolResultPart {
+    type: 'tool_result';
+    id: string;
     name: string;
     args?: Record<string, unknown>;
-    result?: string;
-    status: 'running' | 'success' | 'error';
+    result: unknown;
+    status: 'done' | 'error' | 'cancelled' | 'skipped';
+}
+/** 图片 Part */
+interface ImagePart {
+    type: 'image';
+    url: string;
+}
+/** 错误 Part */
+interface ErrorPart {
+    type: 'error';
+    message: string;
+    category?: string;
+    retryable?: boolean;
 }
-/** 聊天消息（前端显示用） */
+/** 内容 Part 联合类型 */
+type ContentPart = TextPart | ThinkingPart | SearchPart | ToolCallPart | ToolResultPart | ImagePart | ErrorPart;
+/** 内容 Part 类型字符串 */
+type ContentPartType = ContentPart['type'];
+/** 错误详情（结构化错误信息） */
+interface ErrorDetails {
+    category?: string;
+    message: string;
+    code?: string;
+    statusCode?: number;
+    retryable?: boolean;
+    retryAfter?: number;
+}
+/** 聊天消息（前端显示用）- 新架构：基于 parts 数组 */
 interface ChatMessage {
     id: string;
     role: 'user' | 'assistant';
-    content: string;
+    /** 内容 parts 数组 - 核心渲染数据 */
+    parts: ContentPart[];
+    /** 生成此消息时使用的模型 */
+    model?: string;
+    /** 生成此消息时使用的模式 (ask/agent) */
+    mode?: string;
+    /** 生成此消息时是否启用 web 搜索 */
+    webSearchEnabled?: boolean;
+    /** 生成此消息时是否启用深度思考 */
+    thinkingEnabled?: boolean;
+    /** 用户上传的图片（仅用户消息） */
     images?: string[];
-    thinking?: string;
-    thinkingComplete?: boolean;
-    searchResults?: SearchResult[];
-    searching?: boolean;
-    toolCalls?: ToolCall[];
-    copied?: boolean;
+    /** 是否正在加载 */
     loading?: boolean;
+    /** 是否已复制 */
+    copied?: boolean;
+    /** 消息时间戳 */
     timestamp?: Date;
+    /** 错误详情（如果有错误） */
+    error?: ErrorDetails;
+    /** 是否被用户中止 */
+    aborted?: boolean;
 }
-/** 默认模型列表 */
-declare const DEFAULT_MODELS: ModelConfig$1[];
-/** @deprecated 使用 SessionRecord */
-interface ChatSession {
-    id: string;
-    title: string;
-    messages: ChatMessage[];
-    createdAt: Date;
-    updatedAt: Date;
-}
-/** 音视频操作类型 */
-interface MediaOperation {
-    id: string;
-    type: 'clip' | 'transcode' | 'merge' | 'extract_audio' | 'add_subtitle' | 'analyze';
-    description: string;
-    sourceFiles: string[];
-    targetFile?: string;
-    parameters?: Record<string, unknown>;
-    status?: 'pending' | 'applied' | 'rejected';
-    preview?: string;
-}
-/** @deprecated 使用字符串枚举 */
-type AiModel = 'gemini-3-pro-preview' | 'gemini-3-pro-image-preview';
-declare enum FileType {
-    FOLDER = "folder",
-    IMAGE = "image",
-    VIDEO = "video",
-    AUDIO = "audio",
-    TEXT = "text",
-    PDF = "pdf",
-    CODE = "code",
-    ARCHIVE = "archive",
-    OTHER = "other"
-}
-interface DiffStat {
-    file: string;
-    additions: number;
-    deletions: number;
-    type: 'modified' | 'added' | 'deleted';
+/** 获取消息的纯文本内容（用于复制、保存等） */
+declare function getMessageText(message: ChatMessage): string;
+/** 输入区配置快照（用于历史回溯/重发） */
+interface ChatInputOptions {
+    mode: ChatMode;
+    model: string;
+    webSearchEnabled: boolean;
+    thinkingEnabled: boolean;
 }
 
 /**
  * useChat Hook
  * 管理聊天状态和与后端的通信
- * 使用 Adapter 模式解耦后端通信
  *
- * 与 Vue 版本 useChat composable 保持一致
+ * 新架构：
+ * - 使用 Map 存储每个会话的独立状态
+ * - 多会话可同时进行，互不干扰
+ * - 切换 tab 不会停止正在进行的请求
+ * - ContentPart 数组存储消息内容，支持流式渲染和自定义 UI
  */
 
+/** 副作用定义 */
+interface SideEffect {
+    type: string;
+    success: boolean;
+    data?: unknown;
+    message?: string;
+}
+/** 工具完成事件数据 */
+interface ToolCompleteEvent {
+    name: string;
+    result: unknown;
+    /**
+     * 工具声明的副作用列表
+     * 前端可根据此字段处理通知、刷新文件列表等
+     */
+    sideEffects?: SideEffect[];
+}
 interface UseChatOptions {
-    /** Adapter 实例 */
-    adapter?: ChatAdapter;
-    /** 默认模型 */
+    adapter: ChatAdapter;
     defaultModel?: string;
-    /** 默认模式 */
     defaultMode?: ChatMode$1;
+    onToolComplete?: (event: ToolCompleteEvent) => void;
+    autoRunConfig?: AutoRunConfig;
 }
 /**
  * 聊天状态管理 Hook
+ *
+ * 核心架构：
+ * - sessionStatesRef: Map<sessionId, SessionState> 存储每个会话的独立状态
+ * - 多会话可同时进行请求，互不干扰
+ * - 切换 tab 不会停止任何正在进行的请求
  */
-declare function useChat(options?: UseChatOptions): {
+declare function useChat(options: UseChatOptions): {
     sessions: SessionRecord$1[];
     currentSessionId: string | null;
     messages: ChatMessage[];
@@ -172,72 +232,268 @@ declare function useChat(options?: UseChatOptions): {
     createNewSession: () => Promise<void>;
     deleteSession: (sessionId: string) => Promise<void>;
     deleteCurrentSession: () => Promise<void>;
+    hideSession: (sessionId: string, hidden: boolean) => Promise<void>;
+    clearAllSessions: () => Promise<void>;
+    hideOtherSessions: () => Promise<void>;
+    exportCurrentSession: () => string | null;
     sendMessage: (text: string, images?: string[]) => Promise<void>;
     cancelRequest: () => void;
     copyMessage: (messageId: string) => Promise<void>;
     regenerateMessage: (messageIndex: number) => void;
+    resendFromIndex: (index: number, text: string) => void;
     setMode: (value: ChatMode$1) => void;
     setModel: (value: string) => void;
     setWebSearch: (value: boolean) => void;
     setThinking: (value: boolean) => void;
     setWorkingDirectory: (dir: string) => void;
+    autoRunConfig: AutoRunConfig;
+    loadAutoRunConfig: () => Promise<void>;
+    saveAutoRunConfig: (config: AutoRunConfig) => Promise<void>;
 };
 
 /**
- * ChatPanel Component
- * 与 Vue 版本 ChatPanel.vue 保持一致
+ * 全局 ChatInput 状态 Context
+ * 用于在 MessageBubble 中的 ChatInput 共享和修改全局状态
  */
 
+interface ChatInputContextValue {
+    mode: ChatMode;
+    model: string;
+    models: ModelOption[];
+    webSearch: boolean;
+    thinking: boolean;
+    isLoading: boolean;
+    /** Electron adapter（用于 @ 文件选择） */
+    adapter?: ChatAdapter;
+    setMode: (value: ChatMode) => void;
+    setModel: (value: string) => void;
+    setWebSearch: (value: boolean) => void;
+    setThinking: (value: boolean) => void;
+}
+interface ChatInputProviderProps {
+    value: ChatInputContextValue;
+    children: ReactNode;
+}
+declare const ChatInputProvider: FC<ChatInputProviderProps>;
+declare function useChatInputContext(): ChatInputContextValue | null;
+
+/** 块渲染器映射 */
+type BlockRenderers = Record<string, ComponentType<{
+    block: ContentBlock;
+}>>;
+/** 工具结果渲染器映射 */
+type ToolRenderers = Record<string, ComponentType<ToolRendererProps>>;
+/** 块渲染器上下文 */
+declare const BlockRenderersContext: react.Context<BlockRenderers>;
+/** 工具结果渲染器上下文 */
+declare const ToolRenderersContext: react.Context<ToolRenderers>;
+/** 渲染器 Provider Props */
+interface RenderersProviderProps {
+    blockRenderers?: BlockRenderers;
+    toolRenderers?: ToolRenderers;
+    children: ReactNode;
+}
+/** 渲染器 Provider */
+declare const RenderersProvider: FC<RenderersProviderProps>;
+
+/** 功能项 */
+interface WelcomeFeature {
+    name: string;
+    icon: string;
+}
+/** 快捷任务 */
+interface WelcomeTask {
+    name: string;
+    desc: string;
+    prompt: string;
+    icon: string;
+}
+/** 欢迎页配置 */
+interface WelcomeConfig {
+    /** 标题 */
+    title: string;
+    /** 副标题 */
+    subtitle: string;
+    /** 图标 */
+    icon: string;
+    /** 功能列表 */
+    features: WelcomeFeature[];
+    /** 快捷任务 */
+    tasks: WelcomeTask[];
+}
+/** 默认配置 */
+declare const defaultWelcomeConfig: WelcomeConfig;
+
+/** ChatPanel 暴露给外部的方法 */
+interface ChatPanelHandle {
+    /** 设置输入框内容 */
+    setInputText: (text: string) => void;
+    /** 在光标位置插入文本（用于 @ 上下文） */
+    insertInputText: (text: string) => void;
+    /** 聚焦输入框 */
+    focusInput: () => void;
+    /** 发送消息 */
+    sendMessage: (text: string) => void;
+    /** 设置当前工作目录 */
+    setCwd: (dir: string) => void;
+}
 interface ChatPanelProps {
     /** Adapter 实例 */
-    adapter?: ChatAdapter;
-    /** 工作目录 */
-    workingDir?: string;
+    adapter: ChatAdapter;
     /** 默认模型 */
     defaultModel?: string;
     /** 默认模式 */
     defaultMode?: ChatMode$1;
     /** 可用模型列表 */
-    models?: ModelConfig$1[];
+    models?: ModelOption$1[];
     /** 隐藏标题栏 */
     hideHeader?: boolean;
     /** 关闭回调（有此属性时显示关闭按钮） */
     onClose?: () => void;
+    /** 工具执行完成回调 */
+    onToolComplete?: (event: ToolCompleteEvent) => void;
     /** 自定义类名 */
     className?: string;
-    /** 自定义 Markdown 渲染器 */
-    renderMarkdown?: (content: string) => ReactNode;
+    /** 欢迎页配置 */
+    welcomeConfig?: Partial<WelcomeConfig>;
+    /** 自定义工具结果渲染器 - 根据工具名称选择渲染组件 */
+    toolRenderers?: Record<string, ComponentType<ToolRendererProps>>;
+    /**
+     * 执行步骤折叠模式
+     * - 'open': 始终展开
+     * - 'close': 始终折叠
+     * - 'auto': 执行时展开，完成后折叠
+     */
+    stepsExpandedType?: 'open' | 'close' | 'auto';
 }
-declare const ChatPanel: FC<ChatPanelProps>;
+declare const ChatPanel: react.ForwardRefExoticComponent<ChatPanelProps & react.RefAttributes<ChatPanelHandle>>;
 
 /**
- * ChatInput Component
- * 与 Vue 版本 ChatInput.vue 保持一致
+ * MessageBubble Component
+ * 新架构：使用 ContentPart 数组渲染消息内容
  */
 
+interface MessageBubbleProps {
+    role: 'user' | 'assistant';
+    /** 内容 parts 数组 - 新架构核心 */
+    parts: ContentPart[];
+    /** 生成此消息时使用的模型 */
+    model?: string;
+    /** 生成此消息时使用的模式 (ask/agent) */
+    mode?: string;
+    /** 用户上传的图片 */
+    images?: string[];
+    /** 是否正在加载 */
+    loading?: boolean;
+    /** 是否已复制 */
+    copied?: boolean;
+    /** 消息时间戳 */
+    timestamp?: Date | string | number;
+    onCopy?: () => void;
+    onRegenerate?: () => void;
+    /** 编辑用户消息后重新发送 */
+    onSend?: (text: string) => void;
+    /** 步骤折叠模式 */
+    stepsExpandedType?: 'open' | 'close' | 'auto';
+    /** 工具调用相关 - 通过 props 传递 */
+    adapter?: ChatAdapter;
+    autoRunConfig?: AutoRunConfig;
+    onSaveConfig?: (config: AutoRunConfig) => Promise<void>;
+}
+declare const MessageBubble: FC<MessageBubbleProps>;
+
+/**
+ * 内容渲染器
+ * 将原始文本解析为内容块并渲染
+ */
+
+interface ContentRendererProps {
+    /** 原始文本内容 */
+    content: string;
+    /** 预解析的块列表（可选，用于流式更新） */
+    blocks?: ContentBlock[];
+    /** 代码复制事件 */
+    onCodeCopy?: (code: string) => void;
+}
+declare const ContentRenderer: FC<ContentRendererProps>;
+
+/**
+ * 文本块组件
+ */
+
+interface TextBlockProps {
+    block: TextBlock$1;
+}
+declare const TextBlock: FC<TextBlockProps>;
+
+/**
+ * 代码块组件
+ */
+
+interface CodeBlockProps {
+    block: CodeBlock$1;
+    onCopy?: (code: string) => void;
+}
+declare const CodeBlock: FC<CodeBlockProps>;
+
+/**
+ * 工具结果渲染器
+ * 根据工具名称选择合适的渲染组件
+ */
+
+declare const ToolResultRenderer: FC<ToolRendererProps>;
+
+/**
+ * 默认工具结果渲染器
+ */
+
+declare const DefaultToolResult: FC<ToolRendererProps>;
+
+/**
+ * 天气卡片渲染器
+ */
+
+declare const WeatherCard: FC<ToolRendererProps>;
+
+/**
+ * 搜索结果渲染器
+ */
+
+declare const SearchResults: FC<ToolRendererProps>;
+
+/** ChatInput 暴露给外部的方法 */
+interface ChatInputHandle {
+    /** 设置输入框内容 */
+    setText: (text: string) => void;
+    /** 聚焦输入框 */
+    focus: () => void;
+    /** 清空输入框 */
+    clear: () => void;
+    /** 在光标位置插入文本（用于 @ 上下文） */
+    insertText: (text: string) => void;
+    /** 添加图片 */
+    addImages: (files: File[]) => void;
+}
 interface ChatInputProps {
     /** 变体模式：input-底部输入框，message-历史消息 */
     variant?: 'input' | 'message';
     /** 受控值（用于历史消息编辑） */
     value?: string;
-    selectedImages?: string[];
     isLoading?: boolean;
     mode?: ChatMode;
     model?: string;
-    models?: ModelConfig[];
+    models?: ModelOption[];
     webSearchEnabled?: boolean;
     thinkingEnabled?: boolean;
-    onSend?: (text: string) => void;
-    onRemoveImage?: (index: number) => void;
+    onSend?: (text: string, images?: ImageData[]) => void;
     onCancel?: () => void;
-    onUploadImage?: () => void;
     onAtContext?: () => void;
     onModeChange?: (mode: ChatMode) => void;
     onModelChange?: (model: string) => void;
     onWebSearchChange?: (enabled: boolean) => void;
     onThinkingChange?: (enabled: boolean) => void;
 }
-declare const ChatInput: FC<ChatInputProps>;
+declare const ChatInput: react.ForwardRefExoticComponent<ChatInputProps & react.RefAttributes<ChatInputHandle>>;
 
 /**
  * ChatHeader Component
@@ -257,6 +513,8 @@ interface ChatHeaderProps {
     onSwitchSession?: (sessionId: string) => void;
     /** 删除会话 */
     onDeleteSession?: (sessionId: string) => void;
+    /** 隐藏/显示会话（在 tab 栏关闭但不删除） */
+    onHideSession?: (sessionId: string, hidden: boolean) => void;
     /** 关闭面板 */
     onClose?: () => void;
     /** 清空所有对话 */
@@ -280,60 +538,45 @@ declare const ChatHeader: FC<ChatHeaderProps>;
  */
 
 interface WelcomeMessageProps {
+    /** 欢迎页配置（可部分配置，未配置项使用默认值） */
+    config?: Partial<WelcomeConfig>;
     /** 快捷操作回调 */
     onQuickAction: (text: string) => void;
 }
 declare const WelcomeMessage: FC<WelcomeMessageProps>;
 
 /**
- * MessageBubble Component
- * 与 Vue 版本 MessageBubble.vue 保持一致
+ * ConfirmDialog Component
+ * 自定义确认弹窗组件
  */
 
-interface MessageBubbleProps {
-    role: 'user' | 'assistant';
-    content: string;
-    images?: string[];
-    thinking?: string;
-    thinkingComplete?: boolean;
-    thinkingDuration?: number;
-    searchResults?: SearchResult[];
-    searching?: boolean;
-    toolCalls?: ToolCall[];
-    copied?: boolean;
-    loading?: boolean;
-    onCopy?: () => void;
-    onRegenerate?: () => void;
-    /** 编辑用户消息后重新发送 */
-    onSend?: (text: string) => void;
-    /** 自定义 Markdown 渲染器 */
-    renderMarkdown?: (content: string) => ReactNode;
+interface ConfirmDialogProps {
+    /** 是否显示 */
+    visible: boolean;
+    /** 标题 */
+    title?: string;
+    /** 消息内容 */
+    message: string;
+    /** 类型：info | warning | danger */
+    type?: 'info' | 'warning' | 'danger';
+    /** 确认按钮文字 */
+    confirmText?: string;
+    /** 取消按钮文字 */
+    cancelText?: string;
+    /** 确认回调 */
+    onConfirm?: () => void;
+    /** 取消回调 */
+    onCancel?: () => void;
 }
-declare const MessageBubble: FC<MessageBubbleProps>;
+declare const ConfirmDialog: FC<ConfirmDialogProps>;
 
-/**
- * ExecutionSteps Component
- * 与 Vue 版本 ExecutionSteps.vue 保持一致
- */
+interface ToastProps {
+    visible: boolean;
+    message: string;
+    type?: 'info' | 'success' | 'warning' | 'error';
+    duration?: number;
+    onClose: () => void;
+}
+declare const Toast: FC<ToastProps>;
 
-interface ExecutionStepsProps {
-    /** 是否正在加载 */
-    loading?: boolean;
-    /** 是否有消息内容 */
-    hasContent?: boolean;
-    /** 思考内容 */
-    thinking?: string;
-    /** 思考是否完成 */
-    thinkingComplete?: boolean;
-    /** 思考耗时 */
-    thinkingDuration?: number;
-    /** 是否正在搜索 */
-    searching?: boolean;
-    /** 搜索结果 */
-    searchResults?: SearchResult[];
-    /** 工具调用列表 */
-    toolCalls?: ToolCall[];
-}
-declare const ExecutionSteps: FC<ExecutionStepsProps>;
-
-export { type AiModel, ChatHeader, ChatInput, type ChatMessage, ChatPanel, type ChatSession, type CreateSessionOptions, DEFAULT_MODELS, type DiffStat, ExecutionSteps, FileType, type ImageData, type MediaOperation, MessageBubble, type SaveMessageOptions, type SearchResult, type SendMessageOptions, type ThinkingData, type ToolCall, type ToolCallData, type ToolResultData, type UpdateSessionOptions, type UseChatOptions, WelcomeMessage, createNullAdapter, useChat };
+export { type BlockRenderers, BlockRenderersContext, ChatHeader, ChatInput, type ChatInputContextValue, type ChatInputOptions, ChatInputProvider, type ChatMessage, ChatPanel, type ChatPanelHandle, CodeBlock, ConfirmDialog, type ContentPart, type ContentPartType, ContentRenderer, type CreateSessionOptions, DefaultToolResult, type ErrorDetails, type ErrorPart, type ImageData, type ImagePart, MessageBubble, RenderersProvider, type SaveMessageOptions, type SearchPart, type SearchResult, SearchResults, type SendMessageOptions, type SideEffect, TextBlock, type TextPart, type ThinkingData, type ThinkingPart, Toast, type ToolCallData, type ToolCallPart, type ToolCompleteEvent, type ToolRenderers, ToolRenderersContext, type ToolResultData, type ToolResultPart, ToolResultRenderer, type UpdateSessionOptions, type UseChatOptions, WeatherCard, type WelcomeConfig, type WelcomeFeature, WelcomeMessage, type WelcomeTask, defaultWelcomeConfig, getMessageText, useChat, useChatInputContext };