ai-chat-ui-kit 0.1.0

package/packages/core/src/store/ToolCallStore.ts

@@ -0,0 +1,164 @@
+/**
+ * @generated-by AI: edenxpzhang
+ * @generated-date 2026-05-13
+ */
+
+import { BaseStore } from './base.js';
+import { ToolCall } from '../types/index.js';
+
+// 工具调用状态
+interface ToolCallState {
+  // 所有工具调用
+  toolCalls: Map<string, ToolCall>;
+  // 按消息 ID 索引
+  messageToolCalls: Map<string, string[]>;
+  // 正在执行的工具调用 ID
+  executingIds: Set<string>;
+}
+
+// 初始状态
+const initialState: ToolCallState = {
+  toolCalls: new Map(),
+  messageToolCalls: new Map(),
+  executingIds: new Set()
+};
+
+export class ToolCallStore extends BaseStore<ToolCallState> {
+  constructor() {
+    super(initialState);
+  }
+
+  // 添加工具调用
+  addToolCall(messageId: string, toolCall: ToolCall): void {
+    const toolCalls = new Map(this.state.toolCalls);
+    toolCalls.set(toolCall.id, toolCall);
+
+    const messageToolCalls = new Map(this.state.messageToolCalls);
+    const ids = messageToolCalls.get(messageId) || [];
+    messageToolCalls.set(messageId, [...ids, toolCall.id]);
+
+    this.setState({ toolCalls, messageToolCalls });
+  }
+
+  // 批量添加工具调用
+  addToolCalls(messageId: string, toolCalls: ToolCall[]): void {
+    const newToolCalls = new Map(this.state.toolCalls);
+    const newMessageToolCalls = new Map(this.state.messageToolCalls);
+    
+    const ids = newMessageToolCalls.get(messageId) || [];
+    const newIds: string[] = [];
+
+    toolCalls.forEach(tc => {
+      newToolCalls.set(tc.id, tc);
+      newIds.push(tc.id);
+    });
+
+    newMessageToolCalls.set(messageId, [...ids, ...newIds]);
+
+    this.setState({
+      toolCalls: newToolCalls,
+      messageToolCalls: newMessageToolCalls
+    });
+  }
+
+  // 更新工具调用状态
+  updateToolCallStatus(id: string, status: ToolCall['status']): void {
+    const toolCalls = new Map(this.state.toolCalls);
+    const toolCall = toolCalls.get(id);
+    
+    if (toolCall) {
+      toolCalls.set(id, { ...toolCall, status });
+      
+      const executingIds = new Set(this.state.executingIds);
+      if (status === 'executing') {
+        executingIds.add(id);
+      } else {
+        executingIds.delete(id);
+      }
+
+      this.setState({ toolCalls, executingIds });
+    }
+  }
+
+  // 设置工具调用结果
+  setToolCallResult(id: string, result: unknown): void {
+    const toolCalls = new Map(this.state.toolCalls);
+    const toolCall = toolCalls.get(id);
+    
+    if (toolCall) {
+      toolCalls.set(id, { ...toolCall, result, status: 'completed' });
+      
+      const executingIds = new Set(this.state.executingIds);
+      executingIds.delete(id);
+
+      this.setState({ toolCalls, executingIds });
+    }
+  }
+
+  // 设置工具调用错误
+  setToolCallError(id: string, error: unknown): void {
+    const toolCalls = new Map(this.state.toolCalls);
+    const toolCall = toolCalls.get(id);
+    
+    if (toolCall) {
+      toolCalls.set(id, { 
+        ...toolCall, 
+        result: error, 
+        status: 'failed' 
+      });
+      
+      const executingIds = new Set(this.state.executingIds);
+      executingIds.delete(id);
+
+      this.setState({ toolCalls, executingIds });
+    }
+  }
+
+  // 获取消息的工具调用
+  getToolCallsForMessage(messageId: string): ToolCall[] {
+    const ids = this.state.messageToolCalls.get(messageId) || [];
+    return ids
+      .map(id => this.state.toolCalls.get(id))
+      .filter(Boolean) as ToolCall[];
+  }
+
+  // 获取正在执行的工具调用
+  getExecutingToolCalls(): ToolCall[] {
+    return Array.from(this.state.executingIds)
+      .map(id => this.state.toolCalls.get(id))
+      .filter(Boolean) as ToolCall[];
+  }
+
+  // 是否有正在执行的工具调用
+  hasExecuting(): boolean {
+    return this.state.executingIds.size > 0;
+  }
+
+  // 清除消息的工具调用
+  clearToolCallsForMessage(messageId: string): void {
+    const messageToolCalls = new Map(this.state.messageToolCalls);
+    const ids = messageToolCalls.get(messageId) || [];
+    
+    const toolCalls = new Map(this.state.toolCalls);
+    const executingIds = new Set(this.state.executingIds);
+    
+    ids.forEach(id => {
+      toolCalls.delete(id);
+      executingIds.delete(id);
+    });
+
+    messageToolCalls.delete(messageId);
+
+    this.setState({ toolCalls, messageToolCalls, executingIds });
+  }
+
+  // 清除所有工具调用
+  clearAll(): void {
+    this.setState(initialState);
+  }
+
+  // 重置
+  reset(): void {
+    this.setState(initialState);
+  }
+}

package/packages/core/src/store/base.ts

@@ -0,0 +1,75 @@
+/**
+ * @generated-by AI: edenxpzhang
+ * @generated-date 2026-05-13
+ */
+
+// 简单的事件发射器（用于状态管理）
+export class EventEmitter {
+  private events: Map<string, Set<Function>> = new Map();
+
+  // 订阅事件
+  on(event: string, callback: Function): void {
+    if (!this.events.has(event)) {
+      this.events.set(event, new Set());
+    }
+    this.events.get(event)?.add(callback);
+  }
+
+  // 取消订阅
+  off(event: string, callback: Function): void {
+    const callbacks = this.events.get(event);
+    if (callbacks) {
+      callbacks.delete(callback);
+    }
+  }
+
+  // 触发事件
+  emit(event: string, ...args: unknown[]): void {
+    const callbacks = this.events.get(event);
+    if (callbacks) {
+      callbacks.forEach((callback) => {
+        try {
+          callback(...args);
+        } catch (error) {
+          console.error(`Error in event listener for "${event}":`, error);
+        }
+      });
+    }
+  }
+
+  // 清空所有事件
+  clear(): void {
+    this.events.clear();
+  }
+}
+
+// Store 基类
+export abstract class BaseStore<T> {
+  protected state: T;
+  protected emitter: EventEmitter;
+
+  constructor(initialState: T) {
+    this.state = initialState;
+    this.emitter = new EventEmitter();
+  }
+
+  // 获取状态
+  getState(): T {
+    return this.state;
+  }
+
+  // 更新状态
+  protected setState(partial: Partial<T>): void {
+    this.state = { ...this.state, ...partial };
+    this.emitter.emit('change', this.state);
+  }
+
+  // 订阅状态变化
+  subscribe(callback: (state: T) => void): () => void {
+    this.emitter.on('change', callback);
+    return () => this.emitter.off('change', callback);
+  }
+
+  // 重置状态
+  abstract reset(): void;
+}

package/packages/core/src/types/index.ts

@@ -0,0 +1,133 @@
+/**
+ * @generated-by AI: edenxpzhang
+ * @generated-date 2026-05-13
+ */
+
+// 消息角色枚举
+export enum MessageRole {
+  User = 'user',
+  Assistant = 'assistant',
+  System = 'system',
+  Tool = 'tool'
+}
+
+// 消息类型
+export interface Message {
+  id: string;
+  role: MessageRole;
+  content: string;
+  timestamp: number;
+  // 工具调用相关
+  toolCalls?: ToolCall[];
+  // 元数据（用于插件扩展）
+  metadata?: Record<string, unknown>;
+}
+
+// 工具调用
+export interface ToolCall {
+  id: string;
+  name: string;
+  arguments: Record<string, unknown>;
+  result?: unknown;
+  status: 'pending' | 'executing' | 'completed' | 'failed';
+}
+
+// 模型配置
+export interface ModelConfig {
+  // 模型提供商
+  provider: 'openai' | 'ernie' | 'qwen' | 'spark' | 'hunyuan' | 'custom';
+  // 模型名称
+  model: string;
+  // API 端点
+  apiEndpoint?: string;
+  // API Key
+  apiKey?: string;
+  // 自定义请求头
+  headers?: Record<string, string>;
+  // 请求参数
+  params?: {
+    temperature?: number;
+    topP?: number;
+    maxTokens?: number;
+    [key: string]: unknown;
+  };
+}
+
+// 聊天配置
+export interface ChatConfig {
+  // 是否启用流式输出
+  stream?: boolean;
+  // 系统提示词
+  systemPrompt?: string;
+  // 历史消息数量限制
+  maxHistory?: number;
+  // 是否启用工具调用
+  enableTools?: boolean;
+}
+
+// API 适配器接口
+export interface APIAdapter {
+  // 发送消息
+  sendMessage(params: {
+    messages: Message[];
+    modelConfig: ModelConfig;
+    chatConfig: ChatConfig;
+    onChunk?: (chunk: string) => void;
+    onToolCall?: (toolCall: ToolCall) => void;
+    onComplete?: (message: Message) => void;
+    onError?: (error: Error) => void;
+  }): Promise<void>;
+  
+  // 取消请求
+  abort(): void;
+}
+
+// 消息插件接口
+export interface MessagePlugin {
+  // 插件类型标识
+  type: string;
+  // 判断是否匹配该插件
+  match: (content: string) => boolean;
+  // 渲染函数
+  render: (content: string, context: RenderContext) => HTMLElement | string;
+  // 优先级（数字越大优先级越高）
+  priority?: number;
+}
+
+// 渲染上下文
+export interface RenderContext {
+  // 消息对象
+  message: Message;
+  // 是否流式输出中
+  isStreaming: boolean;
+  // 主题
+  theme: string;
+  // 自定义配置
+  [key: string]: unknown;
+}
+
+// 主题配置
+export interface ThemeConfig {
+  // 主题名称
+  name: string;
+  // CSS 变量
+  variables: Record<string, string>;
+  // 自定义样式
+  styles?: string;
+}
+
+// 聊天状态
+export interface ChatState {
+  // 消息列表
+  messages: Message[];
+  // 是否加载中
+  isLoading: boolean;
+  // 是否流式输出中
+  isStreaming: boolean;
+  // 错误
+  error: Error | null;
+  // 当前会话 ID
+  sessionId: string;
+}
+
+

package/packages/core/tsup.config.ts

@@ -0,0 +1,18 @@
+/**
+ * @generated-by AI: edenxpzhang
+ * @generated-date 2026-05-13
+ */
+import { defineConfig } from 'tsup';
+
+export default defineConfig({
+  entry: ['src/**/*.ts'],
+  outDir: 'dist',
+  format: ['esm', 'cjs'],
+  target: 'es2020',
+  splitting: true,
+  clean: true,
+  dts: true,
+  sourcemap: true,
+  treeshake: true,
+  external: ['vitest', 'vitest/**'],
+});

package/packages/themes/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "@ai-chat/themes",
+  "version": "0.1.0",
+  "description": "Theme packages for AI Chat UI Kit",
+  "main": "dist/index.js",
+  "module": "dist/index.mjs",
+  "types": "dist/index.d.mts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js",
+      "types": "./dist/index.d.mts"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": ["dist"],
+  "scripts": {
+    "dev": "tsup --watch",
+    "build": "tsup"
+  },
+  "dependencies": {},
+  "devDependencies": {
+    "copyfiles": "^2.0.0"
+  },
+  "peerDependenciesMeta": {
+    "@ai-chat/components": {
+      "optional": true
+    }
+  },
+  "keywords": ["ai", "chat", "theme", "ui"],
+  "author": "edenxpzhang",
+  "license": "MIT"
+}

package/packages/themes/src/corporate/index.ts

@@ -0,0 +1,52 @@
+/**
+ * @generated-by AI: edenxpzhang
+ * @generated-date 2026-05-13
+ */
+
+import type { ThemeConfig } from '../types.js';
+import themeStyles from './theme.css?raw';
+
+export const corporateTheme: ThemeConfig = {
+  name: 'corporate',
+  variables: {
+    '--ai-primary': '#1890ff',
+    '--ai-primary-hover': '#40a9ff',
+    '--ai-primary-active': '#096dd9',
+    '--ai-bg-primary': '#ffffff',
+    '--ai-bg-secondary': '#fafafa',
+    '--ai-bg-tertiary': '#f0f2f5',
+    '--ai-bg-chat': '#fafafa',
+    '--ai-text-primary': '#333333',
+    '--ai-text-secondary': '#666666',
+    '--ai-text-tertiary': '#999999',
+    '--ai-text-inverse': '#ffffff',
+    '--ai-message-user-bg': '#1890ff',
+    '--ai-message-user-text': '#ffffff',
+    '--ai-message-ai-bg': '#ffffff',
+    '--ai-message-ai-text': '#333333',
+    '--ai-message-border': '#e8e8e8',
+    '--ai-input-bg': '#ffffff',
+    '--ai-input-border': '#d9d9d9',
+    '--ai-input-focus-border': '#1890ff',
+    '--ai-input-text': '#333333',
+    '--ai-input-placeholder': '#999999',
+    '--ai-tool-call-bg': '#f6f8fa',
+    '--ai-tool-call-border': '#d1d9e0',
+    '--ai-tool-call-success': '#52c41a',
+    '--ai-tool-call-error': '#ff4d4f',
+    '--ai-tool-call-running': '#1890ff',
+    '--ai-shadow-sm': '0 1px 2px rgba(0, 0, 0, 0.06)',
+    '--ai-shadow-md': '0 2px 8px rgba(0, 0, 0, 0.1)',
+    '--ai-shadow-lg': '0 2px 8px rgba(0, 0, 0, 0.1)',
+    '--ai-radius-sm': '2px',
+    '--ai-radius-md': '4px',
+    '--ai-radius-lg': '8px',
+    '--ai-radius-xl': '8px',
+    '--ai-spacing-xs': '4px',
+    '--ai-spacing-sm': '8px',
+    '--ai-spacing-md': '12px',
+    '--ai-spacing-lg': '24px',
+    '--ai-spacing-xl': '24px',
+  },
+  styles: themeStyles,
+};

package/packages/themes/src/corporate/theme.css

@@ -0,0 +1,228 @@
+/**
+ * @generated-by AI: edenxpzhang
+ * @generated-date 2026-05-13
+ *
+ * Corporate Professional —— 企业商务
+ * 对齐 docs/chat-style-6-corporate.html
+ */
+
+:root[data-theme='corporate'],
+.ai-theme-corporate {
+  --ai-primary: #1890ff;
+  --ai-primary-hover: #40a9ff;
+  --ai-bg-primary: #ffffff;
+  --ai-bg-secondary: #fafafa;
+  --ai-text-primary: #333;
+  --ai-border: #e8e8e8;
+  --ai-message-user-bg: #1890ff;
+  --ai-message-user-text: #fff;
+  --ai-message-ai-bg: #fff;
+  --ai-message-ai-text: #333;
+}
+
+/* body */
+.ai-theme-corporate-host,
+body[data-theme='corporate'] {
+  background: #f0f2f5;
+}
+
+/* 容器 */
+.ai-theme-corporate .ai-chat,
+[data-theme='corporate'] .ai-chat {
+  background: #fff;
+  border-radius: 8px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  border: 1px solid #e8e8e8;
+  font-family: 'Microsoft YaHei', 'Segoe UI', sans-serif;
+  overflow: hidden;
+}
+
+/* Header */
+.ai-theme-corporate .ai-chat__header,
+[data-theme='corporate'] .ai-chat__header {
+  padding: 16px 24px;
+  background: #fff;
+  border-bottom: 3px solid #1890ff;
+  display: flex;
+  align-items: center;
+  gap: 16px;
+}
+.ai-theme-corporate .ai-chat__avatar,
+[data-theme='corporate'] .ai-chat__avatar {
+  width: 42px;
+  height: 42px;
+  background: #1890ff;
+  border-radius: 8px;
+  color: #fff;
+  font-size: 18px;
+  font-weight: bold;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.ai-theme-corporate .ai-chat__title,
+[data-theme='corporate'] .ai-chat__title {
+  font-size: 16px;
+  font-weight: 600;
+  color: #333;
+}
+.ai-theme-corporate .ai-chat__subtitle,
+[data-theme='corporate'] .ai-chat__subtitle {
+  font-size: 12px;
+  color: #999;
+}
+
+/* Messages */
+.ai-theme-corporate .ai-chat__messages,
+[data-theme='corporate'] .ai-chat__messages {
+  background: #fafafa;
+  padding: 24px;
+  gap: 20px;
+}
+.ai-theme-corporate .ai-chat__messages::-webkit-scrollbar,
+[data-theme='corporate'] .ai-chat__messages::-webkit-scrollbar { width: 6px; }
+.ai-theme-corporate .ai-chat__messages::-webkit-scrollbar-thumb,
+[data-theme='corporate'] .ai-chat__messages::-webkit-scrollbar-thumb {
+  background: #d9d9d9;
+  border-radius: 3px;
+}
+
+/* Message */
+.ai-theme-corporate .ai-message,
+[data-theme='corporate'] .ai-message {
+  max-width: 85%;
+  display: flex;
+  gap: 12px;
+}
+.ai-theme-corporate .ai-message__avatar,
+[data-theme='corporate'] .ai-message__avatar {
+  display: flex;
+  width: 36px;
+  height: 36px;
+  border-radius: 50%;
+  align-items: center;
+  justify-content: center;
+  font-size: 13px;
+  font-weight: bold;
+  color: #fff;
+  flex-shrink: 0;
+}
+.ai-theme-corporate .ai-message--user .ai-message__avatar,
+[data-theme='corporate'] .ai-message--user .ai-message__avatar { background: #52c41a; }
+.ai-theme-corporate .ai-message--assistant .ai-message__avatar,
+[data-theme='corporate'] .ai-message--assistant .ai-message__avatar { background: #1890ff; }
+.ai-theme-corporate .ai-message__content,
+[data-theme='corporate'] .ai-message__content {
+  padding: 12px 16px;
+  border-radius: 8px;
+  font-size: 14px;
+  line-height: 1.6;
+}
+.ai-theme-corporate .ai-message--user .ai-message__content,
+[data-theme='corporate'] .ai-message--user .ai-message__content {
+  background: #1890ff;
+  color: #fff;
+  border-top-right-radius: 2px;
+}
+.ai-theme-corporate .ai-message--assistant .ai-message__content,
+[data-theme='corporate'] .ai-message--assistant .ai-message__content {
+  background: #fff;
+  color: #333;
+  border: 1px solid #e8e8e8;
+  border-top-left-radius: 2px;
+}
+.ai-theme-corporate .ai-message__time,
+[data-theme='corporate'] .ai-message__time {
+  font-size: 11px;
+  color: #999;
+  margin-top: 4px;
+}
+.ai-theme-corporate .ai-message--user .ai-message__time,
+[data-theme='corporate'] .ai-message--user .ai-message__time { text-align: right; }
+
+/* Input */
+.ai-theme-corporate .ai-input,
+[data-theme='corporate'] .ai-input {
+  padding: 16px 24px;
+  background: #fff;
+  border-top: 1px solid #e8e8e8;
+}
+.ai-theme-corporate .ai-input__wrapper,
+[data-theme='corporate'] .ai-input__wrapper {
+  display: flex;
+  gap: 12px;
+  align-items: flex-end;
+}
+.ai-theme-corporate .ai-input__textarea,
+[data-theme='corporate'] .ai-input__textarea {
+  flex: 1;
+  padding: 12px 16px;
+  border: 1px solid #d9d9d9;
+  border-radius: 6px;
+  font-size: 14px;
+  resize: none;
+  outline: none;
+  min-height: 44px;
+  max-height: 120px;
+  font-family: inherit;
+  transition: all 0.2s;
+  background: #fff;
+  color: #333;
+}
+.ai-theme-corporate .ai-input__textarea:focus,
+[data-theme='corporate'] .ai-input__textarea:focus {
+  border-color: #1890ff;
+  box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
+}
+.ai-theme-corporate .ai-input__send,
+[data-theme='corporate'] .ai-input__send {
+  padding: 12px 24px;
+  background: #1890ff;
+  color: #fff;
+  border: none;
+  border-radius: 6px;
+  cursor: pointer;
+  font-size: 14px;
+  font-weight: 500;
+  transition: all 0.2s;
+  white-space: nowrap;
+}
+.ai-theme-corporate .ai-input__send:hover:not(:disabled),
+[data-theme='corporate'] .ai-input__send:hover:not(:disabled) {
+  background: #40a9ff;
+}
+.ai-theme-corporate .ai-input__send:disabled,
+[data-theme='corporate'] .ai-input__send:disabled {
+  background: #d9d9d9;
+  cursor: not-allowed;
+}
+
+/* Typing */
+.ai-theme-corporate .ai-typing-indicator,
+[data-theme='corporate'] .ai-typing-indicator {
+  display: flex;
+  gap: 4px;
+  padding: 14px 16px;
+  background: #fff;
+  border: 1px solid #e8e8e8;
+  border-radius: 8px;
+  border-top-left-radius: 2px;
+  width: fit-content;
+}
+.ai-theme-corporate .ai-typing-indicator__dot,
+[data-theme='corporate'] .ai-typing-indicator__dot {
+  width: 6px;
+  height: 6px;
+  background: #999;
+  border-radius: 50%;
+  animation: ai-typing-bounce 1.4s infinite;
+}
+.ai-theme-corporate .ai-typing-indicator__dot:nth-child(2),
+[data-theme='corporate'] .ai-typing-indicator__dot:nth-child(2) { animation-delay: 0.2s; }
+.ai-theme-corporate .ai-typing-indicator__dot:nth-child(3),
+[data-theme='corporate'] .ai-typing-indicator__dot:nth-child(3) { animation-delay: 0.4s; }
+
+@keyframes ai-typing-bounce {
+  0%, 60%, 100% { transform: translateY(0); }
+  30% { transform: translateY(-6px); }
+}