@alicloud/appflow-chat 0.0.1-beta.1

package/dist/types/index.d.ts

@@ -0,0 +1,862 @@
+import { default as default_2 } from 'react';
+import { Provider } from 'react';
+
+/**
+ * BubbleContent - 消息气泡核心展示组件
+ *
+ * @example
+ * ```tsx
+ * <BubbleContent
+ *   content="这是消息内容，支持**Markdown**"
+ *   status="Success"
+ *   role="bot"
+ * >
+ *   <ChatBotSource items={references} />
+ * </BubbleContent>
+ * ```
+ */
+export declare const BubbleContent: default_2.FC<BubbleContentProps>;
+
+export declare interface BubbleContentProps {
+    /** 消息内容（Markdown格式） */
+    content: string;
+    /** 渲染状态 */
+    status?: 'Running' | 'Success' | 'Error';
+    /** 消息角色 */
+    role?: 'user' | 'bot';
+    /** 自定义类名 */
+    className?: string;
+    /** 自定义样式 */
+    style?: default_2.CSSProperties;
+    /** 自定义气泡样式（用于业务组件传入） */
+    bubbleStyle?: default_2.CSSProperties;
+    /** 子元素（如参考资料组件） */
+    children?: default_2.ReactNode;
+    /** 等待消息文本，由外层传入 */
+    waitingMessage?: string;
+}
+
+export declare interface ChatConfig {
+    welcome: string;
+    questions: string[];
+    models: ModelInfo[];
+    features: {
+        image: boolean;
+        file: boolean;
+        audio: boolean;
+        webSearch: boolean;
+    };
+    chatbotId: string;
+    integrateId: string;
+}
+
+export declare interface ChatMessage {
+    text?: string;
+    images?: string[];
+    files?: string[];
+    audio?: string;
+    modelId?: string;
+    webSearch?: boolean;
+}
+
+export declare class ChatService {
+    private config;
+    private setupConfig;
+    private sessionId;
+    private currentController;
+    private isInitialized;
+    /**
+     * 初始化SDK并返回配置信息
+     */
+    setup(config: SetupConfig): Promise<ChatConfig>;
+    /**
+     * 初始化认证票据
+     */
+    private initTicket;
+    /**
+     * 获取聊天机器人配置
+     */
+    private fetchConfig;
+    /**
+     * 获取请求令牌
+     */
+    private getRequestToken;
+    /**
+     * 发送消息（流式响应）
+     */
+    chat(message: ChatMessage): ChatStream;
+    /**
+     * 发送消息的内部实现
+     */
+    private sendMessage;
+    /**
+     * 上传文件
+     */
+    upload(file: File): Promise<string>;
+    /**
+     * 清除会话
+     */
+    clear(): void;
+    /**
+     * 取消当前请求
+     */
+    cancel(): void;
+    /**
+     * 获取当前配置
+     */
+    getConfig(): ChatConfig | null;
+    /**
+     * 获取当前会话ID
+     */
+    getSessionId(): string;
+    /**
+     * 获取指定模型的能力配置
+     * @param modelId 模型ID，不传则使用第一个模型
+     */
+    getModelCapabilities(modelId?: string): ModelCapabilities;
+    /**
+     * 检查指定模型是否支持某个功能
+     * @param capability 功能名称
+     * @param modelId 模型ID，不传则使用第一个模型
+     */
+    hasCapability(capability: 'image' | 'file' | 'audio' | 'webSearch', modelId?: string): boolean;
+    /**
+     * 设置当前会话ID
+     * @param sessionId 会话ID
+     */
+    setSessionId(sessionId: string): void;
+    /**
+     * 获取对话历史记录
+     * @param sessionId 会话ID，不传则使用当前会话ID
+     * @returns 历史消息列表
+     */
+    getHistory(sessionId?: string): Promise<HistoryMessage[]>;
+    /**
+     * 获取会话列表
+     * @returns 会话列表
+     */
+    getSessions(): Promise<ChatSession[]>;
+    /**
+     * 发送事件回调消息
+     * 用于 humanVerify、cardCallBack 等需要向服务端发送回调的场景
+     *
+     * @param data 回调数据
+     * @param data.sessionWebhook 会话 Webhook URL
+     * @param data.content 回调内容对象
+     * @returns Promise<void>
+     *
+     * @example
+     * ```typescript
+     * await chatService.sendEventCallback({
+     *   sessionWebhook: 'https://...',
+     *   content: {
+     *     verifyId: 'xxx',
+     *     status: 'approve',
+     *     customParams: { ... }
+     *   }
+     * });
+     * ```
+     */
+    sendEventCallback(data: {
+        sessionWebhook: string;
+        content: Record<string, any>;
+    }): Promise<void>;
+    /**
+     * 提交人工审核结果
+     * 这是 sendEventCallback 的便捷封装，专门用于 HumanVerify 场景
+     *
+     * @param data 审核数据
+     * @param data.verifyId 验证ID
+     * @param data.sessionWebhook 会话 Webhook URL
+     * @param data.status 审核状态 ('approve' | 'reject')
+     * @param data.customParams 自定义参数值
+     * @param data.customParamsKey 自定义参数的字段名，默认为 'customParams'
+     * @returns Promise<void>
+     *
+     * @example
+     * ```typescript
+     * await chatService.submitHumanVerify({
+     *   verifyId: 'xxx',
+     *   sessionWebhook: 'https://...',
+     *   status: 'approve',
+     *   customParams: { name: '张三', age: 25 },
+     *   customParamsKey: 'formData'
+     * });
+     * ```
+     */
+    submitHumanVerify(data: {
+        verifyId: string;
+        sessionWebhook: string;
+        status: 'approve' | 'reject';
+        customParams?: Record<string, any>;
+        customParamsKey?: string;
+    }): Promise<void>;
+}
+
+export declare const chatService: ChatService;
+
+export declare interface ChatSession {
+    id: string;
+    sessionId: string;
+    title: string;
+    gmtCreate?: string;
+    gmtModified?: string;
+}
+
+export declare interface ChatStream {
+    onMessage(callback: (content: string, done: boolean, meta?: any) => void): ChatStream;
+    onError(callback: (error: Error) => void): ChatStream;
+}
+
+export declare interface ChatStreamCallbacks {
+    onMessage?: (content: string, done: boolean, meta?: any) => void;
+    onError?: (error: Error) => void;
+}
+
+/**
+ * 将后端返回的小写 schema 转换为组件需要的大写格式
+ * @param schema 后端返回的 schema（小写字段名）
+ * @returns 转换后的 schema（大写字段名）
+ */
+export declare const convertSchemaToUpperCase: (schema: any) => CustomParamSchema | undefined;
+
+/**
+ * CustomParam 的 Schema 定义
+ */
+export declare interface CustomParamSchema {
+    Type: ParamType;
+    Title?: string;
+    Description?: string;
+    Required?: string[];
+    Properties?: Record<string, CustomParamSchema>;
+    Items?: CustomParamSchema;
+}
+
+/**
+ * CustomParamsRenderer 组件
+ * 根据 CustomParam Schema 渲染表单
+ *
+ * @example
+ * ```tsx
+ * const schema: CustomParamSchema = {
+ *   Type: 'object',
+ *   Properties: {
+ *     name: { Type: 'string', Title: '名称', Description: '请输入名称' },
+ *     age: { Type: 'number', Title: '年龄' },
+ *     enabled: { Type: 'boolean', Title: '是否启用' },
+ *     tags: {
+ *       Type: 'array',
+ *       Title: '标签',
+ *       Items: { Type: 'string' }
+ *     },
+ *     config: {
+ *       Type: 'object',
+ *       Title: '配置',
+ *       Properties: {
+ *         key: { Type: 'string', Title: '键' },
+ *         value: { Type: 'string', Title: '值' }
+ *       }
+ *     }
+ *   },
+ *   Required: ['name']
+ * };
+ *
+ * <CustomParamsRenderer
+ *   schema={schema}
+ *   value={formValue}
+ *   onChange={setFormValue}
+ * />
+ * ```
+ */
+export declare const CustomParamsRenderer: default_2.FC<CustomParamsRendererProps>;
+
+/**
+ * CustomParamsRenderer 组件的 Props
+ */
+export declare interface CustomParamsRendererProps {
+    /** CustomParams 的 schema */
+    schema: CustomParamSchema;
+    /** 表单值 */
+    value?: Record<string, any>;
+    /** 值变化回调 */
+    onChange?: (value: Record<string, any>) => void;
+    /** 是否禁用 */
+    disabled?: boolean;
+    /** 字段名前缀（用于嵌套场景） */
+    namePrefix?: string;
+    /** 验证错误信息 */
+    errors?: Record<string, string>;
+}
+
+export declare type DocReferenceItem = SourceItem;
+
+/**
+ * DocReferences - 参考资料组件
+ *
+ * @example
+ * ```tsx
+ * <DocReferences
+ *   items={[
+ *     { title: '参考文档1', text: '内容...', index: '1', type: 'rag' },
+ *     { title: '搜索结果1', url: 'https://...', type: 'web_search' }
+ *   ]}
+ *   status="Success"
+ *   onItemClick={(item) => console.log('点击了', item)}
+ *   onWebSearchClick={(items) => console.log('网页搜索', items)}
+ * />
+ * ```
+ */
+export declare const DocReferences: default_2.FC<DocReferencesProps>;
+
+export declare interface DocReferencesProps {
+    /** 参考资料列表 */
+    items: DocReferenceItem[];
+    /** 渲染状态 */
+    status?: 'Running' | 'Success' | 'Error';
+    /** 点击参考资料回调 */
+    onItemClick?: (item: DocReferenceItem) => void;
+    /** 点击网页搜索结果回调 */
+    onWebSearchClick?: (items: DocReferenceItem[]) => void;
+    /** 自定义类名 */
+    className?: string;
+    /** 自定义样式 */
+    style?: default_2.CSSProperties;
+}
+
+/**
+ * HistoryCard 历史卡片组件 (SDK 版本)
+ * 用于展示历史对话中的 card 类型消息（只读模式）
+ *
+ * @example
+ * ```tsx
+ * <HistoryCard
+ *   approvalStatus="approved"
+ *   formValues={{ name: 'test', age: 18 }}
+ *   formSchema={schema}
+ * />
+ * ```
+ */
+export declare const HistoryCard: default_2.FC<HistoryCardProps>;
+
+/** HistoryCard 相关数据 */
+export declare interface HistoryCardData {
+    approvalStatus?: string;
+    formValues?: Record<string, any>;
+    formSchema?: CustomParamSchema;
+}
+
+export declare interface HistoryCardProps {
+    /** 审批状态 */
+    approvalStatus?: string;
+    /** 表单值 */
+    formValues?: Record<string, any>;
+    /** 表单 Schema */
+    formSchema?: CustomParamSchema;
+}
+
+export declare interface HistoryMessage {
+    id: string;
+    role: 'user' | 'assistant';
+    content: string;
+    messageType: string;
+    gmtCreate?: string;
+    sessionId?: string;
+    images?: string[];
+    files?: {
+        name: string;
+        url: string;
+    }[];
+}
+
+/**
+ * HumanVerify 人工审核组件 (SDK 版本)
+ * 用于展示需要人工审核的表单，并处理提交逻辑
+ *
+ * @example
+ * ```tsx
+ * <HumanVerify
+ *   verifyId="xxx"
+ *   sessionWebhook="https://..."
+ *   approved={false}
+ *   customParamsSchema={schema}
+ *   customParamsKey="customParams"
+ *   onSubmit={(data) => {
+ *     bot.postMessage({
+ *       msgType: 'cardCallBack',
+ *       data: {
+ *         sessionWebhook: data.sessionWebhook,
+ *         content: JSON.stringify({
+ *           verifyId: data.verifyId,
+ *           status: data.status,
+ *           [data.customParamsKey]: data.customParamsValue,
+ *         }),
+ *       },
+ *     });
+ *   }}
+ * />
+ * ```
+ */
+export declare const HumanVerify: default_2.FC<HumanVerifyProps>;
+
+/** HumanVerify 相关数据 */
+export declare interface HumanVerifyData {
+    verifyId?: string;
+    sessionWebhook?: string;
+    approved?: boolean;
+    customParams?: CustomParamSchema;
+    customParamsKey?: string;
+}
+
+export declare interface HumanVerifyProps {
+    /** 验证ID */
+    verifyId?: string;
+    /** 会话 Webhook */
+    sessionWebhook?: string;
+    /** 是否已提交 */
+    approved?: boolean;
+    /** CustomParams 的 schema */
+    customParamsSchema?: CustomParamSchema;
+    /** CustomParams 的 key（用于提交时的字段名） */
+    customParamsKey?: string;
+    /** 提交回调函数 */
+    onSubmit?: (data: {
+        verifyId: string;
+        sessionWebhook: string;
+        status: string;
+        customParamsKey: string;
+        customParamsValue: Record<string, any>;
+    }) => void;
+}
+
+/** HumanVerify 提交数据类型 */
+export declare interface HumanVerifySubmitData {
+    verifyId: string;
+    sessionWebhook: string;
+    status: string;
+    customParamsKey: string;
+    customParamsValue: Record<string, any>;
+}
+
+/**
+ * ECharts 按需加载函数
+ * 用于在需要渲染图表时动态加载 ECharts 库
+ */
+export declare const loadEchartsScript: () => Promise<void>;
+
+/**
+ * MarkdownRenderer - Markdown渲染组件
+ *
+ * @example
+ * ```tsx
+ * <MarkdownRenderer
+ *   content="# 标题\n这是正文内容，支持**加粗**和*斜体*"
+ *   status="Success"
+ * />
+ * ```
+ */
+export declare const MarkdownRenderer: default_2.FC<MarkdownRendererProps>;
+
+export declare interface MarkdownRendererProps {
+    /** Markdown内容 */
+    content: string;
+    /** 渲染状态，Running时显示加载动画 */
+    status?: 'Running' | 'Success' | 'Error';
+    /** 自定义类名 */
+    className?: string;
+    /** 自定义样式 */
+    style?: default_2.CSSProperties;
+}
+
+export declare const MarkdownView: default_2.FC<MarkdownViewProps>;
+
+export declare interface MarkdownViewProps {
+    /** Markdown 内容 */
+    content: any;
+    /** 状态 */
+    status?: string;
+    /** 完整数据 */
+    fullData?: any;
+    /** 事件类型 */
+    eventType?: string;
+    /** 等待消息提示 */
+    waitingMessage?: string;
+}
+
+/**
+ * MessageBubble - 消息气泡组件
+ *
+ * @example
+ * ```tsx
+ * 使用默认交互
+ * <MessageBubble
+ *   content="这是AI的回复，支持**Markdown**格式"
+ *   role="bot"
+ *   status="Success"
+ *   references={[
+ *     { title: '参考文档1', text: '文档内容...', type: 'rag' }
+ *   ]}
+ * />
+ *
+ * // 自定义交互
+ * <MessageBubble
+ *   content="这是AI的回复"
+ *   references={references}
+ *   onReferenceClick={(item) => console.log('自定义处理', item)}
+ *   onWebSearchClick={(items) => console.log('自定义处理', items)}
+ * />
+ * ```
+ */
+export declare const MessageBubble: default_2.FC<MessageBubbleProps>;
+
+export declare interface MessageBubbleProps {
+    /** 消息内容（Markdown格式） */
+    content: string;
+    /** 消息角色 */
+    role?: 'user' | 'bot';
+    /** 渲染状态 */
+    status?: 'Running' | 'Success' | 'Error';
+    /** 参考资料列表 */
+    references?: DocReferenceItem[];
+    /** 自定义类名 */
+    className?: string;
+    /** 自定义样式 */
+    style?: default_2.CSSProperties;
+    /** 点击参考资料回调（不传则使用默认实现） */
+    onReferenceClick?: (item: DocReferenceItem) => void;
+    /** 点击网页搜索结果回调（不传则使用默认实现） */
+    onWebSearchClick?: (items: DocReferenceItem[]) => void;
+    /** 事件类型（用于特殊消息如 humanVerify、historyCard） */
+    eventType?: 'humanVerify' | 'historyCard';
+    /** HumanVerify 相关数据 */
+    humanVerifyData?: HumanVerifyData;
+    /** HistoryCard 相关数据（历史对话中的审核卡片） */
+    historyCardData?: HistoryCardData;
+    /** HumanVerify 提交回调 */
+    onHumanVerifySubmit?: (data: HumanVerifySubmitData) => void;
+}
+
+export declare interface ModelCapabilities {
+    image: boolean;
+    file: boolean;
+    audio: boolean;
+    webSearch: boolean;
+    fileConfig?: {
+        supportFileTypes?: string[];
+        limit?: number;
+        description?: string;
+    };
+}
+
+export declare interface ModelInfo {
+    id: string;
+    name: string;
+    config?: {
+        image?: boolean;
+        file?: boolean;
+        webSearch?: boolean;
+        fileConfig?: string;
+    };
+}
+
+declare type ParamType = 'string' | 'number' | 'boolean' | 'array' | 'object';
+
+/**
+ * RichBubbleContent - 富文本消息气泡核心展示组件
+ *
+ * @example
+ * ```tsx
+ * // Markdown类型
+ * <RichBubbleContent
+ *   content="# 标题\n正文内容"
+ *   messageType="markdown"
+ *   status="Success"
+ * />
+ *
+ * // Rich类型（包含多种内容）
+ * <RichBubbleContent
+ *   content={JSON.stringify([
+ *     { messageType: 'markdown', content: '# 分析结果' },
+ *     { messageType: 'ant_table', content: JSON.stringify({ column: ['A', 'B'], data: [{A: 1, B: 2}] }) },
+ *     { messageType: 'echart', content: JSON.stringify({ option: {...} }) }
+ *   ])}
+ *   messageType="rich"
+ *   status="Success"
+ * >
+ *   <DocReferences items={references} />
+ * </RichBubbleContent>
+ * ```
+ */
+export declare const RichBubbleContent: default_2.FC<RichBubbleContentProps>;
+
+export declare interface RichBubbleContentProps {
+    /** 消息内容 */
+    content: string;
+    /** 消息类型 */
+    messageType?: 'markdown' | 'rich';
+    /** 渲染状态 */
+    status?: 'Running' | 'Success' | 'Error';
+    /** 消息角色 */
+    role?: 'user' | 'bot';
+    /** 自定义类名 */
+    className?: string;
+    /** 自定义样式 */
+    style?: default_2.CSSProperties;
+    /** 子元素（如参考资料组件） */
+    children?: default_2.ReactNode;
+    /** 等待消息文本，由外层传入 */
+    waitingMessage?: string;
+}
+
+/**
+ * RichBubble 上下文
+ * 用于在 RichBubbleContent 和子组件（如 ECharts）之间共享折叠面板状态
+ */
+export declare interface RichBubbleContextValue {
+    /** 当前激活的折叠面板 key */
+    activeKey: string | string[];
+}
+
+export declare const RichBubbleProvider: Provider<RichBubbleContextValue>;
+
+/**
+ * RichMessageBubble - 富文本消息气泡组件
+ *
+ * @example
+ * ```tsx
+ * // 使用默认交互
+ * <RichMessageBubble
+ *   content="# 标题\n正文内容"
+ *   messageType="markdown"
+ *   status="Success"
+ *   references={[
+ *     { title: '参考文档1', text: '文档内容...', type: 'rag' }
+ *   ]}
+ * />
+ *
+ * // 自定义交互
+ * <RichMessageBubble
+ *   content={JSON.stringify([
+ *     { messageType: 'markdown', content: '# 分析结果' },
+ *     { messageType: 'echart', content: JSON.stringify({ option: {...} }) }
+ *   ])}
+ *   messageType="rich"
+ *   references={references}
+ *   onReferenceClick={(item) => console.log('自定义处理', item)}
+ *   onWebSearchClick={(items) => console.log('自定义处理', items)}
+ * />
+ * ```
+ */
+export declare const RichMessageBubble: default_2.FC<RichMessageBubbleProps>;
+
+export declare interface RichMessageBubbleProps {
+    /** 消息内容 */
+    content: string;
+    /** 消息类型 */
+    messageType?: 'markdown' | 'rich';
+    /** 渲染状态 */
+    status?: 'Running' | 'Success' | 'Error';
+    /** 参考资料列表 */
+    references?: DocReferenceItem[];
+    /** 自定义类名 */
+    className?: string;
+    /** 自定义样式 */
+    style?: default_2.CSSProperties;
+    /** 点击参考资料回调（不传则使用默认实现） */
+    onReferenceClick?: (item: DocReferenceItem) => void;
+    /** 点击网页搜索结果回调（不传则使用默认实现） */
+    onWebSearchClick?: (items: DocReferenceItem[]) => void;
+}
+
+/**
+ * ChatService - 独立的聊天服务类
+ * 用于自定义UI场景，不依赖React
+ */
+export declare interface SetupConfig {
+    integrateId: string;
+    domain?: string;
+    access_session_token?: string;
+}
+
+/**
+ * SourceContent - 参考资料核心展示组件
+ *
+ * @example
+ * ```tsx
+ * <SourceContent
+ *   items={[
+ *     { title: '参考文档1', text: '内容...', index: '1', type: 'rag' },
+ *     { title: '搜索结果1', url: 'https://...', type: 'web_search' }
+ *   ]}
+ *   status="Success"
+ *   onItemClick={(item) => console.log('点击了', item)}
+ *   onWebSearchClick={(items) => console.log('网页搜索', items)}
+ * />
+ * ```
+ */
+export declare const SourceContent: default_2.FC<SourceContentProps>;
+
+export declare interface SourceContentProps {
+    /** 参考资料列表 */
+    items: SourceItem[];
+    /** 渲染状态 */
+    status?: 'Running' | 'Success' | 'Error' | string;
+    /** 是否使用大写字段名（PageConfig模式） */
+    isPageConfig?: boolean;
+    /** 点击参考资料回调 */
+    onItemClick?: (item: SourceItem) => void;
+    /** 点击网页搜索结果回调 */
+    onWebSearchClick?: (items: SourceItem[]) => void;
+    /** 自定义类名 */
+    className?: string;
+    /** 自定义样式 */
+    style?: default_2.CSSProperties;
+}
+
+export declare interface SourceItem {
+    /** 标题 */
+    title?: string;
+    Title?: string;
+    /** 内容文本 */
+    text?: string;
+    Text?: string;
+    /** 索引序号 */
+    index?: string;
+    Index?: string;
+    /** 类型：rag-知识库, web_search-网页搜索 */
+    type?: 'rag' | 'web_search' | string;
+    Type?: string;
+    /** 图片列表 */
+    images?: string[];
+    Images?: string[];
+    /** 链接URL（网页搜索结果） */
+    url?: string;
+    Url?: string;
+    /** 文档ID */
+    doc_id?: string;
+    doc_name?: string;
+    index_id?: string;
+}
+
+/**
+ * 使用 CustomParamsRenderer 的 Hook
+ * 提供表单值管理和校验功能
+ */
+export declare const useCustomParamsRenderer: (schema: CustomParamSchema) => {
+    value: Record<string, any>;
+    setValue: default_2.Dispatch<default_2.SetStateAction<Record<string, any>>>;
+    validate: () => ValidationResult;
+    reset: () => void;
+    setFieldValue: (fieldName: string, fieldValue: any) => void;
+    getFieldValue: (fieldName: string) => any;
+};
+
+export declare const useRichBubbleContext: () => RichBubbleContextValue;
+
+/**
+ * 校验 CustomParams 的值
+ * @param schema Schema 定义
+ * @param value 表单值
+ * @param prefix 字段名前缀
+ * @returns 校验结果
+ */
+export declare const validateCustomParams: (schema: CustomParamSchema, value: Record<string, any>, prefix?: string) => ValidationResult;
+
+/**
+ * 校验错误信息
+ */
+export declare interface ValidationError {
+    field: string;
+    message: string;
+}
+
+/**
+ * 校验结果
+ */
+export declare interface ValidationResult {
+    valid: boolean;
+    errors: ValidationError[];
+}
+
+/**
+ * WebSearchContent - 网页搜索结果核心展示组件
+ *
+ * @example
+ * ```tsx
+ * <WebSearchContent
+ *   items={[
+ *     { title: '搜索结果1', text: '内容摘要...', url: 'https://...' }
+ *   ]}
+ *   open={true}
+ *   onClose={() => setOpen(false)}
+ * />
+ * ```
+ */
+export declare const WebSearchContent: default_2.FC<WebSearchContentProps>;
+
+export declare interface WebSearchContentProps {
+    /** 搜索结果列表 */
+    items?: WebSearchItem[];
+    /** 是否显示 */
+    open?: boolean;
+    /** 关闭回调 */
+    onClose?: () => void;
+    /** 是否使用大写字段名（PageConfig模式） */
+    isPageConfig?: boolean;
+    /** 面板宽度 */
+    width?: number | string;
+    /** 挂载容器 */
+    getContainer?: () => HTMLElement;
+    /** 自定义类名 */
+    className?: string;
+    /** 自定义样式 */
+    style?: default_2.CSSProperties;
+}
+
+export declare interface WebSearchItem {
+    /** 标题 */
+    title?: string;
+    Title?: string;
+    /** 内容摘要 */
+    text?: string;
+    Text?: string;
+    /** 链接URL */
+    url?: string;
+    Url?: string;
+}
+
+/**
+ * WebSearchPanel - 网页搜索结果面板组件
+ *
+ * @example
+ * ```tsx
+ * const [open, setOpen] = useState(false);
+ * const [searchResults, setSearchResults] = useState([]);
+ *
+ * <WebSearchPanel
+ *   items={searchResults}
+ *   open={open}
+ *   onClose={() => setOpen(false)}
+ *   width={400}
+ * />
+ * ```
+ */
+export declare const WebSearchPanel: default_2.FC<WebSearchPanelProps>;
+
+export declare interface WebSearchPanelProps {
+    /** 搜索结果列表 */
+    items: WebSearchItem[];
+    /** 是否显示 */
+    open: boolean;
+    /** 关闭回调 */
+    onClose: () => void;
+    /** 面板宽度 */
+    width?: number | string;
+    /** 挂载容器 */
+    getContainer?: () => HTMLElement;
+    /** 自定义类名 */
+    className?: string;
+    /** 自定义样式 */
+    style?: default_2.CSSProperties;
+}
+
+export { }