@alan-ai/alan-sdk-web 1.8.60 → 1.8.62

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/AlanButton.d.ts +4 -1
  2. package/dist/alan_lib.js +907 -268
  3. package/dist/alan_lib.min.js +1 -1
  4. package/package.json +1 -1
package/dist/alan_lib.js CHANGED
@@ -83965,9 +83965,43 @@
83965
83965
  }
83966
83966
  });
83967
83967
 
83968
+ // alan_btn/src/state.ts
83969
+ var uiState = {
83970
+ lib: {
83971
+ version: ""
83972
+ },
83973
+ project: {
83974
+ id: null
83975
+ },
83976
+ btn: {
83977
+ isTopAligned: false,
83978
+ zIndex: void 0
83979
+ },
83980
+ textChat: {
83981
+ available: false,
83982
+ expanded: false,
83983
+ inlined: false,
83984
+ options: null,
83985
+ loaderTimeoutMs: 6e4,
83986
+ defaults: {
83987
+ minChatWidth: 250,
83988
+ appearAnimationMs: 200,
83989
+ chatMargin: 25,
83990
+ textareaFontSize: 15,
83991
+ textareaLineHeight: 1.6,
83992
+ defaultSvgIconSize: 24
83993
+ }
83994
+ }
83995
+ };
83996
+
83968
83997
  // alan_btn/src/textChat/helpers/getMsgLoader.ts
83969
83998
  function getMsgLoader() {
83970
- return '<div class="alan-btn__chat-incomming-msg-wrapper"> <div class="alan-btn__chat-incomming-msg msg-1">&nbsp;</div> <div class="alan-btn__chat-incomming-msg msg-2">&nbsp;</div> <div class="alan-btn__chat-incomming-msg msg-3">&nbsp;</div> </div>';
83999
+ const textChatOptions = uiState.textChat.options;
84000
+ const waitingResponseBubbleLayout = textChatOptions?.bubbles?.waitingResponse?.layout || "default";
84001
+ const waitingResponseBubbleLabel = textChatOptions?.bubbles?.waitingResponse?.label || "Generating response...";
84002
+ const content = waitingResponseBubbleLayout === "default" ? '<div class="alan-btn__chat-incomming-msg msg-1">&nbsp;</div> <div class="alan-btn__chat-incomming-msg msg-2">&nbsp;</div> <div class="alan-btn__chat-incomming-msg msg-3">&nbsp;</div>' : `<span class="alan-btn__chat-incomming-msg-loader-icon"></span>
84003
+ <span class="alan-btn__chat-incomming-msg-loader-label">${waitingResponseBubbleLabel}</span>`;
84004
+ return `<div class="alan-btn__chat-incomming-msg-wrapper">${content}</div>`;
83971
84005
  }
83972
84006
 
83973
84007
  // alan_btn/src/textChat/helpers/buildMsgIncommingLoader.ts
@@ -83977,7 +84011,7 @@
83977
84011
  function buildMsgIncommingLoader(msg) {
83978
84012
  if (msg.initLoad)
83979
84013
  return "";
83980
- return !isFinalMessage(msg) ? `<div style="margin-top: 12px;margin-bottom: 12px;">${getMsgLoader()}</div>` : "";
84014
+ return !isFinalMessage(msg) ? `<div style="margin-top: 12px;margin-bottom: 4px;">${getMsgLoader()}</div>` : "";
83981
84015
  }
83982
84016
 
83983
84017
  // alan_btn/src/textChat/helpers/getMsgReadProp.ts
@@ -84003,6 +84037,9 @@
84003
84037
  messages[i].ctx = { format: "markdown" };
84004
84038
  }
84005
84039
  }
84040
+ if (message.ctx?.final === true) {
84041
+ messages[i].ctx.final = message.ctx?.final;
84042
+ }
84006
84043
  }
84007
84044
 
84008
84045
  // alan_btn/src/textChat/helpers/processMessageForChat.ts
@@ -84181,15 +84218,14 @@
84181
84218
  `
84182
84219
  },
84183
84220
  send: `
84184
- <svg width="36" height="24" viewBox="0 0 36 24" fill="none" xmlns="http://www.w3.org/2000/svg">
84185
- <path d="M14.1225 13.1096L24.6225 2.60955M14.2501 13.4376L16.8782 20.1956C17.1097 20.791 17.2255 21.0886 17.3923 21.1755C17.5369 21.2509 17.7092 21.251 17.8538 21.1758C18.0207 21.0891 18.1369 20.7916 18.3691 20.1965L24.9594 3.30875C25.1691 2.77157 25.2739 2.50298 25.2165 2.33135C25.1667 2.1823 25.0498 2.06533 24.9007 2.01554C24.7291 1.95821 24.4605 2.06302 23.9233 2.27265L7.03562 8.86299C6.44052 9.09522 6.14303 9.21133 6.05633 9.37823C5.98113 9.52292 5.98122 9.6952 6.05662 9.8398C6.14352 10.0066 6.44123 10.1223 7.03653 10.3539L13.7945 12.982C13.9153 13.029 13.9757 13.0525 14.0266 13.0888C14.0717 13.1209 14.1111 13.1604 14.1433 13.2055C14.1796 13.2563 14.2031 13.3168 14.2501 13.4376Z" stroke="#4A515D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
84221
+ <svg width="44" height="28" viewBox="0 0 44 28" fill="none" xmlns="http://www.w3.org/2000/svg">
84222
+ <path d="M17.2915 17.7085L29.3026 5.69727M17.4375 18.0837L20.4438 25.8143C20.7086 26.4954 20.8411 26.8358 21.0319 26.9352C21.1973 27.0215 21.3944 27.0216 21.5598 26.9356C21.7507 26.8364 21.8836 26.4961 22.1493 25.8153L29.688 6.4971C29.9279 5.88261 30.0478 5.57536 29.9821 5.37903C29.9252 5.20853 29.7914 5.07473 29.6209 5.01777C29.4246 4.95219 29.1173 5.07209 28.5028 5.31188L9.18467 12.8507C8.50392 13.1164 8.16361 13.2492 8.06444 13.4401C7.97841 13.6056 7.97852 13.8027 8.06477 13.9681C8.16418 14.1589 8.50473 14.2913 9.18571 14.5562L16.9163 17.5625C17.0545 17.6163 17.1236 17.6432 17.1818 17.6847C17.2334 17.7214 17.2784 17.7666 17.3153 17.8182C17.3568 17.8763 17.3837 17.9455 17.4375 18.0837Z" stroke="#4A515D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
84186
84223
  </svg>
84187
84224
  `,
84188
84225
  mic: `
84189
- <svg width="44" height="40" viewBox="0 0 44 40" fill="none" xmlns="http://www.w3.org/2000/svg">
84190
- <path d="M29 18V20C29 23.866 25.866 27 22 27M22 27C18.134 27 15 23.866 15 20V18M22 27V30M18 30H26M22 23C20.3431 23 19 21.6569 19 20V13C19 11.3432 20.3431 10 22 10C23.6569 10 25 11.3432 25 13V20C25 21.6569 23.6569 23 22 23Z" stroke="#4A515D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
84226
+ <svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
84227
+ <path d="M21.4 12.8V15C21.4 19.2526 17.9526 22.7 13.7 22.7M13.7 22.7C9.4474 22.7 6 19.2526 6 15V12.8M13.7 22.7V26M9.3 26H18.1M13.7 18.3C11.8774 18.3 10.4 16.8226 10.4 15V7.3C10.4 5.47752 11.8774 4 13.7 4C15.5226 4 17 5.47752 17 7.3V15C17 16.8226 15.5226 18.3 13.7 18.3Z" stroke="#4A515D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
84191
84228
  </svg>
84192
-
84193
84229
  `,
84194
84230
  micPlayingBars: `<div class="alan-text-chat__animated-btn-bars">
84195
84231
  <div class="alan-text-chat__bar alan-text-chat__bar-1"></div>
@@ -84204,9 +84240,10 @@
84204
84240
  <path d="M15 9.4V5C15 3.34315 13.6569 2 12 2C10.8224 2 9.80325 2.67852 9.3122 3.66593M12 19V22M12 19C8.13401 19 5 15.866 5 12V10M12 19C15.866 19 19 15.866 19 12V10M8 22H16M2 2L22 22M12 15C10.3431 15 9 13.6569 9 12V9L14.1226 14.12C13.5796 14.6637 12.8291 15 12 15Z" stroke="#969EB0" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
84205
84241
  </svg>
84206
84242
  `,
84207
- disconnected: `<svg class="alan-btn_disconnected-chat-icon-rotate" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
84208
- <path d="M22 10C22 10 19.995 7.26822 18.3662 5.63824C16.7373 4.00827 14.4864 3 12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21C16.1031 21 19.5649 18.2543 20.6482 14.5M22 10V4M22 10H16" stroke="#969EB0" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
84209
- </svg>`,
84243
+ disconnected: `<svg class="alan-btn_disconnected-chat-icon-rotate" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
84244
+ <path d="M26 14C26 14 23.995 11.2682 22.3662 9.63824C20.7373 8.00827 18.4864 7 16 7C11.0294 7 7 11.0294 7 16C7 20.9706 11.0294 25 16 25C20.1031 25 23.5649 22.2543 24.6482 18.5M26 14V8M26 14H20" stroke="#969EB0" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
84245
+ </svg>
84246
+ `,
84210
84247
  noWiFi: `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
84211
84248
  <path d="M15.3119 10C16.6802 10.4263 17.9624 11.1191 19.08 12.05M22.5799 8.49997C19.6575 5.92394 15.8956 4.50262 11.9999 4.50262C11.3949 4.50262 10.7931 4.5369 10.1972 4.60447M8.52979 15.61C9.54499 14.8888 10.7595 14.5013 12.0048 14.5013C13.2501 14.5013 14.4646 14.8888 15.4798 15.61M12 19.5H12.01M1.19336 8.70076C2.52697 7.47869 4.06839 6.47975 5.75851 5.76306M4.73193 12.243C6.12934 11.012 7.84172 10.1302 9.73265 9.73393M15.6983 15.7751C14.6792 14.9763 13.3952 14.5 11.9999 14.5C10.5835 14.5 9.28172 14.9908 8.25537 15.8116M3 3L21 21" stroke="#969EB0" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
84212
84249
  </svg>
@@ -84237,7 +84274,12 @@
84237
84274
  <path fill-rule="evenodd" clip-rule="evenodd" d="M7.29492 14.9898C6.88071 14.9898 6.54492 14.654 6.54492 14.2398V12.7003C6.54492 12.5898 6.45538 12.5003 6.34492 12.5003L4.77346 12.5003C4.35925 12.5003 4.02346 12.1645 4.02346 11.7503C4.02346 11.3361 4.35924 11.0003 4.77345 11.0003L6.79491 11.0003C7.48527 11.0003 8.04492 11.5599 8.04492 12.2503V14.2398C8.04492 14.654 7.70914 14.9898 7.29492 14.9898Z" fill="#969EB0"/>
84238
84275
  <path fill-rule="evenodd" clip-rule="evenodd" d="M12.7285 5.01044C13.1427 5.01044 13.4785 5.34622 13.4785 5.76044V7.29998C13.4785 7.41044 13.5681 7.49998 13.6785 7.49998L15.25 7.49997C15.6642 7.49997 16 7.83576 16 8.24997C16 8.66418 15.6642 8.99997 15.25 8.99997L13.2285 8.99999C12.5382 8.99999 11.9785 8.44035 11.9785 7.74999V5.76044C11.9785 5.34622 12.3143 5.01044 12.7285 5.01044Z" fill="#969EB0"/>
84239
84276
  </svg>
84240
- `
84277
+ `,
84278
+ saveChatState: `<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
84279
+ <path d="M2.375 12.875C2.375 15.1141 2.375 16.2337 3.07062 16.9294C3.76624 17.625 4.88583 17.625 7.125 17.625H11.875C14.1142 17.625 15.2337 17.625 15.9294 16.9294C16.625 16.2337 16.625 15.1141 16.625 12.875" stroke="#1C274C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
84280
+ <path d="M9.50001 3.375V13.6667M9.50001 13.6667L12.6667 10.2031M9.50001 13.6667L6.33334 10.2031" stroke="#1C274C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
84281
+ </svg>
84282
+ `
84241
84283
  };
84242
84284
  function getCloseChatIcon(textChatOptions) {
84243
84285
  return textChatOptions?.popup?.icons?.close?.svg || chatIcons.closeChat;
@@ -84248,6 +84290,9 @@
84248
84290
  function getCollapseChatIcon(textChatOptions) {
84249
84291
  return textChatOptions?.popup?.icons?.fullScreen?.svgCollapse || chatIcons.collapseChat;
84250
84292
  }
84293
+ function getSaveChatStateIcon(textChatOptions) {
84294
+ return textChatOptions?.popup?.icons?.saveChatState?.svg || chatIcons.saveChatState;
84295
+ }
84251
84296
  function getSendChatIcon(textChatOptions) {
84252
84297
  return textChatOptions?.popup?.icons?.send?.svg || chatIcons.send;
84253
84298
  }
@@ -84261,32 +84306,6 @@
84261
84306
  return textChatOptions?.popup?.icons?.mute?.svgOn || chatIcons.unmute;
84262
84307
  }
84263
84308
 
84264
- // alan_btn/src/state.ts
84265
- var uiState = {
84266
- lib: {
84267
- version: ""
84268
- },
84269
- project: {
84270
- id: null
84271
- },
84272
- btn: {
84273
- isTopAligned: false,
84274
- zIndex: void 0
84275
- },
84276
- textChat: {
84277
- available: false,
84278
- expanded: false,
84279
- inlined: false,
84280
- options: null,
84281
- loaderTimeoutMs: 3e4,
84282
- defaults: {
84283
- minChatWidth: 250,
84284
- appearAnimationMs: 200,
84285
- chatMargin: 25
84286
- }
84287
- }
84288
- };
84289
-
84290
84309
  // alan_btn/src/textChat/fullscreen.ts
84291
84310
  function openChatInFullScreen(chatHolderDiv) {
84292
84311
  chatHolderDiv.classList.add("alan-btn_text-chat-full-screen");
@@ -84314,7 +84333,7 @@
84314
84333
  sideChatHeader.appendChild(chatCollapseSideBarBtn);
84315
84334
  chatCloseSideBarBtn.addEventListener("click", options.closeTextChat);
84316
84335
  chatCollapseSideBarBtn.addEventListener("click", options.expandCollapseChatSidePanel);
84317
- newChatSideBarBtn.addEventListener("click", options.onClearChatClick);
84336
+ newChatSideBarBtn.addEventListener("click", options.clearTextChat);
84318
84337
  }
84319
84338
  }
84320
84339
 
@@ -84696,14 +84715,12 @@
84696
84715
  }
84697
84716
  return null;
84698
84717
  }
84699
- function fixTextChatSizeIfNeeded(width, height, doubleMargin) {
84700
- var defaultChatMargin = uiState.textChat.defaults.chatMargin;
84701
- const margin = doubleMargin ? 2 * defaultChatMargin : defaultChatMargin;
84702
- if (height !== null && window.innerHeight - defaultChatMargin < height) {
84703
- setChatHeight(window.innerHeight - margin);
84718
+ function fixTextChatSizeIfNeeded(width, height) {
84719
+ if (height !== null && window.innerHeight < height) {
84720
+ setChatHeight(window.innerHeight);
84704
84721
  }
84705
- if (width !== null && window.innerWidth - defaultChatMargin < width) {
84706
- setChatWidth(window.innerWidth - margin);
84722
+ if (width !== null && window.innerWidth < width) {
84723
+ setChatWidth(window.innerWidth);
84707
84724
  }
84708
84725
  }
84709
84726
 
@@ -84852,14 +84869,34 @@
84852
84869
  function getPaddingProp(top, right, bottom, left) {
84853
84870
  return `${top}px ${right}px ${bottom}px ${left}px;`;
84854
84871
  }
84855
-
84856
- // alan_btn/src/styles/chat.ts
84872
+ function getInnerBorderRadiusProp(br) {
84873
+ if (+br > 0) {
84874
+ return +br - 1;
84875
+ }
84876
+ return 0;
84877
+ }
84857
84878
  function getNumPropVal(val, defaultVal) {
84858
84879
  if (+val >= 0) {
84859
84880
  return val;
84860
84881
  }
84861
84882
  return defaultVal;
84862
84883
  }
84884
+ function svgToBase64(svg) {
84885
+ return btoa(unescape(encodeURIComponent(svg)));
84886
+ }
84887
+ function parseSvgSize(svgString) {
84888
+ if (!svgString)
84889
+ return [];
84890
+ const parser = new DOMParser();
84891
+ const svgDoc = parser.parseFromString(svgString, "image/svg+xml");
84892
+ const svgElement = svgDoc.querySelector("svg");
84893
+ const width = svgElement.getAttribute("width");
84894
+ const height = svgElement.getAttribute("height");
84895
+ const defaultSize = uiState.textChat.defaults.defaultSvgIconSize;
84896
+ return [width || defaultSize, height || defaultSize];
84897
+ }
84898
+
84899
+ // alan_btn/src/styles/chat.ts
84863
84900
  var flexMap = {
84864
84901
  left: "flex-start",
84865
84902
  right: "flex-end",
@@ -84871,11 +84908,11 @@
84871
84908
  const defaultMinChatHeight = 400;
84872
84909
  const defaultChatHeight = 700;
84873
84910
  const chatHeaderHeight = +textChatOptions?.header?.height || 40;
84874
- const chatTextareaLineHieght = 1.25;
84911
+ const chatTextareaLineHieght = uiState.textChat.defaults.textareaLineHeight;
84875
84912
  const textareaHolderHeight = +textChatOptions?.footer?.height || 67;
84876
84913
  const chatMicBtnActiveSize = 32;
84877
84914
  const textChatScrollSize = 6;
84878
- const defaultChatTextareaFontSize = 15;
84915
+ const defaultChatTextareaFontSize = uiState.textChat.defaults.textareaFontSize;
84879
84916
  const withSendBtnOutside = textChatOptions?.footer?.layout?.name === "send-btn-outside";
84880
84917
  const footerTopPadding = getNumPropVal(textChatOptions?.footer?.padding?.top, 2);
84881
84918
  const footerRightPadding = getNumPropVal(textChatOptions?.footer?.padding?.right, 18);
@@ -84901,6 +84938,7 @@
84901
84938
  const responseBubbleRightPadding = getNumPropVal(textChatOptions?.bubbles?.response?.padding?.right, 20);
84902
84939
  const responseBubbleBottomPadding = getNumPropVal(textChatOptions?.bubbles?.response?.padding?.bottom, 9);
84903
84940
  const responseBubbleLeftPadding = getNumPropVal(textChatOptions?.bubbles?.response?.padding?.left, 20);
84941
+ const waitingResponseBubbleLayout = textChatOptions?.bubbles?.waitingResponse?.layout || "default";
84904
84942
  const responseBubbleBorderRadiusTopLeft = getNumPropVal(textChatOptions?.bubbles?.response?.borderRadius?.topLeft, defaultBubbleBorderRadius);
84905
84943
  const responseBubbleBorderRadiusTopRight = getNumPropVal(textChatOptions?.bubbles?.response?.borderRadius?.topRight, defaultBubbleBorderRadius);
84906
84944
  const responseBubbleBorderRadiusBottomRight = getNumPropVal(textChatOptions?.bubbles?.response?.borderRadius?.bottomRight, defaultBubbleBorderRadius);
@@ -84930,7 +84968,7 @@
84930
84968
  const headerLayoutName = textChatOptions?.header?.layout?.name || "centered-title";
84931
84969
  let cssChatHeight = getTextChatSizeAfterResize("height");
84932
84970
  let cssChatWidth = getTextChatSizeAfterResize("width");
84933
- fixTextChatSizeIfNeeded(cssChatWidth, cssChatHeight, true);
84971
+ fixTextChatSizeIfNeeded(cssChatWidth, cssChatHeight);
84934
84972
  cssChatHeight = getTextChatSizeAfterResize("height");
84935
84973
  cssChatWidth = getTextChatSizeAfterResize("width");
84936
84974
  if (cssChatHeight) {
@@ -84952,6 +84990,7 @@
84952
84990
  const chatBgColor1 = textChatOptions?.popup?.backgroundColor || `#DAEBFF`;
84953
84991
  const chatBgColor2 = textChatOptions?.popup?.backgroundColor2 || `#ffffff`;
84954
84992
  const chatGradientType = textChatOptions?.popup?.gradientType || `linear`;
84993
+ const chatCustomBg = textChatOptions?.popup?.background?.customCss;
84955
84994
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-holder {
84956
84995
  position: fixed;
84957
84996
  height: ${cssChatHeight};
@@ -85150,7 +85189,10 @@
85150
85189
  if (chatGradientType === "radial") {
85151
85190
  chatBackgroud = `radial-gradient(circle, ${chatBgColor2} 0%, ${chatBgColor1} 100%)`;
85152
85191
  }
85153
- keyFrames += getStyleSheetMarker() + `.alan-btn__popup-chat {
85192
+ if (chatGradientType === "custom" && chatCustomBg) {
85193
+ chatBackgroud = chatCustomBg;
85194
+ }
85195
+ keyFrames += getStyleSheetMarker() + `.alan-btn__popup-chat, ${getStyleSheetMarker() + `.alan-btn__history-chat`} {
85154
85196
  height: 100%;
85155
85197
  position: relative;
85156
85198
  overflow: hidden;
@@ -85177,11 +85219,11 @@
85177
85219
  }`;
85178
85220
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-textarea-holder {
85179
85221
  width: 100%;
85180
- height: ${textareaHolderHeight}px;
85181
- max-height: ${textareaHolderHeight}px;
85182
85222
  min-height: ${textareaHolderHeight}px;
85183
- background-color: ${textChatOptions?.footer?.backgroundColor || "transparent"};
85223
+ background-color: ${textChatOptions?.footer?.backgroundColor || "#DAEBFF"};
85184
85224
  position: relative;
85225
+ display: flex;
85226
+ flex-shrink: 0;
85185
85227
  padding: ${getPaddingProp(footerTopPadding, footerRightPadding, footerBottomPadding, footerLeftPadding)};
85186
85228
  }`;
85187
85229
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-textarea-holder-outer-content {
@@ -85191,24 +85233,34 @@
85191
85233
  gap: 8px;
85192
85234
  position: relative;
85193
85235
  }`;
85236
+ const defaultTextareaBorderRadius = 20;
85237
+ const topRightBorderRadius = textChatOptions?.textarea?.borderRadius?.topRight || defaultTextareaBorderRadius;
85238
+ const bottomRightBorderRadius = textChatOptions?.textarea?.borderRadius?.bottomRight || defaultTextareaBorderRadius;
85239
+ const calculatedTextareaRightPadding = Math.max(Math.max(topRightBorderRadius, bottomRightBorderRadius), textareaRightPadding);
85194
85240
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-textarea-inner-holder {
85195
85241
  width: 100%;
85196
85242
  height: 100%;
85197
85243
  position: relative;
85244
+ display: flex;
85245
+ align-items: center;
85246
+ overflow: hidden;
85247
+ border-radius: ${textChatOptions?.textarea?.borderRadius?.topLeft || defaultTextareaBorderRadius}px ${topRightBorderRadius}px ${bottomRightBorderRadius}px ${textChatOptions?.textarea?.borderRadius?.bottomLeft || defaultTextareaBorderRadius}px;
85248
+ border: 1px solid ${textChatOptions?.textarea?.borderColor || textChatOptions?.textarea?.backgroundColor || `transparent`};
85249
+ box-shadow: ${textChatOptions?.textarea?.hasShadow === false ? "none" : `0px 1px 3px rgba(16, 39, 126, 0.2)`};
85250
+ background-color: ${textChatOptions?.textarea?.backgroundColor || `#ffffff`} ;
85251
+ padding: ${getPaddingProp(0, calculatedTextareaRightPadding, 0, 0)};
85198
85252
  }`;
85199
85253
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-messages-empty-block {
85200
85254
  flex: 1 1 auto;
85201
85255
  }`;
85202
85256
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-messages-wrapper {
85203
85257
  width: 100%;
85204
- height: calc(100% - ${chatHeaderHeight + textareaHolderHeight}px);
85205
- max-height: calc(100% - ${chatHeaderHeight + textareaHolderHeight}px);
85206
- min-height: calc(100% - ${chatHeaderHeight + textareaHolderHeight}px);
85258
+ height: 100%;
85207
85259
  overflow-y: scroll;
85208
85260
  overflow-x: hidden;
85209
85261
  padding: ${getPaddingProp(msgsTopPadding, msgsRightPadding, msgsBottomPadding, msgsLeftPadding)};
85210
85262
  display: flex;
85211
- flex-shrink: 0;
85263
+ flex-shrink: 1;
85212
85264
  flex-direction: column-reverse;
85213
85265
  }`;
85214
85266
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-messages {
@@ -85242,16 +85294,24 @@
85242
85294
  position:relative;
85243
85295
  }`;
85244
85296
  const headerFontSize = textChatOptions?.header?.fontSize || 16;
85297
+ const headerIconGap = getNumPropVal(textChatOptions?.header?.icon?.gap, 12);
85298
+ const headerAlignment = textChatOptions?.header?.alignment || "center";
85245
85299
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-header-title {
85246
85300
  max-width: calc(100% - 112px);
85247
85301
  overflow: hidden;
85248
85302
  text-overflow: ellipsis;
85249
85303
  white-space: nowrap;
85250
- display: inline-block;
85304
+ display: flex;
85305
+ align-items: ${headerAlignment};
85251
85306
  font-weight: 600;
85252
85307
  font-size: ${headerFontSize}px;
85253
- position: relative;
85254
- top: ${headerFontSize >= 20 ? "-2" : "0"}px;
85308
+ gap: ${headerIconGap}px;
85309
+ }`;
85310
+ keyFrames += getStyleSheetMarker() + `.alan-btn__chat-header-title-icon {
85311
+ display: flex;
85312
+ }`;
85313
+ keyFrames += getStyleSheetMarker() + `.alan-btn__chat-header-title-label {
85314
+ display: flex;
85255
85315
  }`;
85256
85316
  const withGradientForHeader = uiState.textChat.options?.header?.withBottomGradient !== false;
85257
85317
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-header-gradient {
@@ -85304,8 +85364,10 @@
85304
85364
  height: 100%;
85305
85365
  cursor: pointer;
85306
85366
  position: relative;
85307
- top:50%;
85308
- transform: translateY(-50%);
85367
+ }`;
85368
+ keyFrames += getStyleSheetMarker() + `.multi-line .alan-btn__chat-clear-btn {
85369
+ align-items: flex-end;
85370
+ padding-bottom: ${textareaBottomPadding}px;
85309
85371
  }`;
85310
85372
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-clear-btn.disabled {
85311
85373
  pointer-events: none;
@@ -85440,6 +85502,23 @@
85440
85502
  fill: ${textChatOptions?.popup?.icons?.close?.hover?.fill || `#97989c`};
85441
85503
  }`;
85442
85504
  }
85505
+ keyFrames += getStyleSheetMarker() + `.alan-btn__save-chat-state-btn {
85506
+ height: 100%;
85507
+ display: ${textChatOptions?.popup?.saveChatState?.enabled ? "flex" : `none`};
85508
+ align-items: center;
85509
+ cursor: pointer;
85510
+ pointer-events: all;
85511
+ }`;
85512
+ keyFrames += getStyleSheetMarker() + `.alan-btn__save-chat-state-btn-disabled {
85513
+ opacity: 0.5;
85514
+ pointer-events: none;
85515
+ }`;
85516
+ keyFrames += getStyleSheetMarker() + `.alan-btn__save-chat-state-btn svg path {
85517
+ stroke: ${textChatOptions?.popup?.icons?.saveChatState?.default?.fill || `#969EB0`};
85518
+ }`;
85519
+ keyFrames += getStyleSheetMarker() + `.alan-btn__save-chat-state-btn:hover svg path {
85520
+ stroke: ${textChatOptions?.popup?.icons?.saveChatState?.hover?.fill || `#0046ff`};
85521
+ }`;
85443
85522
  keyFrames += getStyleSheetMarker() + `.alan-btn__expand-collapse-chat-btn {
85444
85523
  height: 100%;
85445
85524
  display: ${textChatOptions?.popup?.fullScreenMode?.enabled ? "flex" : `none`};
@@ -85508,28 +85587,23 @@
85508
85587
  min-height:15px;
85509
85588
  width: 100%;
85510
85589
  position: absolute;
85511
- bottom: ${textareaHolderHeight}px;
85590
+ top: -15px;
85512
85591
  display: ${withGradientForFooter ? "block" : "none"};
85513
85592
  left:0;
85514
85593
  }`;
85515
- const defaultTextareaBorderRadius = 20;
85516
85594
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-textarea {
85517
85595
  width: 100%;
85518
- border-radius: ${textChatOptions?.textarea?.borderRadius?.topLeft || defaultTextareaBorderRadius}px ${textChatOptions?.textarea?.borderRadius?.topRight || defaultTextareaBorderRadius}px ${textChatOptions?.textarea?.borderRadius?.bottomRight || defaultTextareaBorderRadius}px ${textChatOptions?.textarea?.borderRadius?.bottomLeft || defaultTextareaBorderRadius}px;
85519
- border: 1px solid ${textChatOptions?.textarea?.borderColor || textChatOptions?.textarea?.backgroundColor || `transparent`};
85520
- box-shadow: ${textChatOptions?.textarea?.hasShadow === false ? "none" : `0px 1px 3px rgba(16, 39, 126, 0.2)`};
85521
- background-color: ${textChatOptions?.textarea?.backgroundColor || `#ffffff`} ;
85522
85596
  color: ${textChatOptions?.textarea?.color || `#171717`} ;
85523
85597
  overflow: hidden;
85524
85598
  outline: none;
85525
85599
  resize: none;
85600
+ background: transparent;
85601
+ border: none;
85526
85602
  -webkit-appearance: none;
85527
85603
  font-size: ${getTextAreaFontSize(isMobile(), textChatOptions?.textarea?.fontSize || defaultChatTextareaFontSize)}px;
85528
85604
  line-height: ${chatTextareaLineHieght};
85529
85605
  text-align: left;
85530
- max-height: 100%;
85531
- height: 100%;
85532
- padding: ${getPaddingProp(textareaTopPadding, textareaRightPadding, textareaBottomPadding, textareaLeftPadding)};
85606
+ padding: ${getPaddingProp(textareaTopPadding, 0, textareaBottomPadding, textareaLeftPadding)};
85533
85607
  margin: 0px!important;
85534
85608
  -webkit-user-select: text;
85535
85609
  -khtml-user-select: text;
@@ -85558,8 +85632,9 @@
85558
85632
  border-radius: 3px;
85559
85633
  background: transparent;
85560
85634
  }`;
85635
+ const micHolderWidth = 44;
85561
85636
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-holder.alan-text-chat__voice-enabled .alan-btn__chat-textarea {
85562
- padding-left: 44px;
85637
+ padding-left: ${micHolderWidth}px;
85563
85638
  }`;
85564
85639
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat.alan-btn__mic-active .alan-btn__chat-textarea {
85565
85640
  opacity: 0.6;
@@ -85633,11 +85708,11 @@
85633
85708
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-send-btn {
85634
85709
  ${!withSendBtnOutside && `
85635
85710
  position: absolute;
85636
- top: 50%;
85711
+ top: 0;
85637
85712
  right: 0px;
85638
- transform: translateY(-50%);
85713
+ width: 44px;
85639
85714
  `}
85640
-
85715
+ height: 100%;
85641
85716
  transition: opacity 300ms ease-in-out;
85642
85717
  display: flex;
85643
85718
  flex-direction: row;
@@ -85651,6 +85726,10 @@
85651
85726
  -ms-user-select: none; /* IE/Edge */
85652
85727
  user-select: none;
85653
85728
  }`;
85729
+ keyFrames += getStyleSheetMarker() + `.multi-line .alan-btn__chat-send-btn {
85730
+ align-items: flex-end;
85731
+ padding-bottom: ${textareaBottomPadding}px;
85732
+ }`;
85654
85733
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-send-btn svg path {
85655
85734
  stroke: ${textChatOptions?.textarea?.placeholderColor || `#747474`};
85656
85735
  opacity: 0.5;
@@ -85670,10 +85749,11 @@
85670
85749
  }
85671
85750
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-mic-btn {
85672
85751
  position: absolute;
85673
- left: 3px;
85674
- top:50%;
85675
- transform: translateY(-50%);
85676
- transform-origin: top;
85752
+ left: 0px;
85753
+ top:0;
85754
+ height: 100%;
85755
+ width: ${micHolderWidth}px;
85756
+ transform-origin: center;
85677
85757
  display: flex;
85678
85758
  flex-direction: row;
85679
85759
  cursor: pointer;
@@ -85681,6 +85761,16 @@
85681
85761
  align-items: center;
85682
85762
  border-radius: 50%;
85683
85763
  }`;
85764
+ keyFrames += getStyleSheetMarker() + `.multi-line .alan-btn__chat-mic-btn {
85765
+ align-items: flex-end;
85766
+ transform-origin: bottom;
85767
+ padding-bottom: ${textareaBottomPadding}px;
85768
+ }`;
85769
+ const micActiveBottomPadding = +textareaBottomPadding - 2 >= 0 ? +textareaBottomPadding - 2 : 0;
85770
+ keyFrames += getStyleSheetMarker() + `.multi-line .alan-btn__chat-mic-btn.active {
85771
+ align-items: flex-end;
85772
+ padding-bottom: ${micActiveBottomPadding}px;
85773
+ }`;
85684
85774
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-notifications-bubble {
85685
85775
  position: absolute;
85686
85776
  right: 4px;
@@ -85847,8 +85937,13 @@
85847
85937
  }`;
85848
85938
  const responseBubbleFontSize = +(textChatOptions?.bubbles?.response?.fontSize || 15);
85849
85939
  const responseBubbleFontColor = textChatOptions?.bubbles?.response?.color || `#171717`;
85940
+ const responseBubbleLabelIconGap = getNumPropVal(textChatOptions?.bubbles?.response?.label?.icon?.gap, 12);
85941
+ const responseBubbleLabelAlignment = textChatOptions?.bubbles?.response?.label?.alignment || "center";
85942
+ const responseLabelIcon = textChatOptions?.bubbles?.response?.label?.icon?.svg;
85850
85943
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-response-label {
85851
- display: ${responseBubbleLabelEnabled ? "block" : "none"};
85944
+ display: ${responseBubbleLabelEnabled ? "flex" : "none"};
85945
+ align-items:${responseBubbleLabelAlignment};
85946
+ gap: ${responseBubbleLabelIconGap}px;
85852
85947
  position: relative;
85853
85948
  color: ${responseBubbleLabelColor};
85854
85949
  font-size: ${responseBubbleLabelFontSize}px;
@@ -85862,6 +85957,19 @@
85862
85957
  -ms-user-select: text; /* IE/Edge */
85863
85958
  user-select: text;
85864
85959
  }`;
85960
+ const [responseLabelWidth, responseLabelHeight] = parseSvgSize(responseLabelIcon);
85961
+ keyFrames += getStyleSheetMarker() + `.alan-btn__chat-response-label-icon {
85962
+ display: ${responseLabelIcon ? "flex" : "none"};
85963
+ background-image: url('data:image/svg+xml;base64,${svgToBase64(responseLabelIcon)}');
85964
+ background-size: cover;
85965
+ ${responseLabelIcon ? `
85966
+ width: ${responseLabelWidth}px;
85967
+ height: ${responseLabelHeight}px;
85968
+ ` : ""}
85969
+ }`;
85970
+ keyFrames += getStyleSheetMarker() + `.alan-btn__chat-response-label-text {
85971
+ display: flex;
85972
+ }`;
85865
85973
  keyFrames += getStyleSheetMarker() + `.alan-btn_text-chat-full-screen .alan-btn__chat-response-label {
85866
85974
  text-align: left;
85867
85975
  padding-left: ${avatarSize + avatarRightMargin}px;
@@ -85890,6 +85998,11 @@
85890
85998
  -ms-user-select: text; /* IE/Edge */
85891
85999
  user-select: text;
85892
86000
  }`;
86001
+ keyFrames += getStyleSheetMarker() + `.alan-btn__chat-response.alan-incoming-msg {
86002
+ ${waitingResponseBubbleLayout === "loader-and-label-wo-bubble" ? `padding: ${getPaddingProp(responseBubbleTopPadding, 0, responseBubbleBottomPadding, 0)};
86003
+ background: none;
86004
+ border-color:transparent;` : ``}
86005
+ }`;
85893
86006
  keyFrames += getStyleSheetMarker() + `.alan-btn__chat-buttons {
85894
86007
  margin-bottom: 16px;
85895
86008
  display:flex;
@@ -86156,31 +86269,7 @@
86156
86269
  padding: 0px;
86157
86270
  margin-bottom:0;
86158
86271
  }`);
86159
- keyFrames += getStyleSheetMarker() + `.alan-btn__chat-incomming-msg-wrapper {
86160
- display: flex;
86161
- align-items: center;
86162
- }`;
86163
- keyFrames += getStyleSheetMarker() + `.alan-btn__chat-incomming-msg {
86164
- border-radius: 50%;
86165
- background-color: ${textChatOptions?.bubbles?.response?.color || `#080808`};
86166
- margin: 2px;
86167
- height: 6px;
86168
- width: 6px;
86169
- animation: alan-dot-bounce 1.5s infinite ease;
86170
- }`;
86171
- keyFrames += getStyleSheetMarker() + `.msg-2 {
86172
- animation-delay: .2s;
86173
- }`;
86174
- keyFrames += getStyleSheetMarker() + `.msg-3 {
86175
- animation-delay: .3s;
86176
- }`;
86177
- keyFrames += getStyleSheetMarker() + generateKeyFrame("alan-dot-bounce", `
86178
- 0%, 100% { opacity:1;}
86179
-
86180
- 60% {
86181
- transform: translateY(3px);
86182
- opacity:.0;
86183
- }`);
86272
+ keyFrames += getCssForResponseLoader(getStyleSheetMarker(), uiState.textChat.options);
86184
86273
  keyFrames += getStyleSheetMarker() + `.alan-btn_text-chat-full-screen .alan-btn__chat-popup {
86185
86274
  width: 100%;
86186
86275
  margin-left: 51px;
@@ -86318,102 +86407,86 @@
86318
86407
  const hasCopyBtn = textChatOptions?.bubbles?.response?.copyBtn;
86319
86408
  const commandsBlockIsVisible = hasLikeBtn || hasCopyBtn;
86320
86409
  keyFrames += styleSheetMarker + `.alan-btn__chat-response-commands-wrapper {
86321
- margin-top: 10px;
86322
86410
  display: ${commandsBlockIsVisible ? "block" : "none"};
86323
- ${commandsBlockIsVisible ? `
86324
- border-top: 1px solid #D2DAE5;
86325
-
86326
- ` : ""}
86411
+ line-height: 0;
86412
+ }`;
86413
+ keyFrames += styleSheetMarker + `.alan-btn__chat-response-commands-wrapper-hidden {
86414
+ display: none;
86327
86415
  }`;
86328
86416
  keyFrames += styleSheetMarker + `.alan-btn__chat-response-commands-wrapper-content {
86329
86417
  ${commandsBlockIsVisible ? `
86330
86418
  position:relative;
86331
- margin-top: 10px;
86419
+ margin-top: 4px;
86332
86420
  display: inline-flex;
86421
+ gap: 2px;
86333
86422
 
86334
86423
  ` : ""}
86335
86424
  }`;
86336
- keyFrames += styleSheetMarker + `.alan-btn__chat-response-commands-wrapper-content:before {
86337
-
86338
- ${commandsBlockIsVisible ? `
86339
- content: '';
86340
- position: absolute;
86341
- border-radius: 6px;
86342
- border: 1px solid #D2DAE5;
86343
- display: block;
86344
- width: 100%;
86345
- height: 100%;
86346
- top: -1px;
86347
- left: -1px;
86348
- pointer-events: none;
86349
-
86350
- ` : ""}
86351
- }`;
86425
+ var copyBtnWidth = 20;
86426
+ var copyBtnHeight = 24;
86427
+ var likeDislikeBtnWidth = 18;
86428
+ var likeDislikeBtnHeight = 24;
86352
86429
  keyFrames += styleSheetMarker + `.alan-btn__chat-response__like-btn {
86353
- opacity: 0.5;
86354
86430
  display: ${textChatOptions?.bubbles?.response?.likeBtn ? "flex" : `none`};
86355
86431
  ${textChatOptions?.bubbles?.response?.likeBtn ? `
86356
- padding: 4px;
86357
86432
  align-items: center;
86358
86433
  border-radius: 5px;
86359
86434
  cursor: pointer;
86360
- width:28px;
86361
- min-width:28px;
86362
- height:32px;
86363
- min-height:32px;
86435
+ width:${likeDislikeBtnWidth}px;
86436
+ min-width:${likeDislikeBtnWidth}px;
86437
+ height:${likeDislikeBtnHeight}px;
86438
+ min-height:${likeDislikeBtnHeight}px;
86364
86439
  ` : ``};
86365
86440
 
86366
86441
  }`;
86367
86442
  keyFrames += styleSheetMarker + `.alan-btn__chat-response__dislike-btn {
86368
- opacity: 0.5;
86369
86443
  display: ${textChatOptions?.bubbles?.response?.likeBtn ? "flex" : `none`};
86370
86444
  ${textChatOptions?.bubbles?.response?.likeBtn ? `
86371
- padding: 4px;
86372
86445
  align-items: center;
86373
86446
  border-radius: 5px;
86374
86447
  cursor: pointer;
86375
- width:28px;
86376
- min-width:28px;
86377
- height:32px;
86378
- min-height:32px;
86448
+ width:${likeDislikeBtnWidth}px;
86449
+ min-width:${likeDislikeBtnWidth}px;
86450
+ height:${likeDislikeBtnHeight}px;
86451
+ min-height:${likeDislikeBtnHeight}px;
86379
86452
  ` : ``};
86380
86453
  }`;
86381
86454
  keyFrames += styleSheetMarker + `.alan-btn__chat-response__copy-btn {
86382
- opacity: 0.5;
86383
86455
  display: ${textChatOptions?.bubbles?.response?.copyBtn ? "inline-flex" : `none`};
86384
86456
  ${textChatOptions?.bubbles?.response?.copyBtn ? `
86385
- padding: 4px;
86386
86457
  align-items: center;
86387
86458
  border-radius: 5px;
86388
86459
  cursor: pointer;
86389
- width:28px;
86390
- min-width:28px;
86391
- height:32px;
86392
- min-height:32px;
86460
+ width:${copyBtnWidth}px;
86461
+ min-width:${copyBtnWidth}px;
86462
+ height:${copyBtnHeight}px;
86463
+ min-height:${copyBtnHeight}px;
86393
86464
  ` : ``};
86394
86465
  }`;
86466
+ const bottomBtnsBgColor = textChatOptions?.bubbles?.response?.bottomBtns?.backgroundColor?.hover || `#dcddde`;
86467
+ const bottomBtnsColor = textChatOptions?.bubbles?.response?.bottomBtns?.color || "#17171780";
86395
86468
  if (!isMobile()) {
86396
86469
  keyFrames += styleSheetMarker + `.alan-btn__chat-response__copy-btn:hover {
86397
- background-color:#D2DAE5!important;
86470
+ background-color:${bottomBtnsBgColor}!important;
86398
86471
  }`;
86399
86472
  keyFrames += styleSheetMarker + `.alan-btn__chat-response__like-btn:hover {
86400
- background-color:#D2DAE5!important;
86473
+ background-color:${bottomBtnsBgColor}!important;
86401
86474
  }`;
86402
86475
  keyFrames += styleSheetMarker + `.alan-btn__chat-response__dislike-btn:hover {
86403
- background-color:#D2DAE5!important;
86476
+ background-color:${bottomBtnsBgColor}!important;
86404
86477
  }`;
86405
86478
  }
86406
86479
  keyFrames += styleSheetMarker + `.alan-btn__chat-response__copy-btn svg {
86407
86480
  width: 20px;
86408
86481
  }`;
86409
86482
  keyFrames += styleSheetMarker + `.alan-btn__chat-response__copy-btn svg path {
86410
- fill: ${responseBubbleFontColor};
86483
+ fill: ${bottomBtnsColor};
86411
86484
  }`;
86412
86485
  keyFrames += styleSheetMarker + `.alan-btn__chat-response__like-btn svg path {
86413
- fill: ${responseBubbleFontColor};
86486
+ fill: ${bottomBtnsColor};
86414
86487
  }`;
86415
86488
  keyFrames += styleSheetMarker + `.alan-btn__chat-response__dislike-btn svg path {
86416
- fill: ${responseBubbleFontColor};
86489
+ fill: ${bottomBtnsColor};
86417
86490
  }`;
86418
86491
  keyFrames += styleSheetMarker + `.alan-btn__chat-response__copy-btn alan-btn__copy-icon {
86419
86492
  width: 22px;
@@ -86428,13 +86501,118 @@
86428
86501
  display: inline-block;
86429
86502
  }`;
86430
86503
  keyFrames += styleSheetMarker + `.alan-btn__chat-response__copy-btn.alan-copy-btn-copied .alan-btn__copied-icon {
86431
- stroke: ${responseBubbleFontColor};
86504
+ stroke: ${bottomBtnsColor};
86505
+ }`;
86506
+ keyFrames += styleSheetMarker + `.alan-btn__chat-response__code-wrapper {
86507
+ position: relative;
86508
+ }`;
86509
+ keyFrames += styleSheetMarker + `.alan-btn__chat-response__code-wrapper:hover .alan-btn__chat-response__copy-code-btn {
86510
+ display: flex;
86511
+ align-items: center;
86512
+ justify-content: center;
86513
+ }`;
86514
+ keyFrames += styleSheetMarker + `.alan-btn__chat-response__copy-code-btn {
86515
+ position: absolute;
86516
+ top: 2px;
86517
+ right: 2px;
86518
+ width:${copyBtnWidth}px;
86519
+ min-width:${copyBtnWidth}px;
86520
+ height:${copyBtnHeight}px;
86521
+ min-height:${copyBtnHeight}px;
86522
+ border-radius: 2px;
86523
+ cursor: pointer;
86524
+ display: none;
86525
+ }`;
86526
+ keyFrames += styleSheetMarker + `.alan-btn__chat-response__copy-code-btn .alan-btn__copied-icon {
86527
+ display: none;
86528
+ }`;
86529
+ keyFrames += styleSheetMarker + `.alan-btn__chat-response__copy-code-btn.alan-copy-btn-copied .alan-btn__copy-icon {
86530
+ display: none;
86531
+ }`;
86532
+ keyFrames += styleSheetMarker + `.alan-btn__chat-response__copy-code-btn.alan-copy-btn-copied .alan-btn__copied-icon {
86533
+ display: inline-block;
86534
+ }`;
86535
+ keyFrames += styleSheetMarker + `.alan-btn__chat-response__copy-code-btn svg path {
86536
+ fill: ${bottomBtnsColor};
86537
+ }`;
86538
+ keyFrames += styleSheetMarker + `.alan-btn__chat-response__copy-code-btn.alan-copy-btn-copied .alan-btn__copied-icon {
86539
+ stroke: ${bottomBtnsColor};
86432
86540
  }`;
86541
+ keyFrames += styleSheetMarker + `.alan-btn__chat-response__copy-code-btn svg {
86542
+ width:20px;
86543
+ }`;
86544
+ if (!isMobile()) {
86545
+ keyFrames += styleSheetMarker + `.alan-btn__chat-response__copy-code-btn:hover {
86546
+ background-color:${bottomBtnsBgColor}!important;
86547
+ }`;
86548
+ }
86549
+ return keyFrames;
86550
+ }
86551
+ function getCssForResponseLoader(styleSheetMarker, textChatOptions) {
86552
+ let keyFrames = "";
86553
+ const waitingResponseBubbleLayout = textChatOptions?.bubbles?.waitingResponse?.layout || "default";
86554
+ const waitingResponseBubbleLabelIconAlignment = textChatOptions?.bubbles?.waitingResponse?.alignment || "center";
86555
+ const waitingResponseBubbleLoaderIcon = textChatOptions?.bubbles?.waitingResponse?.icon?.svg;
86556
+ const waitingResponseBubbleLoaderIconGap = getNumPropVal(textChatOptions?.bubbles?.waitingResponse?.icon?.gap, 8);
86557
+ const [responseLabelWidth, responseLabelHeight] = parseSvgSize(waitingResponseBubbleLoaderIcon);
86558
+ keyFrames += styleSheetMarker + `.alan-btn__chat-incomming-msg-wrapper {
86559
+ display: flex;
86560
+ ${waitingResponseBubbleLayout !== "default" ? `
86561
+ align-items: ${waitingResponseBubbleLabelIconAlignment};
86562
+ gap: ${waitingResponseBubbleLoaderIconGap}px;
86563
+ ` : ``}
86564
+ }`;
86565
+ keyFrames += styleSheetMarker + `.alan-btn__chat-incomming-msg-loader-icon {
86566
+ display: ${waitingResponseBubbleLoaderIcon ? "flex" : "none"};
86567
+ background-image: url('data:image/svg+xml;base64,${svgToBase64(waitingResponseBubbleLoaderIcon)}');
86568
+ background-size: cover;
86569
+ ${waitingResponseBubbleLoaderIcon ? `
86570
+ width: ${responseLabelWidth}px;
86571
+ height: ${responseLabelHeight}px;
86572
+ ` : ""}
86573
+ }`;
86574
+ keyFrames += styleSheetMarker + `.alan-btn__chat-incomming-msg-loader-label {
86575
+ display: inline-block;
86576
+ }`;
86577
+ keyFrames += styleSheetMarker + `.alan-btn__chat-incomming-msg {
86578
+ border-radius: 50%;
86579
+ background-color: ${textChatOptions?.bubbles?.response?.color || `#080808`};
86580
+ margin: 2px;
86581
+ height: 6px;
86582
+ width: 6px;
86583
+ animation: alan-dot-bounce 1.5s infinite ease;
86584
+ }`;
86585
+ keyFrames += styleSheetMarker + `.msg-2 {
86586
+ animation-delay: .2s;
86587
+ }`;
86588
+ keyFrames += styleSheetMarker + `.msg-3 {
86589
+ animation-delay: .3s;
86590
+ }`;
86591
+ keyFrames += styleSheetMarker + generateKeyFrame("alan-dot-bounce", `
86592
+ 0%, 100% { opacity:1;}
86593
+
86594
+ 60% {
86595
+ transform: translateY(3px);
86596
+ opacity:.0;
86597
+ }`);
86433
86598
  return keyFrames;
86434
86599
  }
86435
86600
  function getCssForTextChatLinks(styleSheetMarker, textChatOptions) {
86436
86601
  let result = "";
86437
86602
  const responseBubbleFontSize = +(textChatOptions?.bubbles?.response?.fontSize || 15);
86603
+ const learnMoreLinkBorderColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.default?.borderColor || `#EAF2FC`;
86604
+ const learnMoreLinkHoverBorderColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.hover?.borderColor || `#EAF2FC`;
86605
+ const learnMoreLinkActiveBorderColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.active?.borderColor || `#EAF2FC`;
86606
+ const learnMoreLinkBackgroundColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.default?.backgroundColor || `transparent`;
86607
+ const learnMoreLinkHoverBackgroundColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.hover?.backgroundColor || `#EAF2FC`;
86608
+ const learnMoreLinkActiveBackgroundColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.active?.backgroundColor || `#EAF2FC`;
86609
+ const learnMoreLinkNumberBackgroundColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.default?.linkNumberBackgroundColor || `#EAF2FC`;
86610
+ const learnMoreLinkNumberHoverBackgroundColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.hover?.linkNumberBackgroundColor || `#EAF2FC`;
86611
+ const learnMoreLinkNumberActiveBackgroundColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.active?.linkNumberBackgroundColor || `#EAF2FC`;
86612
+ const learnMoreTopLeftBorderRadius = getNumPropVal(uiState.textChat.options?.bubbles?.response?.learnMore?.links?.borderRadius?.topLeft, 4);
86613
+ const learnMoreTopRightBorderRadius = getNumPropVal(uiState.textChat.options?.bubbles?.response?.learnMore?.links?.borderRadius?.topRight, 4);
86614
+ const learnMoreBottomRightBorderRadius = getNumPropVal(uiState.textChat.options?.bubbles?.response?.learnMore?.links?.borderRadius?.bottomRight, 4);
86615
+ const learnMoreBottomLeftBorderRadius = getNumPropVal(uiState.textChat.options?.bubbles?.response?.learnMore?.links?.borderRadius?.bottomLeft, 4);
86438
86616
  result += styleSheetMarker + `.alan-btn__chat-response-links-wrapper {
86439
86617
  display: flex;
86440
86618
  flex-wrap: wrap;
@@ -86445,32 +86623,46 @@
86445
86623
  margin-top: 10px;
86446
86624
  }`;
86447
86625
  result += styleSheetMarker + `.alan-btn__chat-response-link {
86448
- border: 1px solid #EAF2FC;
86449
- border-radius: 4px;
86626
+ border: 1px solid ${learnMoreLinkBorderColor};
86627
+ border-radius: ${learnMoreTopLeftBorderRadius}px ${learnMoreTopRightBorderRadius}px ${learnMoreBottomRightBorderRadius}px ${learnMoreBottomLeftBorderRadius}px;
86628
+ background-color: ${learnMoreLinkBackgroundColor};
86450
86629
  margin-right: 10px;
86451
86630
  margin-bottom: 4px;
86452
86631
  display: flex;
86453
86632
  align-items: center;
86454
86633
  max-width: 100%;
86455
- font-size: ${responseBubbleFontSize - 2}px;
86456
86634
  }`;
86457
86635
  if (!isMobile()) {
86458
86636
  result += styleSheetMarker + `.alan-btn__chat-response-links-wrapper a.alan-btn__chat-response-link:hover {
86459
86637
  text-decoration: none !important;
86460
- background-color: #EAF2FC;
86638
+ background-color: ${learnMoreLinkHoverBackgroundColor};
86639
+ border-color: ${learnMoreLinkHoverBorderColor};
86640
+ }`;
86641
+ result += styleSheetMarker + `.alan-btn__chat-response-links-wrapper a.alan-btn__chat-response-link:active {
86642
+ text-decoration: none !important;
86643
+ background-color: ${learnMoreLinkActiveBackgroundColor};
86644
+ border-color: ${learnMoreLinkActiveBorderColor};
86461
86645
  }`;
86462
86646
  }
86463
86647
  result += styleSheetMarker + `.alan-btn__chat-response-link-icon-wrapper {
86464
86648
  padding: 9px 4px;
86465
- background-color: #EAF2FC;
86466
- border-radius: 3px;
86649
+ background-color: ${learnMoreLinkNumberBackgroundColor};
86650
+ border-radius: ${getInnerBorderRadiusProp(learnMoreTopLeftBorderRadius)}px ${getInnerBorderRadiusProp(learnMoreTopRightBorderRadius)}px ${getInnerBorderRadiusProp(learnMoreBottomRightBorderRadius)}px ${getInnerBorderRadiusProp(learnMoreBottomLeftBorderRadius)}px;
86467
86651
  display: inline-block;
86468
- min-width: 26px;
86652
+ min-width: 28px;
86469
86653
  height: 100%;
86470
86654
  display: flex;
86471
86655
  justify-content: center;
86472
86656
  align-items: center;
86473
86657
  }`;
86658
+ if (!isMobile()) {
86659
+ result += styleSheetMarker + `.alan-btn__chat-response-link:hover .alan-btn__chat-response-link-icon-wrapper {
86660
+ background-color: ${learnMoreLinkNumberHoverBackgroundColor};
86661
+ }`;
86662
+ result += styleSheetMarker + `.alan-btn__chat-response-link:active .alan-btn__chat-response-link-icon-wrapper {
86663
+ background-color: ${learnMoreLinkNumberActiveBackgroundColor};
86664
+ }`;
86665
+ }
86474
86666
  const linkColor = uiState.textChat.options?.bubbles?.response?.links?.color?.default || `#4183c4`;
86475
86667
  const linkHoverColor = uiState.textChat.options?.bubbles?.response?.links?.color?.hover || `#4183c4`;
86476
86668
  result += styleSheetMarker + `.alan-btn__chat-response-link svg path {
@@ -86581,17 +86773,18 @@
86581
86773
  hasFooterLinks = !!tempNode.querySelector(".footnotes");
86582
86774
  tempNode.remove();
86583
86775
  }
86584
- for (let i = 0; i < msg.links?.length; i++) {
86585
- const curLink = msg.links[i];
86776
+ const links = msg.links?.filter((link) => isValidUrl(link?.href));
86777
+ for (let i = 0; i < links?.length; i++) {
86778
+ const curLink = links[i];
86586
86779
  const target = getLinkTarget(curLink);
86587
86780
  linksHtml += `<a class="alan-btn__chat-response-link" href="${curLink.href}" target="${target}">
86588
86781
  <span class="alan-btn__chat-response-link-icon-wrapper">${getLinkIcon(curLink)}</span>
86589
86782
  <span class="alan-btn__chat-response-link-title">${curLink.title || curLink.href}</span>
86590
86783
  </a>`;
86591
86784
  }
86592
- if (msg.links?.length) {
86785
+ if (links?.length) {
86593
86786
  linksBlock = `<div class="alan-btn__chat-response-links-wrapper ${(msg.text || msg.images?.length > 0) && !hasFooterLinks ? "with-content-on-top" : ""}">
86594
- ${!hasFooterLinks ? `<span style="margin-right: 10px;display: inline-block;font-weight: 500;">${LEARN_MORE_LABEL} </span>` : ""}
86787
+ ${!hasFooterLinks ? `<span style="margin-right: 10px;display: inline-block;font-weight: 600;">${LEARN_MORE_LABEL} </span>` : ""}
86595
86788
  ${linksHtml}
86596
86789
  </div>`;
86597
86790
  }
@@ -86604,17 +86797,41 @@
86604
86797
  return "_blank";
86605
86798
  }
86606
86799
  }
86800
+ function isValidUrl(url) {
86801
+ try {
86802
+ const parsedUrl = new URL(url);
86803
+ const hasValidProtocol = parsedUrl.protocol === "http:" || parsedUrl.protocol === "https:";
86804
+ const hasValidHostname = parsedUrl.hostname.length > 0;
86805
+ return hasValidProtocol && hasValidHostname;
86806
+ } catch (e) {
86807
+ return false;
86808
+ }
86809
+ }
86607
86810
 
86608
86811
  // alan_btn/src/styles/markdown.ts
86609
86812
  function generateCssForMarkdown(stylesheetMarker, classPrefix) {
86610
86813
  let keyFrames = "";
86814
+ const tableBorderColor = uiState.textChat.options?.bubbles?.response?.table?.borderColor || `#b7b5b5`;
86611
86815
  const responseBubbleFontSize = +(uiState.textChat.options?.bubbles?.response?.fontSize || 15);
86612
86816
  const responseBubbleBg = uiState.textChat.options?.bubbles?.response?.backgroundColor || `#ffffff`;
86613
86817
  const responseBubbleFontColor = uiState.textChat.options?.bubbles?.response?.color || `#171717`;
86614
86818
  const responseBubbleCodeBackgroundColor = uiState.textChat.options?.bubbles?.response?.codeBackgroundColor || `#f8f8f8`;
86819
+ const responseBubbleCodeBorderColor = uiState.textChat.options?.bubbles?.response?.codeBorderColor || `#DDD`;
86615
86820
  const linkColor = uiState.textChat.options?.bubbles?.response?.links?.color?.default || `#4183c4`;
86616
86821
  const linkHoverColor = uiState.textChat.options?.bubbles?.response?.links?.color?.hover || `#4183c4`;
86617
- const footerLinkBgColor = "#EAF2FC";
86822
+ const learnMoreLinkBorderColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.default?.borderColor || `#EAF2FC`;
86823
+ const learnMoreLinkHoverBorderColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.hover?.borderColor || `#EAF2FC`;
86824
+ const learnMoreLinkActiveBorderColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.active?.borderColor || `#EAF2FC`;
86825
+ const learnMoreLinkBackgroundColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.default?.backgroundColor || `transparent`;
86826
+ const learnMoreLinkHoverBackgroundColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.hover?.backgroundColor || `#EAF2FC`;
86827
+ const learnMoreLinkActiveBackgroundColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.active?.backgroundColor || `#EAF2FC`;
86828
+ const learnMoreLinkNumberBackgroundColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.default?.linkNumberBackgroundColor || `#EAF2FC`;
86829
+ const learnMoreLinkNumberHoverBackgroundColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.hover?.linkNumberBackgroundColor || `#EAF2FC`;
86830
+ const learnMoreLinkNumberActiveBackgroundColor = uiState.textChat.options?.bubbles?.response?.learnMore?.links?.active?.linkNumberBackgroundColor || `#EAF2FC`;
86831
+ const learnMoreTopLeftBorderRadius = getNumPropVal(uiState.textChat.options?.bubbles?.response?.learnMore?.links?.borderRadius?.topLeft, 4);
86832
+ const learnMoreTopRightBorderRadius = getNumPropVal(uiState.textChat.options?.bubbles?.response?.learnMore?.links?.borderRadius?.topRight, 4);
86833
+ const learnMoreBottomRightBorderRadius = getNumPropVal(uiState.textChat.options?.bubbles?.response?.learnMore?.links?.borderRadius?.bottomRight, 4);
86834
+ const learnMoreBottomLeftBorderRadius = getNumPropVal(uiState.textChat.options?.bubbles?.response?.learnMore?.links?.borderRadius?.bottomLeft, 4);
86618
86835
  const cssRules = [
86619
86836
  `a {
86620
86837
  color: ${linkColor}!important;
@@ -86753,7 +86970,7 @@
86753
86970
  `code {
86754
86971
  background-color: ${responseBubbleCodeBackgroundColor}!important;
86755
86972
  border-radius: 3px!important;
86756
- border: 1px solid #DDD!important;
86973
+ border: 1px solid ${responseBubbleCodeBorderColor}!important;
86757
86974
  font-family: Consolas, "Liberation Mono", Courier, monospace!important;
86758
86975
  margin: 0 2px!important;
86759
86976
  padding: 0 5px!important;
@@ -86767,7 +86984,7 @@
86767
86984
  `pre {
86768
86985
  background-color: ${responseBubbleCodeBackgroundColor}!important;
86769
86986
  border-radius: 3px!important;
86770
- border: 1px solid #DDD!important;
86987
+ border: 1px solid ${responseBubbleCodeBorderColor}!important;
86771
86988
  font-family: Consolas, "Liberation Mono", Courier, monospace!important;
86772
86989
  padding: 10px!important;
86773
86990
  white-space: pre-line!important;
@@ -86807,19 +87024,19 @@
86807
87024
  }`,
86808
87025
  `table > thead > tr > th {
86809
87026
  padding: 4px!important;
86810
- border-top: 1px solid #b7b5b5!important;
87027
+ border-top: 1px solid ${tableBorderColor}!important;
86811
87028
  }`,
86812
87029
  `table > tbody > tr > th {
86813
87030
  padding: 4px!important;
86814
- border-top: 1px solid #b7b5b5!important;
87031
+ border-top: 1px solid ${tableBorderColor}!important;
86815
87032
  }`,
86816
87033
  `table > thead > tr > td {
86817
87034
  padding: 4px!important;
86818
- border-top: 1px solid #b7b5b5!important;
87035
+ border-top: 1px solid ${tableBorderColor}!important;
86819
87036
  }`,
86820
87037
  `table > tbody > tr > td {
86821
87038
  padding: 4px;
86822
- border-top: 1px solid #b7b5b5!important;
87039
+ border-top: 1px solid ${tableBorderColor}!important;
86823
87040
  }`,
86824
87041
  `strong {
86825
87042
  font-weight: bold!important;
@@ -86828,11 +87045,18 @@
86828
87045
  font-style: italic!important;
86829
87046
  }`,
86830
87047
  `sup.footnote-ref{
86831
- background: ${footerLinkBgColor};
87048
+ background: ${learnMoreLinkNumberBackgroundColor};
86832
87049
  padding: 1px;
86833
87050
  border-radius: 4px;
86834
87051
  position: relative;
86835
87052
  top: -5px;
87053
+ font-size: ${responseBubbleFontSize}px!important;
87054
+ }`,
87055
+ `sup.footnote-ref:hover{
87056
+ background: ${learnMoreLinkNumberHoverBackgroundColor};
87057
+ }`,
87058
+ `sup.footnote-ref:active{
87059
+ background: ${learnMoreLinkNumberActiveBackgroundColor};
86836
87060
  }`,
86837
87061
  `.footnotes{
86838
87062
  padding-top: 10px;
@@ -86844,18 +87068,29 @@
86844
87068
  }`,
86845
87069
  `.footnotes-list:before {
86846
87070
  content: '${LEARN_MORE_LABEL}';
86847
- font-weight: 500;
87071
+ font-weight: 600;
86848
87072
  }`,
86849
87073
  `.footnote-item {
86850
87074
  position: relative;
86851
- display: inline-block;
86852
- border-radius: 4px;
87075
+ display: inline-flex;
87076
+ align-items: center;
87077
+ max-width: 100%;
87078
+ border-radius: ${learnMoreTopLeftBorderRadius}px ${learnMoreTopRightBorderRadius}px ${learnMoreBottomRightBorderRadius}px ${learnMoreBottomLeftBorderRadius}px;
86853
87079
  cursor: pointer;
86854
- border: 1px solid ${footerLinkBgColor};
87080
+ border: 1px solid ${learnMoreLinkBorderColor};
86855
87081
  margin-bottom:4px;
87082
+ background-color: ${learnMoreLinkBackgroundColor};
87083
+ }`,
87084
+ `.footnote-item .footnote-backref {
87085
+ display: none;
86856
87086
  }`,
86857
87087
  `.footnote-item:hover {
86858
- background-color: ${footerLinkBgColor};
87088
+ border: 1px solid ${learnMoreLinkHoverBorderColor};
87089
+ background-color: ${learnMoreLinkHoverBackgroundColor};
87090
+ }`,
87091
+ `.footnote-item:active {
87092
+ border: 1px solid ${learnMoreLinkActiveBorderColor};
87093
+ background-color: ${learnMoreLinkActiveBackgroundColor};
86859
87094
  }`,
86860
87095
  `.footnote-item p {
86861
87096
  margin-top: 0;
@@ -86863,6 +87098,10 @@
86863
87098
  padding-right: 6px;
86864
87099
  padding-left: 6px;
86865
87100
  display: inline-block;
87101
+ overflow: hidden;
87102
+ text-overflow: ellipsis;
87103
+ white-space: nowrap;
87104
+ color: ${linkColor}!important;
86866
87105
  }`,
86867
87106
  `.footnote-item:hover p a {
86868
87107
  text-decoration: none!important;
@@ -86872,17 +87111,23 @@
86872
87111
  counter-increment: list-counter;
86873
87112
  content: counter(list-counter);
86874
87113
  padding: 4px 4px;
86875
- background-color: ${footerLinkBgColor};
86876
- border-radius: 3px;
87114
+ background-color: ${learnMoreLinkNumberBackgroundColor};
87115
+ border-radius: ${getInnerBorderRadiusProp(learnMoreTopLeftBorderRadius)}px ${getInnerBorderRadiusProp(learnMoreTopRightBorderRadius)}px ${getInnerBorderRadiusProp(learnMoreBottomRightBorderRadius)}px ${getInnerBorderRadiusProp(learnMoreBottomLeftBorderRadius)}px;
87116
+ box-sizing: border-box;
86877
87117
  display: inline-block;
86878
- min-width: 18px;
87118
+ min-width: 28px;
86879
87119
  text-align: center;
86880
87120
  color: ${linkColor}!important;
86881
87121
  }`,
86882
87122
  `.footnotes-list>.footnote-item:hover::before {
86883
87123
  color: ${linkHoverColor}!important;
87124
+ background-color: ${learnMoreLinkNumberHoverBackgroundColor};
87125
+ }`,
87126
+ `.footnotes-list>.footnote-item:active::before {
87127
+ color: ${linkHoverColor}!important;
87128
+ background-color: ${learnMoreLinkNumberActiveBackgroundColor};
86884
87129
  }`,
86885
- `.footnotes-sep{
87130
+ `.footnotes-sep {
86886
87131
  display: none!important;
86887
87132
  }`,
86888
87133
  `.scroll-table {
@@ -86964,7 +87209,7 @@
86964
87209
  keyFrames += getStyleSheetMarker() + ".alan-overlay-popup:hover .alan-overlay-popup__ok{opacity:1;transition:opacity 300ms ease-in-out;}";
86965
87210
  keyFrames += getStyleSheetMarker() + generateKeyFrame("alan-gradient", "0%{backgroundPosition: 0 0;}50%{backgroundPosition: -100% 0;}100%{backgroundPosition: 0 0;}");
86966
87211
  keyFrames += getStyleSheetMarker() + generateKeyFrame("alan-pulsating", "0%{transform: scale(1.11111);}50%{transform: scale(1.0);}100%{transform: scale(1.11111);}");
86967
- keyFrames += getStyleSheetMarker() + generateKeyFrame("alan-text-chat-pulsating", "0%{transform: scale(1) translateY(-50%);}50%{transform: scale(0.91) translateY(-50%);}100%{transform: scale(1) translateY(-50%);}");
87212
+ keyFrames += getStyleSheetMarker() + generateKeyFrame("alan-text-chat-pulsating", "0%{transform: scale(1)} 50%{transform: scale(0.91);} 100%{transform: scale(1) }");
86968
87213
  keyFrames += getStyleSheetMarker() + generateKeyFrame("alan-mic-pulsating", "0%{transform: scale(0.91);}50%{transform: scale(1.0);}100%{transform: scale(0.91);}");
86969
87214
  keyFrames += getStyleSheetMarker() + generateKeyFrame("alan-triangle-mic-pulsating", "0%{transform: scale(0.94);}50%{transform: scale(1.0);}100%{transform: scale(0.94);}");
86970
87215
  keyFrames += getStyleSheetMarker() + generateKeyFrame("alan-fade-in", "0%{opacity: 0;}100%{opacity:1;}");
@@ -87123,14 +87368,41 @@
87123
87368
 
87124
87369
  // alan_btn/src/textChat/highlightJs.ts
87125
87370
  window.hljs = es_default;
87126
- var hljsWasInit = false;
87127
- function initHighlightJs() {
87128
- if (hljsWasInit)
87371
+ if (window.hljs) {
87372
+ window.hljs.addPlugin({
87373
+ "after:highlightElement": ({ el, text }) => {
87374
+ const wrapper = el.parentElement;
87375
+ if (wrapper == null) {
87376
+ return;
87377
+ }
87378
+ wrapper.classList.add("alan-btn__chat-response__code-wrapper");
87379
+ const copyButton = document.createElement("span");
87380
+ copyButton.classList.add(
87381
+ "alan-btn__chat-response__copy-code-btn"
87382
+ );
87383
+ copyButton.innerHTML = chatIcons.copy + chatIcons.copied;
87384
+ copyButton.onclick = () => {
87385
+ copyTextToBuffer(text);
87386
+ copyButton.classList.add("alan-copy-btn-copied");
87387
+ setTimeout(() => {
87388
+ copyButton.classList.remove("alan-copy-btn-copied");
87389
+ }, 2e3);
87390
+ };
87391
+ wrapper.appendChild(copyButton);
87392
+ }
87393
+ });
87394
+ }
87395
+ var hljsTheme = false;
87396
+ function initHighlightJs(theme, customDocument) {
87397
+ const doc = customDocument || document;
87398
+ const hljsStylesId = `alan-hljs-styles-${theme}`;
87399
+ if (hljsTheme === theme && doc.getElementById(hljsStylesId))
87129
87400
  return;
87130
- hljsWasInit = true;
87131
- var style = document.createElement("style");
87132
- style.textContent = highlightJsCss();
87133
- document.getElementsByTagName("head")[0].appendChild(style);
87401
+ hljsTheme = theme;
87402
+ var style = doc.createElement("style");
87403
+ style.textContent = highlightJsCss(theme);
87404
+ style.id = hljsStylesId;
87405
+ doc.getElementsByTagName("head")[0].appendChild(style);
87134
87406
  }
87135
87407
  function highlightCode(msgsHolder) {
87136
87408
  if (window.hljs) {
@@ -87144,8 +87416,8 @@
87144
87416
  });
87145
87417
  }
87146
87418
  }
87147
- function highlightJsCss() {
87148
- return `
87419
+ function highlightJsCss(theme) {
87420
+ const lightTheme = `
87149
87421
  pre code.hljs {
87150
87422
  display: block;
87151
87423
  overflow-x: auto;
@@ -87263,7 +87535,131 @@
87263
87535
  .hljs-tag {
87264
87536
  /* purposely ignored */
87265
87537
 
87266
- }`;
87538
+ }
87539
+ `;
87540
+ const darkTheme = `
87541
+ pre code.hljs {
87542
+ display: block;
87543
+ overflow-x: auto;
87544
+ padding: 1em
87545
+ }
87546
+ code.hljs {
87547
+ padding: 3px 5px
87548
+ }
87549
+ /*!
87550
+ Theme: GitHub Dark
87551
+ Description: Dark theme as seen on github.com
87552
+ Author: github.com
87553
+ Maintainer: @Hirse
87554
+ Updated: 2021-05-15
87555
+
87556
+ Outdated base version: https://github.com/primer/github-syntax-dark
87557
+ Current colors taken from GitHub's CSS
87558
+ */
87559
+ .hljs {
87560
+ color: #c9d1d9;
87561
+ background: #0d1117
87562
+ }
87563
+ .hljs-doctag,
87564
+ .hljs-keyword,
87565
+ .hljs-meta .hljs-keyword,
87566
+ .hljs-template-tag,
87567
+ .hljs-template-variable,
87568
+ .hljs-type,
87569
+ .hljs-variable.language_ {
87570
+ /* prettylights-syntax-keyword */
87571
+ color: #ff7b72
87572
+ }
87573
+ .hljs-title,
87574
+ .hljs-title.class_,
87575
+ .hljs-title.class_.inherited__,
87576
+ .hljs-title.function_ {
87577
+ /* prettylights-syntax-entity */
87578
+ color: #d2a8ff
87579
+ }
87580
+ .hljs-attr,
87581
+ .hljs-attribute,
87582
+ .hljs-literal,
87583
+ .hljs-meta,
87584
+ .hljs-number,
87585
+ .hljs-operator,
87586
+ .hljs-variable,
87587
+ .hljs-selector-attr,
87588
+ .hljs-selector-class,
87589
+ .hljs-selector-id {
87590
+ /* prettylights-syntax-constant */
87591
+ color: #79c0ff
87592
+ }
87593
+ .hljs-regexp,
87594
+ .hljs-string,
87595
+ .hljs-meta .hljs-string {
87596
+ /* prettylights-syntax-string */
87597
+ color: #a5d6ff
87598
+ }
87599
+ .hljs-built_in,
87600
+ .hljs-symbol {
87601
+ /* prettylights-syntax-variable */
87602
+ color: #ffa657
87603
+ }
87604
+ .hljs-comment,
87605
+ .hljs-code,
87606
+ .hljs-formula {
87607
+ /* prettylights-syntax-comment */
87608
+ color: #8b949e
87609
+ }
87610
+ .hljs-name,
87611
+ .hljs-quote,
87612
+ .hljs-selector-tag,
87613
+ .hljs-selector-pseudo {
87614
+ /* prettylights-syntax-entity-tag */
87615
+ color: #7ee787
87616
+ }
87617
+ .hljs-subst {
87618
+ /* prettylights-syntax-storage-modifier-import */
87619
+ color: #c9d1d9
87620
+ }
87621
+ .hljs-section {
87622
+ /* prettylights-syntax-markup-heading */
87623
+ color: #1f6feb;
87624
+ font-weight: bold
87625
+ }
87626
+ .hljs-bullet {
87627
+ /* prettylights-syntax-markup-list */
87628
+ color: #f2cc60
87629
+ }
87630
+ .hljs-emphasis {
87631
+ /* prettylights-syntax-markup-italic */
87632
+ color: #c9d1d9;
87633
+ font-style: italic
87634
+ }
87635
+ .hljs-strong {
87636
+ /* prettylights-syntax-markup-bold */
87637
+ color: #c9d1d9;
87638
+ font-weight: bold
87639
+ }
87640
+ .hljs-addition {
87641
+ /* prettylights-syntax-markup-inserted */
87642
+ color: #aff5b4;
87643
+ background-color: #033a16
87644
+ }
87645
+ .hljs-deletion {
87646
+ /* prettylights-syntax-markup-deleted */
87647
+ color: #ffdcd7;
87648
+ background-color: #67060c
87649
+ }
87650
+ .hljs-char.escape_,
87651
+ .hljs-link,
87652
+ .hljs-params,
87653
+ .hljs-property,
87654
+ .hljs-punctuation,
87655
+ .hljs-tag {
87656
+ /* purposely ignored */
87657
+ }`;
87658
+ const themes = {
87659
+ light: lightTheme,
87660
+ dark: darkTheme
87661
+ };
87662
+ return themes[theme];
87267
87663
  }
87268
87664
 
87269
87665
  // node_modules/dont-crop/dist/mjs/linearRegression.js
@@ -87400,7 +87796,7 @@
87400
87796
  if (button.setVisualState) {
87401
87797
  resultBtn += ` data-alan-button-set-visual-state="${encodeValueForHtmlAttr(button.setVisualState)}" `;
87402
87798
  }
87403
- resultBtn += ` >${button.label}</div>`;
87799
+ resultBtn += ` >${button.html || button.label}</div>`;
87404
87800
  return resultBtn;
87405
87801
  }).join("") || ""}</div>`;
87406
87802
  }
@@ -87448,55 +87844,65 @@
87448
87844
 
87449
87845
  // alan_btn/src/autosync.ts
87450
87846
  var popstateListenerWasAdded = false;
87451
- var previousUrl = "";
87452
- function autoSyncPageState(data) {
87453
- if (data && data.web?.pageState?.autoSync !== false) {
87847
+ var prevPageContent = "";
87848
+ var ALAN_BTN_PAGE_SYNC_EVENT = "alan-btn__page-sync";
87849
+ var syncPageStateDebounced = debounce(function() {
87850
+ window.dispatchEvent(new Event(ALAN_BTN_PAGE_SYNC_EVENT));
87851
+ }, 1e3);
87852
+ function autoSyncPageState(isEnabled) {
87853
+ if (isEnabled) {
87454
87854
  sendPageState();
87455
87855
  if (popstateListenerWasAdded !== true) {
87456
87856
  popstateListenerWasAdded = true;
87457
- window.addEventListener("locationchange", listenForPopState);
87857
+ window.addEventListener(ALAN_BTN_PAGE_SYNC_EVENT, listenForPageChanges);
87458
87858
  }
87459
87859
  } else {
87460
87860
  popstateListenerWasAdded = false;
87461
- window.removeEventListener("locationchange", listenForPopState);
87861
+ window.removeEventListener(ALAN_BTN_PAGE_SYNC_EVENT, listenForPageChanges);
87462
87862
  }
87463
87863
  }
87464
- function addListenerForUrlChange() {
87864
+ function logMutations(mutationsList, observer) {
87865
+ for (const mutation of mutationsList) {
87866
+ if (mutation?.target?.closest && mutation?.target?.closest(".alanBtn-root")) {
87867
+ continue;
87868
+ }
87869
+ syncPageStateDebounced([]);
87870
+ }
87871
+ }
87872
+ function addSyncPageStateListener() {
87873
+ if (window.MutationObserver) {
87874
+ var observer = new MutationObserver(logMutations);
87875
+ observer.observe(document.body, {
87876
+ attributes: true,
87877
+ childList: true,
87878
+ subtree: true,
87879
+ characterData: true
87880
+ });
87881
+ }
87465
87882
  if (window.navigation) {
87466
87883
  window.navigation.addEventListener("navigate", (e) => {
87467
- window.dispatchEvent(new Event("locationchange"));
87468
- });
87469
- } else if ("MutationObserver" in window) {
87470
- var observer = new MutationObserver(function(mutations) {
87471
- if (window.location.href !== previousUrl) {
87472
- previousUrl = window.location.href;
87473
- window.dispatchEvent(new Event("locationchange"));
87474
- }
87884
+ window.dispatchEvent(new Event(ALAN_BTN_PAGE_SYNC_EVENT));
87475
87885
  });
87476
- var config = { subtree: true, childList: true };
87477
- observer.observe(document, config);
87478
87886
  } else {
87479
87887
  const history = window.history;
87480
87888
  const oldPushState = history.pushState;
87481
87889
  history.pushState = function pushState(...args) {
87482
87890
  const ret = oldPushState.apply(this, args);
87483
- window.dispatchEvent(new Event("pushstate"));
87484
- window.dispatchEvent(new Event("locationchange"));
87891
+ window.dispatchEvent(new Event(ALAN_BTN_PAGE_SYNC_EVENT));
87485
87892
  return ret;
87486
87893
  };
87487
87894
  const oldReplaceState = history.replaceState;
87488
87895
  history.replaceState = function replaceState(...args) {
87489
87896
  const ret = oldReplaceState.apply(this, args);
87490
- window.dispatchEvent(new Event("replacestate"));
87491
- window.dispatchEvent(new Event("locationchange"));
87897
+ window.dispatchEvent(new Event(ALAN_BTN_PAGE_SYNC_EVENT));
87492
87898
  return ret;
87493
87899
  };
87494
87900
  window.addEventListener("popstate", () => {
87495
- window.dispatchEvent(new Event("locationchange"));
87901
+ window.dispatchEvent(new Event(ALAN_BTN_PAGE_SYNC_EVENT));
87496
87902
  });
87497
87903
  }
87498
87904
  }
87499
- function listenForPopState() {
87905
+ function listenForPageChanges() {
87500
87906
  sendPageState();
87501
87907
  }
87502
87908
  function sendPageState() {
@@ -87504,26 +87910,35 @@
87504
87910
  page.innerHTML = document.getElementsByTagName("html")[0].innerHTML;
87505
87911
  var scripts = page.getElementsByTagName("script");
87506
87912
  var styles = page.getElementsByTagName("style");
87507
- var elementsToRemove = [...scripts, ...styles];
87913
+ var alanBtnEl = page.getElementsByClassName("alanBtn-root");
87914
+ var debugChatEl = page.getElementsByClassName("alanStudio-debug-chat");
87915
+ var elementsToRemove = [...scripts, ...styles, ...alanBtnEl, ...debugChatEl];
87508
87916
  for (var i = 0; i < elementsToRemove.length; i++) {
87509
87917
  elementsToRemove[i].remove();
87510
87918
  }
87919
+ const pageContent = page.outerHTML;
87920
+ if (prevPageContent === pageContent) {
87921
+ return;
87922
+ }
87923
+ prevPageContent = pageContent;
87511
87924
  if (window.tutorProject) {
87512
- window.tutorProject.call("syncPageState", { html: page.outerHTML });
87925
+ window.tutorProject.call("syncPageState", {
87926
+ html: pageContent,
87927
+ url: window.location.href
87928
+ });
87513
87929
  }
87514
87930
  }
87515
87931
 
87516
87932
  // alan_btn/src/textChat/buildCommandsBlock.ts
87517
- function buildCommandsBlock(msg) {
87518
- if (msg.ctx?.hasActions) {
87519
- return `<div class="alan-btn__chat-response-commands-wrapper">
87933
+ function buildCommandsBlock(msg, textChatOptions) {
87934
+ const isBlockVisible = msg.ctx?.enableFeedback || textChatOptions?.bubbles?.response?.copyBtn;
87935
+ return `<div class="alan-btn__chat-response-commands-wrapper ${isBlockVisible !== true ? "alan-btn__chat-response-commands-wrapper-hidden" : ""}">
87520
87936
  <div class="alan-btn__chat-response-commands-wrapper-content">
87521
87937
  ${buildCopyBtnContent(msg)}
87522
- <span class="alan-btn__chat-response__like-btn ${msg.liked >= 1 ? "selected" : ""}">${getLikeSvgIcon(msg)}</span>
87523
- <span class="alan-btn__chat-response__dislike-btn ${msg.liked <= -1 ? "selected" : ""}">${getDislikeSvgIcon(msg)}</span>
87938
+ ${msg.ctx?.enableFeedback ? `
87939
+ <span class="alan-btn__chat-response__like-btn ${msg.liked >= 1 ? "selected" : ""}">${getLikeSvgIcon(msg)}</span>
87940
+ <span class="alan-btn__chat-response__dislike-btn ${msg.liked <= -1 ? "selected" : ""}">${getDislikeSvgIcon(msg)}</span>` : ""}
87524
87941
  </div></div>`;
87525
- }
87526
- return "";
87527
87942
  }
87528
87943
  function getLikeSvgIcon(msg) {
87529
87944
  return msg.liked === 1 ? chatIcons.likeSelected : chatIcons.like;
@@ -87537,10 +87952,88 @@
87537
87952
  return copyBtn;
87538
87953
  return msg.type === "response" && isFinalMessage(msg) ? copyBtn : "";
87539
87954
  }
87955
+ function changeMsgLikeStatus(msg) {
87956
+ const reqId = msg.ctx?.reqId || msg.reqId;
87957
+ if (reqId) {
87958
+ window.tutorProject.call("sendFeedback", { reqId, status: msg.liked });
87959
+ }
87960
+ }
87961
+ function resetStylesForLikeAndDislikeBtns(curMsgBubble, msg) {
87962
+ const likeBtnEl = curMsgBubble.querySelector(".alan-btn__chat-response__like-btn");
87963
+ const dislikeBtnEl = curMsgBubble.querySelector(".alan-btn__chat-response__dislike-btn");
87964
+ if (likeBtnEl && dislikeBtnEl) {
87965
+ likeBtnEl.innerHTML = getLikeSvgIcon(msg);
87966
+ dislikeBtnEl.innerHTML = getDislikeSvgIcon(msg);
87967
+ }
87968
+ }
87969
+ function deleteHiddenImagesWithCode(str) {
87970
+ return (str || "").replace(/<img\s+style="display:none;".*?\/>/gi, "").replace(/\s+$/g, "");
87971
+ }
87972
+
87973
+ // alan_btn/src/textChat/saveChatStateToFile.ts
87974
+ function saveChatState(chatEl, projectId, headContent, codeContent) {
87975
+ const alanBtnContent = chatEl.outerHTML;
87976
+ const alanMainClass = "alan-" + projectId;
87977
+ const newHtmlContent = `
87978
+ <!DOCTYPE html>
87979
+ <html lang="en">
87980
+ <head>
87981
+ <title>Alan Text Chat History</title>
87982
+ ${headContent ? headContent : ""}
87983
+ <style>
87984
+ body {
87985
+ padding:0 !important;
87986
+ margin: 0 !important;
87987
+ background: #c6cbce;
87988
+ }
87989
+ .alan-btn__history-chat-header > h1 {
87990
+ padding-left: 10px !important;
87991
+ color: #000;
87992
+ }
87993
+ .alan-btn__history-chat-header {
87994
+ margin: 0px auto;
87995
+ max-width: 500px;
87996
+ }
87997
+ .alan-history-inner-content {
87998
+ margin: 0px auto;
87999
+ max-width: 500px;
88000
+ height:100%;
88001
+ box-shadow: 0px 1px 3px rgba(16, 39, 126, 0.2);
88002
+ }
88003
+ </style>
88004
+ </head>
88005
+ <body class="alan-btn__history-body">
88006
+ <div class="alan-history-content ${alanMainClass}">
88007
+ <div class="alan-btn__history-chat-header">
88008
+ <h1>Alan Text Chat History</h1>
88009
+ </div>
88010
+ <div class="alan-btn__history-chat alan-history-inner-content">
88011
+ ${alanBtnContent}
88012
+ </div>
88013
+ </div>
88014
+ ${codeContent ? codeContent : ""}
88015
+ </body>
88016
+ </html>
88017
+ `;
88018
+ const now = /* @__PURE__ */ new Date();
88019
+ const year = now.getFullYear();
88020
+ const month = String(now.getMonth() + 1).padStart(2, "0");
88021
+ const day = String(now.getDate()).padStart(2, "0");
88022
+ const hours = String(now.getHours()).padStart(2, "0");
88023
+ const minutes = String(now.getMinutes()).padStart(2, "0");
88024
+ const seconds = String(now.getSeconds()).padStart(2, "0");
88025
+ const formattedDate = `__${year}-${month}-${day}_${hours}-${minutes}-${seconds}`;
88026
+ const blob = new Blob([newHtmlContent], { type: "text/html" });
88027
+ const link = document.createElement("a");
88028
+ link.href = URL.createObjectURL(blob);
88029
+ link.download = `alan_text_chat_history${formattedDate}.html`;
88030
+ link.click();
88031
+ URL.revokeObjectURL(link.href);
88032
+ }
87540
88033
 
87541
88034
  // alan_btn/alan_btn.ts
87542
88035
  (function(ns) {
87543
- uiState.lib.version = "alan-version.1.8.60".replace("alan-version.", "");
88036
+ uiState.lib.version = "alan-version.1.8.62".replace("alan-version.", "");
87544
88037
  if (window.alanBtn) {
87545
88038
  console.warn("Alan: the Alan Button source code has already added (v." + uiState.lib.version + ")");
87546
88039
  }
@@ -87655,6 +88148,19 @@
87655
88148
  },
87656
88149
  isAudioOutputEnabled: () => {
87657
88150
  return textToSpeachVoiceEnabled;
88151
+ },
88152
+ setFullScreenMode: (value) => {
88153
+ if (value) {
88154
+ enterFullScreenModeForTextChat();
88155
+ } else {
88156
+ exitFullScreenModeForTextChat();
88157
+ }
88158
+ },
88159
+ close: () => {
88160
+ closeTextChat();
88161
+ },
88162
+ clear: () => {
88163
+ clearTextChat();
87658
88164
  }
87659
88165
  },
87660
88166
  //deprecated
@@ -87911,6 +88417,8 @@
87911
88417
  var btnBgLayerZIndex;
87912
88418
  var popupIsVisible = false;
87913
88419
  var tabActive = true;
88420
+ var tabId = guid();
88421
+ saveTabId();
87914
88422
  window.addEventListener("online", updateOnlineStatus);
87915
88423
  window.addEventListener("offline", updateOnlineStatus);
87916
88424
  window.addEventListener("focus", syncChatHistoryBetweenTabs);
@@ -88534,7 +89042,7 @@
88534
89042
  onresizeDebounced({});
88535
89043
  if (!(uiState.textChat.expanded || uiState.textChat.inlined)) {
88536
89044
  var chatHolderRect = chatHolderDiv.getBoundingClientRect();
88537
- fixTextChatSizeIfNeeded(chatHolderRect.width, chatHolderRect.height, false);
89045
+ fixTextChatSizeIfNeeded(chatHolderRect.width, chatHolderRect.height);
88538
89046
  }
88539
89047
  };
88540
89048
  var initialPermissionWasAsked = false;
@@ -88656,7 +89164,7 @@
88656
89164
  continueWithAudio = false;
88657
89165
  if (textChatIsHidden) {
88658
89166
  sendClientEvent({ buttonClicked: true });
88659
- fixTextChatSizeIfNeeded(getTextChatSizeAfterResize("width"), getTextChatSizeAfterResize("height"), true);
89167
+ fixTextChatSizeIfNeeded(getTextChatSizeAfterResize("width"), getTextChatSizeAfterResize("height"));
88660
89168
  showTextChat();
88661
89169
  setTextChatPosition(chatHolderDiv);
88662
89170
  }
@@ -89011,12 +89519,15 @@
89011
89519
  }
89012
89520
  }
89013
89521
  if (options.key && !isTutorMode()) {
89014
- addListenerForUrlChange();
89522
+ addSyncPageStateListener();
89523
+ }
89524
+ if (isTutorMode()) {
89525
+ autoSyncPageState(true);
89015
89526
  }
89016
89527
  function onOptionsReceived(data) {
89017
89528
  console.log("Alan: options received");
89018
89529
  console.timeEnd("Alan: receiving options time");
89019
- autoSyncPageState(data);
89530
+ autoSyncPageState(data && data.web?.pageState?.autoSync !== false);
89020
89531
  if (data && data.web) {
89021
89532
  keepButtonPositionAfterDnD = data.web.alanButtonDragAndDrop?.keepButtonPositionAfterDnD || data.web.keepButtonPositionAfterDnD;
89022
89533
  if (!keepButtonPositionAfterDnD) {
@@ -89044,6 +89555,11 @@
89044
89555
  if (data && data.web && data.web.chatOptions?.textChat?.enabled === true) {
89045
89556
  uiState.textChat.available = true;
89046
89557
  voiceEnabledInTextChat = data.web.chatOptions?.textChat?.voice?.enabled;
89558
+ const themeFromOptions = data.web.chatOptions?.textChat?.bubbles?.response?.codeTheme || "light";
89559
+ const currentTheme = uiState.textChat.options?.bubbles?.response?.codeTheme;
89560
+ if (currentTheme !== themeFromOptions) {
89561
+ initHighlightJs(themeFromOptions);
89562
+ }
89047
89563
  uiState.textChat.options = data.web.chatOptions?.textChat;
89048
89564
  if (getVoiceEnabledFlag() !== data.web.chatOptions?.textChat?.audio?.enabled) {
89049
89565
  if (data.web.chatOptions?.textChat?.audio?.enabled) {
@@ -89624,12 +90140,6 @@
89624
90140
  }
89625
90141
  return imgsBlock;
89626
90142
  }
89627
- function changeMsgLikeStatus(msg) {
89628
- const reqId = msg.ctx?.reqId || msg.reqId;
89629
- if (reqId) {
89630
- window.tutorProject.call("sendFeedback", { reqId, status: msg.liked });
89631
- }
89632
- }
89633
90143
  function performLikeOrDislike(e) {
89634
90144
  const curMsgBubble = e.target.closest(".alan-btn__chat-msg-holder");
89635
90145
  if (!curMsgBubble)
@@ -89650,14 +90160,6 @@
89650
90160
  resetStylesForLikeAndDislikeBtns(curMsgBubble, msg);
89651
90161
  saveMessageHistory();
89652
90162
  }
89653
- function resetStylesForLikeAndDislikeBtns(curMsgBubble, msg) {
89654
- const likeBtnEl = curMsgBubble.querySelector(".alan-btn__chat-response__like-btn");
89655
- const dislikeBtnEl = curMsgBubble.querySelector(".alan-btn__chat-response__dislike-btn");
89656
- if (likeBtnEl && dislikeBtnEl) {
89657
- likeBtnEl.innerHTML = getLikeSvgIcon(msg);
89658
- dislikeBtnEl.innerHTML = getDislikeSvgIcon(msg);
89659
- }
89660
- }
89661
90163
  document.removeEventListener("click", performLikeOrDislike);
89662
90164
  document.addEventListener("click", performLikeOrDislike);
89663
90165
  function buildMsgTextContent(msg) {
@@ -89672,14 +90174,16 @@
89672
90174
  return result ? `<span class="alan-btn__chat-response-text-wrapper">${fixTargetForLinks(result)}</span>` : "";
89673
90175
  }
89674
90176
  function buildMsgContent(msg) {
89675
- return `${buildImagesContent(msg)}${buildMsgTextContent(msg)}${buildLinksContent(msg)}${buildCommandsBlock(msg)}${buildMsgIncommingLoader(msg)}`;
90177
+ return `${buildImagesContent(msg)}${buildMsgTextContent(msg)}${buildLinksContent(msg)}${buildCommandsBlock(msg, uiState?.textChat?.options)}${buildMsgIncommingLoader(msg)}`;
89676
90178
  }
89677
- initHighlightJs();
89678
90179
  initMathJax(textChatMessages.length, (i2) => getMsgElForMathJax(i2));
89679
90180
  document.addEventListener("click", (e) => {
89680
90181
  let clickedEl = e.target;
89681
90182
  clickedEl = clickedEl.closest(".alan-btn__chat-response__copy-btn");
89682
90183
  if (clickedEl) {
90184
+ let textChat = clickedEl.closest("#alan-text-chat");
90185
+ if (!textChat)
90186
+ return;
89683
90187
  clickedEl.classList.add("alan-copy-btn-copied");
89684
90188
  setTimeout(() => {
89685
90189
  clickedEl.classList.remove("alan-copy-btn-copied");
@@ -89689,7 +90193,7 @@
89689
90193
  const msg = textChatMessages[msgInd];
89690
90194
  let textToCopy = "";
89691
90195
  if (msg) {
89692
- textToCopy = msg.text || "";
90196
+ textToCopy = deleteHiddenImagesWithCode(msg.text || "");
89693
90197
  copyTextToBuffer(
89694
90198
  (msg.images?.length > 0 ? msg.images?.map((img) => img.src).join("\n") + "\n\n" : "") + textToCopy + (msg.links?.length > 0 ? `
89695
90199
 
@@ -89708,9 +90212,12 @@ ${LEARN_MORE_LABEL}
89708
90212
  }
89709
90213
  function getMsgBubbleLabel(msg) {
89710
90214
  if (msg.type === "request" || msg.type === "response") {
90215
+ const isResponse = msg.type === "response";
89711
90216
  const requestLabel = uiState?.textChat?.options?.bubbles?.request?.label?.text || "Me";
89712
90217
  const responseLabel = uiState?.textChat?.options?.bubbles?.response?.label?.text || "Alan";
89713
- const msgLabel = `<div class="alan-btn__chat-${msg.type}-label">${msg.type === "request" ? requestLabel : responseLabel}</div>`;
90218
+ const msgLabel = `<div class="alan-btn__chat-${msg.type}-label">
90219
+ ${isResponse ? `<span class="alan-btn__chat-${msg.type}-label-icon"></span>` : ""}
90220
+ <span class="alan-btn__chat-${msg.type}-label-text">${isResponse ? responseLabel : requestLabel}</span></div>`;
89714
90221
  return msgLabel;
89715
90222
  }
89716
90223
  return "";
@@ -89734,11 +90241,11 @@ ${LEARN_MORE_LABEL}
89734
90241
  }
89735
90242
  }
89736
90243
  if (msg.ctx) {
89737
- if (window.fakeMsg?.ctx?.hasActions) {
89738
- msg.ctx.hasActions = window.fakeMsg?.ctx?.hasActions;
90244
+ if (window.fakeMsg?.ctx?.enableFeedback) {
90245
+ msg.ctx.enableFeedback = window.fakeMsg?.ctx?.enableFeedback;
89739
90246
  }
89740
90247
  } else {
89741
- msg.ctx = { hasActions: window.fakeMsg?.ctx?.hasActions };
90248
+ msg.ctx = { enableFeedback: window.fakeMsg?.ctx?.enableFeedback };
89742
90249
  }
89743
90250
  window.fakeMsg = null;
89744
90251
  }
@@ -89840,7 +90347,7 @@ ${LEARN_MORE_LABEL}
89840
90347
  }
89841
90348
  innerEl.insertAdjacentHTML("beforeend", buildMsgTextContent(updatedMsg));
89842
90349
  innerEl.insertAdjacentHTML("beforeend", buildLinksContent(updatedMsg));
89843
- innerEl.insertAdjacentHTML("beforeend", buildCommandsBlock(msg));
90350
+ innerEl.insertAdjacentHTML("beforeend", buildCommandsBlock(msg, uiState?.textChat?.options));
89844
90351
  innerEl.insertAdjacentHTML("beforeend", buildMsgIncommingLoader(msg));
89845
90352
  if (isMsgContainsTable(innerEl?.innerHTML)) {
89846
90353
  innerEl.classList.add("with-table");
@@ -89867,6 +90374,7 @@ ${LEARN_MORE_LABEL}
89867
90374
  enableTextareaInTheChat();
89868
90375
  }
89869
90376
  }
90377
+ manageSaveChatHistoryBtn();
89870
90378
  }
89871
90379
  function scrollTextChat(msgHolder, behavior) {
89872
90380
  const scrollOptions = {
@@ -89892,7 +90400,10 @@ ${LEARN_MORE_LABEL}
89892
90400
  }
89893
90401
  function saveMessageHistory() {
89894
90402
  if (isLocalStorageAvailable && curDialogId) {
89895
- localStorage.setItem(getKeyForSavingTextChatMessages(), JSON.stringify(textChatMessages));
90403
+ const lastActiveTabId = localStorage.getItem("alan-btn-tab-id");
90404
+ if (lastActiveTabId === tabId) {
90405
+ localStorage.setItem(getKeyForSavingTextChatMessages(), JSON.stringify(textChatMessages));
90406
+ }
89896
90407
  }
89897
90408
  }
89898
90409
  function getKeyForSavingTextChatMessages() {
@@ -89908,7 +90419,7 @@ ${LEARN_MORE_LABEL}
89908
90419
  }
89909
90420
  }
89910
90421
  }
89911
- function onClearChatClick() {
90422
+ function clearTextChat() {
89912
90423
  clearDialogId();
89913
90424
  if (window.tutorProject) {
89914
90425
  window.tutorProject.close();
@@ -89927,11 +90438,18 @@ ${LEARN_MORE_LABEL}
89927
90438
  function clearChatAndChatHistory() {
89928
90439
  clearChat();
89929
90440
  clearChatHistoryStorage();
90441
+ manageSaveChatHistoryBtn();
89930
90442
  }
89931
90443
  function syncChatHistoryBetweenTabs() {
89932
90444
  tabActive = true;
90445
+ saveTabId();
89933
90446
  restoreMessageList(false);
89934
90447
  }
90448
+ function saveTabId() {
90449
+ if (isLocalStorageAvailable) {
90450
+ localStorage.setItem("alan-btn-tab-id", tabId);
90451
+ }
90452
+ }
89935
90453
  function restoreMessageList(initLoad) {
89936
90454
  var savedMsgs;
89937
90455
  if (isLocalStorageAvailable) {
@@ -90046,6 +90564,70 @@ ${LEARN_MORE_LABEL}
90046
90564
  textareaHolder.classList.remove("ready-to-send");
90047
90565
  }
90048
90566
  }
90567
+ resizeTextArea();
90568
+ }
90569
+ function onChatTextAreaChange(e) {
90570
+ resizeTextArea();
90571
+ }
90572
+ const resizeTextAreaDebounced = throttle(function() {
90573
+ resizeTextArea();
90574
+ }, 300);
90575
+ function resizeTextArea() {
90576
+ var el = getChatTextareaEl();
90577
+ if (!el)
90578
+ return;
90579
+ const isMultiline = uiState.textChat.options?.textarea?.fieldType === "multi-line";
90580
+ const defaultLineHeight = uiState.textChat.defaults.textareaLineHeight;
90581
+ if (isMultiline) {
90582
+ const defaultChatTextareaFontSize = uiState.textChat.defaults.textareaFontSize;
90583
+ const fontSize = +getTextAreaFontSize(isMobile(), uiState.textChat.options?.textarea?.fontSize || defaultChatTextareaFontSize);
90584
+ const textareaTopPadding = +getNumPropVal(uiState.textChat.options?.textarea?.padding?.top, 12);
90585
+ const textareaBottomPadding = +getNumPropVal(uiState.textChat.options?.textarea?.padding?.bottom, 12);
90586
+ const maxLinesCount = Math.max(+getNumPropVal(uiState.textChat.options?.textarea?.maxLinesCount, 7), 1);
90587
+ const paddingsAndBorder = textareaTopPadding + textareaBottomPadding;
90588
+ const lineHeight = fontSize * defaultLineHeight;
90589
+ const maxHeight = lineHeight * maxLinesCount + paddingsAndBorder;
90590
+ const defaultOneLineHeight = lineHeight + paddingsAndBorder;
90591
+ el.style.height = `${getDynamicInputHeight(el, maxHeight)}px`;
90592
+ if (el.offsetHeight > defaultOneLineHeight) {
90593
+ el.closest("#textarea-holder")?.classList?.add("multi-line");
90594
+ } else {
90595
+ el.closest("#textarea-holder")?.classList?.remove("multi-line");
90596
+ }
90597
+ } else {
90598
+ el.closest("#textarea-holder")?.classList?.remove("multi-line");
90599
+ el.style.height = `100%`;
90600
+ }
90601
+ }
90602
+ function getDynamicInputHeight(el, maxHeight) {
90603
+ const style = window.getComputedStyle(el);
90604
+ const text = el.value;
90605
+ const id = "alanBtnHiddenTextDiv";
90606
+ const hasHiddenDiv = document.getElementById(id);
90607
+ const draftDiv = document.getElementById(id) || document.createElement("div");
90608
+ if (style) {
90609
+ draftDiv.id = id;
90610
+ draftDiv.style.position = "absolute";
90611
+ draftDiv.style.visibility = "hidden";
90612
+ draftDiv.style.whiteSpace = "pre-wrap";
90613
+ draftDiv.style.overflow = "visible";
90614
+ draftDiv.style.wordBreak = "break-all";
90615
+ draftDiv.style.width = style.width;
90616
+ draftDiv.style.maxWidth = style.width;
90617
+ draftDiv.style.fontFamily = style.fontFamily;
90618
+ draftDiv.style.fontSize = style.fontSize;
90619
+ draftDiv.style.lineHeight = style.lineHeight;
90620
+ draftDiv.style.padding = style.padding;
90621
+ draftDiv.style.border = style.border;
90622
+ draftDiv.style.maxHeight = `${maxHeight}px`;
90623
+ }
90624
+ draftDiv.textContent = text + "\u200B";
90625
+ if (!hasHiddenDiv) {
90626
+ document.body.appendChild(draftDiv);
90627
+ }
90628
+ const newHeight = draftDiv.offsetHeight;
90629
+ el.style.overflow = maxHeight - newHeight - 2 > 0 ? "hidden" : "auto";
90630
+ return newHeight;
90049
90631
  }
90050
90632
  function getRestoreMsgsLsKey() {
90051
90633
  const projectId = getProjectId();
@@ -90125,7 +90707,8 @@ ${LEARN_MORE_LABEL}
90125
90707
  }
90126
90708
  const goToPrev = keyCode === 38;
90127
90709
  const goToNext = keyCode === 40;
90128
- if (goToPrev || goToNext) {
90710
+ const isMultiline = uiState.textChat.options?.textarea?.fieldType === "multi-line";
90711
+ if (!isMultiline && (goToPrev || goToNext)) {
90129
90712
  switchMessages(keyCode);
90130
90713
  e.stopPropagation();
90131
90714
  e.preventDefault();
@@ -90200,6 +90783,26 @@ ${LEARN_MORE_LABEL}
90200
90783
  parentEl.children[0].classList.add("alan-btn__chat-enter-full-screen-mode");
90201
90784
  parentEl.children[1].classList.add("alan-btn__chat-exit-full-screen-mode");
90202
90785
  }
90786
+ function createTextInputNode(fieldType) {
90787
+ const el = document.createElement(fieldType);
90788
+ el.id = "chatTextarea";
90789
+ el.setAttribute("autocomplete", "off");
90790
+ el.classList.add("alan-btn__chat-textarea");
90791
+ el.addEventListener("keydown", onChatTextAreaKeyDown);
90792
+ el.addEventListener("keyup", onChatTextAreaKeyUp);
90793
+ el.addEventListener("input", onChatTextAreaChange);
90794
+ return el;
90795
+ }
90796
+ function manageSaveChatHistoryBtn() {
90797
+ var saveChatStateBtnImg = document.getElementById("alan-btn-save-chat-state-btn");
90798
+ if (saveChatStateBtnImg) {
90799
+ if (textChatMessages?.length > 0) {
90800
+ saveChatStateBtnImg.classList.remove("alan-btn__save-chat-state-btn-disabled");
90801
+ } else {
90802
+ saveChatStateBtnImg.classList.add("alan-btn__save-chat-state-btn-disabled");
90803
+ }
90804
+ }
90805
+ }
90203
90806
  function initTextChat() {
90204
90807
  var textareaDiv = document.getElementById("textarea-holder");
90205
90808
  var textareaInnerDiv = document.getElementById("textarea-inner-holder");
@@ -90215,6 +90818,8 @@ ${LEARN_MORE_LABEL}
90215
90818
  var leftHeaderIconsHolder = document.getElementById("chat-header-left-icons");
90216
90819
  var closeChatBtnImg = document.getElementById("alan-btn-chat-close-btn");
90217
90820
  var expandCollapseChatBtnImg = document.getElementById("alan-btn-expand-collapse-chat-btn");
90821
+ var saveChatStateBtnImg = document.getElementById("alan-btn-save-chat-state-btn");
90822
+ const isMultiline = uiState.textChat.options?.textarea?.fieldType === "multi-line";
90218
90823
  if (!chatDivWrapper.classList.contains("alan-btn__chat")) {
90219
90824
  document.addEventListener("touchstart", keyboardScrollFixListenerForChat, { passive: false });
90220
90825
  if (isInlinedMode()) {
@@ -90242,18 +90847,27 @@ ${LEARN_MORE_LABEL}
90242
90847
  headerInnerDiv = createDiv({ id: "chat-header-inner", class: "alan-btn__chat-header-inner" });
90243
90848
  var headerDivGr = createDiv({ class: "alan-btn__chat-header-gradient" });
90244
90849
  var clearChatBtn = createDivWithSvg(chatIcons.clear, { id: "clear-chat-btn", class: "alan-btn__chat-clear-btn" });
90245
- clearChatBtn.addEventListener("click", onClearChatClick);
90850
+ clearChatBtn.addEventListener("click", clearTextChat);
90246
90851
  headerTille = document.createElement("span");
90247
90852
  headerTille.id = "chat-header-title";
90248
90853
  headerTille.classList.add("alan-btn__chat-header-title");
90249
90854
  leftHeaderIconsHolder = createDiv({ id: "chat-header-left-icons", class: "alan-btn__chat-header-left-icons" });
90250
90855
  rightHeaderIconsHolder = createDiv({ id: "chat-header-right-icons", class: "alan-btn__chat-header-right-icons" });
90251
90856
  if (!isMobile()) {
90857
+ saveChatStateBtnImg = createDivWithSvg(
90858
+ getSaveChatStateIcon(uiState?.textChat?.options),
90859
+ { class: "alan-btn__save-chat-state-btn", id: "alan-btn-save-chat-state-btn" }
90860
+ );
90252
90861
  expandCollapseChatBtnImg = createDivWithSvg(
90253
90862
  `${getExpandChatIcon(uiState?.textChat?.options)}${getCollapseChatIcon(uiState?.textChat?.options)}`,
90254
90863
  { class: "alan-btn__expand-collapse-chat-btn", id: "alan-btn-expand-collapse-chat-btn" }
90255
90864
  );
90865
+ rightHeaderIconsHolder.appendChild(saveChatStateBtnImg);
90256
90866
  rightHeaderIconsHolder.appendChild(expandCollapseChatBtnImg);
90867
+ saveChatStateBtnImg.addEventListener("click", () => {
90868
+ const headContent = document.head.innerHTML;
90869
+ saveChatState(document.querySelector("#chatMessagesWrapper"), getProjectId(), headContent);
90870
+ });
90257
90871
  expandCollapseChatBtnImg.addEventListener("click", expandCollapseTextChat);
90258
90872
  addNeedClassesToExpandCollapseBtn(expandCollapseChatBtnImg);
90259
90873
  }
@@ -90266,18 +90880,13 @@ ${LEARN_MORE_LABEL}
90266
90880
  headerInnerDiv.appendChild(headerTille);
90267
90881
  headerInnerDiv.appendChild(rightHeaderIconsHolder);
90268
90882
  headerDiv.appendChild(headerInnerDiv);
90269
- fillSideBarContent(chatSideBar, { onClearChatClick, expandCollapseChatSidePanel, closeTextChat });
90883
+ fillSideBarContent(chatSideBar, { clearTextChat, expandCollapseChatSidePanel, closeTextChat });
90270
90884
  textareaInnerDiv = createDiv({ id: "textarea-inner-holder", class: "alan-btn__chat-textarea-inner-holder" });
90271
90885
  textareaHolderDiv = createDiv({ id: "textarea-holder-content", class: "alan-btn__chat-textarea-holder-outer-content" });
90272
90886
  textareaDiv = createDiv({ id: "textarea-holder", class: "alan-btn__chat-textarea-holder" });
90273
90887
  var textareaDivGr = document.createElement("div");
90274
90888
  textareaDivGr.classList.add("alan-btn__chat-textarea-holder-gradient");
90275
- chatTextarea = document.createElement("input");
90276
- chatTextarea.id = "chatTextarea";
90277
- chatTextarea.setAttribute("autocomplete", "off");
90278
- chatTextarea.classList.add("alan-btn__chat-textarea");
90279
- chatTextarea.addEventListener("keydown", onChatTextAreaKeyDown);
90280
- chatTextarea.addEventListener("keyup", onChatTextAreaKeyUp);
90889
+ chatTextarea = createTextInputNode(isMultiline ? "textarea" : "input");
90281
90890
  chatSendBtn = document.createElement("div");
90282
90891
  chatSendBtn.id = "chat-send-btn";
90283
90892
  chatSendBtn.classList.add("alan-btn__chat-send-btn");
@@ -90293,14 +90902,30 @@ ${LEARN_MORE_LABEL}
90293
90902
  chatDiv.appendChild(headerDivGr);
90294
90903
  chatHolderDiv.classList.add("alan-btn__chat-holder");
90295
90904
  }
90905
+ const tagName = chatTextarea?.tagName?.toLowerCase();
90906
+ if (tagName === "input" && isMultiline) {
90907
+ const newTextareaEl = createTextInputNode("textarea");
90908
+ newTextareaEl.placeholder = chatTextarea.placeholder;
90909
+ chatTextarea.parentNode.replaceChild(newTextareaEl, chatTextarea);
90910
+ } else if (tagName === "textarea" && !isMultiline) {
90911
+ const newTextareaEl = createTextInputNode("input");
90912
+ newTextareaEl.placeholder = chatTextarea.placeholder;
90913
+ chatTextarea.parentNode.replaceChild(newTextareaEl, chatTextarea);
90914
+ }
90915
+ setTimeout(() => {
90916
+ resizeTextArea();
90917
+ });
90296
90918
  if (headerTille) {
90919
+ const icon = uiState.textChat.options?.header?.icon?.svg;
90297
90920
  const title = uiState.textChat.options?.header?.label || "Alan AI Assistant";
90298
- headerTille.innerText = title;
90299
- headerTille.setAttribute("title", title);
90921
+ headerTille.innerHTML = `${icon ? `<span class="alan-btn__chat-header-title-icon">${icon}</span>` : ""}<span class="alan-btn__chat-header-title-label" title="${title}">${title}</span>`;
90300
90922
  }
90301
90923
  if (closeChatBtnImg) {
90302
90924
  closeChatBtnImg.innerHTML = getCloseChatIcon(uiState.textChat.options);
90303
90925
  }
90926
+ if (saveChatStateBtnImg) {
90927
+ saveChatStateBtnImg.innerHTML = getSaveChatStateIcon(uiState.textChat.options);
90928
+ }
90304
90929
  if (expandCollapseChatBtnImg) {
90305
90930
  expandCollapseChatBtnImg.innerHTML = `${getExpandChatIcon(uiState?.textChat?.options)}${getCollapseChatIcon(uiState?.textChat?.options)}`;
90306
90931
  addNeedClassesToExpandCollapseBtn(expandCollapseChatBtnImg);
@@ -90316,6 +90941,7 @@ ${LEARN_MORE_LABEL}
90316
90941
  chatMicBtn.id = "chat-mic-btn";
90317
90942
  chatMicBtn.addEventListener("click", () => {
90318
90943
  chatTextarea.value = "";
90944
+ resizeTextArea();
90319
90945
  textareaDiv.classList.remove("show-gradient");
90320
90946
  if (!isAlanActive) {
90321
90947
  disableVoiceEnabledBtn();
@@ -90358,6 +90984,7 @@ ${LEARN_MORE_LABEL}
90358
90984
  chatTextarea.setAttribute("placeholder", uiState.textChat.options?.textarea?.placeholder);
90359
90985
  }
90360
90986
  }
90987
+ manageSaveChatHistoryBtn();
90361
90988
  }
90362
90989
  function getOpenCloseTextChatLocalStorageKey() {
90363
90990
  return `alan-btn-text-chat-opened-for-projectId-${getProjectId()}`;
@@ -90431,13 +91058,21 @@ ${LEARN_MORE_LABEL}
90431
91058
  }
90432
91059
  function expandCollapseTextChat() {
90433
91060
  if (!uiState.textChat.expanded) {
91061
+ enterFullScreenModeForTextChat();
91062
+ } else {
91063
+ exitFullScreenModeForTextChat();
91064
+ }
91065
+ }
91066
+ function enterFullScreenModeForTextChat() {
91067
+ if (uiState.textChat?.options?.popup?.fullScreenMode?.enabled === true) {
90434
91068
  uiState.textChat.expanded = true;
90435
91069
  openChatInFullScreen(chatHolderDiv);
90436
- } else {
90437
- uiState.textChat.expanded = false;
90438
- chatHolderDiv.classList.remove("alan-btn_text-chat-full-screen");
90439
91070
  }
90440
91071
  }
91072
+ function exitFullScreenModeForTextChat() {
91073
+ uiState.textChat.expanded = false;
91074
+ chatHolderDiv.classList.remove("alan-btn_text-chat-full-screen");
91075
+ }
90441
91076
  function getVoiceEnabledFlagLocalStorageKey() {
90442
91077
  return `alan-btn-text-chat__text-to-speach-voice-enabled__for-projectId-${getProjectId()}`;
90443
91078
  }
@@ -90925,6 +91560,7 @@ ${LEARN_MORE_LABEL}
90925
91560
  btn.appendChild(chatNotificationsBubble);
90926
91561
  }
90927
91562
  rootEl.appendChild(chatHolderDiv);
91563
+ resizeTextArea();
90928
91564
  btnDisabled = false;
90929
91565
  }
90930
91566
  function hideBtn() {
@@ -91214,7 +91850,10 @@ ${LEARN_MORE_LABEL}
91214
91850
  }
91215
91851
  if (!isMobile()) {
91216
91852
  chatHolderDiv.addEventListener("mousedown", onMouseDownForResizeTextChat);
91217
- chatHolderDiv.addEventListener("mousemove", onMouseHoverForResizeTextChat);
91853
+ chatHolderDiv.addEventListener("mousemove", (e) => {
91854
+ onMouseHoverForResizeTextChat(e);
91855
+ resizeTextAreaDebounced();
91856
+ });
91218
91857
  chatHolderDiv.addEventListener("mouseleave", onMouseHoverForResizeTextChat);
91219
91858
  document.addEventListener("mouseup", onMouseUpForResizeTextChat, true);
91220
91859
  document.addEventListener("mousemove", onMouseMoveForResizeTextChat, true);