@alan-ai/alan-sdk-web 1.8.75 → 1.8.76

package/dist/AlanButton.d.ts

@@ -8,6 +8,10 @@ export interface AlanButton {
     isActive: () => boolean;
     remove: () => void;
     sendText: (text: string) => void;
+    theme: {
+        setTheme: (theme: 'light' | 'dark') => void;
+        getTheme: () => string,
+    };
     textChat: {
         setAudioOutputEnabled: (value: boolean) => void,
         isAudioOutputEnabled: () => boolean,

package/dist/alan_lib.js

@@ -89452,6 +89452,7 @@
 
   // alan_btn/src/state.ts
   var uiState = {
+    currentTheme: null,
     lib: {
       version: ""
     },
@@ -93706,10 +93707,28 @@ code.hljs {
       }
     }
   }
+  function broadcastThemeToIframes() {
+    const theme = uiState.currentTheme;
+    const iframes = window.frames;
+    const message = {
+      type: "alanThemeEvent",
+      theme
+    };
+    for (let i = 0; i < iframes.length; i++) {
+      try {
+        iframes[i].postMessage(message, "*");
+      } catch (error) {
+        console.error(`Failed to send message to iframe ${i}`, error);
+      }
+    }
+  }
   function onIFrameSizeListener(event) {
     if (event.data && event.data.source !== "alan-chat-iframe") {
       return;
     }
+    if (broadcastThemeToIframes) {
+      broadcastThemeToIframes();
+    }
     if (event.data?.height) {
       adjustIFrameSize(event.data);
     }
@@ -93986,7 +94005,7 @@ code.hljs {
 
   // alan_btn/alan_btn.ts
   (function(ns) {
-    uiState.lib.version = "alan-version.1.8.75".replace("alan-version.", "");
+    uiState.lib.version = "alan-version.1.8.76".replace("alan-version.", "");
     if (window.alanBtn) {
       console.warn("Alan: the Alan Button source code has already added (v." + uiState.lib.version + ")");
     }
@@ -94093,6 +94112,14 @@ code.hljs {
         sendText: (text) => {
           _sendText(text);
         },
+        theme: {
+          setTheme: (theme) => {
+            changeTheme(theme);
+          },
+          getTheme: () => {
+            return uiState.currentTheme;
+          }
+        },
         textChat: {
           setAudioOutputEnabled: (value) => {
             if (value === true) {
@@ -94440,6 +94467,7 @@ code.hljs {
         }
         return value;
       }
+      uiState.currentTheme = options?.theme || null;
       uiState.btn.zIndex = options.zIndex || findHighestZIndex() + 1;
       btnIconsZIndex = uiState.btn.zIndex - 2;
       btnTextPanelsZIndex = uiState.btn.zIndex - 1;
@@ -94921,7 +94949,7 @@ code.hljs {
       createAlanStyleSheet(options);
       function connectProject() {
         uiState.project.id = options.key;
-        tryReadSettingsFromLocalStorage();
+        applyOptionsFromLocalStorage();
         switchState(getDefaultBtnState(DISCONNECTED));
         window.tutorProject = window.alan.project(options.key, getAuthData(options.authData), options.host, null, {
           platform: mode === "demo" ? "alanplayground" : null,
@@ -95478,12 +95506,10 @@ code.hljs {
       if (isTutorMode()) {
         manageSyncPageStateListeners(true);
       }
-      function onOptionsReceived(data) {
-        console.log("Alan: options received");
-        console.timeEnd("Alan: receiving options time");
-        manageSyncPageStateListeners(data && data.web?.pageState?.autoSync !== false);
-        if (data && data.web) {
-          keepButtonPositionAfterDnD = data.web.alanButtonDragAndDrop?.keepButtonPositionAfterDnD || data.web.keepButtonPositionAfterDnD;
+      function changeOptions(options2) {
+        manageSyncPageStateListeners(options2?.pageState?.autoSync !== false);
+        if (options2) {
+          keepButtonPositionAfterDnD = options2.alanButtonDragAndDrop?.keepButtonPositionAfterDnD || options2.keepButtonPositionAfterDnD;
           if (!keepButtonPositionAfterDnD) {
             clearSavedBtnPosition();
           }
@@ -95491,39 +95517,37 @@ code.hljs {
         } else {
           setButtonPosition();
         }
-        if (data && data.web) {
-          dragAndDropEnabled = data.web.alanButtonDragAndDrop?.dragAndDropEnabled;
-        }
-        if (data && data.web && data.web.hideS2TPanel === true) {
+        dragAndDropEnabled = options2?.alanButtonDragAndDrop?.dragAndDropEnabled;
+        if (options2?.hideS2TPanel === true) {
           hideSpeach2TextPanel();
         } else {
           showSpeach2TextPanel();
         }
-        if (data && data.web && (data.web.alanButtonPopup?.popupEnabled === true || data.web.popupEnabled === true)) {
+        if (options2?.alanButtonPopup?.popupEnabled === true || options2?.popupEnabled === true) {
           popupEnabled = true;
         } else {
           popupEnabled = false;
           hidePopup();
         }
         if (!isTutorMode()) {
-          if (data && data.web && data.web.chatOptions?.textChat?.enabled === true) {
+          if (options2?.chatOptions?.textChat?.enabled === true) {
             uiState.textChat.available = true;
-            voiceEnabledInTextChat = data.web.chatOptions?.textChat?.voice?.enabled;
-            const themeFromOptions = data.web.chatOptions?.textChat?.bubbles?.response?.codeTheme || "light";
-            const currentTheme = uiState.textChat.options?.bubbles?.response?.codeTheme;
-            if (currentTheme !== themeFromOptions) {
-              initHighlightJs(themeFromOptions);
-            }
-            uiState.textChat.options = data.web.chatOptions?.textChat;
-            if (getVoiceEnabledFlag() !== data.web.chatOptions?.textChat?.audio?.enabled) {
-              if (data.web.chatOptions?.textChat?.audio?.enabled) {
+            voiceEnabledInTextChat = options2.chatOptions?.textChat?.voice?.enabled;
+            const codeThemeFromOptions = options2.chatOptions?.textChat?.bubbles?.response?.codeTheme || "light";
+            const currentCodeTheme = uiState.textChat.options?.bubbles?.response?.codeTheme;
+            if (currentCodeTheme !== codeThemeFromOptions) {
+              initHighlightJs(codeThemeFromOptions);
+            }
+            uiState.textChat.options = options2?.chatOptions?.textChat;
+            if (getVoiceEnabledFlag() !== options2?.chatOptions?.textChat?.audio?.enabled) {
+              if (options2?.chatOptions?.textChat?.audio?.enabled) {
                 enableAudio(false);
               } else {
                 disableAudio(false);
               }
             }
             initTextChat();
-            if (isInlinedMode() || data.web.chatOptions?.textChat?.popup?.openByDefualt === true || isTextChatSavedStateOpened()) {
+            if (isInlinedMode() || options2?.chatOptions?.textChat?.popup?.openByDefualt === true || isTextChatSavedStateOpened()) {
               if (!textChatWasClosedManually) {
                 showTextChat(true);
               }
@@ -95533,26 +95557,21 @@ code.hljs {
             hideTextChat();
           }
         }
-        if (data && data.web && data.web.timeout !== void 0) {
-          turnOffTimeout = data.web.timeout;
+        if (options2?.timeout !== void 0) {
+          turnOffTimeout = options2.timeout;
           setTurnOffVoiceTimeout();
         }
-        if (data && data.web) {
-          applyBtnOptions(data.web);
-        }
-        applyLogoOptions(data);
-        if (options.mode !== "tutor") {
-          if (data && data.web) {
-            applyBtnSizeOptions(data.web.buttonSize || btnModes[mode].btnSize);
+        if (!isTutorMode()) {
+          if (options2) {
+            applyLogoOptions(options2);
+            applyBtnOptions(options2);
+            applyBtnSizeOptions(options2.buttonSize || btnModes[mode].btnSize);
           }
         }
-        if (isLocalStorageAvailable && data) {
-          localStorage.setItem(getStorageKey(), JSON.stringify(data));
+        if (options2?.playReadyToListenSound !== void 0) {
+          applyPlayReadyToListenSoundOptions(options2.playReadyToListenSound);
         }
-        if (data && data.web && data.web.playReadyToListenSound !== void 0) {
-          applyPlayReadyToListenSoundOptions(data.web.playReadyToListenSound);
-        }
-        if (data && data.web && data.web.hidden === true) {
+        if (options2?.hidden === true) {
           hideBtn();
         } else {
           if (btnDisabled) {
@@ -95564,6 +95583,32 @@ code.hljs {
           }
         }
       }
+      function saveOptions(fullOptions) {
+        if (isLocalStorageAvailable && fullOptions) {
+          alanBtnSavedOptions = fullOptions;
+          localStorage.setItem(getBtnOptionsStorageKey(), JSON.stringify(fullOptions));
+        }
+      }
+      function onOptionsReceived(data) {
+        console.log("Alan: options received");
+        console.timeEnd("Alan: receiving options time");
+        saveOptions(data);
+        changeOptions(getOptionsByTheme(data?.web, uiState.currentTheme || options.theme));
+      }
+      function changeTheme(theme) {
+        const options2 = getOptionsByTheme(alanBtnSavedOptions?.web, theme);
+        if (options2) {
+          changeOptions(options2);
+        }
+        uiState.currentTheme = theme;
+        broadcastThemeToIframes();
+      }
+      function getOptionsByTheme(options2, theme) {
+        if (theme) {
+          return options2?.themes?.[theme]?.options || options2;
+        }
+        return options2;
+      }
       function onConnectStatusChange(res) {
         if (res === "disconnected") {
           if (previousState !== OFFLINE) {
@@ -97694,7 +97739,7 @@ ${LEARN_MORE_LABEL}
           }
         }
       }
-      function getStorageKey() {
+      function getBtnOptionsStorageKey() {
         var key = "";
         if (options && options.key) {
           key = options.key;
@@ -97734,39 +97779,39 @@ ${LEARN_MORE_LABEL}
           createAlanStyleSheet(options);
         }
       }
-      function applyLogoOptions(data) {
-        if (data && data.web) {
-          if (data.web.logoUrl && !data.web.logoIdle && !data.web.logoListen && !data.web.logoProcess && !data.web.logoReply && !data.web.logoTextChat) {
-            listenStateBtnIconImg.src = data.web.logoUrl;
-            processStateBtnIconImg.src = data.web.logoUrl;
-            replyStateBtnIconImg.src = data.web.logoUrl;
+      function applyLogoOptions(options2) {
+        if (options2) {
+          if (options2.logoUrl && !options2.logoIdle && !options2.logoListen && !options2.logoProcess && !options2.logoReply && !options2.logoTextChat) {
+            listenStateBtnIconImg.src = options2.logoUrl;
+            processStateBtnIconImg.src = options2.logoUrl;
+            replyStateBtnIconImg.src = options2.logoUrl;
           } else {
             if (uiState.textChat.available) {
-              if (data.web.logoTextChat) {
-                defaultStateBtnIconImg.src = data.web.logoTextChat;
+              if (options2.logoTextChat) {
+                defaultStateBtnIconImg.src = options2.logoTextChat;
               } else {
                 defaultStateBtnIconImg.src = btnIcons.alanLogoIconSrc;
               }
             } else {
-              if (data.web.logoIdle) {
-                defaultStateBtnIconImg.src = data.web.logoIdle;
+              if (options2.logoIdle) {
+                defaultStateBtnIconImg.src = options2.logoIdle;
               } else {
                 defaultStateBtnIconImg.src = btnIcons.micIconSrc;
               }
-              if (data.web.logoListen) {
-                listenStateBtnIconImg.src = data.web.logoListen;
+              if (options2.logoListen) {
+                listenStateBtnIconImg.src = options2.logoListen;
               } else {
                 listenStateBtnIconImg.removeAttribute("src");
                 listenStateBtnIconImg.style.opacity = "0";
               }
-              if (data.web.logoProcess) {
-                processStateBtnIconImg.src = data.web.logoProcess;
+              if (options2.logoProcess) {
+                processStateBtnIconImg.src = options2.logoProcess;
               } else {
                 processStateBtnIconImg.removeAttribute("src");
                 processStateBtnIconImg.style.opacity = "0";
               }
-              if (data.web.logoReply) {
-                replyStateBtnIconImg.src = data.web.logoReply;
+              if (options2.logoReply) {
+                replyStateBtnIconImg.src = options2.logoReply;
               } else {
                 replyStateBtnIconImg.removeAttribute("src");
                 replyStateBtnIconImg.style.opacity = "0";
@@ -97786,19 +97831,17 @@ ${LEARN_MORE_LABEL}
       } else {
         if (isLocalStorageAvailable) {
           try {
-            tryReadSettingsFromLocalStorage();
+            applyOptionsFromLocalStorage();
           } catch (e) {
           }
         }
       }
-      function tryReadSettingsFromLocalStorage() {
+      function applyOptionsFromLocalStorage() {
         if (isLocalStorageAvailable) {
           try {
-            alanBtnSavedOptions = JSON.parse(localStorage.getItem(getStorageKey()));
+            alanBtnSavedOptions = JSON.parse(localStorage.getItem(getBtnOptionsStorageKey()));
             if (alanBtnSavedOptions && alanBtnSavedOptions.web) {
-              if (alanBtnSavedOptions.web) {
-                applyBtnOptions(alanBtnSavedOptions.web);
-              }
+              applyBtnOptions(getOptionsByTheme(alanBtnSavedOptions.web, options.theme));
             }
           } catch (e) {
           }