@alan-ai/alan-sdk-web 1.8.84 → 1.8.85

package/dist/AlanButton.d.ts

@@ -21,6 +21,7 @@ export interface AlanButton {
         isAudioOutputEnabled: () => boolean,
         setFullScreenMode: (value: boolean) => void,
         close: () => void,
+        minimize: () => void,
         open: () => void,
         clear: () => void,
     };

package/dist/AlanButtonOptions.d.ts

@@ -1,6 +1,7 @@
 export interface AlanButtonOptions {
     key: string;
     rootEl?: HTMLElement | undefined;
+    chatEl?: HTMLElement | undefined;
     right?: number | string;
     bottom?: number | string;
     left?: number | string;
@@ -17,7 +18,11 @@ export interface AlanButtonOptions {
     onButtonState?: (state: string) => void;
     onConnectionStatus?: (status: string) => void;
     textChat?: {
+        closeDelay?: number;
+        showBtnIfChatOpen?: boolean;
+        openByDefault?: boolean;
         onClose?: () => void;
         onMinimize?: () => void;
+        onOpen?: () => void;
     }
 }

package/dist/alan_lib.js

@@ -91753,6 +91753,10 @@
         opacity: 0;
         animation: text-chat-appear-anim ${textChatAppearAnimationMs}ms ease-in-out forwards;
     }`;
+    keyFrames += getStyleSheetMarker() + `.alan-text-chat__openning-immidiately {
+        opacity: 1;
+        transform: scale(1);
+    }`;
     keyFrames += getStyleSheetMarker() + generateKeyFrame(
       "text-chat-appear-anim",
       `
@@ -93942,6 +93946,7 @@
     style.setAttribute("id", "alan-stylesheet-" + projectId);
     style.type = "text/css";
     keyFrames += `.alanBtn-root * {  box-sizing: border-box; font-family: ${webOptions?.chatOptions?.textChat?.popup?.fontFamily || "Poppins"}; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}`;
+    keyFrames += `.alanBtn-chat-root-inlined {height: 100%;}`;
     var hoverSelector = !isMobile() ? ":hover" : ":active";
     if (!isMobile()) {
       keyFrames += getStyleSheetMarker() + ".alanBtn{transform: scale(1); transition: " + transitionCss + ";} .alanBtn" + hoverSelector + "{transform: scale(1.11111);transition:" + transitionCss + ";}.alanBtn:focus {transform: scale(1);" + transitionCss + ";  border: solid 3px #50e3c2;  outline: none;  }";
@@ -95038,7 +95043,7 @@ code.hljs {
   // alan_btn/alan_btn.ts
   var import_sjcl = __toESM(require_sjcl());
   (function(ns) {
-    uiState.lib.version = "alan-version.1.8.84".replace("alan-version.", "");
+    uiState.lib.version = "alan-version.1.8.85".replace("alan-version.", "");
     if (window.alanBtn) {
       console.warn("Alan: the Alan Button source code has already added (v." + uiState.lib.version + ")");
     }
@@ -95063,7 +95068,8 @@ code.hljs {
       var keepButtonPositionAfterDnD = false;
       var dragAndDropEnabled = true;
       var curDialogId = null;
-      var textChatIsHidden = true;
+      var closeChatTimeoutId;
+      var textChatIsHidden = !options.textChat?.openByDefault;
       var textChatWasClosedManually = false;
       var voiceEnabledInTextChat = true;
       var textChatMessages = [];
@@ -95225,6 +95231,9 @@ code.hljs {
             showTextChat();
             broadcastReloadIframeToIframes();
           },
+          minimize: () => {
+            minimizeTextChat();
+          },
           close: () => {
             closeTextChat();
           },
@@ -95550,6 +95559,9 @@ code.hljs {
       function isInlinedMode() {
         return uiState.textChat.inlined;
       }
+      function isChatOpenedByDefault() {
+        return options?.textChat?.openByDefault;
+      }
       btnSize = btnModes[mode].btnSize;
       function setDefautlPositionProps(value) {
         if (/^\d+$/.test(value)) {
@@ -95565,6 +95577,7 @@ code.hljs {
       if (uiState.btn.zIndex) {
         rootEl.style.zIndex = uiState.btn.zIndex;
       }
+      chatHolderDiv.style.zIndex = uiState.btn.zIndex + 2;
       setButtonPosition();
       recognisedTextContent.classList.add("alanBtn-recognised-text-content");
       recognisedTextHolder.classList.add("alanBtn-recognised-text-holder");
@@ -95596,7 +95609,7 @@ code.hljs {
           sideBtnPos = setDefautlPositionProps(options.right !== void 0 ? options.right : btnModes[mode].rightPos);
           initRightPos = parseInt(sideBtnPos, 10);
         }
-        if (isInlinedMode()) {
+        if (isInlinedMode() && !options.chatEl) {
           rootEl.style.position = "static";
         } else {
           rootEl.style.position = options.position ? options.position : "fixed";
@@ -95767,7 +95780,7 @@ code.hljs {
         btn.style.height = size + "px";
         btn.style.maxHeight = size + "px";
         rootEl.style.width = size + "px";
-        if (isInlinedMode()) {
+        if (isInlinedMode() && !options.chatEl) {
           rootEl.style.width = "100%";
           rootEl.style.minWidth = "100%";
           rootEl.style.maxWidth = "100%";
@@ -96181,8 +96194,12 @@ code.hljs {
           return;
         if (!dndBackAnimFinished)
           return;
-        if (uiState.textChat.available && textChatIsHidden) {
-          activateAlanButton();
+        if (uiState.textChat.available) {
+          if (textChatIsHidden) {
+            activateAlanButton();
+          } else {
+            closeTextChat();
+          }
         } else {
           activateVoiceBtn();
           this.blur();
@@ -96638,7 +96655,12 @@ code.hljs {
             }
             updateMsgLoaderIcons(options2?.chatOptions?.textChat);
             initTextChat();
-            if (isInlinedMode() || options2?.chatOptions?.textChat?.popup?.openByDefualt === true || isTextChatSavedStateOpened()) {
+            if (options2?.chatOptions?.textChat?.popup?.openByDefualt === true || !isInlinedMode() && isTextChatSavedStateOpened()) {
+              if (!textChatWasClosedManually) {
+                showTextChat(true);
+              }
+            }
+            if (isChatOpenedByDefault()) {
               if (!textChatWasClosedManually) {
                 showTextChat(true);
               }
@@ -96701,7 +96723,7 @@ code.hljs {
       }
       function savePrevUserId(userId) {
         if (isLocalStorageAvailable) {
-          localStorage.setItem(LOCAL_STORAGE_KEYS.getPrevUserIdKey(), encryptMessage(userId, "userId"));
+          localStorage.setItem(LOCAL_STORAGE_KEYS.getPrevUserIdKey(), encryptMessage(userId || "default", "userId"));
         }
       }
       function getPrevUserId() {
@@ -98316,38 +98338,56 @@ ${LEARN_MORE_LABEL}
         }
       }
       function showTextChat(noAnimation) {
+        if (chatHolderDiv.classList.contains("is-alan-chat-opened"))
+          return;
+        clearTimeout(closeChatTimeoutId);
         textChatWasClosedManually = false;
-        if (options.onEvent) {
-          options.onEvent({ name: "textChatOpened" });
-        }
         fixPopupScrollOnMobileForTextChat(true);
         hideChatNotifications();
         hidePopup();
         chatHolderDiv.style.display = "flex";
         textChatIsHidden = false;
-        if (noAnimation === true) {
-          rootEl.classList.add("hide-alan-btn-when-text-chat-is-opened-immediately");
+        if (options.textChat?.showBtnIfChatOpen !== true) {
+          if (noAnimation === true) {
+            rootEl.classList.add("hide-alan-btn-when-text-chat-is-opened-immediately");
+          } else {
+            rootEl.classList.add("hide-alan-btn-when-text-chat-is-opened");
+          }
+        }
+        chatHolderDiv.classList.add("is-alan-chat-opened");
+        if (isInlinedMode()) {
+          chatHolderDiv.classList.add("alan-text-chat__openning-immidiately");
         } else {
-          rootEl.classList.add("hide-alan-btn-when-text-chat-is-opened");
+          chatHolderDiv.classList.add("alan-text-chat__openning");
         }
-        chatHolderDiv.classList.add("alan-text-chat__openning");
         if (isLocalStorageAvailable) {
           if (!isMobile()) {
             localStorage.setItem(LOCAL_STORAGE_KEYS.getOpenedClosedTextChatStateKey(), "1");
           }
         }
+        if (options?.textChat?.onOpen) {
+          options?.textChat?.onOpen();
+        }
+        if (options.onEvent) {
+          options.onEvent({ name: "textChatOpened" });
+        }
       }
       function hideTextChat() {
         if (textChatIsHidden)
           return;
         deactivateAlanButton();
+        chatHolderDiv.classList.remove("is-alan-chat-opened");
         chatHolderDiv.classList.add("alan-text-chat__closing");
-        rootEl.classList.add("text-chat-is-closing");
+        if (options.textChat?.showBtnIfChatOpen !== true) {
+          rootEl.classList.add("text-chat-is-closing");
+        }
         setTimeout(() => {
           chatHolderDiv.style.display = "none";
           chatHolderDiv.classList.remove("alan-text-chat__closing");
-          rootEl.classList.remove("hide-alan-btn-when-text-chat-is-opened");
-          rootEl.classList.remove("hide-alan-btn-when-text-chat-is-opened-immediately");
+          if (options.textChat?.showBtnIfChatOpen !== true) {
+            rootEl.classList.remove("hide-alan-btn-when-text-chat-is-opened");
+            rootEl.classList.remove("hide-alan-btn-when-text-chat-is-opened-immediately");
+          }
           rootEl.classList.remove("text-chat-is-closing");
           fixPopupScrollOnMobileForTextChat(false);
         }, uiState.textChat.defaults.appearAnimationMs);
@@ -98366,26 +98406,47 @@ ${LEARN_MORE_LABEL}
       }
       function closeTextChat() {
         textChatWasClosedManually = true;
-        if (options.onEvent) {
-          options.onEvent({ name: "textChatClosed" });
-        }
         if (options?.textChat?.onClose) {
           options?.textChat?.onClose();
+        }
+        const closeDelay = options?.textChat?.closeDelay;
+        if (closeDelay) {
+          clearTimeout(closeChatTimeoutId);
+          closeChatTimeoutId = setTimeout(() => {
+            _closeChat();
+          }, closeDelay);
         } else {
-          hideTextChat();
+          _closeChat();
+        }
+      }
+      function _closeChat() {
+        if (options.onEvent) {
+          options.onEvent({ name: "textChatClosed" });
         }
+        hideTextChat();
         if (uiState.textChat.options?.popup?.clearChatOnClose === true) {
           onClearTextChatBtnClick();
         }
       }
-      function minimizeTextChat() {
+      function _minimizeChat() {
         if (options.onEvent) {
           options.onEvent({ name: "textChatMinimized" });
         }
+        hideTextChat();
+      }
+      function minimizeTextChat() {
+        textChatWasClosedManually = true;
         if (options?.textChat?.onMinimize) {
           options?.textChat?.onMinimize();
+        }
+        const closeDelay = options?.textChat?.closeDelay;
+        if (closeDelay) {
+          clearTimeout(closeChatTimeoutId);
+          closeChatTimeoutId = setTimeout(() => {
+            _minimizeChat();
+          }, closeDelay);
         } else {
-          hideTextChat();
+          _minimizeChat();
         }
       }
       function expandCollapseChatSidePanel() {
@@ -98509,7 +98570,7 @@ ${LEARN_MORE_LABEL}
         changeBgColors(DEFAULT);
         micIconDiv.style.opacity = "1";
         roundedTriangleIconDiv.style.opacity = "0";
-        disconnectedMicLoaderIconImg.style.opacity = "0";
+        disconnectedMicLoaderIconImg.style.opacity = "1";
         changeCustomLogoVisibility(
           defaultStateBtnIconImg,
           [
@@ -98880,13 +98941,20 @@ ${LEARN_MORE_LABEL}
       }
       function showBtn() {
         rootEl.innerHTML = "";
-        if (!isInlinedMode()) {
-          recognisedTextHolder.appendChild(recognisedTextContent);
-          rootEl.appendChild(recognisedTextHolder);
-          rootEl.appendChild(btn);
-          btn.appendChild(chatNotificationsBubble);
+        recognisedTextHolder.appendChild(recognisedTextContent);
+        rootEl.appendChild(recognisedTextHolder);
+        rootEl.appendChild(btn);
+        btn.appendChild(chatNotificationsBubble);
+        if (isInlinedMode()) {
+          if (options.chatEl) {
+            options.chatEl.append(chatHolderDiv);
+          } else {
+            console.error("Text Chat element is not defined. Set chatEl in Alan Button options");
+            return;
+          }
+        } else {
+          rootEl.appendChild(chatHolderDiv);
         }
-        rootEl.appendChild(chatHolderDiv);
         resizeTextArea();
         btnDisabled = false;
       }
@@ -98957,6 +99025,13 @@ ${LEARN_MORE_LABEL}
       }
       rootEl.classList.add("alanBtn-root");
       rootEl.classList.add("alan-" + getProjectId());
+      if (options.chatEl) {
+        options.chatEl.classList.add("alanBtn-root");
+        if (isInlinedMode()) {
+          options.chatEl.classList.add("alanBtn-chat-root-inlined");
+        }
+        options.chatEl.classList.add("alan-" + getProjectId());
+      }
       var alanBtnSavedOptions = null;
       if (isTutorMode()) {
         showBtn();
@@ -99032,10 +99107,10 @@ ${LEARN_MORE_LABEL}
             rootEl.style.setProperty("top", dndBtnTopPos + "px", "important");
             rootEl.style.setProperty("bottom", "auto", "important");
           }
-          if (Math.abs(tempDeltaX) > 15 || Math.abs(tempDeltaY) > 15) {
+          if ((Math.abs(tempDeltaX) > 15 || Math.abs(tempDeltaY) > 15) && !isInlinedMode()) {
             hideTextChat();
-            afterMouseMove = true;
           }
+          afterMouseMove = true;
           newLeftPos = dndBtnLeftPos + posInfo.clientX - dndInitMousePos2[0];
           newTopPos = dndBtnTopPos + posInfo.clientY - dndInitMousePos2[1];
           tempDeltaX = posInfo.clientX - dndInitMousePos2[0];