ibc-ai-web-sdk 2.0.3 → 2.0.4

package/dist/index.cjs.js

@@ -225,7 +225,8 @@ class AIChatClient {
         return token;
       }).catch(error => {
         if (silent) {
-          console.warn('[AIChatClient] Silent token refresh failed (reason=' + reason + '):', error.message);
+          const errMsg = error && (error.message || String(error)) || 'unknown error';
+          console.warn('[AIChatClient] Silent token refresh failed (reason=' + reason + '):', errMsg);
           return this.config.token || '';
         }
         this.stopBackgroundRefresh();
@@ -2719,6 +2720,849 @@ function createDOMPurify() {
 }
 var purify = createDOMPurify();
 
+/**
+ * 预设主题配置
+ * 提供多种常用主题，用户可以直接使用或自定义
+ */
+
+/**
+ * 默认主题（蓝色渐变）
+ */
+const DEFAULT_THEME = {
+  name: 'default',
+  label: '默认主题',
+  colors: {
+    primary: '#1890ff',
+    primaryLight: '#40a9ff',
+    primaryDark: '#096dd9',
+    secondary: '#722ed1',
+    background: '#ffffff',
+    backgroundGradient: '#f8fafc',
+    text: '#1e293b',
+    textSecondary: '#64748b',
+    userBubble: 'linear-gradient(135deg, #1890ff, #40a9ff)',
+    aiBubble: '#ffffff',
+    headerGradient: 'linear-gradient(90deg, rgba(24, 144, 255, 0.08), rgba(114, 46, 209, 0.08))',
+    border: 'rgba(24, 144, 255, 0.15)',
+    shadow: 'rgba(24, 144, 255, 0.12)',
+    inputBackground: '#f8fafc',
+    inputBorder: '#e2e8f0',
+    loading: '#64748b',
+    success: '#52c41a',
+    error: '#ff4d4f',
+    warning: '#faad14'
+  },
+  borderRadius: {
+    dialog: '16px',
+    bubble: '12px',
+    button: '50%',
+    input: '28px',
+    small: '6px',
+    medium: '12px'
+  },
+  fontSize: {
+    title: '15px',
+    welcomeText: '17px',
+    welcomeDesc: '13px',
+    message: '14px',
+    time: '11px',
+    small: '11px'
+  },
+  boxShadow: {
+    dialog: '0 0 30px rgba(24, 144, 255, 0.12), 0 8px 32px rgba(0, 0, 0, 0.1)',
+    bubble: '0 2px 8px rgba(0, 0, 0, 0.06)',
+    userBubble: '0 4px 12px rgba(24, 144, 255, 0.25)',
+    button: '0 4px 12px rgba(24, 144, 255, 0.35)'
+  }
+};
+
+/**
+ * 深色主题
+ */
+const DARK_THEME = {
+  name: 'dark',
+  label: '深色主题',
+  colors: {
+    primary: '#40a9ff',
+    primaryLight: '#69c0ff',
+    primaryDark: '#1890ff',
+    secondary: '#9254de',
+    background: '#0f172a',
+    backgroundGradient: '#1e293b',
+    text: '#f1f5f9',
+    textSecondary: '#94a3b8',
+    userBubble: 'linear-gradient(135deg, #1890ff, #40a9ff)',
+    aiBubble: '#1e293b',
+    headerGradient: 'linear-gradient(90deg, rgba(64, 169, 255, 0.15), rgba(146, 84, 222, 0.15))',
+    border: 'rgba(64, 169, 255, 0.3)',
+    shadow: 'rgba(0, 0, 0, 0.3)',
+    inputBackground: '#1e293b',
+    inputBorder: '#334155',
+    loading: '#94a3b8',
+    success: '#73d13d',
+    error: '#ff7875',
+    warning: '#ffd666'
+  },
+  borderRadius: {
+    dialog: '16px',
+    bubble: '12px',
+    button: '50%',
+    input: '28px',
+    small: '6px',
+    medium: '12px'
+  },
+  fontSize: {
+    title: '15px',
+    welcomeText: '17px',
+    welcomeDesc: '13px',
+    message: '14px',
+    time: '11px',
+    small: '11px'
+  },
+  boxShadow: {
+    dialog: '0 0 30px rgba(64, 169, 255, 0.15), 0 8px 32px rgba(0, 0, 0, 0.4)',
+    bubble: '0 2px 8px rgba(0, 0, 0, 0.2)',
+    userBubble: '0 4px 12px rgba(24, 144, 255, 0.3)',
+    button: '0 4px 12px rgba(24, 144, 255, 0.4)'
+  }
+};
+
+/**
+ * 清新主题（绿色系）
+ */
+const FRESH_THEME = {
+  name: 'fresh',
+  label: '清新主题',
+  colors: {
+    primary: '#52c41a',
+    primaryLight: '#73d13d',
+    primaryDark: '#389e0d',
+    secondary: '#1890ff',
+    background: '#ffffff',
+    backgroundGradient: '#f6ffed',
+    text: '#1e293b',
+    textSecondary: '#64748b',
+    userBubble: 'linear-gradient(135deg, #52c41a, #73d13d)',
+    aiBubble: '#ffffff',
+    headerGradient: 'linear-gradient(90deg, rgba(82, 196, 26, 0.08), rgba(24, 144, 255, 0.08))',
+    border: 'rgba(82, 196, 26, 0.15)',
+    shadow: 'rgba(82, 196, 26, 0.12)',
+    inputBackground: '#f6ffed',
+    inputBorder: '#d9f7be',
+    loading: '#64748b',
+    success: '#52c41a',
+    error: '#ff4d4f',
+    warning: '#faad14'
+  },
+  borderRadius: {
+    dialog: '20px',
+    bubble: '16px',
+    button: '50%',
+    input: '32px',
+    small: '8px',
+    medium: '16px'
+  },
+  fontSize: {
+    title: '15px',
+    welcomeText: '17px',
+    welcomeDesc: '13px',
+    message: '14px',
+    time: '11px',
+    small: '11px'
+  },
+  boxShadow: {
+    dialog: '0 0 30px rgba(82, 196, 26, 0.12), 0 8px 32px rgba(0, 0, 0, 0.1)',
+    bubble: '0 2px 8px rgba(0, 0, 0, 0.06)',
+    userBubble: '0 4px 12px rgba(82, 196, 26, 0.25)',
+    button: '0 4px 12px rgba(82, 196, 26, 0.35)'
+  }
+};
+
+/**
+ * 活力主题（橙色系）
+ */
+const VIBRANT_THEME = {
+  name: 'vibrant',
+  label: '活力主题',
+  colors: {
+    primary: '#fa8c16',
+    primaryLight: '#ffa940',
+    primaryDark: '#d46b08',
+    secondary: '#f5222d',
+    background: '#ffffff',
+    backgroundGradient: '#fff7e6',
+    text: '#1e293b',
+    textSecondary: '#64748b',
+    userBubble: 'linear-gradient(135deg, #fa8c16, #ffa940)',
+    aiBubble: '#ffffff',
+    headerGradient: 'linear-gradient(90deg, rgba(250, 140, 22, 0.08), rgba(245, 34, 45, 0.08))',
+    border: 'rgba(250, 140, 22, 0.15)',
+    shadow: 'rgba(250, 140, 22, 0.12)',
+    inputBackground: '#fff7e6',
+    inputBorder: '#ffd591',
+    loading: '#64748b',
+    success: '#52c41a',
+    error: '#ff4d4f',
+    warning: '#faad14'
+  },
+  borderRadius: {
+    dialog: '12px',
+    bubble: '10px',
+    button: '50%',
+    input: '24px',
+    small: '4px',
+    medium: '10px'
+  },
+  fontSize: {
+    title: '15px',
+    welcomeText: '17px',
+    welcomeDesc: '13px',
+    message: '14px',
+    time: '11px',
+    small: '11px'
+  },
+  boxShadow: {
+    dialog: '0 0 30px rgba(250, 140, 22, 0.12), 0 8px 32px rgba(0, 0, 0, 0.1)',
+    bubble: '0 2px 8px rgba(0, 0, 0, 0.06)',
+    userBubble: '0 4px 12px rgba(250, 140, 22, 0.25)',
+    button: '0 4px 12px rgba(250, 140, 22, 0.35)'
+  }
+};
+
+/**
+ * 浪漫主题（粉色系）
+ */
+const ROMANTIC_THEME = {
+  name: 'romantic',
+  label: '浪漫主题',
+  colors: {
+    primary: '#eb2f96',
+    primaryLight: '#fb6f92',
+    primaryDark: '#c41d7f',
+    secondary: '#722ed1',
+    background: '#ffffff',
+    backgroundGradient: '#fff0f6',
+    text: '#1e293b',
+    textSecondary: '#64748b',
+    userBubble: 'linear-gradient(135deg, #eb2f96, #fb6f92)',
+    aiBubble: '#ffffff',
+    headerGradient: 'linear-gradient(90deg, rgba(235, 47, 150, 0.08), rgba(114, 46, 209, 0.08))',
+    border: 'rgba(235, 47, 150, 0.15)',
+    shadow: 'rgba(235, 47, 150, 0.12)',
+    inputBackground: '#fff0f6',
+    inputBorder: '#ffadd2',
+    loading: '#64748b',
+    success: '#52c41a',
+    error: '#ff4d4f',
+    warning: '#faad14'
+  },
+  borderRadius: {
+    dialog: '24px',
+    bubble: '16px',
+    button: '50%',
+    input: '32px',
+    small: '8px',
+    medium: '16px'
+  },
+  fontSize: {
+    title: '15px',
+    welcomeText: '17px',
+    welcomeDesc: '13px',
+    message: '14px',
+    time: '11px',
+    small: '11px'
+  },
+  boxShadow: {
+    dialog: '0 0 30px rgba(235, 47, 150, 0.12), 0 8px 32px rgba(0, 0, 0, 0.1)',
+    bubble: '0 2px 8px rgba(0, 0, 0, 0.06)',
+    userBubble: '0 4px 12px rgba(235, 47, 150, 0.25)',
+    button: '0 4px 12px rgba(235, 47, 150, 0.35)'
+  }
+};
+
+/**
+ * 紫色主题（优雅神秘）
+ */
+const PURPLE_THEME = {
+  name: 'purple',
+  label: '紫色主题',
+  colors: {
+    primary: '#722ed1',
+    primaryLight: '#9254de',
+    primaryDark: '#531dab',
+    secondary: '#1890ff',
+    background: '#ffffff',
+    backgroundGradient: '#f9f0ff',
+    text: '#1e293b',
+    textSecondary: '#64748b',
+    userBubble: 'linear-gradient(135deg, #722ed1, #9254de)',
+    aiBubble: '#ffffff',
+    headerGradient: 'linear-gradient(90deg, rgba(114, 46, 209, 0.08), rgba(24, 144, 255, 0.08))',
+    border: 'rgba(114, 46, 209, 0.15)',
+    shadow: 'rgba(114, 46, 209, 0.12)',
+    inputBackground: '#f9f0ff',
+    inputBorder: '#d3adf7',
+    loading: '#64748b',
+    success: '#52c41a',
+    error: '#ff4d4f',
+    warning: '#faad14'
+  },
+  borderRadius: {
+    dialog: '16px',
+    bubble: '12px',
+    button: '50%',
+    input: '28px',
+    small: '6px',
+    medium: '12px'
+  },
+  fontSize: {
+    title: '15px',
+    welcomeText: '17px',
+    welcomeDesc: '13px',
+    message: '14px',
+    time: '11px',
+    small: '11px'
+  },
+  boxShadow: {
+    dialog: '0 0 30px rgba(114, 46, 209, 0.12), 0 8px 32px rgba(0, 0, 0, 0.1)',
+    bubble: '0 2px 8px rgba(0, 0, 0, 0.06)',
+    userBubble: '0 4px 12px rgba(114, 46, 209, 0.25)',
+    button: '0 4px 12px rgba(114, 46, 209, 0.35)'
+  }
+};
+
+/**
+ * 海洋主题（深蓝深海）
+ */
+const OCEAN_THEME = {
+  name: 'ocean',
+  label: '海洋主题',
+  colors: {
+    primary: '#0077b6',
+    primaryLight: '#00b4d8',
+    primaryDark: '#023e8a',
+    secondary: '#00b4d8',
+    background: '#ffffff',
+    backgroundGradient: '#f0f9ff',
+    text: '#1e293b',
+    textSecondary: '#64748b',
+    userBubble: 'linear-gradient(135deg, #0077b6, #00b4d8)',
+    aiBubble: '#ffffff',
+    headerGradient: 'linear-gradient(90deg, rgba(0, 119, 182, 0.08), rgba(0, 180, 216, 0.08))',
+    border: 'rgba(0, 119, 182, 0.15)',
+    shadow: 'rgba(0, 119, 182, 0.12)',
+    inputBackground: '#f0f9ff',
+    inputBorder: '#bae6fd',
+    loading: '#64748b',
+    success: '#52c41a',
+    error: '#ff4d4f',
+    warning: '#faad14'
+  },
+  borderRadius: {
+    dialog: '14px',
+    bubble: '10px',
+    button: '50%',
+    input: '28px',
+    small: '6px',
+    medium: '12px'
+  },
+  fontSize: {
+    title: '15px',
+    welcomeText: '17px',
+    welcomeDesc: '13px',
+    message: '14px',
+    time: '11px',
+    small: '11px'
+  },
+  boxShadow: {
+    dialog: '0 0 30px rgba(0, 119, 182, 0.12), 0 8px 32px rgba(0, 0, 0, 0.1)',
+    bubble: '0 2px 8px rgba(0, 0, 0, 0.06)',
+    userBubble: '0 4px 12px rgba(0, 119, 182, 0.25)',
+    button: '0 4px 12px rgba(0, 119, 182, 0.35)'
+  }
+};
+
+/**
+ * 暮光主题（紫罗兰渐变）
+ */
+const TWILIGHT_THEME = {
+  name: 'twilight',
+  label: '暮光主题',
+  colors: {
+    primary: '#9333ea',
+    primaryLight: '#a855f7',
+    primaryDark: '#7e22ce',
+    secondary: '#ec4899',
+    background: '#ffffff',
+    backgroundGradient: '#faf5ff',
+    text: '#1e293b',
+    textSecondary: '#64748b',
+    userBubble: 'linear-gradient(135deg, #9333ea, #ec4899)',
+    aiBubble: '#ffffff',
+    headerGradient: 'linear-gradient(90deg, rgba(147, 51, 234, 0.08), rgba(236, 72, 153, 0.08))',
+    border: 'rgba(147, 51, 234, 0.15)',
+    shadow: 'rgba(147, 51, 234, 0.12)',
+    inputBackground: '#faf5ff',
+    inputBorder: '#e9d5ff',
+    loading: '#64748b',
+    success: '#52c41a',
+    error: '#ff4d4f',
+    warning: '#faad14'
+  },
+  borderRadius: {
+    dialog: '18px',
+    bubble: '14px',
+    button: '50%',
+    input: '30px',
+    small: '8px',
+    medium: '14px'
+  },
+  fontSize: {
+    title: '15px',
+    welcomeText: '17px',
+    welcomeDesc: '13px',
+    message: '14px',
+    time: '11px',
+    small: '11px'
+  },
+  boxShadow: {
+    dialog: '0 0 30px rgba(147, 51, 234, 0.12), 0 8px 32px rgba(0, 0, 0, 0.1)',
+    bubble: '0 2px 8px rgba(0, 0, 0, 0.06)',
+    userBubble: '0 4px 12px rgba(147, 51, 234, 0.25)',
+    button: '0 4px 12px rgba(147, 51, 234, 0.35)'
+  }
+};
+
+/**
+ * 薄荷主题（青绿色）
+ */
+const MINT_THEME = {
+  name: 'mint',
+  label: '薄荷主题',
+  colors: {
+    primary: '#14b8a6',
+    primaryLight: '#2dd4bf',
+    primaryDark: '#0d9488',
+    secondary: '#06b6d4',
+    background: '#ffffff',
+    backgroundGradient: '#f0fdfa',
+    text: '#1e293b',
+    textSecondary: '#64748b',
+    userBubble: 'linear-gradient(135deg, #14b8a6, #2dd4bf)',
+    aiBubble: '#ffffff',
+    headerGradient: 'linear-gradient(90deg, rgba(20, 184, 166, 0.08), rgba(6, 182, 212, 0.08))',
+    border: 'rgba(20, 184, 166, 0.15)',
+    shadow: 'rgba(20, 184, 166, 0.12)',
+    inputBackground: '#f0fdfa',
+    inputBorder: '#99f6e4',
+    loading: '#64748b',
+    success: '#52c41a',
+    error: '#ff4d4f',
+    warning: '#faad14'
+  },
+  borderRadius: {
+    dialog: '16px',
+    bubble: '12px',
+    button: '50%',
+    input: '28px',
+    small: '6px',
+    medium: '12px'
+  },
+  fontSize: {
+    title: '15px',
+    welcomeText: '17px',
+    welcomeDesc: '13px',
+    message: '14px',
+    time: '11px',
+    small: '11px'
+  },
+  boxShadow: {
+    dialog: '0 0 30px rgba(20, 184, 166, 0.12), 0 8px 32px rgba(0, 0, 0, 0.1)',
+    bubble: '0 2px 8px rgba(0, 0, 0, 0.06)',
+    userBubble: '0 4px 12px rgba(20, 184, 166, 0.25)',
+    button: '0 4px 12px rgba(20, 184, 166, 0.35)'
+  }
+};
+
+/**
+ * 玫瑰主题（深红色）
+ */
+const ROSE_THEME = {
+  name: 'rose',
+  label: '玫瑰主题',
+  colors: {
+    primary: '#e11d48',
+    primaryLight: '#fb7185',
+    primaryDark: '#be123c',
+    secondary: '#f43f5e',
+    background: '#ffffff',
+    backgroundGradient: '#fff1f2',
+    text: '#1e293b',
+    textSecondary: '#64748b',
+    userBubble: 'linear-gradient(135deg, #e11d48, #fb7185)',
+    aiBubble: '#ffffff',
+    headerGradient: 'linear-gradient(90deg, rgba(225, 29, 72, 0.08), rgba(244, 63, 94, 0.08))',
+    border: 'rgba(225, 29, 72, 0.15)',
+    shadow: 'rgba(225, 29, 72, 0.12)',
+    inputBackground: '#fff1f2',
+    inputBorder: '#fecdd3',
+    loading: '#64748b',
+    success: '#52c41a',
+    error: '#ff4d4f',
+    warning: '#faad14'
+  },
+  borderRadius: {
+    dialog: '16px',
+    bubble: '12px',
+    button: '50%',
+    input: '28px',
+    small: '6px',
+    medium: '12px'
+  },
+  fontSize: {
+    title: '15px',
+    welcomeText: '17px',
+    welcomeDesc: '13px',
+    message: '14px',
+    time: '11px',
+    small: '11px'
+  },
+  boxShadow: {
+    dialog: '0 0 30px rgba(225, 29, 72, 0.12), 0 8px 32px rgba(0, 0, 0, 0.1)',
+    bubble: '0 2px 8px rgba(0, 0, 0, 0.06)',
+    userBubble: '0 4px 12px rgba(225, 29, 72, 0.25)',
+    button: '0 4px 12px rgba(225, 29, 72, 0.35)'
+  }
+};
+
+/**
+ * 极光主题（蓝绿渐变）
+ */
+const AURORA_THEME = {
+  name: 'aurora',
+  label: '极光主题',
+  colors: {
+    primary: '#0ea5e9',
+    primaryLight: '#38bdf8',
+    primaryDark: '#0284c7',
+    secondary: '#10b981',
+    background: '#ffffff',
+    backgroundGradient: '#f0f9ff',
+    text: '#1e293b',
+    textSecondary: '#64748b',
+    userBubble: 'linear-gradient(135deg, #0ea5e9, #10b981)',
+    aiBubble: '#ffffff',
+    headerGradient: 'linear-gradient(90deg, rgba(14, 165, 233, 0.08), rgba(16, 185, 129, 0.08))',
+    border: 'rgba(14, 165, 233, 0.15)',
+    shadow: 'rgba(14, 165, 233, 0.12)',
+    inputBackground: '#f0f9ff',
+    inputBorder: '#bae6fd',
+    loading: '#64748b',
+    success: '#52c41a',
+    error: '#ff4d4f',
+    warning: '#faad14'
+  },
+  borderRadius: {
+    dialog: '20px',
+    bubble: '14px',
+    button: '50%',
+    input: '30px',
+    small: '8px',
+    medium: '14px'
+  },
+  fontSize: {
+    title: '15px',
+    welcomeText: '17px',
+    welcomeDesc: '13px',
+    message: '14px',
+    time: '11px',
+    small: '11px'
+  },
+  boxShadow: {
+    dialog: '0 0 30px rgba(14, 165, 233, 0.12), 0 8px 32px rgba(0, 0, 0, 0.1)',
+    bubble: '0 2px 8px rgba(0, 0, 0, 0.06)',
+    userBubble: '0 4px 12px rgba(14, 165, 233, 0.25)',
+    button: '0 4px 12px rgba(14, 165, 233, 0.35)'
+  }
+};
+
+/**
+ * 薰衣草主题（淡紫色）
+ */
+const LAVENDER_THEME = {
+  name: 'lavender',
+  label: '薰衣草主题',
+  colors: {
+    primary: '#8b5cf6',
+    primaryLight: '#a78bfa',
+    primaryDark: '#7c3aed',
+    secondary: '#c084fc',
+    background: '#ffffff',
+    backgroundGradient: '#faf5ff',
+    text: '#1e293b',
+    textSecondary: '#64748b',
+    userBubble: 'linear-gradient(135deg, #8b5cf6, #c084fc)',
+    aiBubble: '#ffffff',
+    headerGradient: 'linear-gradient(90deg, rgba(139, 92, 246, 0.08), rgba(192, 132, 252, 0.08))',
+    border: 'rgba(139, 92, 246, 0.15)',
+    shadow: 'rgba(139, 92, 246, 0.12)',
+    inputBackground: '#faf5ff',
+    inputBorder: '#ddd6fe',
+    loading: '#64748b',
+    success: '#52c41a',
+    error: '#ff4d4f',
+    warning: '#faad14'
+  },
+  borderRadius: {
+    dialog: '22px',
+    bubble: '16px',
+    button: '50%',
+    input: '32px',
+    small: '8px',
+    medium: '16px'
+  },
+  fontSize: {
+    title: '15px',
+    welcomeText: '17px',
+    welcomeDesc: '13px',
+    message: '14px',
+    time: '11px',
+    small: '11px'
+  },
+  boxShadow: {
+    dialog: '0 0 30px rgba(139, 92, 246, 0.12), 0 8px 32px rgba(0, 0, 0, 0.1)',
+    bubble: '0 2px 8px rgba(0, 0, 0, 0.06)',
+    userBubble: '0 4px 12px rgba(139, 92, 246, 0.25)',
+    button: '0 4px 12px rgba(139, 92, 246, 0.35)'
+  }
+};
+
+/**
+ * 珊瑚主题（粉橙色）
+ */
+const CORAL_THEME = {
+  name: 'coral',
+  label: '珊瑚主题',
+  colors: {
+    primary: '#f97316',
+    primaryLight: '#fb923c',
+    primaryDark: '#ea580c',
+    secondary: '#f43f5e',
+    background: '#ffffff',
+    backgroundGradient: '#fff7ed',
+    text: '#1e293b',
+    textSecondary: '#64748b',
+    userBubble: 'linear-gradient(135deg, #f97316, #fb923c)',
+    aiBubble: '#ffffff',
+    headerGradient: 'linear-gradient(90deg, rgba(249, 115, 22, 0.08), rgba(244, 63, 94, 0.08))',
+    border: 'rgba(249, 115, 22, 0.15)',
+    shadow: 'rgba(249, 115, 22, 0.12)',
+    inputBackground: '#fff7ed',
+    inputBorder: '#fed7aa',
+    loading: '#64748b',
+    success: '#52c41a',
+    error: '#ff4d4f',
+    warning: '#faad14'
+  },
+  borderRadius: {
+    dialog: '14px',
+    bubble: '10px',
+    button: '50%',
+    input: '26px',
+    small: '6px',
+    medium: '10px'
+  },
+  fontSize: {
+    title: '15px',
+    welcomeText: '17px',
+    welcomeDesc: '13px',
+    message: '14px',
+    time: '11px',
+    small: '11px'
+  },
+  boxShadow: {
+    dialog: '0 0 30px rgba(249, 115, 22, 0.12), 0 8px 32px rgba(0, 0, 0, 0.1)',
+    bubble: '0 2px 8px rgba(0, 0, 0, 0.06)',
+    userBubble: '0 4px 12px rgba(249, 115, 22, 0.25)',
+    button: '0 4px 12px rgba(249, 115, 22, 0.35)'
+  }
+};
+
+/**
+ * 翡翠主题（深绿色）
+ */
+const JADE_THEME = {
+  name: 'jade',
+  label: '翡翠主题',
+  colors: {
+    primary: '#059669',
+    primaryLight: '#10b981',
+    primaryDark: '#047857',
+    secondary: '#34d399',
+    background: '#ffffff',
+    backgroundGradient: '#f0fdf4',
+    text: '#1e293b',
+    textSecondary: '#64748b',
+    userBubble: 'linear-gradient(135deg, #059669, #10b981)',
+    aiBubble: '#ffffff',
+    headerGradient: 'linear-gradient(90deg, rgba(5, 150, 105, 0.08), rgba(52, 211, 153, 0.08))',
+    border: 'rgba(5, 150, 105, 0.15)',
+    shadow: 'rgba(5, 150, 105, 0.12)',
+    inputBackground: '#f0fdf4',
+    inputBorder: '#bbf7d0',
+    loading: '#64748b',
+    success: '#52c41a',
+    error: '#ff4d4f',
+    warning: '#faad14'
+  },
+  borderRadius: {
+    dialog: '16px',
+    bubble: '12px',
+    button: '50%',
+    input: '28px',
+    small: '6px',
+    medium: '12px'
+  },
+  fontSize: {
+    title: '15px',
+    welcomeText: '17px',
+    welcomeDesc: '13px',
+    message: '14px',
+    time: '11px',
+    small: '11px'
+  },
+  boxShadow: {
+    dialog: '0 0 30px rgba(5, 150, 105, 0.12), 0 8px 32px rgba(0, 0, 0, 0.1)',
+    bubble: '0 2px 8px rgba(0, 0, 0, 0.06)',
+    userBubble: '0 4px 12px rgba(5, 150, 105, 0.25)',
+    button: '0 4px 12px rgba(5, 150, 105, 0.35)'
+  }
+};
+
+/**
+ * 星空主题（深蓝紫色）
+ */
+const STARSKY_THEME = {
+  name: 'starsky',
+  label: '星空主题',
+  colors: {
+    primary: '#6366f1',
+    primaryLight: '#818cf8',
+    primaryDark: '#4f46e5',
+    secondary: '#a855f7',
+    background: '#0f172a',
+    backgroundGradient: '#1e1b4b',
+    text: '#e2e8f0',
+    textSecondary: '#94a3b8',
+    userBubble: 'linear-gradient(135deg, #6366f1, #a855f7)',
+    aiBubble: '#1e1b4b',
+    headerGradient: 'linear-gradient(90deg, rgba(99, 102, 241, 0.15), rgba(168, 85, 247, 0.15))',
+    border: 'rgba(99, 102, 241, 0.3)',
+    shadow: 'rgba(0, 0, 0, 0.3)',
+    inputBackground: '#1e1b4b',
+    inputBorder: '#312e81',
+    loading: '#94a3b8',
+    success: '#34d399',
+    error: '#f87171',
+    warning: '#fbbf24'
+  },
+  borderRadius: {
+    dialog: '18px',
+    bubble: '14px',
+    button: '50%',
+    input: '30px',
+    small: '8px',
+    medium: '14px'
+  },
+  fontSize: {
+    title: '15px',
+    welcomeText: '17px',
+    welcomeDesc: '13px',
+    message: '14px',
+    time: '11px',
+    small: '11px'
+  },
+  boxShadow: {
+    dialog: '0 0 30px rgba(99, 102, 241, 0.2), 0 8px 32px rgba(0, 0, 0, 0.4)',
+    bubble: '0 2px 8px rgba(0, 0, 0, 0.2)',
+    userBubble: '0 4px 12px rgba(99, 102, 241, 0.3)',
+    button: '0 4px 12px rgba(99, 102, 241, 0.4)'
+  }
+};
+
+/**
+ * 日落主题（暖色调）
+ */
+const SUNSET_THEME = {
+  name: 'sunset',
+  label: '日落主题',
+  colors: {
+    primary: '#ea580c',
+    primaryLight: '#f97316',
+    primaryDark: '#c2410c',
+    secondary: '#dc2626',
+    background: '#ffffff',
+    backgroundGradient: '#fff8f0',
+    text: '#1e293b',
+    textSecondary: '#64748b',
+    userBubble: 'linear-gradient(135deg, #ea580c, #dc2626)',
+    aiBubble: '#ffffff',
+    headerGradient: 'linear-gradient(90deg, rgba(234, 88, 12, 0.08), rgba(220, 38, 38, 0.08))',
+    border: 'rgba(234, 88, 12, 0.15)',
+    shadow: 'rgba(234, 88, 12, 0.12)',
+    inputBackground: '#fff8f0',
+    inputBorder: '#fed7aa',
+    loading: '#64748b',
+    success: '#52c41a',
+    error: '#ff4d4f',
+    warning: '#faad14'
+  },
+  borderRadius: {
+    dialog: '16px',
+    bubble: '12px',
+    button: '50%',
+    input: '28px',
+    small: '6px',
+    medium: '12px'
+  },
+  fontSize: {
+    title: '15px',
+    welcomeText: '17px',
+    welcomeDesc: '13px',
+    message: '14px',
+    time: '11px',
+    small: '11px'
+  },
+  boxShadow: {
+    dialog: '0 0 30px rgba(234, 88, 12, 0.12), 0 8px 32px rgba(0, 0, 0, 0.1)',
+    bubble: '0 2px 8px rgba(0, 0, 0, 0.06)',
+    userBubble: '0 4px 12px rgba(234, 88, 12, 0.25)',
+    button: '0 4px 12px rgba(234, 88, 12, 0.35)'
+  }
+};
+
+/**
+ * 所有预设主题列表
+ */
+const PRESET_THEMES = {
+  DEFAULT: DEFAULT_THEME,
+  DARK: DARK_THEME,
+  FRESH: FRESH_THEME,
+  VIBRANT: VIBRANT_THEME,
+  ROMANTIC: ROMANTIC_THEME,
+  PURPLE: PURPLE_THEME,
+  OCEAN: OCEAN_THEME,
+  TWILIGHT: TWILIGHT_THEME,
+  MINT: MINT_THEME,
+  ROSE: ROSE_THEME,
+  AURORA: AURORA_THEME,
+  LAVENDER: LAVENDER_THEME,
+  CORAL: CORAL_THEME,
+  JADE: JADE_THEME,
+  STARSKY: STARSKY_THEME,
+  SUNSET: SUNSET_THEME
+};
+
 /**
  * AIChatDialog - 纯JavaScript实现的AI对话组件 (Web Components)
  * 样式与功能完全对齐 Vue 版本（1:1 复刻）
@@ -2773,312 +3617,6 @@ const THEME_COLOR_KEY_MAP = {
 };
 
 // ========== 16种预设主题（与Vue版themes.js完全一致） ==========
-const PRESET_THEMES = {
-  DEFAULT: {
-    colors: {
-      primary: '#1890ff',
-      primaryLight: '#40a9ff',
-      primaryDark: '#096dd9',
-      secondary: '#722ed1',
-      background: '#ffffff',
-      backgroundGradient: '#f8fafc',
-      text: '#1e293b',
-      textSecondary: '#64748b',
-      userBubble: 'linear-gradient(135deg, #1890ff, #40a9ff)',
-      aiBubble: '#ffffff',
-      headerGradient: 'linear-gradient(90deg, rgba(24,144,255,0.08), rgba(114,46,209,0.08))',
-      border: 'rgba(24,144,255,0.15)',
-      shadow: 'rgba(24,144,255,0.12)',
-      inputBackground: '#f8fafc',
-      inputBorder: '#e2e8f0'
-    }
-  },
-  DARK: {
-    colors: {
-      primary: '#40a9ff',
-      primaryLight: '#69c0ff',
-      primaryDark: '#1890ff',
-      secondary: '#9254de',
-      background: '#0f172a',
-      backgroundGradient: '#1e293b',
-      text: '#f1f5f9',
-      textSecondary: '#94a3b8',
-      userBubble: 'linear-gradient(135deg, #1890ff, #40a9ff)',
-      aiBubble: '#1e293b',
-      headerGradient: 'linear-gradient(90deg, rgba(64,169,255,0.15), rgba(146,84,222,0.15))',
-      border: 'rgba(64,169,255,0.3)',
-      shadow: 'rgba(0,0,0,0.3)',
-      inputBackground: '#1e293b',
-      inputBorder: '#334155'
-    }
-  },
-  FRESH: {
-    colors: {
-      primary: '#52c41a',
-      primaryLight: '#73d13d',
-      primaryDark: '#389e0d',
-      secondary: '#1890ff',
-      background: '#ffffff',
-      backgroundGradient: '#f6ffed',
-      text: '#1e293b',
-      textSecondary: '#64748b',
-      userBubble: 'linear-gradient(135deg, #52c41a, #73d13d)',
-      aiBubble: '#ffffff',
-      headerGradient: 'linear-gradient(90deg, rgba(82,196,26,0.08), rgba(24,144,255,0.08))',
-      border: 'rgba(82,196,26,0.15)',
-      shadow: 'rgba(82,196,26,0.12)',
-      inputBackground: '#f6ffed',
-      inputBorder: '#d9f7be'
-    }
-  },
-  VIBRANT: {
-    colors: {
-      primary: '#fa8c16',
-      primaryLight: '#ffa940',
-      primaryDark: '#d46b08',
-      secondary: '#f5222d',
-      background: '#ffffff',
-      backgroundGradient: '#fff7e6',
-      text: '#1e293b',
-      textSecondary: '#64748b',
-      userBubble: 'linear-gradient(135deg, #fa8c16, #ffa940)',
-      aiBubble: '#ffffff',
-      headerGradient: 'linear-gradient(90deg, rgba(250,140,22,0.08), rgba(245,34,45,0.08))',
-      border: 'rgba(250,140,22,0.15)',
-      shadow: 'rgba(250,140,22,0.12)',
-      inputBackground: '#fff7e6',
-      inputBorder: '#ffd591'
-    }
-  },
-  ROMANTIC: {
-    colors: {
-      primary: '#eb2f96',
-      primaryLight: '#fb6f92',
-      primaryDark: '#c41d7f',
-      secondary: '#722ed1',
-      background: '#ffffff',
-      backgroundGradient: '#fff0f6',
-      text: '#1e293b',
-      textSecondary: '#64748b',
-      userBubble: 'linear-gradient(135deg, #eb2f96, #fb6f92)',
-      aiBubble: '#ffffff',
-      headerGradient: 'linear-gradient(90deg, rgba(235,47,150,0.08), rgba(114,46,209,0.08))',
-      border: 'rgba(235,47,150,0.15)',
-      shadow: 'rgba(235,47,150,0.12)',
-      inputBackground: '#fff0f6',
-      inputBorder: '#ffadd2'
-    }
-  },
-  PURPLE: {
-    colors: {
-      primary: '#722ed1',
-      primaryLight: '#9254de',
-      primaryDark: '#531dab',
-      secondary: '#1890ff',
-      background: '#ffffff',
-      backgroundGradient: '#f9f0ff',
-      text: '#1e293b',
-      textSecondary: '#64748b',
-      userBubble: 'linear-gradient(135deg, #722ed1, #9254de)',
-      aiBubble: '#ffffff',
-      headerGradient: 'linear-gradient(90deg, rgba(114,46,209,0.08), rgba(24,144,255,0.08))',
-      border: 'rgba(114,46,209,0.15)',
-      shadow: 'rgba(114,46,209,0.12)',
-      inputBackground: '#f9f0ff',
-      inputBorder: '#d3adf7'
-    }
-  },
-  OCEAN: {
-    colors: {
-      primary: '#0077b6',
-      primaryLight: '#00b4d8',
-      primaryDark: '#023e8a',
-      secondary: '#00b4d8',
-      background: '#ffffff',
-      backgroundGradient: '#f0f9ff',
-      text: '#1e293b',
-      textSecondary: '#64748b',
-      userBubble: 'linear-gradient(135deg, #0077b6, #00b4d8)',
-      aiBubble: '#ffffff',
-      headerGradient: 'linear-gradient(90deg, rgba(0,119,182,0.08), rgba(0,180,216,0.08))',
-      border: 'rgba(0,119,182,0.15)',
-      shadow: 'rgba(0,119,182,0.12)',
-      inputBackground: '#f0f9ff',
-      inputBorder: '#bae6fd'
-    }
-  },
-  TWILIGHT: {
-    colors: {
-      primary: '#9333ea',
-      primaryLight: '#a855f7',
-      primaryDark: '#7e22ce',
-      secondary: '#ec4899',
-      background: '#ffffff',
-      backgroundGradient: '#faf5ff',
-      text: '#1e293b',
-      textSecondary: '#64748b',
-      userBubble: 'linear-gradient(135deg, #9333ea, #ec4899)',
-      aiBubble: '#ffffff',
-      headerGradient: 'linear-gradient(90deg, rgba(147,51,234,0.08), rgba(236,72,153,0.08))',
-      border: 'rgba(147,51,234,0.15)',
-      shadow: 'rgba(147,51,234,0.12)',
-      inputBackground: '#faf5ff',
-      inputBorder: '#e9d5ff'
-    }
-  },
-  MINT: {
-    colors: {
-      primary: '#14b8a6',
-      primaryLight: '#2dd4bf',
-      primaryDark: '#0d9488',
-      secondary: '#06b6d4',
-      background: '#ffffff',
-      backgroundGradient: '#f0fdfa',
-      text: '#1e293b',
-      textSecondary: '#64748b',
-      userBubble: 'linear-gradient(135deg, #14b8a6, #2dd4bf)',
-      aiBubble: '#ffffff',
-      headerGradient: 'linear-gradient(90deg, rgba(20,184,166,0.08), rgba(6,182,212,0.08))',
-      border: 'rgba(20,184,166,0.15)',
-      shadow: 'rgba(20,184,166,0.12)',
-      inputBackground: '#f0fdfa',
-      inputBorder: '#99f6e4'
-    }
-  },
-  ROSE: {
-    colors: {
-      primary: '#e11d48',
-      primaryLight: '#fb7185',
-      primaryDark: '#be123c',
-      secondary: '#f43f5e',
-      background: '#ffffff',
-      backgroundGradient: '#fff1f2',
-      text: '#1e293b',
-      textSecondary: '#64748b',
-      userBubble: 'linear-gradient(135deg, #e11d48, #fb7185)',
-      aiBubble: '#ffffff',
-      headerGradient: 'linear-gradient(90deg, rgba(225,29,72,0.08), rgba(244,63,94,0.08))',
-      border: 'rgba(225,29,72,0.15)',
-      shadow: 'rgba(225,29,72,0.12)',
-      inputBackground: '#fff1f2',
-      inputBorder: '#fecdd3'
-    }
-  },
-  AURORA: {
-    colors: {
-      primary: '#0ea5e9',
-      primaryLight: '#38bdf8',
-      primaryDark: '#0284c7',
-      secondary: '#10b981',
-      background: '#ffffff',
-      backgroundGradient: '#f0f9ff',
-      text: '#1e293b',
-      textSecondary: '#64748b',
-      userBubble: 'linear-gradient(135deg, #0ea5e9, #10b981)',
-      aiBubble: '#ffffff',
-      headerGradient: 'linear-gradient(90deg, rgba(14,165,233,0.08), rgba(16,185,129,0.08))',
-      border: 'rgba(14,165,233,0.15)',
-      shadow: 'rgba(14,165,233,0.12)',
-      inputBackground: '#f0f9ff',
-      inputBorder: '#bae6fd'
-    }
-  },
-  LAVENDER: {
-    colors: {
-      primary: '#8b5cf6',
-      primaryLight: '#a78bfa',
-      primaryDark: '#7c3aed',
-      secondary: '#c084fc',
-      background: '#ffffff',
-      backgroundGradient: '#faf5ff',
-      text: '#1e293b',
-      textSecondary: '#64748b',
-      userBubble: 'linear-gradient(135deg, #8b5cf6, #c084fc)',
-      aiBubble: '#ffffff',
-      headerGradient: 'linear-gradient(90deg, rgba(139,92,246,0.08), rgba(192,132,252,0.08))',
-      border: 'rgba(139,92,246,0.15)',
-      shadow: 'rgba(139,92,246,0.12)',
-      inputBackground: '#faf5ff',
-      inputBorder: '#ddd6fe'
-    }
-  },
-  CORAL: {
-    colors: {
-      primary: '#f97316',
-      primaryLight: '#fb923c',
-      primaryDark: '#ea580c',
-      secondary: '#f43f5e',
-      background: '#ffffff',
-      backgroundGradient: '#fff7ed',
-      text: '#1e293b',
-      textSecondary: '#64748b',
-      userBubble: 'linear-gradient(135deg, #f97316, #fb923c)',
-      aiBubble: '#ffffff',
-      headerGradient: 'linear-gradient(90deg, rgba(249,115,22,0.08), rgba(244,63,94,0.08))',
-      border: 'rgba(249,115,22,0.15)',
-      shadow: 'rgba(249,115,22,0.12)',
-      inputBackground: '#fff7ed',
-      inputBorder: '#fed7aa'
-    }
-  },
-  JADE: {
-    colors: {
-      primary: '#059669',
-      primaryLight: '#10b981',
-      primaryDark: '#047857',
-      secondary: '#34d399',
-      background: '#ffffff',
-      backgroundGradient: '#f0fdf4',
-      text: '#1e293b',
-      textSecondary: '#64748b',
-      userBubble: 'linear-gradient(135deg, #059669, #10b981)',
-      aiBubble: '#ffffff',
-      headerGradient: 'linear-gradient(90deg, rgba(5,150,105,0.08), rgba(52,211,153,0.08))',
-      border: 'rgba(5,150,105,0.15)',
-      shadow: 'rgba(5,150,105,0.12)',
-      inputBackground: '#f0fdf4',
-      inputBorder: '#bbf7d0'
-    }
-  },
-  STARSKY: {
-    colors: {
-      primary: '#6366f1',
-      primaryLight: '#818cf8',
-      primaryDark: '#4f46e5',
-      secondary: '#a855f7',
-      background: '#0f172a',
-      backgroundGradient: '#1e1b4b',
-      text: '#e2e8f0',
-      textSecondary: '#94a3b8',
-      userBubble: 'linear-gradient(135deg, #6366f1, #a855f7)',
-      aiBubble: '#1e1b4b',
-      headerGradient: 'linear-gradient(90deg, rgba(99,102,241,0.15), rgba(168,85,247,0.15))',
-      border: 'rgba(99,102,241,0.3)',
-      shadow: 'rgba(0,0,0,0.3)',
-      inputBackground: '#1e1b4b',
-      inputBorder: '#312e81'
-    }
-  },
-  SUNSET: {
-    colors: {
-      primary: '#ea580c',
-      primaryLight: '#f97316',
-      primaryDark: '#c2410c',
-      secondary: '#dc2626',
-      background: '#ffffff',
-      backgroundGradient: '#fff8f0',
-      text: '#1e293b',
-      textSecondary: '#64748b',
-      userBubble: 'linear-gradient(135deg, #ea580c, #dc2626)',
-      aiBubble: '#ffffff',
-      headerGradient: 'linear-gradient(90deg, rgba(234,88,12,0.08), rgba(220,38,38,0.08))',
-      border: 'rgba(234,88,12,0.15)',
-      shadow: 'rgba(234,88,12,0.12)',
-      inputBackground: '#fff8f0',
-      inputBorder: '#fed7aa'
-    }
-  }
-};
 class AIChatDialog extends HTMLElement {
   static get observedAttributes() {
     return ['visible'];
@@ -3249,6 +3787,8 @@ class AIChatDialog extends HTMLElement {
   // P2-17: 应用移动端/桌面端布局（自动全屏或恢复浮动气泡）
   _applyMobileLayout() {
     if (!this._dialog) return;
+    // 行内嵌入模式跳过，保持 CSS 控制的布局
+    if (this.getAttribute('mode') === 'inline') return;
     if (this._isMobile) {
       // 移动端：强制全屏（与Vue版 dialogStyle 一致）
       this._dialog.style.width = '100vw';
@@ -3510,11 +4050,11 @@ class AIChatDialog extends HTMLElement {
   /* ====== 对话框主体（与Vue .ai-chat-dialog 完全一致） ====== */
   .ai-chat-dialog {
     position: fixed;
-    top: 96px;
-    right: 24px;
+    top: var(--ai-dialog-top, 96px);
+    right: var(--ai-dialog-right, 24px);
     bottom: auto;
-    width: min(420px, calc(100vw - 48px));
-    height: min(640px, 80vh);
+    width: var(--ai-dialog-width, min(420px, calc(100vw - 48px)));
+    height: var(--ai-dialog-height, min(640px, 80vh));
     background: var(--ai-bg);
     border-radius: 16px;
     border: 1px solid rgba(226, 232, 240, 0.78);
@@ -4504,6 +5044,27 @@ class AIChatDialog extends HTMLElement {
     .action-icon { width: 30px; height: 30px; }
   }
 
+  /* ========== 行内嵌入模式（mode="inline"，挂载到用户指定容器） ========== */
+  :host([mode="inline"]) { position: relative; top: auto; right: auto; bottom: auto; z-index: auto; width: 100%; height: 100%; }
+  :host([mode="inline"]) .ai-float-container { height: 100%; }
+  :host([mode="inline"]) .float-button { display: none; }
+  :host([mode="inline"]) .ai-chat-dialog {
+    position: relative;
+    top: auto;
+    right: auto;
+    width: 100%;
+    height: 100%;
+    border-radius: 0;
+    box-shadow: none;
+    border: 1px solid var(--ai-border);
+    opacity: 1;
+    transform: none;
+    pointer-events: auto;
+  }
+  :host([mode="inline"]) .dialog-header { cursor: default; }
+  :host([mode="inline"]) .close-btn,
+  :host([mode="inline"]) .expand-btn { display: none; }
+
   /* ========== 暗色主题覆盖（theme: 'dark'） ========== */
   :host(.dark-theme) .ai-chat-dialog {
     box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5), 0 2px 8px rgba(0, 0, 0, 0.3);
@@ -4649,8 +5210,8 @@ class AIChatDialog extends HTMLElement {
         });
       }
 
-      // 拖拽
-      if (this._dialog && this._config?.enableDrag !== false) this.initDraggable();
+      // 拖拽（内嵌模式禁用）
+      if (this._dialog && this._config?.enableDrag !== false && this.getAttribute('mode') !== 'inline') this.initDraggable();
     });
   }
 
@@ -5251,10 +5812,20 @@ class AIChatDialog extends HTMLElement {
     }));
     this.setLoading(true);
     try {
+      // 上传附件并收集 attachmentId
+      const attachmentIds = [];
       for (const file of attachments) {
-        await this.uploadAttachment(file).catch(err => console.warn('[AIChatDialog] 附件上传失败:', err));
+        const res = await this.uploadAttachment(file).catch(err => {
+          console.warn('[AIChatDialog] 附件上传失败:', err);
+          return null;
+        });
+        if (res?.success && res.data?.attachmentId) {
+          attachmentIds.push(res.data.attachmentId);
+        }
       }
-      await this.sendMessageToAI(content || attachmentText);
+      await this.sendMessageToAI(content || attachmentText, {
+        attachmentIds
+      });
     } catch (err) {
       console.error('[AIChatDialog] Error:', err);
       this.handleError(err);
@@ -5283,7 +5854,11 @@ class AIChatDialog extends HTMLElement {
       this._streaming = true;
       this.setLoading(false); // 关掉全局 loading，用消息级 loading 替代
       this.updateLoadingUI(); // re-lock input via _streaming flag
-      await this._directApiCallStream(msgId, content, options.streamOptions || {});
+      const streamOpts = {
+        ...(options.streamOptions || {})
+      };
+      if (options.attachmentIds?.length) streamOpts.attachmentIds = options.attachmentIds;
+      await this._directApiCallStream(msgId, content, streamOpts);
     }
   }
   async mockResponse(userContent) {
@@ -5570,7 +6145,7 @@ class AIChatDialog extends HTMLElement {
       this._messages[idx].content = content;
       delete this._messages[idx]._isStreaming;
       this._messages[idx].time = this.formatTime();
-      this._messages[idx]._status = content && !content.startsWith('(') ? 'completed' : 'error';
+      this._messages[idx]._status = this._isErrorContent(content) ? 'error' : 'completed';
       if (this._streamTypeRaf) {
         cancelAnimationFrame(this._streamTypeRaf);
         this._streamTypeRaf = null;
@@ -5602,6 +6177,13 @@ class AIChatDialog extends HTMLElement {
     return false;
   }
 
+  // 判断错误标记内容（替换脆弱的前缀检查 startsWith('(')）
+  _ERROR_CONTENT_PATTERNS = ['(请求超时', '(等待AI处理', '(无回复)', '(已停止)', '(AI 处理超时', '错误:', '网络错误:', '抱歉，'];
+  _isErrorContent(content) {
+    if (!content) return true;
+    return this._ERROR_CONTENT_PATTERNS.some(p => content.startsWith(p));
+  }
+
   // 运行时事件管理 – incremental DOM, no renderMessages
   _addRuntimeEvent(msgId, event) {
     const idx = this._messages.findIndex(m => m.id === msgId);
@@ -5610,8 +6192,6 @@ class AIChatDialog extends HTMLElement {
     const last = this._messages[idx]._runtimeEvents[this._messages[idx]._runtimeEvents.length - 1];
     if (last && last._text === event._text) return;
     this._messages[idx]._runtimeEvents.push(event);
-    !['NODE_COMPLETE', 'TOOL_END', 'TOOL_RESULT'].includes(event._type);
-
     // Path 1: panel DOM exists and is alive – incremental append
     if (this._runtimeEventsContainerEl && this._body.contains(this._runtimeEventsContainerEl)) {
       const row = document.createElement('div');
@@ -6012,7 +6592,7 @@ if (typeof window !== 'undefined') {
  * 支持任意前端框架：Vue, React, Angular, 原生HTML等
  * 
  * @author IBC AI Team
- * @version 2.0.0
+ * @version 2.0.4
  */
 
 
@@ -6024,16 +6604,53 @@ function createAIChatDialog(options = {}) {
   // 设置属性
   if (options.title) dialog.setAttribute('title', options.title);
   if (options.placeholder) dialog.setAttribute('placeholder', options.placeholder);
-  if (options.width) dialog.style.setProperty('--dialog-width', `${options.width}px`);
-  if (options.height) dialog.style.setProperty('--dialog-height', `${options.height}px`);
-
-  // 添加到DOM（隐藏状态）
-  document.body.appendChild(dialog);
+  // 对话框尺寸和位置（浮窗模式可用）
+  if (options.width) dialog.style.setProperty('--ai-dialog-width', typeof options.width === 'number' ? `${options.width}px` : options.width);
+  if (options.height) dialog.style.setProperty('--ai-dialog-height', typeof options.height === 'number' ? `${options.height}px` : options.height);
+  if (options.top != null) dialog.style.setProperty('--ai-dialog-top', typeof options.top === 'number' ? `${options.top}px` : options.top);
+  if (options.right != null) dialog.style.setProperty('--ai-dialog-right', typeof options.right === 'number' ? `${options.right}px` : options.right);
+
+  // 挂载到指定容器或 body
+  if (options.target) {
+    const container = typeof options.target === 'string' ? document.querySelector(options.target) : options.target;
+    if (container) {
+      dialog.setAttribute('mode', 'inline');
+      container.appendChild(dialog);
+    } else {
+      console.warn('[AI Web SDK] target 容器未找到，回退到 body');
+      document.body.appendChild(dialog);
+    }
+  } else {
+    document.body.appendChild(dialog);
+  }
 
   // 初始化配置
   if (Object.keys(options).length > 0) {
     dialog.init(options);
   }
+
+  // 行内模式：挂载到 DOM 后直接展开
+  if (options.target) {
+    requestAnimationFrame(() => {
+      dialog.style.position = 'relative';
+      dialog.style.height = '100%';
+      if (dialog.shadowRoot) {
+        const container = dialog.shadowRoot.querySelector('.ai-float-container');
+        const dialogEl = dialog.shadowRoot.querySelector('.ai-chat-dialog');
+        const btn = dialog.shadowRoot.querySelector('.float-button');
+        if (container) container.style.height = '100%';
+        if (btn) btn.style.display = 'none';
+        if (dialogEl) {
+          dialogEl.style.position = 'relative';
+          dialogEl.style.top = 'auto';
+          dialogEl.style.right = 'auto';
+          dialogEl.style.width = '100%';
+          dialogEl.style.height = '100%';
+          dialogEl.classList.add('dialog-visible');
+        }
+      }
+    });
+  }
   return dialog;
 }
 
@@ -6218,14 +6835,14 @@ var index = {
   createAIChatDialog,
   installVuePlugin,
   useAIChat,
-  version: '2.0.0'
+  version: '2.0.4'
 };
 
 // 全局暴露（UMD/浏览器环境）
 if (typeof window !== 'undefined') {
   window.AICreateChatDialog = createAIChatDialog;
   window.AIWebSDK = {
-    version: '2.0.0',
+    version: '2.0.4',
     create: createAIChatDialog,
     AIChatDialog,
     AIChatClient,