@appbaseio/reactivesearch-vue 3.0.0-rc.6.3 → 3.0.0-rc.6.5

package/dist/@appbaseio/reactivesearch-vue.umd.js

@@ -7681,6 +7681,7 @@
 	  exports.loadMore = loadMore;
 	  exports.loadDataToExport = loadDataToExport;
 	  exports.fetchAIResponse = fetchAIResponse;
+	  exports.createAISession = createAISession;
 	  function _objectWithoutProperties(obj, keys) {
 	    var target = {};
 	    for (var i in obj) {
@@ -8246,13 +8247,14 @@
 	        var chunk = decoder.decode(value, {
 	          stream: true
 	        });
-	        var lines = chunk.split('\n');
+	        var regex = /\n\n(?=data:)/;
+	        var lines = chunk.split(regex);
 	        var shouldStop = false;
 	        for (var i = 0; i < lines.length; i++) {
 	          var line = lines[i];
 	          if (line.startsWith('data: ')) {
 	            var content = line.slice(6);
-	            if (content === '[DONE]') {
+	            if (content === '[DONE]\n\n') {
 	              shouldStop = true;
 	              if (Promise.resolve(metaInfoPromise) === metaInfoPromise) {
 	                metaInfoPromise.then(function (resMeta) {
@@ -8371,6 +8373,46 @@
 	      doFetch();
 	    };
 	  }
+	  function createAISession() {
+	    var question = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'Reactivesearch';
+	    return function (dispatch, getState) {
+	      var _getState7 = getState(),
+	        _getState7$config = _getState7.config,
+	        url = _getState7$config.url,
+	        configCredentials = _getState7$config.credentials,
+	        endpoint = _getState7$config.endpoint;
+	      var regex = /https:\/\/[^/]+/;
+	      var urlObj = new URL(url.match(regex)[0]);
+	      var credentials = configCredentials;
+	      if (urlObj.username && urlObj.password) {
+	        credentials = urlObj.username + ':' + urlObj.password;
+	        urlObj.username = '';
+	        urlObj.password = '';
+	      }
+	      var fetchUrl = urlObj.toString() + '_ai';
+	      var headers = new Headers();
+	      if (credentials) {
+	        var encodedCredentials = btoa(credentials);
+	        headers.append('Authorization', 'Basic ' + encodedCredentials);
+	      } else if (endpoint && endpoint.headers && endpoint.headers.Authorization) {
+	        headers.append('Authorization', endpoint.headers.Authorization);
+	      }
+	      var requestOptions = {
+	        headers: headers,
+	        method: 'POST',
+	        body: JSON.stringify({
+	          question: question
+	        })
+	      };
+	      return fetch(fetchUrl, _extends({}, requestOptions)).then(function (res) {
+	        return res.json();
+	      }).then(function (parsedRes) {
+	        return parsedRes;
+	      })["catch"](function (e) {
+	        console.error('Error creating an AI session: ', e);
+	      });
+	    };
+	  }
 	});
 	unwrapExports(query);
 	var query_1 = query.loadPopularSuggestions;
@@ -8380,6 +8422,7 @@
 	var query_5 = query.loadMore;
 	var query_6 = query.loadDataToExport;
 	var query_7 = query.fetchAIResponse;
+	var query_8 = query.createAISession;
 
 	var component = createCommonjsModule(function (module, exports) {
 	  Object.defineProperty(exports, "__esModule", {
@@ -24780,7 +24823,7 @@
 	  // eslint-disable-next-line no-nested-ternary
 	  props.isSender ? props.themePreset !== 'dark' ? props.theme.colors.primaryColor : props.theme.colors.borderColor : props.theme.colors.borderColor) + ";\n\t}\n\n\tcode {\n\t\tline-height: normal;\n\n\t\tcolor: " + (
 	  // eslint-disable-next-line no-nested-ternary
-	  props.isSender ? props.themePreset !== 'dark' ? props.theme.colors.primaryTextColor : props.theme.colors.textColor : props.theme.colors.primaryTextColor) + ";\n\t\tborder-radius: 3px;\n\t\tfont-size: 85%;\n\t\tpadding: 0.2em 0.4em;\n\t\tmargin-top: 5px;\n\t\tdisplay: inline-block;\n\t\toverflow: auto;\n\t\twidth: fit-content;\n\t\tmax-width: 100%;\n\t}\n\tul,\n\tol {\n\t\tlist-style-position: inside;\n\n\t}\n\n\tli{\n\t\tdisplay: unset;\n\t\tcursor: default;\n\t\tpadding: initial;\n\n\t\t&:hover{\n\t\t\tbackground-color: initial;\n\t\t}\n\t}\n";
+	  props.isSender ? props.themePreset !== 'dark' ? props.theme.colors.primaryTextColor : props.theme.colors.textColor : props.theme.colors.primaryTextColor) + ";\n\t\tborder-radius: 3px;\n\t\tfont-size: 85%;\n\t\tpadding: 0.2em 0.4em;\n\t\tmargin-top: 5px;\n\t\tdisplay: inline-block;\n\t\toverflow: auto;\n\t\twidth: fit-content;\n\t\tmax-width: 100%;\n\t}\n\tul,\n\tol {\n\t\tlist-style-position: inside;\n\t\tpadding-left: 10px;\n\n\t}\n\n\tli{\n\t\tdisplay: list-item;\n\t\tcursor: default;\n\t\tpadding: initial;\n\n\t\t&:hover{\n\t\t\tbackground-color: initial;\n\t\t}\n\t}\n\tp {\n\t\tmargin: inherit;\n\t}\n";
 	};
 	var messageBGColor = function messageBGColor(props) {
 	  var finalBGColor;
@@ -26499,6 +26542,7 @@
 	    isLoading: types.boolRequired,
 	    sessionIdFromStore: Q.string,
 	    showComponent: types.boolRequired,
+	    componentError: types.componentObject,
 	    style: types.style
 	  },
 	  mounted: function mounted() {},
@@ -26525,7 +26569,7 @@
 	            role: constants_7$1.ASSISTANT,
 	            content: response.answer.text
 	          });
-	          this.error = {
+	          if (!this.AISessionId) this.error = {
 	            message: this.errorMessageForMissingSessionId
 	          };
 	        }
@@ -26543,7 +26587,6 @@
 	      });
 	    },
 	    isAIResponseLoading: function isAIResponseLoading(newVal) {
-	      this.isLoadingState = newVal;
 	      this.$emit('on-data', {
 	        data: this.messages,
 	        rawData: this.$props.rawData,
@@ -26552,7 +26595,6 @@
 	      });
 	    },
 	    isLoading: function isLoading(newVal) {
-	      this.isLoadingState = newVal;
 	      this.$emit('on-data', {
 	        data: this.messages,
 	        rawData: this.$props.rawData,
@@ -26584,14 +26626,50 @@
 	    },
 	    messages: function messages() {
 	      this.scrollToBottom();
+	    },
+	    componentError: function componentError(newVal) {
+	      var _this = this;
+	      if (newVal && newVal._bodyBlob) {
+	        this.AISessionId = ((helper_2(constants_8$1) || {})[this.$props.componentId] || {}).sessionId || null;
+	        if (!this.AISessionId) {
+	          this.generateNewSessionId();
+	        }
+	        newVal._bodyBlob.text().then(function (textData) {
+	          try {
+	            var parsedErrorRes = JSON.parse(textData);
+	            if (parsedErrorRes.error) {
+	              _this.error = parsedErrorRes.error;
+	              _this.$emit('on-data', {
+	                data: _this.messages,
+	                rawData: _this.$props.rawData,
+	                loading: _this.$props.isAIResponseLoading || _this.$props.isLoading,
+	                error: parsedErrorRes.error
+	              });
+	            }
+	          } catch (error) {
+	            console.error('Error parsing component error JSON:', error);
+	          }
+	        })["catch"](function (error) {
+	          console.error('Error reading  component error text data:', error);
+	        });
+	      }
 	    }
 	  },
 	  methods: {
+	    generateNewSessionId: function generateNewSessionId() {
+	      var _this2 = this;
+	      var newSessionPromise = this.createAISession();
+	      newSessionPromise.then(function (res) {
+	        _this2.AISessionId = res.AIsessionId;
+	      })["catch"](function (e) {
+	        console.error(e);
+	      });
+	    },
 	    scrollToBottom: function scrollToBottom() {
-	      var _this = this;
+	      var _this3 = this;
 	      this.$nextTick(function () {
-	        var _this$$refs;
-	        var messageContainer = (_this$$refs = _this.$refs) == null ? void 0 : _this$$refs[_this.$props.innerRef];
+	        var _this3$$refs;
+	        var messageContainer = (_this3$$refs = _this3.$refs) == null ? void 0 : _this3$$refs[_this3.$props.innerRef];
 	        if (messageContainer && messageContainer.$el) {
 	          messageContainer.$el.scrollTo({
 	            top: messageContainer.$el.scrollHeight,
@@ -26658,7 +26736,7 @@
 	          "class": "--ai-answer-error-container " + (helper_31(this.$props.innerClass, 'ai-error') || '')
 	        }, [vue.createVNode("div", {
 	          "class": "--default-error-element"
-	        }, [vue.createVNode("span", null, [(_this$error = this.error) != null && _this$error.message ? this.error.message : 'There was an error in generating the response.', ' ', (_this$error2 = this.error) != null && _this$error2.code ? "Code:\n\t\t\t\t\t\t\t" + this.error.code : '']), this.AISessionId && vue.createVNode(Button, {
+	        }, [vue.createVNode("span", null, [(_this$error = this.error) != null && _this$error.message ? this.error.message : 'There was an error in generating the response.', ' ', (_this$error2 = this.error) != null && _this$error2.code ? ", Code:\n\t\t\t\t\t\t\t" + this.error.code : '']), this.AISessionId && vue.createVNode(Button, {
 	          "primary": true,
 	          "onClick": this.handleRetryRequest
 	        }, {
@@ -26670,6 +26748,7 @@
 	      return null;
 	    },
 	    handleKeyPress: function handleKeyPress(e) {
+	      window.console.log('e', e);
 	      if (e.key === 'Enter') {
 	        this.handleSendMessage(e);
 	        this.inputMessage = '';
@@ -26708,7 +26787,7 @@
 	      }
 	    },
 	    renderIcons: function renderIcons() {
-	      var _this2 = this;
+	      var _this4 = this;
 	      var _slot, _slot2;
 	      var _this$$props = this.$props,
 	        getMicInstance = _this$$props.getMicInstance,
@@ -26722,12 +26801,12 @@
 	        "positionType": "absolute"
 	      }, {
 	        "default": function _default() {
-	          return [!_this2.isLoadingState && _this2.AISessionId && _this2.shouldMicRender(showVoiceInput) && vue.createVNode(Mic, {
+	          return [!_this4.isLoadingState && _this4.AISessionId && _this4.shouldMicRender(showVoiceInput) && vue.createVNode(Mic, {
 	            "getInstance": getMicInstance,
 	            "render": renderMic,
-	            "handleResult": _this2.handleVoiceResults,
+	            "handleResult": _this4.handleVoiceResults,
 	            "class": helper_31(innerClass, 'ai-search-mic') || null
-	          }, null), iconPosition === 'right' && vue.createVNode(IconWrapper, null, _isSlot$6(_slot = _this2.renderIcon()) ? _slot : {
+	          }, null), iconPosition === 'right' && vue.createVNode(IconWrapper, null, _isSlot$6(_slot = _this4.renderIcon()) ? _slot : {
 	            "default": function _default() {
 	              return [_slot];
 	            }
@@ -26739,7 +26818,7 @@
 	        "positionType": "absolute"
 	      }, {
 	        "default": function _default() {
-	          return [iconPosition === 'left' && vue.createVNode(IconWrapper, null, _isSlot$6(_slot2 = _this2.renderIcon()) ? _slot2 : {
+	          return [iconPosition === 'left' && vue.createVNode(IconWrapper, null, _isSlot$6(_slot2 = _this4.renderIcon()) ? _slot2 : {
 	            "default": function _default() {
 	              return [_slot2];
 	            }
@@ -26751,7 +26830,7 @@
 	      this.handleSendMessage(e);
 	    },
 	    renderEnterButtonElement: function renderEnterButtonElement() {
-	      var _this3 = this;
+	      var _this5 = this;
 	      var _this$$props2 = this.$props,
 	        enterButton = _this$$props2.enterButton,
 	        innerClass = _this$$props2.innerClass;
@@ -26759,16 +26838,16 @@
 	      if (enterButton) {
 	        var getEnterButtonMarkup = function getEnterButtonMarkup() {
 	          if (renderEnterButton) {
-	            return renderEnterButton(_this3.enterButtonOnClick);
+	            return renderEnterButton(_this5.enterButtonOnClick);
 	          }
 	          return vue.createVNode(SendButton, {
 	            "primary": true,
 	            "type": "submit",
 	            "tabIndex": 0,
-	            "onClick": _this3.handleSendMessage,
-	            "onKeyPress": _this3.handleKeyPress,
+	            "onClick": _this5.handleSendMessage,
+	            "onKeyPress": _this5.handleKeyPress,
 	            "class": "ask-btn " + helper_31(innerClass, 'ai-enter-button'),
-	            "disabled": _this3.isLoadingState || !_this3.AISessionId
+	            "disabled": _this5.isLoadingState || !_this5.AISessionId
 	          }, {
 	            "default": function _default() {
 	              return [vue.createTextVNode("Send")];
@@ -26791,10 +26870,10 @@
 	      return getComponent(data, this);
 	    },
 	    handleTextAreaHeightChange: function handleTextAreaHeightChange() {
-	      var _this$$refs2, _this$$refs2$_inputRe, _this$$refs3, _this$$refs3$_inputWr, _this$$refs4;
-	      var textArea = (_this$$refs2 = this.$refs) == null ? void 0 : (_this$$refs2$_inputRe = _this$$refs2[_inputRef]) == null ? void 0 : _this$$refs2$_inputRe.$el;
-	      var inputWrapper = (_this$$refs3 = this.$refs) == null ? void 0 : (_this$$refs3$_inputWr = _this$$refs3[_inputWrapperRef]) == null ? void 0 : _this$$refs3$_inputWr.$el;
-	      var errorContainer = (_this$$refs4 = this.$refs) == null ? void 0 : _this$$refs4[_errorContainerRef];
+	      var _this$$refs, _this$$refs$_inputRef, _this$$refs2, _this$$refs2$_inputWr, _this$$refs3;
+	      var textArea = (_this$$refs = this.$refs) == null ? void 0 : (_this$$refs$_inputRef = _this$$refs[_inputRef]) == null ? void 0 : _this$$refs$_inputRef.$el;
+	      var inputWrapper = (_this$$refs2 = this.$refs) == null ? void 0 : (_this$$refs2$_inputWr = _this$$refs2[_inputWrapperRef]) == null ? void 0 : _this$$refs2$_inputWr.$el;
+	      var errorContainer = (_this$$refs3 = this.$refs) == null ? void 0 : _this$$refs3[_errorContainerRef];
 	      if (textArea) {
 	        textArea.style.height = '42px';
 	        var lineHeight = parseInt(getComputedStyle(textArea).lineHeight, 10);
@@ -26826,21 +26905,20 @@
 	  },
 	  render: function render() {
 	    var _slot3;
-	    var _this4 = this;
+	    var _this6 = this;
 	    var props = this.$props;
 	    if (!this.shouldShowComponent) {
 	      return null;
 	    }
 	    return vue.createVNode(Chatbox, {
-	      "style": props.style,
-	      "class": "--ai-chat-box-wrapper"
+	      "style": props.style || {}
 	    }, {
 	      "default": function _default() {
-	        return [_this4.$props.title && vue.createVNode(Title, {
-	          "class": helper_31(_this4.$props.innerClass, 'title') || ''
+	        return [_this6.$props.title && vue.createVNode(Title, {
+	          "class": helper_31(_this6.$props.innerClass, 'title') || ''
 	        }, {
 	          "default": function _default() {
-	            return [_this4.$props.title];
+	            return [_this6.$props.title];
 	          }
 	        }), vue.createVNode(ChatContainer, {
 	          "class": "--ai-chat-container",
@@ -26848,33 +26926,33 @@
 	          "showInput": props.showInput
 	        }, {
 	          "default": function _default() {
-	            return [_this4.hasCustomRenderer && vue.createVNode(MessagesContainer, {
-	              "themePreset": _this4.themePreset,
+	            return [_this6.hasCustomRenderer && vue.createVNode(MessagesContainer, {
+	              "themePreset": _this6.themePreset,
 	              "theme": props.theme,
-	              "ref": _this4.$props.innerRef,
+	              "ref": _this6.$props.innerRef,
 	              "class": "--ai-message-container " + (helper_31(props.innerClass, 'ai-message-container') || '')
-	            }, _isSlot$6(_slot3 = _this4.getComponent()) ? _slot3 : {
+	            }, _isSlot$6(_slot3 = _this6.getComponent()) ? _slot3 : {
 	              "default": function _default() {
 	                return [_slot3];
 	              }
-	            }), !_this4.hasCustomRenderer && vue.createVNode(MessagesContainer, {
-	              "themePreset": _this4.themePreset,
+	            }), !_this6.hasCustomRenderer && vue.createVNode(MessagesContainer, {
+	              "themePreset": _this6.themePreset,
 	              "theme": props.theme,
-	              "ref": _this4.$props.innerRef,
+	              "ref": _this6.$props.innerRef,
 	              "class": "--ai-message-container " + (helper_31(props.innerClass, 'ai-message-container') || '')
 	            }, {
 	              "default": function _default() {
-	                return [_this4.messages.map(function (message, index) {
+	                return [_this6.messages.map(function (message, index) {
 	                  return vue.createVNode(Message, {
 	                    "key": index,
 	                    "isSender": message.role === constants_7$1.USER,
 	                    "innerHTML": md$1.render(message.content),
-	                    "themePreset": _this4.themePreset,
+	                    "themePreset": _this6.themePreset,
 	                    "theme": props.theme,
 	                    "class": "--ai-answer-message " + (helper_31(props.innerClass, 'ai-message') || '')
 	                  }, null);
-	                }), _this4.isLoadingState && vue.createVNode(Message, {
-	                  "themePreset": _this4.themePreset,
+	                }), _this6.isLoadingState && vue.createVNode(Message, {
+	                  "themePreset": _this6.themePreset,
 	                  "theme": props.theme,
 	                  "isSender": false,
 	                  "class": "--ai-answer-message " + (helper_31(props.innerClass, 'ai-message') || null)
@@ -26883,31 +26961,31 @@
 	                    return [vue.createVNode(TypingIndicator, null, {
 	                      "default": function _default() {
 	                        return [vue.createVNode(TypingDot, {
-	                          "themePreset": _this4.themePreset
+	                          "themePreset": _this6.themePreset
 	                        }, null), vue.createVNode(TypingDot, {
-	                          "themePreset": _this4.themePreset
+	                          "themePreset": _this6.themePreset
 	                        }, null), vue.createVNode(TypingDot, {
-	                          "themePreset": _this4.themePreset
+	                          "themePreset": _this6.themePreset
 	                        }, null)];
 	                      }
 	                    })];
 	                  }
 	                })];
 	              }
-	            }), _this4.renderErrorComponent(), ' ', props.showFeedback && vue.createVNode("div", {
+	            }), _this6.renderErrorComponent(), ' ', props.showFeedback && vue.createVNode("div", {
 	              "class": "--ai-answer-feedback-container " + (helper_31(props.innerClass, 'ai-feedback') || '')
 	            }, [vue.createVNode(AIFeedback, {
-	              "hideUI": _this4.isLoadingState || !_this4.sessionId,
-	              "key": _this4.sessionId,
+	              "hideUI": _this6.isLoadingState || !_this6.sessionId,
+	              "key": _this6.sessionId,
 	              "onFeedbackSubmit": function onFeedbackSubmit(useful, reason) {
-	                _this4.trackUsefullness(_this4.sessionId, {
+	                _this6.trackUsefullness(_this6.sessionId, {
 	                  useful: useful,
 	                  reason: reason
 	                });
 	              }
 	            }, null)]), props.showInput && vue.createVNode(MessageInputContainer, {
 	              "class": "--ai-input-container",
-	              "onSubmit": _this4.handleSendMessage
+	              "onSubmit": _this6.handleSendMessage
 	            }, {
 	              "default": function _default() {
 	                return [vue.createVNode(InputGroup, {
@@ -26921,23 +26999,21 @@
 	                      "default": function _default() {
 	                        return [vue.createVNode(MessageInput, {
 	                          "ref": _inputRef,
-	                          "type": "text",
 	                          "placeholder": props.placeholder,
 	                          "enterButton": props.enterButton,
-	                          "value": _this4.inputMessage,
-	                          "onInput": _this4.handleMessageInputChange,
-	                          "onKeyPress": _this4.handleKeyPress,
+	                          "value": _this6.inputMessage,
+	                          "onInput": _this6.handleMessageInputChange,
 	                          "id": props.componentId + "-ai-input",
 	                          "showIcon": props.showIcon,
 	                          "iconPosition": props.iconPosition,
-	                          "themePreset": _this4.themePreset,
-	                          "disabled": _this4.isLoadingState || !_this4.AISessionId,
+	                          "themePreset": _this6.themePreset,
+	                          "disabled": _this6.isLoadingState || !_this6.AISessionId,
 	                          "class": helper_31(props.innerClass, 'ai-input') || null
-	                        }, null), ' ', _this4.renderIcons()];
+	                        }, null), ' ', _this6.renderIcons()];
 	                      }
 	                    })];
 	                  }
-	                }), _this4.renderEnterButtonElement()];
+	                }), _this6.renderEnterButtonElement()];
 	              }
 	            }), ' '];
 	          }
@@ -26964,12 +27040,14 @@
 	    rawData: state.rawData[props.componentId],
 	    themePreset: state.config.themePreset,
 	    isLoading: state.isLoading[props.componentId] || false,
-	    sessionIdFromStore: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].response && state.AIResponses[props.componentId].response.sessionId || ''
+	    sessionIdFromStore: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].response && state.AIResponses[props.componentId].response.sessionId || '',
+	    componentError: state.error[props.componentId]
 	  };
 	};
 	var mapDispatchToProps$3 = {
 	  getAIResponse: query_7,
-	  trackUsefullness: analytics_8
+	  trackUsefullness: analytics_8,
+	  createAISession: query_8
 	};
 	var AIConnected = PreferencesConsumer(ComponentWrapper$1(connect(mapStateToProps$4, mapDispatchToProps$3)(AIAnswer), {
 	  componentType: constants_1$1.AIAnswer,
@@ -39950,7 +40028,7 @@
 	  }, queryString, renderFunction);
 	}
 
-	var version = "3.0.0-rc.6.3";
+	var version = "3.0.0-rc.6.5";
 
 	var components = [RLConnected, ResultCard, ResultList, ReactiveBase, SBConnected, ListConnected, ListConnected$1, RangeConnected$1, RangeConnected$2, RangeConnected$3, RangeConnected, RcConnected, RcConnected$1, RcConnected$2, TBConnected, ListConnected$2, ListConnected$3, StateProviderConnected, RangeConnected$4, TreeListConnected, AIConnected];
 	function install$1 (Vue) {