ibc-ai-web-sdk 2.0.3 → 2.0.5

package/dist/index.umd.js

@@ -227,7 +227,8 @@
           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();
@@ -385,8 +386,25 @@
       if (conversationId) payload.conversationId = conversationId;
       const attachmentIds = options.attachmentIds || this.normalizeAttachmentIds(options.attachments);
       if (attachmentIds.length > 0) payload.attachmentIds = attachmentIds;
-      const bizParams = options.bizParams || options.extendInfo || this.config.extendInfo;
-      if (bizParams) payload.bizParams = typeof bizParams === 'string' ? bizParams : JSON.stringify(bizParams);
+      let bizParams = options.bizParams || options.extendInfo || this.config.extendInfo;
+      if (bizParams) {
+        if (typeof bizParams === 'string') {
+          try {
+            bizParams = JSON.parse(bizParams);
+          } catch (e) {
+            bizParams = {};
+          }
+        }
+      } else {
+        bizParams = {};
+      }
+      // P3: 将页面上下文合并到 bizParams（contextMode='bizParams' 时由 dialog 传入）
+      if (options.context) {
+        Object.assign(bizParams, options.context);
+      }
+      if (Object.keys(bizParams).length > 0) {
+        payload.bizParams = JSON.stringify(bizParams);
+      }
       return payload;
     }
     normalizeAttachmentIds(attachments) {
@@ -2721,12 +2739,855 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
   }
   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 复刻）
    * 
    * @author IBC AI Team
-   * @version 2.1.0
+   * @version 2.0.5
    */
 
 
@@ -2775,312 +3636,6 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
   };
 
   // ========== 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'];
@@ -3123,6 +3678,8 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
       this._runtimeEventsContainerEl = null;
       this._runtimeStatusEl = null;
       this._runtimeCountEl = null;
+      // P3: 页面上下文数据（宿主页面选中的数据）
+      this._context = {};
 
       // ====== 默认主题配置（与 themes.js DEFAULT_THEME 完全一致） ======
       this._themeVars = {
@@ -3209,6 +3766,8 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
       if (this._handleOffline) window.removeEventListener('offline', this._handleOffline);
       // P2-17: 清理resize监听
       if (this._handleResize) window.removeEventListener('resize', this._handleResize);
+      // P0: 清理拖拽事件监听
+      this._cleanupDragListeners();
       // 暂停后台Token刷新定时器（detach时停止，re-attach时由connectedCallback恢复）
       if (this._chatClient) {
         this._chatClient.stopBackgroundRefresh();
@@ -3251,6 +3810,8 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
     // P2-17: 应用移动端/桌面端布局（自动全屏或恢复浮动气泡）
     _applyMobileLayout() {
       if (!this._dialog) return;
+      // 行内嵌入模式跳过，保持 CSS 控制的布局
+      if (this.getAttribute('mode') === 'inline') return;
       if (this._isMobile) {
         // 移动端：强制全屏（与Vue版 dialogStyle 一致）
         this._dialog.style.width = '100vw';
@@ -3358,6 +3919,14 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
         authFn: null,
         onLoad: null,
         onError: null,
+        // P3: 发送前回调 - 每发消息前调用，可返回最新页面上下文（与 setContext 合并，此回调结果优先）
+        onBeforeSend: null,
+        // P3: 上下文注入方式 — 'prompt'=拼到用户消息前面（默认）, 'bizParams'=注入到 bizParams JSON 中
+        contextMode: 'prompt',
+        // P4: 调试模式 - 开启后 console 打印请求/响应/SSE/上下文合并全过程
+        debug: false,
+        // P4: 自定义消息操作按钮 — 返回数组 [{label, className?, onClick}] 在 AI 消息下方渲染
+        onMessageActions: null,
         suggestions: [{
           label: '帮我购买一台轻量应用服务器用于部署应用',
           value: '帮我购买一台轻量应用服务器用于部署应用'
@@ -3371,6 +3940,11 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
       this._chatClient = new AIChatClient(this._config);
       if (this._conversationId) this._chatClient.setConversationId(this._conversationId);
       this.applyConfig();
+      // P1-2 fix: 在 _config 就绪后初始化拖拽，以正确读取 enableDrag
+      if (this._config?.enableDrag !== false && this.getAttribute('mode') !== 'inline' && !this._dragInitialized) {
+        this.initDraggable();
+      }
+      this._debugLog('初始化完成', 'appId=' + this._config.appId, 'userId=' + this._config.userId, 'baseUrl=' + this._config.apiBaseUrl, 'debug=' + !!this._config.debug, 'contextMode=' + (this._config.contextMode || 'prompt'));
       this.loadAppDetail();
       // 触发 onLoad 回调（与Vue版一致）
       if (this._config?.onLoad) this._config.onLoad(this);
@@ -3457,6 +4031,44 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
       return this;
     }
 
+    /**
+     * 设置页面上下文数据（宿主页面选中的数据，随每次请求发送）
+     * @param {Object} context - 上下文数据对象，传 null 清空
+     * @returns {this}
+     */
+    setContext(context) {
+      this._context = context && typeof context === 'object' ? {
+        ...context
+      } : {};
+      return this;
+    }
+
+    /**
+     * 获取当前上下文数据
+     * @returns {Object}
+     */
+    getContext() {
+      return {
+        ...this._context
+      };
+    }
+
+    /**
+     * 外部触发表态发送（业务层主动调用，如点击外部按钮触发 AI 请求）
+     * @param {string} text - 要发送的消息内容
+     * @returns {this}
+     */
+    send(text) {
+      const content = String(text || '').trim();
+      if (!content) return this;
+      if (this._input) this._input.value = content;
+      this._autoResizeInput();
+      this._updateSendButtonState();
+      this._lastSendTime = 0; // 跳过防抖，外部触发视为独立操作
+      this.handleSend();
+      return this;
+    }
+
     // ==================== 显示/隐藏 ====================
 
     showDialog() {
@@ -3512,11 +4124,11 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
   /* ====== 对话框主体（与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);
@@ -4092,6 +4704,19 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
     color: var(--ai-success);
     background: rgba(16, 185, 129, 0.08);
   }
+  /* P4: 自定义操作按钮（文本标签型，宽度自适应） */
+  .action-icon.custom-action-btn {
+    width: auto;
+    padding: 4px 10px;
+    font-size: 12px;
+    font-weight: 500;
+    white-space: nowrap;
+  }
+  .action-icon.custom-action-btn:hover {
+    color: #fff;
+    background: var(--ai-primary);
+    transform: translateY(-1px);
+  }
 
   /* ========== 底部输入框（与Vue .dialog-footer 一致） ========== */
   .dialog-footer {
@@ -4506,6 +5131,27 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
     .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);
@@ -4651,8 +5297,8 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
           });
         }
 
-        // 拖拽
-        if (this._dialog && this._config?.enableDrag !== false) this.initDraggable();
+        // 拖拽（内嵌模式禁用）— 由 init() 在 _config 就绪后触发
+        // initDraggable 延迟到 init() 中执行以免 _config 为空
       });
     }
 
@@ -4705,59 +5351,97 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
     initDraggable() {
       const header = this.shadowRoot?.querySelector('.dialog-header');
       if (!header) return;
+
+      // 清理上一次遗留的 document 级监听（SPA 路由切换场景）
+      this._cleanupDragListeners();
+      const self = this;
       const startDrag = (clientX, clientY) => {
         // P2-17: 移动端禁用拖拽（与Vue版 startTouchDrag: if(isExpanded || isMobile) return 一致）
-        if (this._isExpanded || this._isMobile) return;
-        this._isDragging = true;
-        this._dialog.classList.add('dragging');
-        const rect = this._dialog.getBoundingClientRect();
-        this._dragStartX = clientX - rect.left;
-        this._dragStartY = clientY - rect.top;
+        if (self._isExpanded || self._isMobile) return;
+        self._isDragging = true;
+        self._dialog.classList.add('dragging');
+        const rect = self._dialog.getBoundingClientRect();
+        self._dragStartX = clientX - rect.left;
+        self._dragStartY = clientY - rect.top;
       };
       const onDrag = (clientX, clientY) => {
-        if (!this._isDragging) return;
-        this._dialogX = clientX - this._dragStartX;
-        this._dialogY = clientY - this._dragStartY;
-        this._dialog.style.left = this._dialogX + 'px';
-        this._dialog.style.right = 'auto';
-        this._dialog.style.top = this._dialogY + 'px';
-        this._dialog.style.bottom = 'auto';
+        if (!self._isDragging) return;
+        self._dialogX = clientX - self._dragStartX;
+        self._dialogY = clientY - self._dragStartY;
+        self._dialog.style.left = self._dialogX + 'px';
+        self._dialog.style.right = 'auto';
+        self._dialog.style.top = self._dialogY + 'px';
+        self._dialog.style.bottom = 'auto';
       };
       const stopDrag = () => {
-        if (this._isDragging) {
-          this._isDragging = false;
-          this._dialog.classList.remove('dragging');
+        if (self._isDragging) {
+          self._isDragging = false;
+          self._dialog.classList.remove('dragging');
         }
       };
 
-      // 鼠标事件（桌面端）
-      header.addEventListener('mousedown', e => {
+      // 鼠标事件（桌面端）— 保存引用以便清理
+      this._dragMouseDownHandler = e => {
         if (e.target.closest('button, .header-icon')) return;
         startDrag(e.clientX, e.clientY);
         e.preventDefault();
-      });
-      document.addEventListener('mousemove', e => {
+      };
+      this._dragMouseMoveHandler = e => {
         onDrag(e.clientX, e.clientY);
-      });
-      document.addEventListener('mouseup', stopDrag);
+      };
+      this._dragMouseUpHandler = stopDrag;
+      header.addEventListener('mousedown', this._dragMouseDownHandler);
+      document.addEventListener('mousemove', this._dragMouseMoveHandler);
+      document.addEventListener('mouseup', this._dragMouseUpHandler);
 
       // P1-7: 触摸事件（移动端，与Vue版一致）
-      header.addEventListener('touchstart', e => {
-        if (this._isExpanded) return;
+      this._dragTouchStartHandler = e => {
+        if (self._isExpanded) return;
         if (e.target.closest('button, .header-icon')) return;
         const touch = e.touches[0];
         startDrag(touch.clientX, touch.clientY);
-      }, {
-        passive: true
-      });
-      document.addEventListener('touchmove', e => {
-        if (!this._isDragging) return;
+      };
+      this._dragTouchMoveHandler = e => {
+        if (!self._isDragging) return;
         const touch = e.touches[0];
         onDrag(touch.clientX, touch.clientY);
-      }, {
+      };
+      this._dragTouchEndHandler = stopDrag;
+      header.addEventListener('touchstart', this._dragTouchStartHandler, {
+        passive: true
+      });
+      document.addEventListener('touchmove', this._dragTouchMoveHandler, {
         passive: true
       });
-      document.addEventListener('touchend', stopDrag);
+      document.addEventListener('touchend', this._dragTouchEndHandler);
+      this._dragInitialized = true;
+    }
+
+    // P0: 清理拖拽事件监听（SPA disconnectedCallback / re-init 调用）
+    _cleanupDragListeners() {
+      if (this._dragMouseDownHandler) {
+        const header = this.shadowRoot?.querySelector('.dialog-header');
+        if (header) {
+          header.removeEventListener('mousedown', this._dragMouseDownHandler);
+          header.removeEventListener('touchstart', this._dragTouchStartHandler, {
+            passive: true
+          });
+        }
+        this._dragMouseDownHandler = null;
+        this._dragTouchStartHandler = null;
+      }
+      if (this._dragMouseMoveHandler) {
+        document.removeEventListener('mousemove', this._dragMouseMoveHandler);
+        document.removeEventListener('touchmove', this._dragTouchMoveHandler, {
+          passive: true
+        });
+        document.removeEventListener('mouseup', this._dragMouseUpHandler);
+        document.removeEventListener('touchend', this._dragTouchEndHandler);
+        this._dragMouseMoveHandler = null;
+        this._dragTouchMoveHandler = null;
+        this._dragMouseUpHandler = null;
+        this._dragTouchEndHandler = null;
+      }
     }
     applyConfig() {
       if (!this._config) return;
@@ -4922,11 +5606,12 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
            <div class="message-content">
              ${hasRuntimeEvents ? this._buildRuntimePanel(msg, idx) : ''}
              ${bubbleContent ? `<div class="${bubbleClass}">${bubbleContent}</div>` : ''}
-             ${!msg._isStreaming ? `<div class="message-actions-bar">
-              ${msg.type === 'ai' ? `<div class="action-icons">
-                <span class="action-icon copy-btn${msg.copied ? ' copied' : ''}" data-idx="${idx}" title="${msg.copied ? '已复制' : '复制'}">${msg.copied ? '<svg viewBox="0 0 24 24" fill="none" stroke-width="2"><path d="m20 6-11 11-5-5"/></svg>' : '<svg viewBox="0 0 24 24" fill="none" stroke-width="2"><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg>'}</span>
-                <span class="action-icon regenerate-btn" data-idx="${idx}" title="重新回答"><svg viewBox="0 0 24 24" fill="none" stroke-width="2"><path d="M21 12a9 9 0 1 1-2.64-6.36"/><path d="M21 3v6h-6"/></svg></span>
-              </div>` : ''}
+              ${!msg._isStreaming ? `<div class="message-actions-bar">
+               ${msg.type === 'ai' ? `<div class="action-icons">
+                 <span class="action-icon copy-btn${msg.copied ? ' copied' : ''}" data-idx="${idx}" title="${msg.copied ? '已复制' : '复制'}">${msg.copied ? '<svg viewBox="0 0 24 24" fill="none" stroke-width="2"><path d="m20 6-11 11-5-5"/></svg>' : '<svg viewBox="0 0 24 24" fill="none" stroke-width="2"><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg>'}</span>
+                 <span class="action-icon regenerate-btn" data-idx="${idx}" title="重新回答"><svg viewBox="0 0 24 24" fill="none" stroke-width="2"><path d="M21 12a9 9 0 1 1-2.64-6.36"/><path d="M21 3v6h-6"/></svg></span>
+                 ${this._buildCustomActions(msg, idx)}
+               </div>` : ''}
             </div>` : ''}
           </div>
         </div>`;
@@ -4956,6 +5641,24 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
           });
         });
 
+        // P4: 绑定自定义操作按钮
+        this._body.querySelectorAll('.custom-action-btn').forEach(btn => {
+          btn.addEventListener('click', () => {
+            const idx = parseInt(btn.dataset.idx);
+            const actionIdx = parseInt(btn.dataset.action);
+            const msg = this._messages[idx];
+            if (!msg) return;
+            try {
+              const actions = this._getCustomActions(msg, idx);
+              if (actions && actions[actionIdx]) {
+                actions[actionIdx].onClick(msg.content);
+              }
+            } catch (e) {
+              console.warn('[AIChatDialog] 自定义操作按钮执行失败:', e);
+            }
+          });
+        });
+
         // 绑定执行过程面板折叠/展开（Shadow DOM 下 inline onclick 不可靠）
         this._body.querySelectorAll('.runtime-header').forEach(header => {
           header.addEventListener('click', () => {
@@ -5208,7 +5911,7 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
         this.showToast(this._config?.emptyMessageError || '请输入消息内容');
         return;
       }
-      if (this._isLoading) return;
+      if (this._isLoading || this._streaming) return;
 
       // P1-11: 字数限制检查
       const maxLen = this._config?.maxLength ?? 500;
@@ -5253,10 +5956,59 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
       }));
       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);
+          }
+        }
+
+        // P3: 收集页面上下文（setContext + onBeforeSend）
+        let context = {
+          ...(this._context || {})
+        };
+        if (typeof this._config?.onBeforeSend === 'function') {
+          try {
+            const dynamicCtx = await this._config.onBeforeSend();
+            if (dynamicCtx && typeof dynamicCtx === 'object') {
+              context = {
+                ...context,
+                ...dynamicCtx
+              };
+            }
+          } catch (e) {
+            console.warn('[AIChatDialog] onBeforeSend 执行失败:', e);
+          }
+        }
+        const hasContext = context && Object.keys(context).length > 0;
+        const rawMode = this._config?.contextMode;
+        const VALID_CONTEXT_MODES = ['prompt', 'bizParams'];
+        const contextMode = VALID_CONTEXT_MODES.includes(rawMode) ? rawMode : rawMode ? (console.warn('[AIChatDialog] 无效的 contextMode: "' + rawMode + '"，已回退为 "prompt"（有效值: ' + VALID_CONTEXT_MODES.join(', ') + '）'), 'prompt') : 'prompt';
+        let finalPrompt = content || attachmentText;
+        let contextForBizParams = null;
+        if (hasContext) {
+          this._debugLog('上下文合并', 'keys=', Object.keys(context), 'mode=', contextMode);
+          if (contextMode === 'bizParams') {
+            // 注入到 bizParams
+            contextForBizParams = context;
+          } else {
+            // 默认：拼到 prompt 前面
+            const ctxText = this._formatContextText(context);
+            if (ctxText) {
+              finalPrompt = ctxText + '\n---\n' + finalPrompt;
+            }
+          }
         }
-        await this.sendMessageToAI(content || attachmentText);
+        this._debugLog('发送', 'prompt=' + (finalPrompt || '').substring(0, 150) + (finalPrompt && finalPrompt.length > 150 ? '...' : ''), 'ctxKeys=' + Object.keys(contextForBizParams || context || {}).join(','), 'mode=' + contextMode);
+        await this.sendMessageToAI(finalPrompt, {
+          attachmentIds,
+          context: contextForBizParams
+        });
       } catch (err) {
         console.error('[AIChatDialog] Error:', err);
         this.handleError(err);
@@ -5285,7 +6037,12 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
         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;
+        if (options.context) streamOpts.context = options.context;
+        await this._directApiCallStream(msgId, content, streamOpts);
       }
     }
     async mockResponse(userContent) {
@@ -5342,6 +6099,10 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
       if (!this._chatClient) {
         this._chatClient = new AIChatClient(this._config || {});
       }
+      if (this._config?.debug) {
+        this._chatClient.config.debug = true;
+      }
+      this._debugLog('Stream开始', 'msgId=' + msgId, 'content=' + (content || '').substring(0, 80), 'opts=' + JSON.stringify(requestOptions));
       if (Object.prototype.hasOwnProperty.call(requestOptions, 'conversationId')) {
         this._chatClient.setConversationId(requestOptions.conversationId || null);
       } else if (this._conversationId) {
@@ -5460,6 +6221,7 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
           }
         }, requestOptions);
         if (response?.success) {
+          this._debugLog('Stream完成', 'ok, conversationId=' + (response.data?.conversationId || this._conversationId), 'textLen=' + streamText.length);
           if (response.data?.conversationId) {
             this._conversationId = response.data.conversationId;
           } else if (this._chatClient.conversationId) {
@@ -5472,6 +6234,7 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
             streamText = result;
           }
         } else {
+          this._finalizeMsg(msgId, streamText || '(无回复)');
           return;
         }
         this._finalizeMsg(msgId, streamText || '(无回复)');
@@ -5482,12 +6245,14 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
         }));
         if (this._config?.onMessageReceived) this._config.onMessageReceived(streamText);
       } catch (e) {
+        this._debugWarn('Stream异常', e.name + ': ' + (e.message || ''));
         if (e.name === 'AbortError') {
           this._updateMsg(msgId, '(请求超时或已取消)');
         } else {
           console.error('[AIChatDialog] 流式失败:', e);
           this._updateMsg(msgId, '网络错误: ' + (e.message || '请检查连接'));
         }
+        this._finalizeMsg(msgId, this._messages.find(m => m.id === msgId)?.content || '(无回复)');
       }
     }
     _getStreamTextEl() {
@@ -5572,7 +6337,7 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
         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;
@@ -5604,6 +6369,34 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
       return false;
     }
 
+    // 判断错误标记内容（替换脆弱的前缀检查 startsWith('(')）
+    _ERROR_CONTENT_PATTERNS = ['(请求超时', '(等待AI处理', '(无回复)', '(已停止)', '(AI 处理超时', '错误:', '网络错误:', '抱歉，'];
+    _isErrorContent(content) {
+      if (!content) return true;
+      return this._ERROR_CONTENT_PATTERNS.some(p => content.startsWith(p));
+    }
+
+    // P3: 将上下文对象格式化为可读文本（拼入 prompt 前缀）
+    _formatContextText(context) {
+      if (!context || typeof context !== 'object') return '';
+      const lines = ['[页面上下文]'];
+      for (const key in context) {
+        if (!Object.prototype.hasOwnProperty.call(context, key)) continue;
+        const val = context[key];
+        if (Array.isArray(val) && val.length > 0 && typeof val[0] === 'object') {
+          lines.push(key + ':');
+          for (const item of val) {
+            lines.push('  - ' + Object.values(item).join(' | '));
+          }
+        } else if (typeof val === 'object' && val !== null) {
+          lines.push(key + ': ' + JSON.stringify(val));
+        } else {
+          lines.push(key + ': ' + val);
+        }
+      }
+      return lines.join('\n');
+    }
+
     // 运行时事件管理 – incremental DOM, no renderMessages
     _addRuntimeEvent(msgId, event) {
       const idx = this._messages.findIndex(m => m.id === msgId);
@@ -5612,8 +6405,6 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
       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');
@@ -5700,6 +6491,30 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
       panel.appendChild(eventsContainer);
       return panel;
     }
+
+    // P4: 获取自定义操作按钮列表（缓存结果避免重复调用 onMessageActions）
+    _getCustomActions(msg, idx) {
+      const key = '_customActions_' + idx;
+      if (!msg[key] && typeof this._config?.onMessageActions === 'function') {
+        try {
+          msg[key] = this._config.onMessageActions(msg, idx) || [];
+        } catch (e) {
+          console.warn('[AIChatDialog] onMessageActions 执行失败:', e);
+          msg[key] = [];
+        }
+      }
+      return msg[key] || [];
+    }
+
+    // P4: 生成自定义操作按钮 HTML
+    _buildCustomActions(msg, idx) {
+      const actions = this._getCustomActions(msg, idx);
+      if (!actions.length) return '';
+      return actions.map((a, i) => {
+        const cls = a.className || '';
+        return '<span class="action-icon custom-action-btn' + (cls ? ' ' + this.escapeAttr(cls) : '') + '" data-idx="' + idx + '" data-action="' + i + '" title="' + this.escapeAttr(a.label) + '">' + this.escapeHtml(a.label) + '</span>';
+      }).join('');
+    }
     _buildRuntimePanel(msg, msgIdx) {
       const events = msg._runtimeEvents || [];
       if (events.length === 0) return '';
@@ -5736,7 +6551,7 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
     // ==================== 重新生成（与Vue regenerate 一致） ====================
 
     async regenerate(index) {
-      if (this._isLoading) return;
+      if (this._isLoading || this._streaming) return;
       const aiMessage = this._messages[index];
       if (!aiMessage || aiMessage.type !== 'ai') return;
       let userQuestion = '';
@@ -5924,6 +6739,20 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
       const n = new Date();
       return `${String(n.getHours()).padStart(2, '0')}:${String(n.getMinutes()).padStart(2, '0')}`;
     }
+
+    /**
+     * 调试日志（仅在 config.debug === true 时输出）
+     */
+    _debugLog(tag, ...args) {
+      if (this._config?.debug) {
+        console.log('%c[AI-SDK]%c ' + tag, 'color:#2563eb;font-weight:600', 'color:inherit', ...args);
+      }
+    }
+    _debugWarn(tag, ...args) {
+      if (this._config?.debug) {
+        console.warn('%c[AI-SDK]%c ' + tag, 'color:#f59e0b;font-weight:600', 'color:inherit', ...args);
+      }
+    }
     escapeHtml(s) {
       if (!s) return '';
       const d = document.createElement('div');
@@ -6014,7 +6843,7 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
    * 支持任意前端框架：Vue, React, Angular, 原生HTML等
    * 
    * @author IBC AI Team
-   * @version 2.0.0
+   * @version 2.0.5
    */
 
 
@@ -6026,16 +6855,53 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
     // 设置属性
     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;
   }
 
@@ -6194,12 +7060,10 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
       },
       sendMessage: content => {
         if (dialogRef.current) {
-          const input = dialogRef.current.shadowRoot?.querySelector('.ai-textarea');
+          const input = dialogRef.current.shadowRoot?.querySelector('.message-input');
           if (input) {
-            input.value = content;
-            input.dispatchEvent(new Event('input'));
+            dialogRef.current.send?.(content) || (input.value = content, input.dispatchEvent(new Event('input')), dialogRef.current.shadowRoot?.querySelector('.send-btn')?.click());
           }
-          dialogRef.current.handleSend?.() || dialogRef.current.shadowRoot?.querySelector('.ai-send-btn')?.click();
         }
       },
       clearMessages: () => {
@@ -6220,14 +7084,14 @@ Please report this to https://github.com/markedjs/marked.`,e){let s="<p>An error
     createAIChatDialog,
     installVuePlugin,
     useAIChat,
-    version: '2.0.0'
+    version: '2.0.5'
   };
 
   // 全局暴露（UMD/浏览器环境）
   if (typeof window !== 'undefined') {
     window.AICreateChatDialog = createAIChatDialog;
     window.AIWebSDK = {
-      version: '2.0.0',
+      version: '2.0.5',
       create: createAIChatDialog,
       AIChatDialog,
       AIChatClient,