react-chat-plugin/dist/main.js

A chat widget for react app

module.exports=function(e){var n={};function t(r){if(n[r])return n[r].exports;var a=n[r]={i:r,l:!1,exports:{}};return e[r].call(a.exports,a,a.exports,t),a.l=!0,a.exports}return t.m=e,t.c=n,t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{enumerable:!0,get:r})},t.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},t.t=function(e,n){if(1&n&&(e=t(e)),8&n)return e;if(4&n&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(t.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&n&&"string"!=typeof e)for(var a in e)t.d(r,a,function(n){return e[n]}.bind(null,a));return r},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},t.p="",t(t.s=10)}([function(e,n){e.exports=require("react")},function(e,n){e.exports=require("prop-types")},function(e,n){e.exports=require("moment")},function(e,n,t){"use strict";var r,a=function(){return void 0===r&&(r=Boolean(window&&document&&document.all&&!window.atob)),r},o=function(){var e={};return function(n){if(void 0===e[n]){var t=document.querySelector(n);if(window.HTMLIFrameElement&&t instanceof window.HTMLIFrameElement)try{t=t.contentDocument.head}catch(e){t=null}e[n]=t}return e[n]}}(),i=[];function c(e){for(var n=-1,t=0;t<i.length;t++)if(i[t].identifier===e){n=t;break}return n}function l(e,n){for(var t={},r=[],a=0;a<e.length;a++){var o=e[a],l=n.base?o[0]+n.base:o[0],s=t[l]||0,d="".concat(l," ").concat(s);t[l]=s+1;var u=c(d),f={css:o[1],media:o[2],sourceMap:o[3]};-1!==u?(i[u].references++,i[u].updater(f)):i.push({identifier:d,updater:g(f,n),references:1}),r.push(d)}return r}function s(e){var n=document.createElement("style"),r=e.attributes||{};if(void 0===r.nonce){var a=t.nc;a&&(r.nonce=a)}if(Object.keys(r).forEach((function(e){n.setAttribute(e,r[e])})),"function"==typeof e.insert)e.insert(n);else{var i=o(e.insert||"head");if(!i)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");i.appendChild(n)}return n}var d,u=(d=[],function(e,n){return d[e]=n,d.filter(Boolean).join("\n")});function f(e,n,t,r){var a=t?"":r.media?"@media ".concat(r.media," {").concat(r.css,"}"):r.css;if(e.styleSheet)e.styleSheet.cssText=u(n,a);else{var o=document.createTextNode(a),i=e.childNodes;i[n]&&e.removeChild(i[n]),i.length?e.insertBefore(o,i[n]):e.appendChild(o)}}function h(e,n,t){var r=t.css,a=t.media,o=t.sourceMap;if(a?e.setAttribute("media",a):e.removeAttribute("media"),o&&"undefined"!=typeof btoa&&(r+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(o))))," */")),e.styleSheet)e.styleSheet.cssText=r;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(r))}}var p=null,m=0;function g(e,n){var t,r,a;if(n.singleton){var o=m++;t=p||(p=s(n)),r=f.bind(null,t,o,!1),a=f.bind(null,t,o,!0)}else t=s(n),r=h.bind(null,t,n),a=function(){!function(e){if(null===e.parentNode)return!1;e.parentNode.removeChild(e)}(t)};return r(e),function(n){if(n){if(n.css===e.css&&n.media===e.media&&n.sourceMap===e.sourceMap)return;r(e=n)}else a()}}e.exports=function(e,n){(n=n||{}).singleton||"boolean"==typeof n.singleton||(n.singleton=a());var t=l(e=e||[],n);return function(e){if(e=e||[],"[object Array]"===Object.prototype.toString.call(e)){for(var r=0;r<t.length;r++){var a=c(t[r]);i[a].references--}for(var o=l(e,n),s=0;s<t.length;s++){var d=c(t[s]);0===i[d].references&&(i[d].updater(),i.splice(d,1))}t=o}}}},function(e,n,t){"use strict";e.exports=function(e){var n=[];return n.toString=function(){return this.map((function(n){var t=function(e,n){var t=e[1]||"",r=e[3];if(!r)return t;if(n&&"function"==typeof btoa){var a=(i=r,c=btoa(unescape(encodeURIComponent(JSON.stringify(i)))),l="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(c),"/*# ".concat(l," */")),o=r.sources.map((function(e){return"/*# sourceURL=".concat(r.sourceRoot||"").concat(e," */")}));return[t].concat(o).concat([a]).join("\n")}var i,c,l;return[t].join("\n")}(n,e);return n[2]?"@media ".concat(n[2]," {").concat(t,"}"):t})).join("")},n.i=function(e,t,r){"string"==typeof e&&(e=[[null,e,""]]);var a={};if(r)for(var o=0;o<this.length;o++){var i=this[o][0];null!=i&&(a[i]=!0)}for(var c=0;c<e.length;c++){var l=[].concat(e[c]);r&&a[l[0]]||(t&&(l[2]?l[2]="".concat(t," and ").concat(l[2]):l[2]=t),n.push(l))}},n}},function(e,n){e.exports=require("react-textarea-autosize")},function(e,n,t){var r=t(3),a=t(7);"string"==typeof(a=a.__esModule?a.default:a)&&(a=[[e.i,a,""]]);var o={insert:"head",singleton:!1};r(a,o);e.exports=a.locals||{}},function(e,n,t){(n=t(4)(!1)).push([e.i,".react-chat-container {\n  width: 100%;\n  /* padding-right: 15px;\n  padding-left: 15px;\n  margin-right: auto;\n  margin-left: auto; */\n}\n\n.react-chat-row {\n  display: flex;\n  flex-wrap: wrap;\n  /* margin-right: -15px;\n  margin-left: -15px; */\n}\n\n@media (min-width: 1200px) {\n  .react-chat-container {\n    max-width: 1140px;\n  }\n}\n\n@media (min-width: 992px) {\n  .react-chat-container {\n    max-width: 960px;\n  }\n}\n\n@media (min-width: 768px) {\n  .react-chat-container {\n    max-width: 720px;\n  }\n}\n\n@media (min-width: 576px) {\n  .react-chat-container {\n    max-width: 540px;\n  }\n}\n\n.react-chat-viewerBox {\n  border-color: rgba(33, 37, 41, 0.15);\n  color: #212529;\n  background-color: #fff;\n  min-height: 300px;\n  height: 60vh;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  /* width: 400px;\n  max-width: 500px; */\n  /* margin: auto 20px; */\n  border-width: 1px;\n  border-style: solid;\n  outline: 0;\n}\n\n.react-chat-messagesList {\n  display: flex;\n  flex: 1 1 auto;\n  flex-direction: column;\n  align-items: flex-start;\n  overflow-x: hidden;\n  overflow-y: auto;\n  overscroll-behavior-y: contain;\n  scroll-behavior: smooth;\n  border-width: 0 0 1px 0;\n  border-style: solid;\n  border-color: inherit;\n}\n\n.react-chat-messagesListContent {\n  padding: 16px 16px;\n  width: 100%;\n  box-sizing: border-box;\n  position: relative;\n  flex: 0 0 auto;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  overflow: hidden;\n}\n\n.react-chat-messageBox {\n  max-width: 80%;\n  background: none;\n  box-sizing: border-box;\n  display: flex;\n  flex-shrink: 0;\n  flex-direction: column;\n  position: relative;\n}\n\n.react-chat-messageBoxLeft {\n  padding-left: 40px;\n  align-items: flex-start;\n  text-align: left;\n}\n\n.react-chat-messageBoxRight {\n  padding-right: 40px;\n  align-self: flex-end;\n  align-items: flex-end;\n  text-align: right;\n}\n\n.react-chat-message-buttonGroupLeft a {\n  text-align: center;\n  color: #212529;\n}\n\n.react-chat-message-buttonGroupRight a {\n  text-align: center;\n  color: #007bff;\n}\n\n.react-chat-message-button {\n  cursor: pointer;\n  display: inline-block;\n  background-color: #fff;\n  width: 100%;\n  border-radius: 12px;\n  padding: 5px;\n  margin: 2px !important;\n}\n\n.react-chat-message-button:hover {\n  text-decoration: none;\n}\n\n.react-chat-message {\n  max-width: 100%;\n  margin: 2px 0 0;\n  position: relative;\n  transition: margin 0.2s ease-in-out;\n}\n\n.react-chat-messageLeft {\n  align-items: flex-start;\n  text-align: left;\n}\n\n.react-chat-messageRight {\n  align-self: flex-end;\n  align-items: flex-end;\n  text-align: right;\n}\n\n.react-chat-bubble {\n  transition: box-shadow 0.2s ease-in-out;\n  order: -1;\n  box-shadow: none;\n  border-radius: 12px;\n  padding: 8px 16px;\n  border-width: 1px;\n  border-style: solid;\n  line-height: 1.25;\n  word-wrap: break-word;\n  font-size: 1rem;\n  width: fit-content;\n  text-align: left;\n  word-break: break-word;\n  white-space: break-spaces;\n}\n\n.react-chat-leftBubble {\n  border-bottom-left-radius: 2px;\n  border-color: #e4e7eb;\n  color: #212529;\n  background-color: #e4e7eb;\n  float: left;\n}\n\n.react-chat-rightBubble {\n  border-bottom-right-radius: 2px;\n  border-color: #007bff;\n  color: #fff;\n  background-color: #007bff;\n  float: right;\n}\n\n.react-chat-avatar {\n  border-radius: 100%;\n  width: 32px;\n  height: 32px;\n  margin: 0;\n  position: absolute;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  vertical-align: middle;\n  border-style: none;\n  bottom: 20px;\n}\n\n.react-chat-avatarLeft {\n  left: 0;\n}\n\n.react-chat-avatarRight {\n  right: 0;\n}\n\n.react-chat-inputBox {\n  /*border-color: inherit;*/\n  color: #212529;\n  background-color: #fff;\n  padding: 10px 16px;\n  /*    border-width: 1px 0 0;\n    border-style: solid;*/\n  flex: 0 0 auto;\n  display: flex;\n  flex-direction: row;\n  flex-wrap: nowrap;\n}\n\n.disabled {\n  opacity: 0.3;\n  background-color: #e4e7eb;\n}\n\n.react-chat-textarea {\n  margin: 0;\n  padding: 0;\n  border: 0;\n  font: inherit;\n  background: none;\n  flex: 1 1 auto;\n  width: 100%;\n  box-sizing: border-box;\n  outline: 0;\n  color: inherit;\n  display: flex;\n  align-items: center;\n  -webkit-appearance: none;\n  resize: none;\n}\n\n.react-chat-sendButton {\n  padding: 0;\n  border-color: transparent !important;\n  color: inherit;\n  background: none !important;\n  box-shadow: none !important;\n  transition: color 0.2s ease-in-out;\n  border-radius: 0.25rem;\n  box-sizing: border-box;\n  border-width: 1px;\n  border-style: solid;\n  font-size: 1rem;\n  line-height: 1.5;\n  font-family: inherit;\n  text-align: center;\n  text-decoration: none;\n  white-space: nowrap;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  vertical-align: middle;\n  user-select: none;\n  cursor: pointer;\n  outline: none;\n  -webkit-appearance: none;\n  position: relative;\n}\n\n.react-chat-SendIcon:hover {\n  fill: #007bff;\n}\n\n.react-chat-SendIcon-disable {\n  fill: #212529;\n  cursor: auto;\n}\n\n.react-chat-additional {\n  width: 100%;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  color: #5f6368;\n  font-size: 13px;\n}\n\n.react-chat-bubbleWithError {\n  position: relative;\n}\n\n.react-chat-error {\n  position: absolute;\n  fill: red;\n}\n\n.react-chat-errorLeft {\n  right: -30px;\n}\n\n.react-chat-errorRight {\n  left: -30px;\n}\n\n.react-chat-notification {\n  width: 100%;\n  word-break: break-word;\n  margin-top: 3px !important;\n  margin-bottom: 3px !important;\n}\n\n.text-center {\n  text-align: center!important;\n}\n\n.react-chat-typing-indicator {\n  background-color: #e4e7eb;\n  width: auto;\n  border-radius: 50px;\n  /*padding: 20px;*/\n  display: table;\n  margin: 0 auto;\n  position: relative;\n}\n\n.react-chat-typing-indicator span {\n  height: 1rem;\n  width: 1rem;\n  float: left;\n  margin: 0 1px;\n  background-color: #9e9ea1;\n  display: block;\n  border-radius: 50%;\n  opacity: 0.4;\n}\n\n.react-chat-typing-indicator span:nth-of-type(1) {\n  -webkit-animation: 1s blink infinite 0.3333s;\n  animation: 1s blink infinite 0.3333s;\n}\n.react-chat-typing-indicator span:nth-of-type(2) {\n  -webkit-animation: 1s blink infinite 0.6666s;\n  animation: 1s blink infinite 0.6666s;\n}\n.react-chat-typing-indicator span:nth-of-type(3) {\n  -webkit-animation: 1s blink infinite 0.9999s;\n  animation: 1s blink infinite 0.9999s;\n}\n\n@-webkit-keyframes blink {\n  50% {\n    opacity: 1;\n  }\n}\n\n@keyframes blink {\n  50% {\n    opacity: 1;\n  }\n}\n@-webkit-keyframes bulge {\n  50% {\n    -webkit-transform: scale(1.05);\n    transform: scale(1.05);\n  }\n}\n@keyframes bulge {\n  50% {\n    -webkit-transform: scale(1.05);\n    transform: scale(1.05);\n  }\n}\n",""]),e.exports=n},function(e,n,t){var r=t(3),a=t(9);"string"==typeof(a=a.__esModule?a.default:a)&&(a=[[e.i,a,""]]);var o={insert:"head",singleton:!1};r(a,o);e.exports=a.locals||{}},function(e,n,t){(n=t(4)(!1)).push([e.i,".react-chat-frame {\n  border: 0px;\n  background-color: transparent;\n  /*pointer-events: none;*/\n  z-index: 2147483639;\n  position: fixed;\n  bottom: 0px;\n  /* width: 280px; */\n  /*height: 224px;*/\n  overflow: hidden;\n  opacity: 1;\n  max-width: 100%;\n  right: 0px;\n  max-height: 100%;\n}\n\n.react-chat-frame-wrapper {\n  /* user-select: all; */\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  /* justify-content: flex-end; */\n  height: 100%;\n  /* width: 100%; */\n  /* max-width: 100%; */\n  max-height: 100%;\n  margin: 20px;\n  /* margin-bottom: 20px; */\n}\n\n.react-chat-frame-custom {\n  user-select: none;\n  max-width: 100%;\n  margin: 20px 0px 0px 20px;\n  display: flex;\n  flex-direction: column;\n}\n\n.react-chat-frame-icon-container {\n  width: 60px;\n  height: 60px;\n  border-radius: 25%;\n  display: flex;\n  align-items: center;\n  box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.06);\n  overflow: hidden;\n  margin: 20px 0px 0px 20px;\n  transition: all 0.3s;\n  pointer-events: all;\n  cursor: pointer;\n  background: rgb(0, 108, 255);\n  fill: white;\n}\n\n.react-chat-frame-icon-container:hover {\n  opacity: .8!important;\n}\n\n.react-chat-frame-icon {\n  margin: 0 auto;\n  display: block;\n}\n\n.react-chat-close-icon {\n  width: 15px;\n  height: 15px;\n  margin-bottom: 15px;\n  fill: rgba(33, 37, 41, 0.45);\n  cursor: pointer;\n}\n",""]),e.exports=n},function(e,n,t){"use strict";t.r(n),t.d(n,"ChatFrame",(function(){return q}));var r=t(0),a=t.n(r),o=t(1),i=t.n(o),c=["shiftKey","ctrlKey"],l=t(5),s=t.n(l),d=function(e){return e.replace(/^\s+|\s+$/g,"")};function u(){return(u=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e}).apply(this,arguments)}var f=r.createElement("path",{d:"M2.01 21L23 12 2.01 3 2 10l15 2-15 2z"}),h=r.createElement("path",{d:"M0 0h24v24H0z",fill:"none"});var p=function(e){return r.createElement("svg",u({xmlns:"http://www.w3.org/2000/svg",width:"1.5em",height:"1.5em",viewBox:"0 0 24 24"},e),f,h)};function m(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,n){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(e)))return;var t=[],r=!0,a=!1,o=void 0;try{for(var i,c=e[Symbol.iterator]();!(r=(i=c.next()).done)&&(t.push(i.value),!n||t.length!==n);r=!0);}catch(e){a=!0,o=e}finally{try{r||null==c.return||c.return()}finally{if(a)throw o}}return t}(e,n)||function(e,n){if(!e)return;if("string"==typeof e)return g(e,n);var t=Object.prototype.toString.call(e).slice(8,-1);"Object"===t&&e.constructor&&(t=e.constructor.name);if("Map"===t||"Set"===t)return Array.from(e);if("Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return g(e,n)}(e,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function g(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,r=new Array(n);t<n;t++)r[t]=e[t];return r}function b(e){var n=m(Object(r.useState)(""),2),t=n[0],o=n[1],i=function(n){e.onSendMessage(n),o("")};return a.a.createElement("div",{className:"react-chat-inputBox ".concat(e.disabled?"disabled":"")},a.a.createElement(s.a,{maxRows:3,className:"react-chat-textarea",placeholder:e.disabled?e.disabledInputPlaceholder:e.placeholder,value:t,onChange:function(e){o(e.target.value)},onKeyPress:function(n){if((void 0===e.onSendKey||n[e.onSendKey])&&13===n.charCode){var r=d(t);return r.length&&i(r),n.preventDefault(),!1}},autoFocus:!0,disabled:e.disabled}),a.a.createElement("button",{className:"react-chat-sendButton",onClick:function(e){var n=d(t);n.length&&i(n)},disabled:e.disabled},a.a.createElement(p,{className:e.disabled?"react-chat-SendIcon-disable":"react-chat-SendIcon"})))}b.propTypes={onSendMessage:i.a.func.isRequired,disabled:i.a.bool,disabledInputPlaceholder:i.a.string,placeholder:i.a.string,onSendKey:i.a.oneOf(c)};var x=t(2),v=t.n(x);function y(){return(y=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e}).apply(this,arguments)}var w=r.createElement("path",{d:"M0 0h24v24H0z",fill:"none"}),A=r.createElement("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z"});var k=function(e){return r.createElement("svg",y({xmlns:"http://www.w3.org/2000/svg",width:24,height:24},e),w,A)};var E=function(e){var n=e.type,t=e.timestamp,r=e.timestampFormat,o=e.buttons,i=e.left,c=e.author,l=e.hasError,s=e.text;if("text"===n||"indicator"===n){var d;t&&(d="calendar"===r?v()(t).calendar():"fromNow"===r?v()(t).fromNow():v()(t).format(r));var u=o?o.map((function(e,n){if("URL"===e.type)return a.a.createElement("a",{key:n,href:e.payload,rel:"noreferrer",target:"_blank",className:"react-chat-message-button"},e.title)})):[];return a.a.createElement("div",{className:"react-chat-messageBox ".concat(i?"react-chat-messageBoxLeft":"react-chat-messageBoxRight")},a.a.createElement("img",{alt:"avater img",src:c.avatarUrl?c.avatarUrl:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYAQMAAADaua+7AAAABlBMVEUAgAAAgAAvApEWAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAFklEQVQImWNgIAFwMDSAaWYGA2K1AAAiqQC8t2zWVgAAAABJRU5ErkJggg==",className:"react-chat-avatar ".concat(i?"react-chat-avatarLeft":"react-chat-avatarRight")}),a.a.createElement("div",{className:"react-chat-message ".concat(i?"react-chat-messageLeft":"react-chat-messageRight")},a.a.createElement("div",{className:"react-chat-additional"},c.username),a.a.createElement("div",{className:"react-chat-bubble ".concat(i?"react-chat-leftBubble":"react-chat-rightBubble"," ").concat(l?"react-chat-bubbleWithError":"")},"indicator"===n&&a.a.createElement("div",{className:"react-chat-typing-indicator"},a.a.createElement("span",null),a.a.createElement("span",null),a.a.createElement("span",null)),s,u.length>0&&a.a.createElement("div",{className:i?"react-chat-message-buttonGroupLeft":"react-chat-message-buttonGroupRight"},u),l&&a.a.createElement(k,{className:"".concat(i?"react-chat-errorLeft":"react-chat-errorRight"," react-chat-error")})),a.a.createElement("div",{className:"react-chat-additional"},null!==d&&d)))}if("notification"===n)return a.a.createElement("div",{className:"text-center text-secondary react-chat-notification"},s)};t(6);function S(e){return(S="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function O(){return(O=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e}).apply(this,arguments)}function j(e,n){for(var t=0;t<n.length;t++){var r=n[t];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function N(e,n){return(N=Object.setPrototypeOf||function(e,n){return e.__proto__=n,e})(e,n)}function M(e){var n=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Date.prototype.toString.call(Reflect.construct(Date,[],(function(){}))),!0}catch(e){return!1}}();return function(){var t,r=L(e);if(n){var a=L(this).constructor;t=Reflect.construct(r,arguments,a)}else t=r.apply(this,arguments);return C(this,t)}}function C(e,n){return!n||"object"!==S(n)&&"function"!=typeof n?B(e):n}function B(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function L(e){return(L=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}var I=function(e){!function(e,n){if("function"!=typeof n&&null!==n)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(n&&n.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),n&&N(e,n)}(i,e);var n,t,r,o=M(i);function i(e){var n;return function(e,n){if(!(e instanceof n))throw new TypeError("Cannot call a class as a function")}(this,i),(n=o.call(this,e)).scrollToBottom=n.scrollToBottom.bind(B(n)),n.handleOnSendMessage=n.handleOnSendMessage.bind(B(n)),n}return n=i,(t=[{key:"scrollToBottom",value:function(){this.messagesList&&(this.messagesList.scrollTop=this.messagesList.scrollHeight-this.messagesList.clientHeight)}},{key:"componentDidMount",value:function(){this.scrollToBottom()}},{key:"componentDidUpdate",value:function(){this.scrollToBottom()}},{key:"handleOnSendMessage",value:function(e){this.props.onSendMessage(e)}},{key:"render",value:function(){var e=this,n=this.props,t=n.messages,r=n.userId,o=n.timestampFormat,i=n.height,c=n.width,l=n.disableInput,s=n.disabledInputPlaceholder,d=n.placeholder,u=n.style,f=n.showTypingIndicator,h=n.activeAuthor,p=n.onSendKey,m=t.map((function(e,n){return a.a.createElement(E,O({key:n,left:e.author&&e.author.id!==r,timestampFormat:o},e))}));return a.a.createElement("div",{style:u,className:"react-chat-container"},a.a.createElement("div",{className:"react-chat-row"},a.a.createElement("div",{className:"react-chat-viewerBox",style:{height:i,width:c}},a.a.createElement("div",{className:"react-chat-messagesList",ref:function(n){return e.messagesList=n}},a.a.createElement("div",{className:"react-chat-messagesListContent"},m,f&&null!==h&&a.a.createElement(E,{type:"indicator",author:h,text:"",left:!0}))),a.a.createElement(b,{onSendMessage:this.handleOnSendMessage,disabled:l,placeholder:d,disabledInputPlaceholder:s,onSendKey:p}))))}}])&&j(n.prototype,t),r&&j(n,r),i}(a.a.Component);I.propTypes={messages:i.a.array,userId:i.a.oneOfType([i.a.string,i.a.number]).isRequired,onSendMessage:i.a.func.isRequired,timestampFormat:i.a.oneOf(["calendar","fromNow"]),width:i.a.string,height:i.a.string,disableInput:i.a.bool,disabledInputPlaceholder:i.a.string,placeholder:i.a.string,style:i.a.object,showTypingIndicator:i.a.bool,activeAuthor:i.a.object,onSendKey:i.a.oneOf(c)},I.defaultProps={messages:[],timestampFormat:"calendar",disableInput:!1,disabledInputPlaceholder:"",placeholder:"",showTypingIndicator:!1,activeAuthor:null};var R=I;function T(){return(T=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e}).apply(this,arguments)}var P=r.createElement("path",{d:"M532 386.2c27.5-27.1 44-61.1 44-98.2 0-80-76.5-146.1-176.2-157.9C368.3 72.5 294.3 32 208 32 93.1 32 0 103.6 0 192c0 37 16.5 71 44 98.2-15.3 30.7-37.3 54.5-37.7 54.9-6.3 6.7-8.1 16.5-4.4 25 3.6 8.5 12 14 21.2 14 53.5 0 96.7-20.2 125.2-38.8 9.2 2.1 18.7 3.7 28.4 4.9C208.1 407.6 281.8 448 368 448c20.8 0 40.8-2.4 59.8-6.8C456.3 459.7 499.4 480 553 480c9.2 0 17.5-5.5 21.2-14 3.6-8.5 1.9-18.3-4.4-25-.4-.3-22.5-24.1-37.8-54.8zm-392.8-92.3L122.1 305c-14.1 9.1-28.5 16.3-43.1 21.4 2.7-4.7 5.4-9.7 8-14.8l15.5-31.1L77.7 256C64.2 242.6 48 220.7 48 192c0-60.7 73.3-112 160-112s160 51.3 160 112-73.3 112-160 112c-16.5 0-33-1.9-49-5.6l-19.8-4.5zM498.3 352l-24.7 24.4 15.5 31.1c2.6 5.1 5.3 10.1 8 14.8-14.6-5.1-29-12.3-43.1-21.4l-17.1-11.1-19.9 4.6c-16 3.7-32.5 5.6-49 5.6-54 0-102.2-20.1-131.3-49.7C338 339.5 416 272.9 416 192c0-3.4-.4-6.7-.7-10C479.7 196.5 528 238.8 528 288c0 28.7-16.2 50.6-29.7 64z"});var z=function(e){return r.createElement("svg",T({xmlns:"http://www.w3.org/2000/svg",width:45,height:45,viewBox:"0 0 576 512"},e),P)};function _(){return(_=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e}).apply(this,arguments)}var U=r.createElement("path",{d:"M4.686 427.314L104 328l-32.922-31.029C55.958 281.851 66.666 256 88.048 256h112C213.303 256 224 266.745 224 280v112c0 21.382-25.803 32.09-40.922 16.971L152 376l-99.314 99.314c-6.248 6.248-16.379 6.248-22.627 0L4.686 449.941c-6.248-6.248-6.248-16.379 0-22.627zM443.314 84.686L344 184l32.922 31.029c15.12 15.12 4.412 40.971-16.97 40.971h-112C234.697 256 224 245.255 224 232V120c0-21.382 25.803-32.09 40.922-16.971L296 136l99.314-99.314c6.248-6.248 16.379-6.248 22.627 0l25.373 25.373c6.248 6.248 6.248 16.379 0 22.627z"});var F=function(e){return r.createElement("svg",_({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512"},e),U)};t(8);function K(e){var n=e.icon,t=e.chatbox,r=e.showChatbox,o=e.clickIcon,i=e.showIcon,c=e.iconStyle,l=e.children;return a.a.createElement("div",{className:"react-chat-frame"},a.a.createElement("div",{className:"react-chat-frame-wrapper"},r&&void 0!==t&&a.a.createElement(a.a.Fragment,null,a.a.createElement("div",{className:"react-chat-close-icon",onClick:o},a.a.createElement(F,null)),t),!r&&a.a.createElement("div",{className:"react-chat-frame-custom"},l),i&&a.a.createElement("div",{className:"react-chat-frame-icon-container",onClick:o,style:c},void 0!==n?n:a.a.createElement(z,{className:"react-chat-frame-icon"}))))}K.propTypes={icon:i.a.element,chatbox:i.a.element.isRequired,showChatbox:i.a.bool,clickIcon:i.a.func,showIcon:i.a.bool,children:i.a.element,iconStyle:i.a.object};var q=K;n.default=R}]);