@subiz/widget-v4 4.0.77 → 4.0.80

package/dist/screenshoot.js

@@ -1348,11 +1348,11 @@ function toString(obj) {
 
 "use strict";
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "up": () => (/* binding */ Com),
+/* harmony export */   "u$": () => (/* binding */ Clickaway),
 /* harmony export */   "Kd": () => (/* binding */ getLocale),
 /* harmony export */   "Rs": () => (/* binding */ langMessages),
-/* harmony export */   "WW": () => (/* binding */ downloadLanguage),
-/* harmony export */   "u$": () => (/* binding */ Clickaway),
-/* harmony export */   "up": () => (/* binding */ Com)
+/* harmony export */   "WW": () => (/* binding */ downloadLanguage)
 /* harmony export */ });
 /* harmony import */ var preact__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(6400);
 /* harmony import */ var _util_index_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(819);
@@ -1446,70 +1446,70 @@ function downloadLanguage(store, locale, force) {
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "DEFVAL": () => (/* binding */ DEFVAL),
-/* harmony export */   "DEF_CHAT_BUTTON_BACKGROUND_IMAGE_URL": () => (/* binding */ DEF_CHAT_BUTTON_BACKGROUND_IMAGE_URL),
+/* harmony export */   "parseJSON": () => (/* binding */ parseJSON),
+/* harmony export */   "stringify": () => (/* binding */ stringify),
 /* harmony export */   "Date": () => (/* binding */ Date),
-/* harmony export */   "agentsOfConvo": () => (/* binding */ agentsOfConvo),
-/* harmony export */   "checkRunConditions": () => (/* binding */ checkRunConditions),
-/* harmony export */   "cloneDeep": () => (/* binding */ cloneDeep),
+/* harmony export */   "requestAnimationFrame": () => (/* binding */ requestAnimationFrame),
+/* harmony export */   "setTimeout": () => (/* binding */ setTimeout),
+/* harmony export */   "setInterval": () => (/* binding */ setInterval),
 /* harmony export */   "convoOfEv": () => (/* binding */ convoOfEv),
 /* harmony export */   "convoToEv": () => (/* binding */ convoToEv),
-/* harmony export */   "detectLang": () => (/* binding */ detectLang),
-/* harmony export */   "diffDay": () => (/* binding */ diffDay),
-/* harmony export */   "diffYear": () => (/* binding */ diffYear),
-/* harmony export */   "each": () => (/* binding */ each),
-/* harmony export */   "filter": () => (/* binding */ filter),
-/* harmony export */   "find": () => (/* binding */ find),
-/* harmony export */   "formatCurrency": () => (/* binding */ formatCurrency),
-/* harmony export */   "getAgentDisplayName": () => (/* binding */ getAgentDisplayName),
-/* harmony export */   "getDayName": () => (/* binding */ getDayName),
-/* harmony export */   "getIntegrationId": () => (/* binding */ getIntegrationId),
-/* harmony export */   "getMs": () => (/* binding */ getMs),
+/* harmony export */   "setMsgField": () => (/* binding */ setMsgField),
 /* harmony export */   "getMsgField": () => (/* binding */ getMsgField),
-/* harmony export */   "getUrlParameter": () => (/* binding */ getUrlParameter),
-/* harmony export */   "getUserAttr": () => (/* binding */ getUserAttr),
+/* harmony export */   "merge": () => (/* binding */ merge),
+/* harmony export */   "cloneDeep": () => (/* binding */ cloneDeep),
+/* harmony export */   "randomString": () => (/* binding */ randomString),
+/* harmony export */   "filter": () => (/* binding */ filter),
 /* harmony export */   "includes": () => (/* binding */ includes),
+/* harmony export */   "map": () => (/* binding */ map),
+/* harmony export */   "each": () => (/* binding */ each),
+/* harmony export */   "usersOfConvo": () => (/* binding */ usersOfConvo),
 /* harmony export */   "isConvoSeen": () => (/* binding */ isConvoSeen),
-/* harmony export */   "isEmail": () => (/* binding */ isEmail),
-/* harmony export */   "isNumber": () => (/* binding */ isNumber),
+/* harmony export */   "agentsOfConvo": () => (/* binding */ agentsOfConvo),
+/* harmony export */   "startsWith": () => (/* binding */ startsWith),
+/* harmony export */   "size": () => (/* binding */ size),
+/* harmony export */   "replaceAll": () => (/* binding */ replaceAll),
+/* harmony export */   "trim": () => (/* binding */ trim),
+/* harmony export */   "trimStart": () => (/* binding */ trimStart),
+/* harmony export */   "throttle": () => (/* binding */ throttle),
+/* harmony export */   "find": () => (/* binding */ find),
+/* harmony export */   "orderBy": () => (/* binding */ orderBy),
+/* harmony export */   "getIntegrationId": () => (/* binding */ getIntegrationId),
 /* harmony export */   "isPhone": () => (/* binding */ isPhone),
 /* harmony export */   "isURL": () => (/* binding */ isURL),
-/* harmony export */   "isUserBanned": () => (/* binding */ isUserBanned),
-/* harmony export */   "js2css": () => (/* binding */ js2css),
+/* harmony export */   "isNumber": () => (/* binding */ isNumber),
+/* harmony export */   "isEmail": () => (/* binding */ isEmail),
 /* harmony export */   "last": () => (/* binding */ last),
-/* harmony export */   "map": () => (/* binding */ map),
-/* harmony export */   "merge": () => (/* binding */ merge),
-/* harmony export */   "noop": () => (/* binding */ noop),
+/* harmony export */   "getAgentDisplayName": () => (/* binding */ getAgentDisplayName),
+/* harmony export */   "isUserBanned": () => (/* binding */ isUserBanned),
+/* harmony export */   "setUserAttr": () => (/* binding */ setUserAttr),
+/* harmony export */   "getUserAttr": () => (/* binding */ getUserAttr),
 /* harmony export */   "norm": () => (/* binding */ norm),
-/* harmony export */   "offsetToMin": () => (/* binding */ offsetToMin),
-/* harmony export */   "orderBy": () => (/* binding */ orderBy),
-/* harmony export */   "parseJSON": () => (/* binding */ parseJSON),
-/* harmony export */   "preloadImg": () => (/* binding */ preloadImg),
-/* harmony export */   "preloadWebfonts": () => (/* binding */ preloadWebfonts),
-/* harmony export */   "randomString": () => (/* binding */ randomString),
-/* harmony export */   "replaceAll": () => (/* binding */ replaceAll),
-/* harmony export */   "replaceCssVariable": () => (/* binding */ replaceCssVariable),
+/* harmony export */   "noop": () => (/* binding */ noop),
 /* harmony export */   "replaceCssVariablePlugin": () => (/* binding */ replaceCssVariablePlugin),
-/* harmony export */   "requestAnimationFrame": () => (/* binding */ requestAnimationFrame),
-/* harmony export */   "sameDay": () => (/* binding */ sameDay),
-/* harmony export */   "scrollIntoViewIfNeeded": () => (/* binding */ scrollIntoViewIfNeeded),
+/* harmony export */   "replaceCssVariable": () => (/* binding */ replaceCssVariable),
+/* harmony export */   "tokenize": () => (/* binding */ tokenize),
 /* harmony export */   "setCss": () => (/* binding */ setCss),
-/* harmony export */   "setInterval": () => (/* binding */ setInterval),
-/* harmony export */   "setMsgField": () => (/* binding */ setMsgField),
-/* harmony export */   "setTimeout": () => (/* binding */ setTimeout),
-/* harmony export */   "setUserAttr": () => (/* binding */ setUserAttr),
+/* harmony export */   "DEF_CHAT_BUTTON_BACKGROUND_IMAGE_URL": () => (/* binding */ DEF_CHAT_BUTTON_BACKGROUND_IMAGE_URL),
+/* harmony export */   "DEFVAL": () => (/* binding */ DEFVAL),
+/* harmony export */   "js2css": () => (/* binding */ js2css),
+/* harmony export */   "checkRunConditions": () => (/* binding */ checkRunConditions),
+/* harmony export */   "getDayName": () => (/* binding */ getDayName),
+/* harmony export */   "preloadWebfonts": () => (/* binding */ preloadWebfonts),
+/* harmony export */   "preloadImg": () => (/* binding */ preloadImg),
+/* harmony export */   "offsetToMin": () => (/* binding */ offsetToMin),
+/* harmony export */   "diffDay": () => (/* binding */ diffDay),
+/* harmony export */   "diffYear": () => (/* binding */ diffYear),
+/* harmony export */   "sameDay": () => (/* binding */ sameDay),
 /* harmony export */   "shortTime": () => (/* binding */ shortTime),
-/* harmony export */   "size": () => (/* binding */ size),
+/* harmony export */   "unixSec": () => (/* binding */ unixSec),
+/* harmony export */   "getMs": () => (/* binding */ getMs),
+/* harmony export */   "detectLang": () => (/* binding */ detectLang),
+/* harmony export */   "getUrlParameter": () => (/* binding */ getUrlParameter),
 /* harmony export */   "sleep": () => (/* binding */ sleep),
-/* harmony export */   "startsWith": () => (/* binding */ startsWith),
-/* harmony export */   "stringify": () => (/* binding */ stringify),
-/* harmony export */   "throttle": () => (/* binding */ throttle),
-/* harmony export */   "tokenize": () => (/* binding */ tokenize),
-/* harmony export */   "trim": () => (/* binding */ trim),
-/* harmony export */   "trimStart": () => (/* binding */ trimStart),
+/* harmony export */   "formatCurrency": () => (/* binding */ formatCurrency),
 /* harmony export */   "unicodeToAscii": () => (/* binding */ unicodeToAscii),
-/* harmony export */   "unixSec": () => (/* binding */ unixSec),
-/* harmony export */   "usersOfConvo": () => (/* binding */ usersOfConvo)
+/* harmony export */   "scrollIntoViewIfNeeded": () => (/* binding */ scrollIntoViewIfNeeded)
 /* harmony export */ });
 var op = __webpack_require__(6877);
 
@@ -1837,7 +1837,7 @@ function isURL(url) {
   return re.test(String(url).toLowerCase());
 }
 function isNumber(num) {
-  var re = /^\d+$/;
+  var reg = /^\d+$/;
   return re.test(String(num));
 }
 function isEmail(email) {
@@ -2869,9 +2869,7 @@ function trackInactivity(seconds, cb) {
   }
 }
 let timeOnPage = 0;
-setInterval(() => {
-  timeOnPage += 5;
-}, 5000);
+setInterval(() => timeOnPage++, 1000);
 function trackTimeOnPage(seconds, cb) {
   if (seconds < 1) {
     return setTimeout(function () {
@@ -3208,14 +3206,14 @@ class Pubsub {
 
 "use strict";
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "sY": () => (/* binding */ S),
+/* harmony export */   "h": () => (/* binding */ v),
 /* harmony export */   "HY": () => (/* binding */ d),
 /* harmony export */   "Vf": () => (/* binding */ p),
-/* harmony export */   "h": () => (/* binding */ v),
-/* harmony export */   "sY": () => (/* binding */ S),
 /* harmony export */   "wA": () => (/* binding */ _)
 /* harmony export */ });
 /* unused harmony exports hydrate, createElement, isValidElement, cloneElement, createContext, toChildArray, options */
-var n,l,u,i,t,o,r,f,e={},c=[],s=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i;function a(n,l){for(var u in l)n[u]=l[u];return n}function h(n){var l=n.parentNode;l&&l.removeChild(n)}function v(l,u,i){var t,o,r,f={};for(r in u)"key"==r?t=u[r]:"ref"==r?o=u[r]:f[r]=u[r];if(arguments.length>2&&(f.children=arguments.length>3?n.call(arguments,2):i),"function"==typeof l&&null!=l.defaultProps)for(r in l.defaultProps)void 0===f[r]&&(f[r]=l.defaultProps[r]);return y(l,f,t,o,null)}function y(n,i,t,o,r){var f={type:n,props:i,key:t,ref:o,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,__h:null,constructor:void 0,__v:null==r?++u:r};return null==r&&null!=l.vnode&&l.vnode(f),f}function p(){return{current:null}}function d(n){return n.children}function _(n,l){this.props=n,this.context=l}function k(n,l){if(null==l)return n.__?k(n.__,n.__.__k.indexOf(n)+1):null;for(var u;l<n.__k.length;l++)if(null!=(u=n.__k[l])&&null!=u.__e)return u.__e;return"function"==typeof n.type?k(n):null}function b(n){var l,u;if(null!=(n=n.__)&&null!=n.__c){for(n.__e=n.__c.base=null,l=0;l<n.__k.length;l++)if(null!=(u=n.__k[l])&&null!=u.__e){n.__e=n.__c.base=u.__e;break}return b(n)}}function m(n){(!n.__d&&(n.__d=!0)&&t.push(n)&&!g.__r++||r!==l.debounceRendering)&&((r=l.debounceRendering)||o)(g)}function g(){for(var n;g.__r=t.length;)n=t.sort(function(n,l){return n.__v.__b-l.__v.__b}),t=[],n.some(function(n){var l,u,i,t,o,r;n.__d&&(o=(t=(l=n).__v).__e,(r=l.__P)&&(u=[],(i=a({},t)).__v=t.__v+1,j(r,t,i,l.__n,void 0!==r.ownerSVGElement,null!=t.__h?[o]:null,u,null==o?k(t):o,t.__h),z(u,t),t.__e!=o&&b(t)))})}function w(n,l,u,i,t,o,r,f,s,a){var h,v,p,_,b,m,g,w=i&&i.__k||c,A=w.length;for(u.__k=[],h=0;h<l.length;h++)if(null!=(_=u.__k[h]=null==(_=l[h])||"boolean"==typeof _?null:"string"==typeof _||"number"==typeof _||"bigint"==typeof _?y(null,_,null,null,_):Array.isArray(_)?y(d,{children:_},null,null,null):_.__b>0?y(_.type,_.props,_.key,null,_.__v):_)){if(_.__=u,_.__b=u.__b+1,null===(p=w[h])||p&&_.key==p.key&&_.type===p.type)w[h]=void 0;else for(v=0;v<A;v++){if((p=w[v])&&_.key==p.key&&_.type===p.type){w[v]=void 0;break}p=null}j(n,_,p=p||e,t,o,r,f,s,a),b=_.__e,(v=_.ref)&&p.ref!=v&&(g||(g=[]),p.ref&&g.push(p.ref,null,_),g.push(v,_.__c||b,_)),null!=b?(null==m&&(m=b),"function"==typeof _.type&&_.__k===p.__k?_.__d=s=x(_,s,n):s=P(n,_,p,w,b,s),"function"==typeof u.type&&(u.__d=s)):s&&p.__e==s&&s.parentNode!=n&&(s=k(p))}for(u.__e=m,h=A;h--;)null!=w[h]&&("function"==typeof u.type&&null!=w[h].__e&&w[h].__e==u.__d&&(u.__d=k(i,h+1)),N(w[h],w[h]));if(g)for(h=0;h<g.length;h++)M(g[h],g[++h],g[++h])}function x(n,l,u){for(var i,t=n.__k,o=0;t&&o<t.length;o++)(i=t[o])&&(i.__=n,l="function"==typeof i.type?x(i,l,u):P(u,i,i,t,i.__e,l));return l}function A(n,l){return l=l||[],null==n||"boolean"==typeof n||(Array.isArray(n)?n.some(function(n){A(n,l)}):l.push(n)),l}function P(n,l,u,i,t,o){var r,f,e;if(void 0!==l.__d)r=l.__d,l.__d=void 0;else if(null==u||t!=o||null==t.parentNode)n:if(null==o||o.parentNode!==n)n.appendChild(t),r=null;else{for(f=o,e=0;(f=f.nextSibling)&&e<i.length;e+=2)if(f==t)break n;n.insertBefore(t,o),r=o}return void 0!==r?r:t.nextSibling}function C(n,l,u,i,t){var o;for(o in u)"children"===o||"key"===o||o in l||H(n,o,null,u[o],i);for(o in l)t&&"function"!=typeof l[o]||"children"===o||"key"===o||"value"===o||"checked"===o||u[o]===l[o]||H(n,o,l[o],u[o],i)}function $(n,l,u){"-"===l[0]?n.setProperty(l,u):n[l]=null==u?"":"number"!=typeof u||s.test(l)?u:u+"px"}function H(n,l,u,i,t){var o;n:if("style"===l)if("string"==typeof u)n.style.cssText=u;else{if("string"==typeof i&&(n.style.cssText=i=""),i)for(l in i)u&&l in u||$(n.style,l,"");if(u)for(l in u)i&&u[l]===i[l]||$(n.style,l,u[l])}else if("o"===l[0]&&"n"===l[1])o=l!==(l=l.replace(/Capture$/,"")),l=l.toLowerCase()in n?l.toLowerCase().slice(2):l.slice(2),n.l||(n.l={}),n.l[l+o]=u,u?i||n.addEventListener(l,o?T:I,o):n.removeEventListener(l,o?T:I,o);else if("dangerouslySetInnerHTML"!==l){if(t)l=l.replace(/xlink(H|:h)/,"h").replace(/sName$/,"s");else if("href"!==l&&"list"!==l&&"form"!==l&&"tabIndex"!==l&&"download"!==l&&l in n)try{n[l]=null==u?"":u;break n}catch(n){}"function"==typeof u||(null!=u&&(!1!==u||"a"===l[0]&&"r"===l[1])?n.setAttribute(l,u):n.removeAttribute(l))}}function I(n){this.l[n.type+!1](l.event?l.event(n):n)}function T(n){this.l[n.type+!0](l.event?l.event(n):n)}function j(n,u,i,t,o,r,f,e,c){var s,h,v,y,p,k,b,m,g,x,A,P=u.type;if(void 0!==u.constructor)return null;null!=i.__h&&(c=i.__h,e=u.__e=i.__e,u.__h=null,r=[e]),(s=l.__b)&&s(u);try{n:if("function"==typeof P){if(m=u.props,g=(s=P.contextType)&&t[s.__c],x=s?g?g.props.value:s.__:t,i.__c?b=(h=u.__c=i.__c).__=h.__E:("prototype"in P&&P.prototype.render?u.__c=h=new P(m,x):(u.__c=h=new _(m,x),h.constructor=P,h.render=O),g&&g.sub(h),h.props=m,h.state||(h.state={}),h.context=x,h.__n=t,v=h.__d=!0,h.__h=[]),null==h.__s&&(h.__s=h.state),null!=P.getDerivedStateFromProps&&(h.__s==h.state&&(h.__s=a({},h.__s)),a(h.__s,P.getDerivedStateFromProps(m,h.__s))),y=h.props,p=h.state,v)null==P.getDerivedStateFromProps&&null!=h.componentWillMount&&h.componentWillMount(),null!=h.componentDidMount&&h.__h.push(h.componentDidMount);else{if(null==P.getDerivedStateFromProps&&m!==y&&null!=h.componentWillReceiveProps&&h.componentWillReceiveProps(m,x),!h.__e&&null!=h.shouldComponentUpdate&&!1===h.shouldComponentUpdate(m,h.__s,x)||u.__v===i.__v){h.props=m,h.state=h.__s,u.__v!==i.__v&&(h.__d=!1),h.__v=u,u.__e=i.__e,u.__k=i.__k,u.__k.forEach(function(n){n&&(n.__=u)}),h.__h.length&&f.push(h);break n}null!=h.componentWillUpdate&&h.componentWillUpdate(m,h.__s,x),null!=h.componentDidUpdate&&h.__h.push(function(){h.componentDidUpdate(y,p,k)})}h.context=x,h.props=m,h.state=h.__s,(s=l.__r)&&s(u),h.__d=!1,h.__v=u,h.__P=n,s=h.render(h.props,h.state,h.context),h.state=h.__s,null!=h.getChildContext&&(t=a(a({},t),h.getChildContext())),v||null==h.getSnapshotBeforeUpdate||(k=h.getSnapshotBeforeUpdate(y,p)),A=null!=s&&s.type===d&&null==s.key?s.props.children:s,w(n,Array.isArray(A)?A:[A],u,i,t,o,r,f,e,c),h.base=u.__e,u.__h=null,h.__h.length&&f.push(h),b&&(h.__E=h.__=null),h.__e=!1}else null==r&&u.__v===i.__v?(u.__k=i.__k,u.__e=i.__e):u.__e=L(i.__e,u,i,t,o,r,f,c);(s=l.diffed)&&s(u)}catch(n){u.__v=null,(c||null!=r)&&(u.__e=e,u.__h=!!c,r[r.indexOf(e)]=null),l.__e(n,u,i)}}function z(n,u){l.__c&&l.__c(u,n),n.some(function(u){try{n=u.__h,u.__h=[],n.some(function(n){n.call(u)})}catch(n){l.__e(n,u.__v)}})}function L(l,u,i,t,o,r,f,c){var s,a,v,y=i.props,p=u.props,d=u.type,_=0;if("svg"===d&&(o=!0),null!=r)for(;_<r.length;_++)if((s=r[_])&&"setAttribute"in s==!!d&&(d?s.localName===d:3===s.nodeType)){l=s,r[_]=null;break}if(null==l){if(null===d)return document.createTextNode(p);l=o?document.createElementNS("http://www.w3.org/2000/svg",d):document.createElement(d,p.is&&p),r=null,c=!1}if(null===d)y===p||c&&l.data===p||(l.data=p);else{if(r=r&&n.call(l.childNodes),a=(y=i.props||e).dangerouslySetInnerHTML,v=p.dangerouslySetInnerHTML,!c){if(null!=r)for(y={},_=0;_<l.attributes.length;_++)y[l.attributes[_].name]=l.attributes[_].value;(v||a)&&(v&&(a&&v.__html==a.__html||v.__html===l.innerHTML)||(l.innerHTML=v&&v.__html||""))}if(C(l,p,y,o,c),v)u.__k=[];else if(_=u.props.children,w(l,Array.isArray(_)?_:[_],u,i,t,o&&"foreignObject"!==d,r,f,r?r[0]:i.__k&&k(i,0),c),null!=r)for(_=r.length;_--;)null!=r[_]&&h(r[_]);c||("value"in p&&void 0!==(_=p.value)&&(_!==l.value||"progress"===d&&!_||"option"===d&&_!==y.value)&&H(l,"value",_,y.value,!1),"checked"in p&&void 0!==(_=p.checked)&&_!==l.checked&&H(l,"checked",_,y.checked,!1))}return l}function M(n,u,i){try{"function"==typeof n?n(u):n.current=u}catch(n){l.__e(n,i)}}function N(n,u,i){var t,o;if(l.unmount&&l.unmount(n),(t=n.ref)&&(t.current&&t.current!==n.__e||M(t,null,u)),null!=(t=n.__c)){if(t.componentWillUnmount)try{t.componentWillUnmount()}catch(n){l.__e(n,u)}t.base=t.__P=null}if(t=n.__k)for(o=0;o<t.length;o++)t[o]&&N(t[o],u,"function"!=typeof n.type);i||null==n.__e||h(n.__e),n.__e=n.__d=void 0}function O(n,l,u){return this.constructor(n,u)}function S(u,i,t){var o,r,f;l.__&&l.__(u,i),r=(o="function"==typeof t)?null:t&&t.__k||i.__k,f=[],j(i,u=(!o&&t||i).__k=v(d,null,[u]),r||e,e,void 0!==i.ownerSVGElement,!o&&t?[t]:r?null:i.firstChild?n.call(i.childNodes):null,f,!o&&t?t:r?r.__e:i.firstChild,o),z(f,u)}function q(n,l){S(n,l,q)}function B(l,u,i){var t,o,r,f=a({},l.props);for(r in u)"key"==r?t=u[r]:"ref"==r?o=u[r]:f[r]=u[r];return arguments.length>2&&(f.children=arguments.length>3?n.call(arguments,2):i),y(l.type,f,t||l.key,o||l.ref,null)}function D(n,l){var u={__c:l="__cC"+f++,__:n,Consumer:function(n,l){return n.children(l)},Provider:function(n){var u,i;return this.getChildContext||(u=[],(i={})[l]=this,this.getChildContext=function(){return i},this.shouldComponentUpdate=function(n){this.props.value!==n.value&&u.some(m)},this.sub=function(n){u.push(n);var l=n.componentWillUnmount;n.componentWillUnmount=function(){u.splice(u.indexOf(n),1),l&&l.call(n)}}),n.children}};return u.Provider.__=u.Consumer.contextType=u}n=c.slice,l={__e:function(n,l,u,i){for(var t,o,r;l=l.__;)if((t=l.__c)&&!t.__)try{if((o=t.constructor)&&null!=o.getDerivedStateFromError&&(t.setState(o.getDerivedStateFromError(n)),r=t.__d),null!=t.componentDidCatch&&(t.componentDidCatch(n,i||{}),r=t.__d),r)return t.__E=t}catch(l){n=l}throw n}},u=0,i=function(n){return null!=n&&void 0===n.constructor},_.prototype.setState=function(n,l){var u;u=null!=this.__s&&this.__s!==this.state?this.__s:this.__s=a({},this.state),"function"==typeof n&&(n=n(a({},u),this.props)),n&&a(u,n),null!=n&&this.__v&&(l&&this.__h.push(l),m(this))},_.prototype.forceUpdate=function(n){this.__v&&(this.__e=!0,n&&this.__h.push(n),m(this))},_.prototype.render=d,t=[],o="function"==typeof Promise?Promise.prototype.then.bind(Promise.resolve()):setTimeout,g.__r=0,f=0;
+var n,l,u,i,t,o,r,f,e={},c=[],s=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i;function a(n,l){for(var u in l)n[u]=l[u];return n}function h(n){var l=n.parentNode;l&&l.removeChild(n)}function v(l,u,i){var t,o,r,f={};for(r in u)"key"==r?t=u[r]:"ref"==r?o=u[r]:f[r]=u[r];if(arguments.length>2&&(f.children=arguments.length>3?n.call(arguments,2):i),"function"==typeof l&&null!=l.defaultProps)for(r in l.defaultProps)void 0===f[r]&&(f[r]=l.defaultProps[r]);return y(l,f,t,o,null)}function y(n,i,t,o,r){var f={type:n,props:i,key:t,ref:o,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,__h:null,constructor:void 0,__v:null==r?++u:r};return null==r&&null!=l.vnode&&l.vnode(f),f}function p(){return{current:null}}function d(n){return n.children}function _(n,l){this.props=n,this.context=l}function k(n,l){if(null==l)return n.__?k(n.__,n.__.__k.indexOf(n)+1):null;for(var u;l<n.__k.length;l++)if(null!=(u=n.__k[l])&&null!=u.__e)return u.__e;return"function"==typeof n.type?k(n):null}function b(n){var l,u;if(null!=(n=n.__)&&null!=n.__c){for(n.__e=n.__c.base=null,l=0;l<n.__k.length;l++)if(null!=(u=n.__k[l])&&null!=u.__e){n.__e=n.__c.base=u.__e;break}return b(n)}}function m(n){(!n.__d&&(n.__d=!0)&&t.push(n)&&!g.__r++||r!==l.debounceRendering)&&((r=l.debounceRendering)||o)(g)}function g(){for(var n;g.__r=t.length;)n=t.sort(function(n,l){return n.__v.__b-l.__v.__b}),t=[],n.some(function(n){var l,u,i,t,o,r;n.__d&&(o=(t=(l=n).__v).__e,(r=l.__P)&&(u=[],(i=a({},t)).__v=t.__v+1,j(r,t,i,l.__n,void 0!==r.ownerSVGElement,null!=t.__h?[o]:null,u,null==o?k(t):o,t.__h),z(u,t),t.__e!=o&&b(t)))})}function w(n,l,u,i,t,o,r,f,s,a){var h,v,p,_,b,m,g,w=i&&i.__k||c,A=w.length;for(u.__k=[],h=0;h<l.length;h++)if(null!=(_=u.__k[h]=null==(_=l[h])||"boolean"==typeof _?null:"string"==typeof _||"number"==typeof _||"bigint"==typeof _?y(null,_,null,null,_):Array.isArray(_)?y(d,{children:_},null,null,null):_.__b>0?y(_.type,_.props,_.key,null,_.__v):_)){if(_.__=u,_.__b=u.__b+1,null===(p=w[h])||p&&_.key==p.key&&_.type===p.type)w[h]=void 0;else for(v=0;v<A;v++){if((p=w[v])&&_.key==p.key&&_.type===p.type){w[v]=void 0;break}p=null}j(n,_,p=p||e,t,o,r,f,s,a),b=_.__e,(v=_.ref)&&p.ref!=v&&(g||(g=[]),p.ref&&g.push(p.ref,null,_),g.push(v,_.__c||b,_)),null!=b?(null==m&&(m=b),"function"==typeof _.type&&_.__k===p.__k?_.__d=s=x(_,s,n):s=P(n,_,p,w,b,s),"function"==typeof u.type&&(u.__d=s)):s&&p.__e==s&&s.parentNode!=n&&(s=k(p))}for(u.__e=m,h=A;h--;)null!=w[h]&&("function"==typeof u.type&&null!=w[h].__e&&w[h].__e==u.__d&&(u.__d=k(i,h+1)),N(w[h],w[h]));if(g)for(h=0;h<g.length;h++)M(g[h],g[++h],g[++h])}function x(n,l,u){for(var i,t=n.__k,o=0;t&&o<t.length;o++)(i=t[o])&&(i.__=n,l="function"==typeof i.type?x(i,l,u):P(u,i,i,t,i.__e,l));return l}function A(n,l){return l=l||[],null==n||"boolean"==typeof n||(Array.isArray(n)?n.some(function(n){A(n,l)}):l.push(n)),l}function P(n,l,u,i,t,o){var r,f,e;if(void 0!==l.__d)r=l.__d,l.__d=void 0;else if(null==u||t!=o||null==t.parentNode)n:if(null==o||o.parentNode!==n)n.appendChild(t),r=null;else{for(f=o,e=0;(f=f.nextSibling)&&e<i.length;e+=2)if(f==t)break n;n.insertBefore(t,o),r=o}return void 0!==r?r:t.nextSibling}function C(n,l,u,i,t){var o;for(o in u)"children"===o||"key"===o||o in l||H(n,o,null,u[o],i);for(o in l)t&&"function"!=typeof l[o]||"children"===o||"key"===o||"value"===o||"checked"===o||u[o]===l[o]||H(n,o,l[o],u[o],i)}function $(n,l,u){"-"===l[0]?n.setProperty(l,u):n[l]=null==u?"":"number"!=typeof u||s.test(l)?u:u+"px"}function H(n,l,u,i,t){var o;n:if("style"===l)if("string"==typeof u)n.style.cssText=u;else{if("string"==typeof i&&(n.style.cssText=i=""),i)for(l in i)u&&l in u||$(n.style,l,"");if(u)for(l in u)i&&u[l]===i[l]||$(n.style,l,u[l])}else if("o"===l[0]&&"n"===l[1])o=l!==(l=l.replace(/Capture$/,"")),l=l.toLowerCase()in n?l.toLowerCase().slice(2):l.slice(2),n.l||(n.l={}),n.l[l+o]=u,u?i||n.addEventListener(l,o?T:I,o):n.removeEventListener(l,o?T:I,o);else if("dangerouslySetInnerHTML"!==l){if(t)l=l.replace(/xlink[H:h]/,"h").replace(/sName$/,"s");else if("href"!==l&&"list"!==l&&"form"!==l&&"tabIndex"!==l&&"download"!==l&&l in n)try{n[l]=null==u?"":u;break n}catch(n){}"function"==typeof u||(null!=u&&(!1!==u||"a"===l[0]&&"r"===l[1])?n.setAttribute(l,u):n.removeAttribute(l))}}function I(n){this.l[n.type+!1](l.event?l.event(n):n)}function T(n){this.l[n.type+!0](l.event?l.event(n):n)}function j(n,u,i,t,o,r,f,e,c){var s,h,v,y,p,k,b,m,g,x,A,P=u.type;if(void 0!==u.constructor)return null;null!=i.__h&&(c=i.__h,e=u.__e=i.__e,u.__h=null,r=[e]),(s=l.__b)&&s(u);try{n:if("function"==typeof P){if(m=u.props,g=(s=P.contextType)&&t[s.__c],x=s?g?g.props.value:s.__:t,i.__c?b=(h=u.__c=i.__c).__=h.__E:("prototype"in P&&P.prototype.render?u.__c=h=new P(m,x):(u.__c=h=new _(m,x),h.constructor=P,h.render=O),g&&g.sub(h),h.props=m,h.state||(h.state={}),h.context=x,h.__n=t,v=h.__d=!0,h.__h=[]),null==h.__s&&(h.__s=h.state),null!=P.getDerivedStateFromProps&&(h.__s==h.state&&(h.__s=a({},h.__s)),a(h.__s,P.getDerivedStateFromProps(m,h.__s))),y=h.props,p=h.state,v)null==P.getDerivedStateFromProps&&null!=h.componentWillMount&&h.componentWillMount(),null!=h.componentDidMount&&h.__h.push(h.componentDidMount);else{if(null==P.getDerivedStateFromProps&&m!==y&&null!=h.componentWillReceiveProps&&h.componentWillReceiveProps(m,x),!h.__e&&null!=h.shouldComponentUpdate&&!1===h.shouldComponentUpdate(m,h.__s,x)||u.__v===i.__v){h.props=m,h.state=h.__s,u.__v!==i.__v&&(h.__d=!1),h.__v=u,u.__e=i.__e,u.__k=i.__k,u.__k.forEach(function(n){n&&(n.__=u)}),h.__h.length&&f.push(h);break n}null!=h.componentWillUpdate&&h.componentWillUpdate(m,h.__s,x),null!=h.componentDidUpdate&&h.__h.push(function(){h.componentDidUpdate(y,p,k)})}h.context=x,h.props=m,h.state=h.__s,(s=l.__r)&&s(u),h.__d=!1,h.__v=u,h.__P=n,s=h.render(h.props,h.state,h.context),h.state=h.__s,null!=h.getChildContext&&(t=a(a({},t),h.getChildContext())),v||null==h.getSnapshotBeforeUpdate||(k=h.getSnapshotBeforeUpdate(y,p)),A=null!=s&&s.type===d&&null==s.key?s.props.children:s,w(n,Array.isArray(A)?A:[A],u,i,t,o,r,f,e,c),h.base=u.__e,u.__h=null,h.__h.length&&f.push(h),b&&(h.__E=h.__=null),h.__e=!1}else null==r&&u.__v===i.__v?(u.__k=i.__k,u.__e=i.__e):u.__e=L(i.__e,u,i,t,o,r,f,c);(s=l.diffed)&&s(u)}catch(n){u.__v=null,(c||null!=r)&&(u.__e=e,u.__h=!!c,r[r.indexOf(e)]=null),l.__e(n,u,i)}}function z(n,u){l.__c&&l.__c(u,n),n.some(function(u){try{n=u.__h,u.__h=[],n.some(function(n){n.call(u)})}catch(n){l.__e(n,u.__v)}})}function L(l,u,i,t,o,r,f,c){var s,a,v,y=i.props,p=u.props,d=u.type,_=0;if("svg"===d&&(o=!0),null!=r)for(;_<r.length;_++)if((s=r[_])&&"setAttribute"in s==!!d&&(d?s.localName===d:3===s.nodeType)){l=s,r[_]=null;break}if(null==l){if(null===d)return document.createTextNode(p);l=o?document.createElementNS("http://www.w3.org/2000/svg",d):document.createElement(d,p.is&&p),r=null,c=!1}if(null===d)y===p||c&&l.data===p||(l.data=p);else{if(r=r&&n.call(l.childNodes),a=(y=i.props||e).dangerouslySetInnerHTML,v=p.dangerouslySetInnerHTML,!c){if(null!=r)for(y={},_=0;_<l.attributes.length;_++)y[l.attributes[_].name]=l.attributes[_].value;(v||a)&&(v&&(a&&v.__html==a.__html||v.__html===l.innerHTML)||(l.innerHTML=v&&v.__html||""))}if(C(l,p,y,o,c),v)u.__k=[];else if(_=u.props.children,w(l,Array.isArray(_)?_:[_],u,i,t,o&&"foreignObject"!==d,r,f,r?r[0]:i.__k&&k(i,0),c),null!=r)for(_=r.length;_--;)null!=r[_]&&h(r[_]);c||("value"in p&&void 0!==(_=p.value)&&(_!==l.value||"progress"===d&&!_||"option"===d&&_!==y.value)&&H(l,"value",_,y.value,!1),"checked"in p&&void 0!==(_=p.checked)&&_!==l.checked&&H(l,"checked",_,y.checked,!1))}return l}function M(n,u,i){try{"function"==typeof n?n(u):n.current=u}catch(n){l.__e(n,i)}}function N(n,u,i){var t,o;if(l.unmount&&l.unmount(n),(t=n.ref)&&(t.current&&t.current!==n.__e||M(t,null,u)),null!=(t=n.__c)){if(t.componentWillUnmount)try{t.componentWillUnmount()}catch(n){l.__e(n,u)}t.base=t.__P=null}if(t=n.__k)for(o=0;o<t.length;o++)t[o]&&N(t[o],u,"function"!=typeof n.type);i||null==n.__e||h(n.__e),n.__e=n.__d=void 0}function O(n,l,u){return this.constructor(n,u)}function S(u,i,t){var o,r,f;l.__&&l.__(u,i),r=(o="function"==typeof t)?null:t&&t.__k||i.__k,f=[],j(i,u=(!o&&t||i).__k=v(d,null,[u]),r||e,e,void 0!==i.ownerSVGElement,!o&&t?[t]:r?null:i.firstChild?n.call(i.childNodes):null,f,!o&&t?t:r?r.__e:i.firstChild,o),z(f,u)}function q(n,l){S(n,l,q)}function B(l,u,i){var t,o,r,f=a({},l.props);for(r in u)"key"==r?t=u[r]:"ref"==r?o=u[r]:f[r]=u[r];return arguments.length>2&&(f.children=arguments.length>3?n.call(arguments,2):i),y(l.type,f,t||l.key,o||l.ref,null)}function D(n,l){var u={__c:l="__cC"+f++,__:n,Consumer:function(n,l){return n.children(l)},Provider:function(n){var u,i;return this.getChildContext||(u=[],(i={})[l]=this,this.getChildContext=function(){return i},this.shouldComponentUpdate=function(n){this.props.value!==n.value&&u.some(m)},this.sub=function(n){u.push(n);var l=n.componentWillUnmount;n.componentWillUnmount=function(){u.splice(u.indexOf(n),1),l&&l.call(n)}}),n.children}};return u.Provider.__=u.Consumer.contextType=u}n=c.slice,l={__e:function(n,l){for(var u,i,t;l=l.__;)if((u=l.__c)&&!u.__)try{if((i=u.constructor)&&null!=i.getDerivedStateFromError&&(u.setState(i.getDerivedStateFromError(n)),t=u.__d),null!=u.componentDidCatch&&(u.componentDidCatch(n),t=u.__d),t)return u.__E=u}catch(l){n=l}throw n}},u=0,i=function(n){return null!=n&&void 0===n.constructor},_.prototype.setState=function(n,l){var u;u=null!=this.__s&&this.__s!==this.state?this.__s:this.__s=a({},this.state),"function"==typeof n&&(n=n(a({},u),this.props)),n&&a(u,n),null!=n&&this.__v&&(l&&this.__h.push(l),m(this))},_.prototype.forceUpdate=function(n){this.__v&&(this.__e=!0,n&&this.__h.push(n),m(this))},_.prototype.render=d,t=[],o="function"==typeof Promise?Promise.prototype.then.bind(Promise.resolve()):setTimeout,g.__r=0,f=0;
 //# sourceMappingURL=preact.module.js.map
 
 
@@ -3366,7 +3364,7 @@ var n,l,u,i,t,o,r,f,e={},c=[],s=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[c
 /******/ 	
 /******/ 	/* webpack/runtime/jsonp chunk loading */
 /******/ 	(() => {
-/******/ 		// no baseURI
+/******/ 		__webpack_require__.b = document.baseURI || self.location.href;
 /******/ 		
 /******/ 		// object to store loaded and loading chunks
 /******/ 		// undefined = chunk not loaded, null = chunk preloaded/prefetched
@@ -4320,9 +4318,7 @@ class Store {
 
     store_defineProperty(this, "seenQueue", []);
 
-    store_defineProperty(this, "_typing", util/* default.throttle */.Z.throttle(convoid => this.api.sendTyping(convoid), 3000, {
-      trailing: false
-    }));
+    store_defineProperty(this, "_typing", util/* default.throttle */.Z.throttle(convoid => this.api.sendTyping(convoid), 3000));
 
     store_defineProperty(this, "onConvoEvent", (o, cb) => this.pubsub.on2(o, 'events', cb));
 
@@ -4342,10 +4338,7 @@ class Store {
     store_defineProperty(this, "setIsOpen", isopen => {
       let lastisopen = this.kv.match('isopen');
       this.kv.put('isopen', isopen);
-
-      if (!lastisopen && isopen) {
-        sendEventToThirdParty('SUBIZ Chat', 'Opened', 'Subiz Windows');
-      }
+      if (!lastisopen && isopen) sendEventToThirdParty('SUBIZ Chat', 'Opened', 'Subiz Windows');
     });
 
     store_defineProperty(this, "closePreview", () => this.kv.put('close_preview_at', new util/* default.Date */.Z.Date().getTime()));
@@ -4455,9 +4448,7 @@ class Store {
       platform: window.navigator.platform,
       referrer: document.URL,
       type: this.isMobile() ? 'mobile' : 'desktop',
-      language: navigator.language,
-      page_url: document.URL,
-      page_title: document.title
+      language: navigator.language
     };
     let ga_client_id = getGaClientId();
     if (ga_client_id) device.ga_client_id = ga_client_id;
@@ -4960,7 +4951,9 @@ class Store {
       by: {
         id: user.id,
         type: 'user',
-        device: this.device
+        device: {
+          referrer: document.URL
+        }
       },
       data,
       type,
@@ -5007,20 +5000,6 @@ class Store {
 
     this.onWs(ret);
     sendEventToThirdParty('SUBIZ Chat', 'Sent', 'User');
-    let lastMsgSent = this.kv.match('last_msg_sent');
-
-    if (!lastMsgSent) {
-      let dataLayer = window.dataLayer || [];
-      dataLayer.push({
-        event: 'SUBIZ Chat',
-        event_action: 'Sent',
-        event_label: 'User',
-        first_interaction: 1
-      });
-    }
-
-    this.kv.put('last_msg_sent', util/* default.Date.now */.Z.Date.now());
-    return ret;
   }
 
   _setConvo(convo) {
@@ -5154,7 +5133,7 @@ class Store {
 
   async loopTime() {
     let startms = util/* default.Date.now */.Z.Date.now();
-    if (!util/* default.get */.Z.get(this.kv.match('user'), 'id')) return setTimeout(() => this.loopTime(), 120000);
+    if (!util/* default.get */.Z.get(this.kv.match('user'), 'id')) return setTimeout(() => this.loopTime(), 30000);
     let {
       body: t,
       error
@@ -5164,7 +5143,7 @@ class Store {
     var serverMs = new util/* default.Date */.Z.Date(t).getTime() + latences;
     var localMs = util/* default.Date.now */.Z.Date.now();
     this.timeDiff = Math.floor(serverMs - localMs);
-    setTimeout(() => this.loopTime(), 120000);
+    setTimeout(() => this.loopTime(), 60000);
   }
 
   replaceFileUrl(src) {
@@ -5270,21 +5249,20 @@ const inmemCookie = {
 };
 
 function getGaClientId() {
-  if (!window.ga) return;
-  if (!window.ga.getAll) return;
+  var clientId = '';
+  if (!hasGA()) return clientId;
   var allTrackers = window.ga.getAll() || [];
-  let ga_client_id = '';
   allTrackers.forEach(function (tracker) {
-    ga_client_id = tracker.get('clientId');
+    clientId = tracker.get('clientId');
   });
-  return ga_client_id;
+  return clientId;
 }
 
+const hasGA = () => !!(window.ga && window.ga.getAll);
+
 function getGaTrackingIds() {
   var trackingIds = [];
-  if (!(window.ga && window.ga.getAll)) return trackingIds;
-  if (!window.ga) return [];
-  if (!window.ga.getAll) return [];
+  if (!hasGA()) return trackingIds;
   const allTrackers = window.ga.getAll() || [];
   allTrackers.forEach(function (tracker) {
     var trackingId = tracker.get('trackingId');
@@ -5302,20 +5280,12 @@ function sendToFBPixel(category, action, label) {
 }
 
 function sendToGA(category, action, label) {
-  console.log('SENT.', category, action, label);
-
-  if (window.ga && window.ga.getAll) {
-    const allTrackers = window.ga.getAll() || [];
-    allTrackers.forEach(function (tracker) {
-      const name = tracker.get('name');
-      window.ga(name + '.send', 'event', category, action, label);
-    });
-  } else {
-    if (window.gtag) window.gtag('event', category, {
-      Action: action,
-      Label: label
-    });
-  }
+  if (!hasGA()) return;
+  const allTrackers = window.ga.getAll() || [];
+  allTrackers.forEach(function (tracker) {
+    const name = tracker.get('name');
+    window.ga(name + '.send', 'event', category, action, label);
+  });
 }
 
 function sendEventToThirdParty(category, action, label) {
@@ -5328,12 +5298,6 @@ function sendEventToThirdParty(category, action, label) {
   }));
   sendToGA(category, action, label);
   sendToFBPixel(category, action, label);
-  let dataLayer = window.dataLayer || [];
-  dataLayer.push({
-    event: category,
-    event_action: action,
-    event_label: label
-  });
 }
 
 let mobileCheck = function (a) {
@@ -5719,7 +5683,7 @@ util/* default.preloadWebfonts */.Z.preloadWebfonts(['Roboto'], [400, 500]);
 
 class Widget {
   constructor(ApiURL, FileURL, RealtimeURL, inmem, fake, agenttoken) {
-    lib_defineProperty(this, "version", () => '4.5');
+    lib_defineProperty(this, "version", () => '4.4');
 
     lib_defineProperty(this, "setSetting", setting => this.store.setSetting({
       account_setting: setting
@@ -5803,21 +5767,7 @@ class Widget {
   }
 
   async sendMessage(convoid, message) {
-    if (!convoid) {
-      const {
-        convo,
-        error
-      } = await this.store.startConvo({
-        message: message.text,
-        initial_by: this.store.matchUser().id
-      });
-      if (error) return {
-        error
-      };
-      convoid = convo.id;
-    }
-
-    return this.store.sendConvoEvent(convoid, 'message_sent', {
+    this.store.sendConvoEvent(convoid, 'message_sent', {
       message
     });
   }
@@ -5836,11 +5786,11 @@ class Widget {
     this.pluginMgr.hideCurrentGreeting();
   }
 
-  async showWidget(view, cid) {
+  async showWidget(view, convo) {
     await this.domGate.entry();
     this.pluginMgr.showCurrentChatbox({
       view,
-      cid: cid
+      cid: convo
     });
   }
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@subiz/widget-v4",
-	"version": "4.0.77",
+	"version": "4.0.80",
 	"main": "./compiled_src/lib.js",
 	"scripts": {
 		"dev": "npx webpack serve --config webpack.dev.js",

package/src/chatbox/ButtonAttachments.js

@@ -21,6 +21,6 @@ export default class ButtonAttachments extends Com {
 			sb.each(sb.get(att, 'buttons') || [], btn => buttons.push(btn))
 		})
 
-		return <Buttons store={this.props.store} buttons={buttons} />
+		return <Buttons store={this.props.store} buttons={buttons} t={this.props.t}/>
 	}
 }

package/src/chatbox/Buttons.js

@@ -13,7 +13,7 @@ export default class Buttons extends Com {
 			if (button.type === 'call_button') {
 				return (
 					<a class='url-button-attachment' href={'tel:' + button.phone_number} key={index} title={button.title}>
-						{button.title}
+						{this.props.t.i18n(button.i18n_title) || button.title}
 					</a>
 				)
 			}
@@ -21,7 +21,7 @@ export default class Buttons extends Com {
 			if (button.type === 'url_button') {
 				return (
 					<a class='url-button-attachment' href={button.url} target='_blank' key={index} title={button.title}>
-						{button.title || button.url}
+						{this.props.t.i18n(button.i18n_title) || button.title || button.url} 
 					</a>
 				)
 			}
@@ -29,7 +29,7 @@ export default class Buttons extends Com {
 			if (button.type === 'postback_button') {
 				return (
 					<a class='url-button-attachment' href='javascript:;' onClick={(_) => this.props.onSelect(button)}>
-						{button.title}
+						{this.props.t.i18n(button.i18n_title) || button.title}
 					</a>
 				)
 			}

package/src/chatbox/Event.js

@@ -130,7 +130,7 @@ export default class Event extends Com {
 					<AudioAttachments store={this.props.store} ev={ev} />
 					<VideoAttachments store={this.props.store} ev={ev} />
 					<FileAttachments store={this.props.store} ev={ev} />
-					<ButtonAttachments store={this.props.store} ev={ev} />
+					<ButtonAttachments store={this.props.store} ev={ev} t={this.props.t}/>
 					<FormAttachments
 						store={this.props.store}
 						onSubmit={this.props.onFormSubmit}
@@ -139,7 +139,7 @@ export default class Event extends Com {
 						t={this.props.t}
 					/>
 					<FormSubmitAttachments store={this.props.store} ev={ev} t={this.props.t} />
-					<GenericTemplateAttachments store={this.props.store} ev={ev} onSelect={(e) => this.choosePostbackBtn(e)} />
+					<GenericTemplateAttachments store={this.props.store} ev={ev} onSelect={(e) => this.choosePostbackBtn(e)} t={this.props.t}/>
 					<ProductAttachments t={this.props.t} onPostback={(e) => this.choosePostbackBtn(e)} store={this.props.store} ev={ev} />
 					<OrderAttachments t={this.props.t} store={this.props.store} ev={ev} />
 					<QuickReplies store={this.props.store} ev={ev} onSelect={(e) => this.chooseQuickReply(e)} />
@@ -182,7 +182,7 @@ export default class Event extends Com {
 					<AudioAttachments store={this.props.store} ev={ev} />
 					<VideoAttachments store={this.props.store} ev={ev} />
 					<FileAttachments store={this.props.store} ev={ev} />
-					<ButtonAttachments store={this.props.store} ev={ev} />
+					<ButtonAttachments store={this.props.store} ev={ev} t={this.props.t}/>
 					<FormAttachments store={this.props.store} onSubmit={this.props.onFormSubmit} ref={this.refForm} ev={ev} />
 					<ProductAttachments t={this.props.t} store={this.props.store} ev={ev} />
 					<FormSubmitAttachments store={this.props.store} ev={ev} />

package/src/chatbox/GenericTemplateAttachments.js

@@ -2,11 +2,11 @@ import Buttons from './Buttons.js'
 import sb from '../util/index.js'
 import Drag from './touchscroll'
 
-import { Com } from '../common.js'
-import { h, createRef, Fragment } from 'preact'
+import {Com} from '../common.js'
+import {h, createRef, Fragment} from 'preact'
 
 export default class GenericTemplateAttachments extends Com {
-	constructor (props) {
+	constructor(props) {
 		super(props)
 		this.state = {
 			focusing: 0, // element index
@@ -15,39 +15,47 @@ export default class GenericTemplateAttachments extends Com {
 		this.galleryRef = createRef()
 	}
 
-	componentDidMount () {
+	componentDidMount() {
 		this.bindDrag()
 	}
 
-	focus (eleindex) {
-		this.setState({ focusing: eleindex })
-		// this.galleryRef.current.scrollTo({ left: 190 * eleindex - 20, behavior: 'smooth' })
-		this.galleryRef.current.scrollLeft = 190 * eleindex - 20
+	focus(eleindex) {
+		this.setState({focusing: eleindex})
+		this.galleryRef.current.scrollTo({left: 220 * eleindex, behavior: 'smooth'})
+		//this.galleryRef.current.scrollLeft = 220 * eleindex - 20
 	}
 
-	render () {
+	render() {
 		// dont support user sent button yet
 		let byType = sb.get(this.props.ev, 'by.type')
 		if (byType === 'user') return null
 
 		// filter out all generic
 		let attachments = sb.get(this.props.ev, 'data.message.attachments', [])
-		let generics = sb.filter(attachments, att => sb.get(att, 'type') === 'generic')
+		let generics = sb.filter(attachments, (att) => sb.get(att, 'type') === 'generic')
 
 		if (generics.length === 0) return null
 		var $generics = sb.map(generics, (gen, index) => {
-			var $eles = sb.map(gen.elements, ele => {
-				let $title = ele.title ? <div class="generic-attachment--element-title">{ele.title}</div> : null
-				let $subtitle = ele.subtitle ? <div class="generic-attachment--element-subtitle">{ele.subtitle}</div> : null
+			var $eles = sb.map(gen.elements, (ele) => {
+				let title = this.props.t.i18n(ele.i18n_title) || ele.title
+				let subtitle = this.props.t.i18n(ele.i18n_subtitle) || ele.subtitle
+				let $title = title ? <div class='generic-attachment--element-title'>{title}</div> : null
+				let $subtitle = subtitle ? <div class='generic-attachment--element-subtitle'>{subtitle}</div> : null
 
 				return (
-					<div class="generic-attachment--element swiper-slide">
+					<div class='generic-attachment--element swiper-slide'>
 						<div>
-							<img alt="generic attachment element" class="generic-attachment--element-img" src={this.props.store.replaceFileUrl(ele.image_url)} />
+							<img
+								alt='generic attachment element'
+								class='generic-attachment--element-img'
+								src={this.props.store.replaceFileUrl(ele.image_url)}
+							/>
 						</div>
-						{$title}
-						{$subtitle}
-						<Buttons buttons={ele.buttons} onSelect={button => this.props.onSelect(button)} />
+						<div class='generic-attachment--element-content'>
+							{$title}
+							{$subtitle}
+						</div>
+						<Buttons buttons={ele.buttons} onSelect={(button) => this.props.onSelect(button)} t={this.props.t} />
 					</div>
 				)
 			})
@@ -60,17 +68,17 @@ export default class GenericTemplateAttachments extends Com {
 			if (this.state.focusing === elements.length - 1) rightNavigatorCls += ' generic-attachment-navigator--disabled'
 
 			return (
-				<div class="generic-attachment-container">
-					<div class="generic-attachment" ref={this.galleryRef}>
+				<div class='generic-attachment-container'>
+					<div class='generic-attachment' ref={this.galleryRef}>
 						{$eles}
 					</div>
 					{!this.props.store.isMobile() && (
 						<Fragment>
-							<div class={leftNavigatorCls} onClick={_ => this.focus(this.state.focusing - 1)}>
-								<span class="generic-attachment-navigator-icon">&#8249;</span>
+							<div class={leftNavigatorCls} onClick={(_) => this.focus(this.state.focusing - 1)}>
+								<span class='generic-attachment-navigator-icon'>&#8249;</span>
 							</div>
-							<div class={rightNavigatorCls} onClick={_ => this.focus(this.state.focusing + 1)}>
-								<span class="generic-attachment-navigator-icon">&#8250;</span>
+							<div class={rightNavigatorCls} onClick={(_) => this.focus(this.state.focusing + 1)}>
+								<span class='generic-attachment-navigator-icon'>&#8250;</span>
 							</div>
 						</Fragment>
 					)}
@@ -81,9 +89,9 @@ export default class GenericTemplateAttachments extends Com {
 		return $generics
 	}
 
-	bindDrag () {
+	bindDrag() {
 		if (!this.props.store.isMobile()) return
 		let eles = document.getElementsByClassName('generic-attachment')
-		sb.map(eles, ele => Drag(ele, () => {}))
+		sb.map(eles, (ele) => Drag(ele, () => {}))
 	}
 }