bibot 1.0.55 → 1.0.57

package/dist/index.js

@@ -3827,12 +3827,12 @@ function SendMessageIcon(_ref) {
   return React__default.createElement("svg", {
     xmlns: 'http://www.w3.org/2000/svg',
     className: 'icon icon-tabler icon-tabler-send-2',
-    width: '24',
-    height: '24',
+    width: '36',
+    height: '36',
     viewBox: '0 0 24 24',
     strokeWidth: '1.5',
     stroke: color,
-    fill: 'none',
+    fill: '#d7d7d7',
     strokeLinecap: 'round',
     strokeLinejoin: 'round'
   }, React__default.createElement("path", {
@@ -4129,16 +4129,7 @@ var PredefinedQuestions = function PredefinedQuestions(_ref) {
       flexDirection: 'column',
       textAlign: 'center'
     }
-  }, React.createElement(Avatar, {
-    borderColor: chatBubbleConfig === null || chatBubbleConfig === void 0 ? void 0 : chatBubbleConfig.color,
-    width: '40px',
-    height: '40px',
-    source: chatBubbleConfig === null || chatBubbleConfig === void 0 ? void 0 : chatBubbleConfig.logo_url
-  }), React.createElement("h5", {
-    style: {
-      marginBlock: '0.5px'
-    }
-  }, chatBubbleConfig !== null && chatBubbleConfig !== void 0 && chatBubbleConfig.knownUser ? "Hello " + chatBubbleConfig.knownUser : 'Welcome!'), React.createElement("p", {
+  }, React.createElement("p", {
     style: {
       fontSize: '14px'
     }
@@ -4147,13 +4138,13 @@ var PredefinedQuestions = function PredefinedQuestions(_ref) {
     return React.createElement("div", {
       key: index,
       style: {
-        backgroundColor: 'transparent',
-        border: "0.5px solid " + (chatBubbleConfig ? (_chatBubbleConfig$col = chatBubbleConfig === null || chatBubbleConfig === void 0 ? void 0 : chatBubbleConfig.color) != null ? _chatBubbleConfig$col : '#dedede' : '#000'),
+        backgroundColor: '#fafafa',
+        border: "0.3px solid " + (chatBubbleConfig ? (_chatBubbleConfig$col = chatBubbleConfig === null || chatBubbleConfig === void 0 ? void 0 : chatBubbleConfig.color) != null ? _chatBubbleConfig$col : '#dedede' : '#000'),
         fontSize: '16px',
         margin: '7px',
         textAlign: 'start',
-        padding: '10px',
-        borderRadius: '6px',
+        padding: '14px',
+        borderRadius: '50px',
         cursor: 'pointer'
       },
       onClick: function onClick() {
@@ -4181,13 +4172,13 @@ var AiFollowUps = function AiFollowUps(_ref) {
     return React.createElement("div", {
       key: index,
       style: {
-        backgroundColor: 'transparent',
-        border: "0.5px solid " + (chatBubbleConfig ? (_chatBubbleConfig$col = chatBubbleConfig === null || chatBubbleConfig === void 0 ? void 0 : chatBubbleConfig.color) != null ? _chatBubbleConfig$col : '#dedede' : '#000'),
+        backgroundColor: '#fafafa',
+        border: "0.3px solid " + (chatBubbleConfig ? (_chatBubbleConfig$col = chatBubbleConfig === null || chatBubbleConfig === void 0 ? void 0 : chatBubbleConfig.color) != null ? _chatBubbleConfig$col : '#dedede' : '#000'),
         fontSize: '16px',
         margin: '7px',
         textAlign: 'start',
-        padding: '10px',
-        borderRadius: '6px',
+        padding: '14px',
+        borderRadius: '50px',
         cursor: 'pointer'
       },
       onClick: function onClick() {
@@ -4231,13 +4222,13 @@ var ChatBubbleBiBot = function ChatBubbleBiBot(bibotProps) {
       position: 'absolute',
       bottom: '60px',
       right: '25px',
-      width: 350,
-      height: 500,
+      width: 370,
+      height: 550,
       borderRadius: 10,
       display: 'flex',
       flexDirection: 'column',
       justifyContent: 'space-between',
-      border: "0.5px solid " + (chatBubbleConfig === null || chatBubbleConfig === void 0 ? void 0 : chatBubbleConfig.color)
+      boxShadow: '0 4px 8px 0 rgba(0, 0, 0, 0.2)'
     }
   }, React.createElement("div", {
     className: styles['chat-header'],
@@ -4250,7 +4241,7 @@ var ChatBubbleBiBot = function ChatBubbleBiBot(bibotProps) {
       alignItems: 'center',
       justifyContent: 'flex-start',
       paddingInline: 15,
-      paddingBlock: 10
+      paddingBlock: 25
     }
   }, React.createElement("div", {
     style: {
@@ -4260,10 +4251,10 @@ var ChatBubbleBiBot = function ChatBubbleBiBot(bibotProps) {
       fontWeight: 'bold'
     }
   }, React.createElement(Avatar, {
-    borderColor: isLoading ? '#fff' : chatBubbleConfig === null || chatBubbleConfig === void 0 ? void 0 : chatBubbleConfig.color,
+    borderColor: 'transparent',
     indicator: isOnline ? 'green' : '#dedede',
-    width: '40px',
-    height: '40px',
+    width: '70px',
+    height: '70px',
     source: chatBubbleConfig === null || chatBubbleConfig === void 0 ? void 0 : chatBubbleConfig.logo_url
   })), React.createElement("div", {
     style: {
@@ -4281,13 +4272,11 @@ var ChatBubbleBiBot = function ChatBubbleBiBot(bibotProps) {
     }
   }, chatBubbleConfig === null || chatBubbleConfig === void 0 ? void 0 : chatBubbleConfig.title), isLoading ? React.createElement("span", {
     style: {
-      fontSize: '12px',
-      lineHeight: '0.9'
+      fontSize: '12px'
     }
   }, "Typing...") : React.createElement("span", {
     style: {
-      fontSize: '12px',
-      lineHeight: '0.9'
+      fontSize: '12px'
     }
   }, isOnline ? 'Online' : 'Offline'))), React.createElement("div", {
     className: styles['message-list'],
@@ -4321,14 +4310,24 @@ var ChatBubbleBiBot = function ChatBubbleBiBot(bibotProps) {
     }, message.text) : React.createElement("div", {
       key: index,
       style: {
-        display: 'flex'
+        display: 'flex',
+        flexDirection: 'column'
+      }
+    }, React.createElement("div", {
+      style: {
+        display: 'flex',
+        alignItems: 'center'
       }
-    }, React.createElement(Avatar, {
-      borderColor: isLoading ? '#fff' : chatBubbleConfig === null || chatBubbleConfig === void 0 ? void 0 : chatBubbleConfig.color,
+    }, "  ", React.createElement(Avatar, {
+      borderColor: '#fff',
       width: '20px',
       height: '20px',
       source: chatBubbleConfig === null || chatBubbleConfig === void 0 ? void 0 : chatBubbleConfig.logo_url
-    }), React.createElement("div", {
+    }), React.createElement("small", {
+      style: {
+        marginLeft: 10
+      }
+    }, " ", chatBubbleConfig.title, " ")), React.createElement("div", {
       className: "message " + message.sender,
       style: {
         marginBottom: 10,
@@ -4339,7 +4338,8 @@ var ChatBubbleBiBot = function ChatBubbleBiBot(bibotProps) {
         fontSize: '15px',
         backgroundColor: '#f0f0f0',
         color: '#000',
-        textAlign: 'left'
+        textAlign: 'left',
+        marginTop: 5
       }
     }, message.text));
   }), aiFollowUpQs && !isLoading && React.createElement(AiFollowUps, {
@@ -4360,8 +4360,6 @@ var ChatBubbleBiBot = function ChatBubbleBiBot(bibotProps) {
       alignItems: 'center',
       borderTop: '1px solid #d7d7d7',
       padding: 10,
-      borderBottomLeftRadius: 8,
-      borderBottomRightRadius: 8,
       backgroundColor: '#fff'
     }
   }, React.createElement("input", {
@@ -4379,12 +4377,12 @@ var ChatBubbleBiBot = function ChatBubbleBiBot(bibotProps) {
     value: userInput,
     onChange: handleUserInput,
     onKeyDown: handleKeyPress,
-    placeholder: 'Ask a question'
+    placeholder: 'Type your message here'
   }), React.createElement("button", {
     disabled: isLoading != null ? isLoading : true,
     style: {
       backgroundColor: 'transparent',
-      color: isLoading ? '#dedede' : chatBubbleConfig === null || chatBubbleConfig === void 0 ? void 0 : chatBubbleConfig.color,
+      color: '#dedede',
       border: 'none',
       cursor: 'pointer'
     },
@@ -4392,8 +4390,37 @@ var ChatBubbleBiBot = function ChatBubbleBiBot(bibotProps) {
       return sendInputInquiry();
     }
   }, React.createElement(SendMessageIcon, {
-    color: isLoading ? '#fff' : chatBubbleConfig === null || chatBubbleConfig === void 0 ? void 0 : chatBubbleConfig.color
-  })))), React.createElement("div", {
+    color: '#fff'
+  }))), React.createElement("div", {
+    style: {
+      backgroundColor: '#f9f9f9',
+      minHeight: 45,
+      display: 'flex',
+      flexDirection: 'column',
+      alignItems: 'center',
+      justifyContent: 'center',
+      borderTop: '1px solid #f9f9f9',
+      borderBottomLeftRadius: 10,
+      borderBottomRightRadius: 10
+    }
+  }, React.createElement("a", {
+    href: 'https://bibot.app',
+    target: '_blank',
+    style: {
+      textDecoration: 'none'
+    }
+  }, " ", React.createElement("small", {
+    style: {
+      color: '#9ba6b2',
+      fontSize: 10,
+      marginBlock: 5
+    }
+  }, "Powered by ", React.createElement("span", {
+    style: {
+      fontWeight: 'bold',
+      color: '#1f4760'
+    }
+  }, "BIBOT"))))), React.createElement("div", {
     style: {
       display: 'flex',
       alignItems: 'center',
@@ -4404,8 +4431,15 @@ var ChatBubbleBiBot = function ChatBubbleBiBot(bibotProps) {
       fontSize: '12px',
       color: chatBubbleConfig === null || chatBubbleConfig === void 0 ? void 0 : chatBubbleConfig.color,
       textAlign: 'left',
-      marginRight: '8px',
-      whiteSpace: 'nowrap'
+      marginRight: '5px',
+      whiteSpace: 'nowrap',
+      backgroundColor: '#fff',
+      padding: 15,
+      borderTopRightRadius: 30,
+      borderTopLeftRadius: 10,
+      borderBottomLeftRadius: 10,
+      marginBottom: 60,
+      boxShadow: '0 4px 8px 0 rgba(0, 0, 0, 0.2)'
     }
   }, greeting), React.createElement("button", {
     onClick: toggleChat,