@xpert-ai/chatkit-web-component 0.5.0 → 0.5.2

package/dist/xpert-chatkit.js

@@ -47,7 +47,7 @@ var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read fr
 var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
 var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
 var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _a, _b, _setTrainingOptOut_dec, _hideHistory_dec, _showHistory_dec, _sendCustomAction_dec, _shareThread_dec, _setThreadId_dec, _setRuntimeCapabilities_dec, _setComposerValue_dec, _sendUserMessage_dec, _fetchUpdates_dec, _focusComposer_dec, _c, _opts, _frameUrl, _frame, _wrapper, _launcherCloseButton, _launcherOpen, _chatMinimizedToPet, _framePetOptionsOverride, _petClosedByContextMenu, _shadow, _petOverlay, _resolveLoaded, _loaded, _messenger, _ChatKitElementBase_instances, emitAndThrow_fn, setOptionsDataAttributes_fn, getDisplayMode_fn, getConfiguredPetOptions_fn, mergeConfiguredPetPositionDefaults_fn, getOverlayPetOptions_fn, resolvePetAssetUrl_fn, resolveOverlayPetOptions_fn, getFrameOptions_fn, setLauncherOpen_fn, setChatMinimizedToPet_fn, syncPetOverlayOptions_fn, handlePetActivate_fn, handlePetClose_fn, handlePetReply_fn, handlePetThreadSummaryActivate_fn, _handleLauncherClose, getFrameUrl_fn, setFrameUrl_fn, consumeFrameUrl_fn, _handleFrameLoad, _initialized, maybeInit_fn, _init;
+var _a, _b, _setTrainingOptOut_dec, _hideHistory_dec, _showHistory_dec, _sendCustomAction_dec, _shareThread_dec, _setThreadId_dec, _setRuntimeCapabilities_dec, _setComposerValue_dec, _sendUserMessage_dec, _fetchUpdates_dec, _focusComposer_dec, _c, _opts, _frameUrl, _frame, _wrapper, _launcherCloseButton, _launcherOpen, _chatMinimizedToPet, _framePetOptionsOverride, _petClosedByContextMenu, _shadow, _petOverlay, _resolveLoaded, _loaded, _channelId, _messenger, _ChatKitElementBase_instances, emitAndThrow_fn, setOptionsDataAttributes_fn, getDisplayMode_fn, getConfiguredPetOptions_fn, mergeConfiguredPetPositionDefaults_fn, getOverlayPetOptions_fn, resolvePetAssetUrl_fn, resolveOverlayPetOptions_fn, getFrameOptions_fn, setLauncherOpen_fn, setChatMinimizedToPet_fn, syncPetOverlayOptions_fn, handlePetActivate_fn, handlePetClose_fn, handlePetReply_fn, handlePetThreadSummaryActivate_fn, _handleLauncherClose, getFrameUrl_fn, setFrameUrl_fn, consumeFrameUrl_fn, _handleFrameLoad, _initialized, maybeInit_fn, _init;
 class EventEmitter {
   constructor() {
     __publicField(this, "callbacks", /* @__PURE__ */ new Map());
@@ -366,7 +366,7 @@ const fetchEventSourceWithRetry = async (url, params) => {
     }
   });
 };
-function safeRandomUUID() {
+function createSecureChannelId() {
   const cryptoRef = globalThis.crypto;
   if (typeof (cryptoRef == null ? void 0 : cryptoRef.randomUUID) === "function") {
     return cryptoRef.randomUUID();
@@ -378,7 +378,30 @@ function safeRandomUUID() {
     bytes[8] = bytes[8] & 63 | 128;
     return [...bytes].map((byte) => byte.toString(16).padStart(2, "0")).join("").replace(/^(.{8})(.{4})(.{4})(.{4})(.{12})$/, "$1-$2-$3-$4-$5");
   }
-  return `ck_${Date.now()}_${Math.random().toString(16).slice(2)}`;
+  return null;
+}
+function safeRandomUUID() {
+  return createSecureChannelId() ?? `ck_${Date.now()}_${Math.random().toString(16).slice(2)}`;
+}
+function isTrustedChatKitMessageEvent(event, { channelId, expectedOrigin, expectedSource }) {
+  const payload = event.data;
+  if (!payload || typeof payload !== "object" || !("__xpaiChatKit" in payload)) {
+    return false;
+  }
+  if (payload.__xpaiChatKit !== true) {
+    return false;
+  }
+  if (expectedOrigin !== "*" && event.origin !== expectedOrigin) {
+    return false;
+  }
+  if (event.source === expectedSource) {
+    return true;
+  }
+  const normalizedChannelId = channelId == null ? void 0 : channelId.trim();
+  if (normalizedChannelId) {
+    return "channelId" in payload && payload.channelId === normalizedChannelId;
+  }
+  return false;
 }
 let IntegrationError$1 = class IntegrationError extends Error {
   constructor(message) {
@@ -412,10 +435,12 @@ class BaseMessenger {
     handlers,
     target,
     targetOrigin,
+    channelId,
     fetch: fetch2 = window.fetch
   }) {
     __publicField(this, "targetOrigin");
     __publicField(this, "target");
+    __publicField(this, "channelId");
     __publicField(this, "commandHandlers");
     __publicField(this, "_fetch");
     __publicField(this, "emitter", new EventEmitter());
@@ -446,7 +471,11 @@ class BaseMessenger {
     ));
     __publicField(this, "handleMessage", async (event) => {
       var _a2, _b2, _c2, _d;
-      if (!event.data || event.data.__xpaiChatKit !== true || event.origin !== this.targetOrigin || event.source !== this.target()) {
+      if (!isTrustedChatKitMessageEvent(event, {
+        channelId: this.channelId,
+        expectedOrigin: this.targetOrigin,
+        expectedSource: this.target()
+      })) {
         return;
       }
       const data = event.data;
@@ -587,6 +616,7 @@ class BaseMessenger {
     this.commandHandlers = handlers;
     this.target = target;
     this.targetOrigin = targetOrigin;
+    this.channelId = (channelId == null ? void 0 : channelId.trim()) || void 0;
     this._fetch = (...args) => fetch2(...args);
   }
   setTargetOrigin(targetOrigin) {
@@ -596,6 +626,7 @@ class BaseMessenger {
     var _a2;
     const message = {
       __xpaiChatKit: true,
+      ...this.channelId ? { channelId: this.channelId } : {},
       ...data
     };
     (_a2 = this.target()) == null ? void 0 : _a2.postMessage(message, this.targetOrigin, transfer);
@@ -1396,6 +1427,7 @@ class PetOverlay {
     this.lastDragPosition = null;
     this.lastDragClientX = null;
     this.dragAnimation = null;
+    this.activePointerId = null;
     this.isDragging = false;
     this.isHovering = false;
     this.movedDuringDrag = false;
@@ -1527,7 +1559,7 @@ class PetOverlay {
     };
     this.handlePointerDown = (event) => {
       var _a2, _b2;
-      if (event.button !== 0 || event.ctrlKey) {
+      if (event.button !== 0 || event.ctrlKey || this.isDragging) {
         return;
       }
       this.closeContextMenu();
@@ -1553,12 +1585,17 @@ class PetOverlay {
       this.movedDuringDrag = false;
       this.dragPosition = nextPosition;
       this.isDragging = true;
+      this.activePointerId = event.pointerId;
       this.clearRestingDelayTimer();
       this.isHovering = true;
+      this.captureActivePointer();
       this.installDragListeners();
       this.rescheduleAnimation();
     };
     this.handlePointerMove = (event) => {
+      if (!this.isActiveDragPointer(event)) {
+        return;
+      }
       const nextPosition = this.getNextDragPosition(event);
       const last = this.lastDragPosition;
       if (last && (Math.abs(last.x - nextPosition.x) > DRAG_DIRECTION_THRESHOLD_PX || Math.abs(last.y - nextPosition.y) > DRAG_DIRECTION_THRESHOLD_PX)) {
@@ -1578,20 +1615,18 @@ class PetOverlay {
       this.render();
     };
     this.handlePointerUp = (event) => {
+      if (!this.isActiveDragPointer(event)) {
+        return;
+      }
       const finalPosition = this.lastDragPosition ?? this.getNextDragPosition(event);
-      this.isDragging = false;
-      this.dragPosition = null;
-      this.dragAnimation = null;
-      this.lastDragClientX = null;
-      this.removeDragListeners();
-      this.persistPosition(finalPosition);
-      if (event.pointerType === "mouse" && this.isPointerOverPet(event)) {
-        this.isHovering = true;
-        this.rescheduleAnimation();
-      } else {
-        this.enterRestingAfterDelay();
-        this.rescheduleAnimation();
+      this.finishDrag(finalPosition, event);
+    };
+    this.handleLostPointerCapture = (event) => {
+      if (!this.isActiveDragPointer(event)) {
+        return;
       }
+      const finalPosition = this.lastDragPosition ?? this.getNextDragPosition(event);
+      this.finishDrag(finalPosition, event);
     };
     this.handleClick = () => {
       var _a2;
@@ -1795,6 +1830,7 @@ class PetOverlay {
     pet.addEventListener("pointerenter", this.handlePointerEnter);
     pet.addEventListener("pointerleave", this.handlePointerLeave);
     pet.addEventListener("pointerdown", this.handlePointerDown);
+    pet.addEventListener("lostpointercapture", this.handleLostPointerCapture);
     pet.addEventListener("contextmenu", this.handleContextMenu);
     pet.addEventListener("click", this.handleClick);
     overlay.append(style, pet);
@@ -1804,6 +1840,7 @@ class PetOverlay {
   }
   removeOverlay() {
     var _a2;
+    this.cancelActiveDrag();
     this.clearRestingDelayTimer();
     this.clearTimers();
     this.closeContextMenu();
@@ -1820,6 +1857,10 @@ class PetOverlay {
         "pointerdown",
         this.handlePointerDown
       );
+      this.petElement.removeEventListener(
+        "lostpointercapture",
+        this.handleLostPointerCapture
+      );
       this.petElement.removeEventListener(
         "contextmenu",
         this.handleContextMenu
@@ -2537,6 +2578,34 @@ class PetOverlay {
       this.render();
     }
   }
+  captureActivePointer() {
+    const pointerId = this.activePointerId;
+    const pet = this.petElement;
+    if (pointerId === null || typeof (pet == null ? void 0 : pet.setPointerCapture) !== "function") {
+      return;
+    }
+    try {
+      pet.setPointerCapture(pointerId);
+    } catch {
+    }
+  }
+  releaseActivePointer() {
+    const pointerId = this.activePointerId;
+    const pet = this.petElement;
+    this.activePointerId = null;
+    if (pointerId === null || typeof (pet == null ? void 0 : pet.hasPointerCapture) !== "function" || typeof pet.releasePointerCapture !== "function") {
+      return;
+    }
+    try {
+      if (pet.hasPointerCapture(pointerId)) {
+        pet.releasePointerCapture(pointerId);
+      }
+    } catch {
+    }
+  }
+  isActiveDragPointer(event) {
+    return this.isDragging && event.pointerId === this.activePointerId;
+  }
   getNextDragPosition(event) {
     if (!this.options) {
       return { x: 0, y: 0 };
@@ -2551,12 +2620,35 @@ class PetOverlay {
       normalizeBoundsPadding(this.options.position.boundsPadding)
     );
   }
+  finishDrag(finalPosition, event) {
+    this.isDragging = false;
+    this.dragPosition = null;
+    this.dragAnimation = null;
+    this.lastDragClientX = null;
+    this.removeDragListeners();
+    this.releaseActivePointer();
+    this.persistPosition(finalPosition);
+    if (event.pointerType === "mouse" && this.isPointerOverPet(event)) {
+      this.isHovering = true;
+      this.rescheduleAnimation();
+    } else {
+      this.enterRestingAfterDelay();
+      this.rescheduleAnimation();
+    }
+  }
+  cancelActiveDrag() {
+    this.isDragging = false;
+    this.dragPosition = null;
+    this.dragAnimation = null;
+    this.lastDragPosition = null;
+    this.lastDragClientX = null;
+    this.removeDragListeners();
+    this.releaseActivePointer();
+  }
   installDragListeners() {
     window.addEventListener("pointermove", this.handlePointerMove);
-    window.addEventListener("pointerup", this.handlePointerUp, { once: true });
-    window.addEventListener("pointercancel", this.handlePointerUp, {
-      once: true
-    });
+    window.addEventListener("pointerup", this.handlePointerUp);
+    window.addEventListener("pointercancel", this.handlePointerUp);
   }
   removeDragListeners() {
     window.removeEventListener("pointermove", this.handlePointerMove);
@@ -2603,7 +2695,9 @@ class ChatKitElementBase extends (_c = HTMLElement, _focusComposer_dec = [requir
     __privateAdd(this, _loaded, new Promise((resolve) => {
       __privateSet(this, _resolveLoaded, resolve);
     }));
+    __privateAdd(this, _channelId, createSecureChannelId());
     __privateAdd(this, _messenger, new ChatFrameMessenger({
+      channelId: __privateGet(this, _channelId) ?? void 0,
       fetch: (...args) => {
         var _a2;
         const customFetch = ((_a2 = __privateGet(this, _opts)) == null ? void 0 : _a2.api) && "fetch" in __privateGet(this, _opts).api && __privateGet(this, _opts).api.fetch;
@@ -3102,6 +3196,7 @@ _shadow = new WeakMap();
 _petOverlay = new WeakMap();
 _resolveLoaded = new WeakMap();
 _loaded = new WeakMap();
+_channelId = new WeakMap();
 _messenger = new WeakMap();
 _ChatKitElementBase_instances = new WeakSet();
 emitAndThrow_fn = function(error) {
@@ -3312,7 +3407,8 @@ maybeInit_fn = function() {
   frameURL.hash = encodeBase64({
     options: getInnerOptions(__privateMethod(this, _ChatKitElementBase_instances, getFrameOptions_fn).call(this, __privateGet(this, _opts))),
     referrer: window.location.origin,
-    profile: this.profile
+    profile: this.profile,
+    ...__privateGet(this, _channelId) ? { channelId: __privateGet(this, _channelId) } : {}
   });
   __privateGet(this, _messenger).connect();
   __privateGet(this, _frame).src = frameURL.toString();