customer-chat-sdk 1.1.10 → 1.1.11

package/dist/core/IconManager.d.ts

@@ -24,6 +24,16 @@ export declare class IconManager {
     private lastTouchPosition;
     private touchStartTime;
     private clickThreshold;
+    private cachedContainer;
+    private cachedContainerRect;
+    private cachedIconSize;
+    private lastContainerUpdateTime;
+    private containerUpdateInterval;
+    private cachedIframes;
+    private lastIframeUpdateTime;
+    private iframeUpdateInterval;
+    private rafId;
+    private pendingPosition;
     private onDragHandler;
     private stopDragHandler;
     private startDragHandler;

package/dist/core/IconManager.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconManager.d.ts","sourceRoot":"","sources":["../../src/core/IconManager.ts"],"names":[],"mappings":"AAGA,UAAU,mBAAmB;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB;AAED,UAAU,YAAY;IACpB,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACnB,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CACpB;AAED,qBAAa,WAAW;IACtB,OAAO,CAAC,WAAW,CAA2B;IAC9C,OAAO,CAAC,YAAY,CAA2B;IAC/C,OAAO,CAAC,eAAe,CAA4B;IACnD,OAAO,CAAC,oBAAoB,CAAqC;IACjE,OAAO,CAAC,YAAY,CAA4B;IAChD,OAAO,CAAC,KAAK,CAAiB;IAC9B,OAAO,CAAC,cAAc,CAAgB;IACtC,OAAO,CAAC,MAAM,CAAoC;IAGlD,OAAO,CAAC,UAAU,CAAQ;IAC1B,OAAO,CAAC,WAAW,CAAQ;IAC3B,OAAO,CAAC,QAAQ,CAAQ;IACxB,OAAO,CAAC,UAAU,CAAiB;IACnC,OAAO,CAAC,iBAAiB,CAAiB;IAC1C,OAAO,CAAC,cAAc,CAAI;IAC1B,OAAO,CAAC,cAAc,CAAK;IAG3B,OAAO,CAAC,aAAa,CAAsD;IAC3E,OAAO,CAAC,eAAe,CAAsD;IAC7E,OAAO,CAAC,gBAAgB,CAAsD;IAC9E,OAAO,CAAC,iBAAiB,CAAyC;IAClE,OAAO,CAAC,mBAAmB,CAA2C;IACtE,OAAO,CAAC,WAAW,CAA4B;IAC/C,OAAO,CAAC,aAAa,CAAsB;gBAE/B,QAAQ,CAAC,EAAE,YAAY,EAAE,KAAK,GAAE,OAAe,EAAE,MAAM,CAAC,EAAE,WAAW,GAAG,MAAM;IAQ1F;;OAEG;IACG,IAAI,IAAI,OAAO,CAAC,IAAI,CAAC;IAwH3B;;OAEG;IACH,sBAAsB,IAAI,IAAI;IAI9B;;OAEG;IACH,IAAI,IAAI,IAAI;IAoCZ;;OAEG;IACH,WAAW,CAAC,QAAQ,EAAE,GAAG,GAAG,IAAI;IAIhC;;OAEG;IACH,eAAe,CAAC,QAAQ,EAAE,YAAY,GAAG,IAAI;IAqB7C;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,GAAG,GAAG,IAAI;IAI1B;;OAEG;IACH,OAAO,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,IAAI;IAInC;;OAEG;IACH,cAAc,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,GAAG,IAAI;IAInD;;OAEG;IACH,gBAAgB,CAAC,OAAO,EAAE,mBAAmB,GAAG,IAAI;IA8BpD;;OAEG;IACH,iBAAiB,IAAI,IAAI;IAUzB;;OAEG;IACH,OAAO,CAAC,eAAe;IAavB;;OAEG;IACH,OAAO,CAAC,SAAS;IAgHjB;;OAEG;IACH,OAAO,CAAC,MAAM;IAqHd;;OAEG;IACH,OAAO,CAAC,QAAQ;IAkEhB;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAgCzB;;OAEG;IACH,OAAO,CAAC,WAAW;IAUnB;;OAEG;IACH,YAAY,IAAI,IAAI;IAmBpB;;OAEG;IACH,WAAW,IAAI,IAAI;IAmBnB;;OAEG;IACH,OAAO,CAAC,gBAAgB;IAqCxB;;OAEG;IACH,OAAO,CAAC,WAAW;CAmDpB"}
+{"version":3,"file":"IconManager.d.ts","sourceRoot":"","sources":["../../src/core/IconManager.ts"],"names":[],"mappings":"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"}

package/dist/customer-sdk.cjs.js

@@ -22,6 +22,19 @@ class IconManager {
         this.lastTouchPosition = { x: 0, y: 0 }; // 最后触摸位置
         this.touchStartTime = 0; // 触摸开始时间
         this.clickThreshold = 15; // 点击阈值（像素）
+        // 性能优化：缓存容器信息，避免频繁查询 DOM
+        this.cachedContainer = null;
+        this.cachedContainerRect = null;
+        this.cachedIconSize = { width: 0, height: 0 };
+        this.lastContainerUpdateTime = 0;
+        this.containerUpdateInterval = 100; // 每 100ms 更新一次容器信息（避免频繁重排）
+        // 性能优化：缓存所有 iframe 的位置信息（用于检测鼠标是否在 iframe 上）
+        this.cachedIframes = [];
+        this.lastIframeUpdateTime = 0;
+        this.iframeUpdateInterval = 50; // 每 50ms 更新一次 iframe 位置信息（更频繁，因为 iframe 可能移动）
+        // 性能优化：使用 requestAnimationFrame 节流位置更新
+        this.rafId = null;
+        this.pendingPosition = { x: 0, y: 0, needsUpdate: false };
         // 事件处理器引用（用于清理）
         this.onDragHandler = null;
         this.stopDragHandler = null;
@@ -321,6 +334,14 @@ class IconManager {
             this.dragOffset.x = clientX - iconRect.left;
             this.dragOffset.y = clientY - iconRect.top;
             // 注意：不在这里转换位置，只在真正开始拖动时才转换（在 onDrag 中）
+            // 性能优化：在拖动开始时预加载所有 iframe 位置信息
+            // 这样可以避免在拖动过程中频繁查询 DOM
+            const allIframes = document.querySelectorAll('iframe');
+            this.cachedIframes = Array.from(allIframes).map(iframe => ({
+                element: iframe,
+                rect: iframe.getBoundingClientRect()
+            }));
+            this.lastIframeUpdateTime = Date.now();
             // 添加 document 事件监听器
             if (this.onDragHandler) {
                 document.addEventListener('mousemove', this.onDragHandler);
@@ -363,7 +384,7 @@ class IconManager {
             };
             window.addEventListener('blur', this.blurHandler);
             // 3. 添加超时机制（如果一段时间没有收到 mousemove 事件，自动停止拖动）
-            // 这可以处理鼠标移动到 iframe 上的情况
+            // 优化：缩短超时时间到 100ms，更快检测到事件丢失（特别是嵌套 iframe 场景）
             this.dragTimeoutId = window.setTimeout(() => {
                 if (this.isDragging) {
                     if (this.debug) {
@@ -371,7 +392,7 @@ class IconManager {
                     }
                     this.stopDrag();
                 }
-            }, 500); // 500ms 没有移动事件，自动停止拖动（处理鼠标移动到 iframe 上的情况）
+            }, 100); // 缩短到 100ms，更快检测到事件丢失（特别是嵌套 iframe 场景）
             if (this.debug) {
                 console.log('Drag start');
             }
@@ -389,7 +410,41 @@ class IconManager {
         if (!this.iconElement)
             return;
         e.preventDefault();
+        const clientX = 'touches' in e ? e.touches[0].clientX : e.clientX;
+        const clientY = 'touches' in e ? e.touches[0].clientY : e.clientY;
+        // 检测鼠标是否在任何 iframe 上（通过坐标判断）
+        // 如果检测到鼠标在 iframe 区域，立即停止拖动
+        // 重要：需要检测所有 iframe（包括嵌套的），因为任何 iframe 都会导致事件丢失
+        if (this.isDragging) {
+            const now = Date.now();
+            // 性能优化：缓存 iframe 位置信息，避免频繁查询 DOM
+            if (this.cachedIframes.length === 0 ||
+                now - this.lastIframeUpdateTime > this.iframeUpdateInterval) {
+                // 更新 iframe 缓存
+                const allIframes = document.querySelectorAll('iframe');
+                this.cachedIframes = Array.from(allIframes).map(iframe => ({
+                    element: iframe,
+                    rect: iframe.getBoundingClientRect()
+                }));
+                this.lastIframeUpdateTime = now;
+            }
+            // 检查鼠标是否在任何 iframe 上
+            for (const { rect } of this.cachedIframes) {
+                if (clientX >= rect.left &&
+                    clientX <= rect.right &&
+                    clientY >= rect.top &&
+                    clientY <= rect.bottom) {
+                    // 鼠标在 iframe 上，立即停止拖动
+                    if (this.debug) {
+                        console.log('Mouse over iframe, stopping drag immediately');
+                    }
+                    this.stopDrag();
+                    return;
+                }
+            }
+        }
         // 重置超时定时器（每次移动都重置，确保只有真正停止移动时才触发超时）
+        // 优化：缩短超时时间到 100ms，更快检测到事件丢失（特别是嵌套 iframe 场景）
         if (this.dragTimeoutId !== null) {
             window.clearTimeout(this.dragTimeoutId);
             this.dragTimeoutId = window.setTimeout(() => {
@@ -399,10 +454,8 @@ class IconManager {
                     }
                     this.stopDrag();
                 }
-            }, 500); // 500ms 没有移动事件，自动停止拖动
+            }, 100); // 缩短到 100ms，更快检测到事件丢失（特别是嵌套 iframe 场景）
         }
-        const clientX = 'touches' in e ? e.touches[0].clientX : e.clientX;
-        const clientY = 'touches' in e ? e.touches[0].clientY : e.clientY;
         // 检查是否有足够的移动距离
         const deltaX = Math.abs(clientX - this.lastTouchPosition.x);
         const deltaY = Math.abs(clientY - this.lastTouchPosition.y);
@@ -446,17 +499,31 @@ class IconManager {
             return;
         }
         try {
+            // 性能优化：缓存容器信息，避免频繁查询 DOM
+            const now = Date.now();
             const container = this.getTargetElement();
             if (!container) {
                 return;
             }
-            const containerRect = container.getBoundingClientRect();
+            // 只在必要时更新容器信息（避免频繁重排）
+            if (!this.cachedContainer ||
+                this.cachedContainer !== container ||
+                now - this.lastContainerUpdateTime > this.containerUpdateInterval) {
+                this.cachedContainer = container;
+                this.cachedContainerRect = container.getBoundingClientRect();
+                this.cachedIconSize = {
+                    width: this.iconElement.offsetWidth,
+                    height: this.iconElement.offsetHeight
+                };
+                this.lastContainerUpdateTime = now;
+            }
+            const containerRect = this.cachedContainerRect;
+            const iconWidth = this.cachedIconSize.width;
+            const iconHeight = this.cachedIconSize.height;
             // 计算新位置
             let newX = clientX - this.dragOffset.x - containerRect.left;
             let newY = clientY - this.dragOffset.y - containerRect.top;
             // 限制在容器内
-            const iconWidth = this.iconElement.offsetWidth;
-            const iconHeight = this.iconElement.offsetHeight;
             if (container === document.body) {
                 // 限制在视口内
                 newX = Math.max(0, Math.min(newX, window.innerWidth - iconWidth));
@@ -469,11 +536,22 @@ class IconManager {
                 newX = Math.max(0, Math.min(newX, containerWidth - iconWidth));
                 newY = Math.max(0, Math.min(newY, containerHeight - iconHeight));
             }
-            // 更新位置
-            this.iconElement.style.left = `${newX}px`;
-            this.iconElement.style.top = `${newY}px`;
-            this.iconElement.style.right = 'auto';
-            this.iconElement.style.bottom = 'auto';
+            // 性能优化：使用 requestAnimationFrame 节流位置更新
+            this.pendingPosition.x = newX;
+            this.pendingPosition.y = newY;
+            this.pendingPosition.needsUpdate = true;
+            if (this.rafId === null) {
+                this.rafId = requestAnimationFrame(() => {
+                    this.rafId = null;
+                    if (this.pendingPosition.needsUpdate && this.iconElement && this.isDragging) {
+                        this.iconElement.style.left = `${this.pendingPosition.x}px`;
+                        this.iconElement.style.top = `${this.pendingPosition.y}px`;
+                        this.iconElement.style.right = 'auto';
+                        this.iconElement.style.bottom = 'auto';
+                        this.pendingPosition.needsUpdate = false;
+                    }
+                });
+            }
             // 更新最后位置
             this.lastTouchPosition.x = clientX;
             this.lastTouchPosition.y = clientY;
@@ -573,6 +651,16 @@ class IconManager {
             window.clearTimeout(this.dragTimeoutId);
             this.dragTimeoutId = null;
         }
+        // 清理 requestAnimationFrame
+        if (this.rafId !== null) {
+            cancelAnimationFrame(this.rafId);
+            this.rafId = null;
+        }
+        // 清理缓存
+        this.cachedContainer = null;
+        this.cachedContainerRect = null;
+        this.cachedIframes = []; // 清理 iframe 缓存
+        this.pendingPosition.needsUpdate = false;
     }
     /**
      * 处理点击事件

package/dist/customer-sdk.esm.js

@@ -18,6 +18,19 @@ class IconManager {
         this.lastTouchPosition = { x: 0, y: 0 }; // 最后触摸位置
         this.touchStartTime = 0; // 触摸开始时间
         this.clickThreshold = 15; // 点击阈值（像素）
+        // 性能优化：缓存容器信息，避免频繁查询 DOM
+        this.cachedContainer = null;
+        this.cachedContainerRect = null;
+        this.cachedIconSize = { width: 0, height: 0 };
+        this.lastContainerUpdateTime = 0;
+        this.containerUpdateInterval = 100; // 每 100ms 更新一次容器信息（避免频繁重排）
+        // 性能优化：缓存所有 iframe 的位置信息（用于检测鼠标是否在 iframe 上）
+        this.cachedIframes = [];
+        this.lastIframeUpdateTime = 0;
+        this.iframeUpdateInterval = 50; // 每 50ms 更新一次 iframe 位置信息（更频繁，因为 iframe 可能移动）
+        // 性能优化：使用 requestAnimationFrame 节流位置更新
+        this.rafId = null;
+        this.pendingPosition = { x: 0, y: 0, needsUpdate: false };
         // 事件处理器引用（用于清理）
         this.onDragHandler = null;
         this.stopDragHandler = null;
@@ -317,6 +330,14 @@ class IconManager {
             this.dragOffset.x = clientX - iconRect.left;
             this.dragOffset.y = clientY - iconRect.top;
             // 注意：不在这里转换位置，只在真正开始拖动时才转换（在 onDrag 中）
+            // 性能优化：在拖动开始时预加载所有 iframe 位置信息
+            // 这样可以避免在拖动过程中频繁查询 DOM
+            const allIframes = document.querySelectorAll('iframe');
+            this.cachedIframes = Array.from(allIframes).map(iframe => ({
+                element: iframe,
+                rect: iframe.getBoundingClientRect()
+            }));
+            this.lastIframeUpdateTime = Date.now();
             // 添加 document 事件监听器
             if (this.onDragHandler) {
                 document.addEventListener('mousemove', this.onDragHandler);
@@ -359,7 +380,7 @@ class IconManager {
             };
             window.addEventListener('blur', this.blurHandler);
             // 3. 添加超时机制（如果一段时间没有收到 mousemove 事件，自动停止拖动）
-            // 这可以处理鼠标移动到 iframe 上的情况
+            // 优化：缩短超时时间到 100ms，更快检测到事件丢失（特别是嵌套 iframe 场景）
             this.dragTimeoutId = window.setTimeout(() => {
                 if (this.isDragging) {
                     if (this.debug) {
@@ -367,7 +388,7 @@ class IconManager {
                     }
                     this.stopDrag();
                 }
-            }, 500); // 500ms 没有移动事件，自动停止拖动（处理鼠标移动到 iframe 上的情况）
+            }, 100); // 缩短到 100ms，更快检测到事件丢失（特别是嵌套 iframe 场景）
             if (this.debug) {
                 console.log('Drag start');
             }
@@ -385,7 +406,41 @@ class IconManager {
         if (!this.iconElement)
             return;
         e.preventDefault();
+        const clientX = 'touches' in e ? e.touches[0].clientX : e.clientX;
+        const clientY = 'touches' in e ? e.touches[0].clientY : e.clientY;
+        // 检测鼠标是否在任何 iframe 上（通过坐标判断）
+        // 如果检测到鼠标在 iframe 区域，立即停止拖动
+        // 重要：需要检测所有 iframe（包括嵌套的），因为任何 iframe 都会导致事件丢失
+        if (this.isDragging) {
+            const now = Date.now();
+            // 性能优化：缓存 iframe 位置信息，避免频繁查询 DOM
+            if (this.cachedIframes.length === 0 ||
+                now - this.lastIframeUpdateTime > this.iframeUpdateInterval) {
+                // 更新 iframe 缓存
+                const allIframes = document.querySelectorAll('iframe');
+                this.cachedIframes = Array.from(allIframes).map(iframe => ({
+                    element: iframe,
+                    rect: iframe.getBoundingClientRect()
+                }));
+                this.lastIframeUpdateTime = now;
+            }
+            // 检查鼠标是否在任何 iframe 上
+            for (const { rect } of this.cachedIframes) {
+                if (clientX >= rect.left &&
+                    clientX <= rect.right &&
+                    clientY >= rect.top &&
+                    clientY <= rect.bottom) {
+                    // 鼠标在 iframe 上，立即停止拖动
+                    if (this.debug) {
+                        console.log('Mouse over iframe, stopping drag immediately');
+                    }
+                    this.stopDrag();
+                    return;
+                }
+            }
+        }
         // 重置超时定时器（每次移动都重置，确保只有真正停止移动时才触发超时）
+        // 优化：缩短超时时间到 100ms，更快检测到事件丢失（特别是嵌套 iframe 场景）
         if (this.dragTimeoutId !== null) {
             window.clearTimeout(this.dragTimeoutId);
             this.dragTimeoutId = window.setTimeout(() => {
@@ -395,10 +450,8 @@ class IconManager {
                     }
                     this.stopDrag();
                 }
-            }, 500); // 500ms 没有移动事件，自动停止拖动
+            }, 100); // 缩短到 100ms，更快检测到事件丢失（特别是嵌套 iframe 场景）
         }
-        const clientX = 'touches' in e ? e.touches[0].clientX : e.clientX;
-        const clientY = 'touches' in e ? e.touches[0].clientY : e.clientY;
         // 检查是否有足够的移动距离
         const deltaX = Math.abs(clientX - this.lastTouchPosition.x);
         const deltaY = Math.abs(clientY - this.lastTouchPosition.y);
@@ -442,17 +495,31 @@ class IconManager {
             return;
         }
         try {
+            // 性能优化：缓存容器信息，避免频繁查询 DOM
+            const now = Date.now();
             const container = this.getTargetElement();
             if (!container) {
                 return;
             }
-            const containerRect = container.getBoundingClientRect();
+            // 只在必要时更新容器信息（避免频繁重排）
+            if (!this.cachedContainer ||
+                this.cachedContainer !== container ||
+                now - this.lastContainerUpdateTime > this.containerUpdateInterval) {
+                this.cachedContainer = container;
+                this.cachedContainerRect = container.getBoundingClientRect();
+                this.cachedIconSize = {
+                    width: this.iconElement.offsetWidth,
+                    height: this.iconElement.offsetHeight
+                };
+                this.lastContainerUpdateTime = now;
+            }
+            const containerRect = this.cachedContainerRect;
+            const iconWidth = this.cachedIconSize.width;
+            const iconHeight = this.cachedIconSize.height;
             // 计算新位置
             let newX = clientX - this.dragOffset.x - containerRect.left;
             let newY = clientY - this.dragOffset.y - containerRect.top;
             // 限制在容器内
-            const iconWidth = this.iconElement.offsetWidth;
-            const iconHeight = this.iconElement.offsetHeight;
             if (container === document.body) {
                 // 限制在视口内
                 newX = Math.max(0, Math.min(newX, window.innerWidth - iconWidth));
@@ -465,11 +532,22 @@ class IconManager {
                 newX = Math.max(0, Math.min(newX, containerWidth - iconWidth));
                 newY = Math.max(0, Math.min(newY, containerHeight - iconHeight));
             }
-            // 更新位置
-            this.iconElement.style.left = `${newX}px`;
-            this.iconElement.style.top = `${newY}px`;
-            this.iconElement.style.right = 'auto';
-            this.iconElement.style.bottom = 'auto';
+            // 性能优化：使用 requestAnimationFrame 节流位置更新
+            this.pendingPosition.x = newX;
+            this.pendingPosition.y = newY;
+            this.pendingPosition.needsUpdate = true;
+            if (this.rafId === null) {
+                this.rafId = requestAnimationFrame(() => {
+                    this.rafId = null;
+                    if (this.pendingPosition.needsUpdate && this.iconElement && this.isDragging) {
+                        this.iconElement.style.left = `${this.pendingPosition.x}px`;
+                        this.iconElement.style.top = `${this.pendingPosition.y}px`;
+                        this.iconElement.style.right = 'auto';
+                        this.iconElement.style.bottom = 'auto';
+                        this.pendingPosition.needsUpdate = false;
+                    }
+                });
+            }
             // 更新最后位置
             this.lastTouchPosition.x = clientX;
             this.lastTouchPosition.y = clientY;
@@ -569,6 +647,16 @@ class IconManager {
             window.clearTimeout(this.dragTimeoutId);
             this.dragTimeoutId = null;
         }
+        // 清理 requestAnimationFrame
+        if (this.rafId !== null) {
+            cancelAnimationFrame(this.rafId);
+            this.rafId = null;
+        }
+        // 清理缓存
+        this.cachedContainer = null;
+        this.cachedContainerRect = null;
+        this.cachedIframes = []; // 清理 iframe 缓存
+        this.pendingPosition.needsUpdate = false;
     }
     /**
      * 处理点击事件