@subiz/widget-v4 4.1.44 → 4.1.46

package/assets/less/message.less

@@ -147,6 +147,12 @@
 	white-space: pre-wrap;
 }
 
+.message-user.message-user-images-container {
+  width: 85%;
+  display: flex;
+  justify-content: flex-end;
+}
+
 .message-user.message-user-audio {
   flex: 1;
 }

package/compiled_src/call/css.js

@@ -4,4 +4,5 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _default = exports.default = require('css-loader!less-loader!../../assets/less/notif.less');
+var _default = require('css-loader!less-loader!../../assets/less/notif.less');
+exports.default = _default;

package/compiled_src/chatbox/ImageAttachments.js

@@ -8,9 +8,93 @@ var _index = _interopRequireDefault(require("../util/index.js"));
 var _common = require("../common.js");
 var _preact = require("preact");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 class ImageAttachment extends _common.Com {
   constructor(props) {
     super(props);
+    _defineProperty(this, "containerRef", (0, _preact.createRef)());
+    this.setState({
+      ready: false
+    });
+  }
+  componentDidMount() {
+    this.setImageFrameDimension();
+  }
+  setImageFrameDimension() {
+    const MAX_HEIGHT = 240;
+    const DEFAULT_MAX_WIDTH = 267;
+    let $container = this.containerRef.current;
+    this.frameWidth = $container ? $container.offsetWidth : DEFAULT_MAX_WIDTH;
+    this.frameHeight = MAX_HEIGHT;
+    this.setState({
+      ready: true
+    });
+  }
+  calculateImageDimension(image) {
+    if (!image.width || !image.height) return {
+      width: this.frameWidth,
+      height: this.frameHeight
+    };
+    let ratio = image.width / image.height - this.frameWidth / this.frameHeight;
+    if (ratio >= 0) {
+      let width = this.frameWidth;
+      let height = image.height * this.frameWidth / image.width;
+      height = Math.round(height);
+      return {
+        width,
+        height
+      };
+    } else {
+      let height = this.frameHeight;
+      let width = image.width * this.frameHeight / image.height;
+      width = Math.round(width);
+      return {
+        width,
+        height
+      };
+    }
+  }
+  renderImage(image, index) {
+    if (!this.state.ready) {
+      return;
+    }
+    let byType = _index.default.get(this.props.ev, 'by.type');
+    if (!image.width || !image.height) {
+      return (0, _preact.h)("div", {
+        class: `image-attachment image-attachment--${byType}`
+      }, (0, _preact.h)("a", {
+        href: this.props.store.replaceFileUrl(image.thumbnail_url || image.url),
+        target: "_blank"
+      }, (0, _preact.h)("img", {
+        alt: true,
+        class: "image-attachment__img",
+        src: this.props.store.replaceFileUrl(image.thumbnail_url || image.url),
+        onload: e => this.props.onLoad && this.props.onLoad()
+      })));
+    }
+    let {
+      width,
+      height
+    } = this.calculateImageDimension(image);
+    return (0, _preact.h)("div", {
+      class: `image-attachment image-attachment--${byType}`
+    }, (0, _preact.h)("a", {
+      href: this.props.store.replaceFileUrl(image.thumbnail_url || image.url),
+      target: "_blank"
+    }, (0, _preact.h)("img", {
+      alt: true,
+      ref: el => {
+        if (el) {
+          el.style.setProperty('width', `${width}px`, 'important');
+          el.style.setProperty('height', `${height}px`, 'important');
+        }
+      },
+      class: "image-attachment__img",
+      src: this.props.store.replaceFileUrl(image.thumbnail_url || image.url),
+      onload: e => this.props.onLoad && this.props.onLoad()
+    })));
   }
   render() {
     var attachments = _index.default.get(this.props.ev, 'data.message.attachments', []);
@@ -27,24 +111,16 @@ class ImageAttachment extends _common.Com {
       images.push(att);
     });
     if (images.length === 0) return null;
-    var $images = _index.default.map(images, (image, index) => (0, _preact.h)("div", {
-      class: `image-attachment image-attachment--${byType}`
-    }, (0, _preact.h)("a", {
-      href: this.props.store.replaceFileUrl(image.thumbnail_url || image.url),
-      target: "_blank"
-    }, (0, _preact.h)("img", {
-      alt: true,
-      class: "image-attachment__img",
-      src: this.props.store.replaceFileUrl(image.thumbnail_url || image.url),
-      onload: e => this.props.onLoad && this.props.onLoad()
-    }))));
+    let $images = _index.default.map(images, (image, index) => this.renderImage(image, index));
     if (byType === 'agent') {
       return (0, _preact.h)("div", {
-        class: "message-agent"
+        class: "message-agent",
+        ref: this.containerRef
       }, $images);
     } else {
       return (0, _preact.h)("div", {
-        class: "message-user"
+        class: "message-user message-user-images-container",
+        ref: this.containerRef
       }, $images);
     }
   }

package/compiled_src/chatbox/css.js

@@ -4,4 +4,5 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _default = exports.default = require('css-loader!less-loader!../../assets/less/chatbox.less');
+var _default = require('css-loader!less-loader!../../assets/less/chatbox.less');
+exports.default = _default;

package/compiled_src/common.js

@@ -65,7 +65,8 @@ const getLocale = (plugin, loc) => {
   return plugin.locale || 'en-US';
 };
 exports.getLocale = getLocale;
-let langMessages = exports.langMessages = {};
+let langMessages = {};
+exports.langMessages = langMessages;
 let downloadLock = false;
 function downloadLanguage(store, locale, force) {
   if (downloadLock) return new Promise(resolve => _index.default.setTimeout(() => downloadLanguage(store, locale, force).then(resolve), 100));

package/compiled_src/contact/contact.js

@@ -356,9 +356,10 @@ function replaceCssVariable(css, setting) {
   }
   return ret.join('');
 }
-const DEFVAL = exports.DEFVAL = {
+const DEFVAL = {
   font_size: '16px',
   font_family: 'roboto',
   text_color: '#333',
   primary_color: '#333'
-};
+};
+exports.DEFVAL = DEFVAL;

package/compiled_src/contact/css.js

@@ -4,4 +4,5 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _default = exports.default = require('css-loader!less-loader!../../assets/less/contact.less');
+var _default = require('css-loader!less-loader!../../assets/less/contact.less');
+exports.default = _default;

package/compiled_src/lib.js

@@ -243,4 +243,5 @@ class Widget {
   }
 }
 window.__sbz_WIDGET = Widget;
-var _default = exports.default = Widget;
+var _default = Widget;
+exports.default = _default;

package/compiled_src/notif/css.js

@@ -4,4 +4,5 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _default = exports.default = require('css-loader!less-loader!../../assets/less/notif.less');
+var _default = require('css-loader!less-loader!../../assets/less/notif.less');
+exports.default = _default;

package/compiled_src/popup/css.js

@@ -4,4 +4,5 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _default = exports.default = require('css-loader!less-loader!../../assets/less/popup.less');
+var _default = require('css-loader!less-loader!../../assets/less/popup.less');
+exports.default = _default;

package/compiled_src/popup/popup.js

@@ -211,7 +211,7 @@ class Popup extends _common.Com {
       });
     }
   }
-  onButtonClick(e, buttontype) {
+  async onButtonClick(e, buttontype) {
     e.stopPropagation();
     let popup = _index.default.get(this.props.plugin, 'popup', {});
     let page = _index.default.get(this.props.plugin.popup, `pages.${this.getPageIndex()}`);
@@ -235,14 +235,13 @@ class Popup extends _common.Com {
       if (a.action === 'submit' || a.action === 'conversion') hasConversion = true;
     }
     if (hasConversion) {
+      if (this.isSubmitting) return;
       var formData = this._formRef.current ? new FormData(this._formRef.current) : new FormData();
       var summitFields = [];
       let user = _index.default.cloneDeep(this.props.store.matchUser());
       let is_lead = false;
       let modifiedPairs = {};
-      console.log('333333333333');
       for (var pair of formData.entries()) {
-        console.log('44444444444444444');
         if (modifiedPairs[pair[0]]) {
           let currentValue = _index.default.get(modifiedPairs, `${pair[0]}.1`, '');
           currentValue += `,${pair[1]}`;
@@ -251,9 +250,7 @@ class Popup extends _common.Com {
           modifiedPairs[pair[0]] = [pair[0], pair[1]];
         }
       }
-      console.log('1111111111111', Object.entries(modifiedPairs));
       for (const [_, pair] of Object.entries(modifiedPairs)) {
-        console.log('2222222222222', pair);
         let page = _index.default.get(this.props.plugin.popup, `pages.${this.getPageIndex()}`);
         let form = _index.default.find(page.components, com => com.type === 'form');
         let fields = _index.default.get(form, 'form.fields', []);
@@ -277,8 +274,9 @@ class Popup extends _common.Com {
         key: 'lead_source',
         text: 'plugin.' + this.props.plugin.id
       });
-      this.props.store.setUser(user);
-      this.props.store.sendConversion(this.props.plugin.id, summitFields, this.impressionToken);
+      this.isSubmitting = true;
+      await Promise.all([this.props.store.setUser(user), this.props.store.sendConversion(this.props.plugin.id, summitFields, this.impressionToken)]);
+      this.isSubmitting = false;
     }
     for (let a of actions) {
       if (a.action === 'open_widget') this.props.showWidget('list');

package/compiled_src/popup/tick.core.commonjs.js

@@ -1333,4 +1333,5 @@ let obj = function () {
   module.exports = API;
   return module.exports;
 }();
-var _default = exports.default = obj;
+var _default = obj;
+exports.default = _default;

package/compiled_src/store/api.js

@@ -91,7 +91,7 @@ class _default {
         error
       };
       return {
-        url: this.FileURL + body.url
+        url: body.url
       };
     });
     _defineProperty(this, "time", _ => ajax.setBaseUrl(this.ApiURL).withCredentials(true).setParser('json').get('/time'));

package/compiled_src/store/store.js

@@ -760,7 +760,14 @@ class Store {
         if (!att._file) return;
         files.push(att);
         if (ImageTypes.includes(att._file.type)) {
-          att.url = await loadImage(att._file);
+          let {
+            width,
+            height,
+            url
+          } = await loadImage(att._file);
+          att.url = url;
+          att.width = width;
+          att.height = height;
         }
       });
     }
@@ -973,7 +980,16 @@ function loadImage(file) {
   return new Promise(rs => {
     var reader = new window.FileReader();
     reader.onload = e => {
-      rs(e.target.result);
+      let src = e.target.result;
+      let img = new Image();
+      img.onload = () => {
+        rs({
+          url: src,
+          width: img.width,
+          height: img.height
+        });
+      };
+      img.src = src;
     };
     reader.readAsDataURL(file);
   });

package/compiled_src/util/campaign.js

@@ -37,7 +37,9 @@ function trackAreaClicked(selector, cb) {
     on('click', selector, cb);
   });
 }
-function trackInactivity(seconds = 0, cb) {
+function trackInactivity() {
+  let seconds = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
+  let cb = arguments.length > 1 ? arguments[1] : undefined;
   let events = ['scroll', 'keyup', 'keydown', 'mousemove', 'mousewheel', 'mouseenter', 'mouseover', 'mousedown', 'touchstart', 'touchmove', 'touchenter'];
   let inactiveSeconds = 0;
   let resetTime = () => {
@@ -60,7 +62,9 @@ let timeOnPage = 0;
 common.setInterval(() => {
   timeOnPage += 5;
 }, 5000);
-function trackTimeOnPage(seconds = 0, cb) {
+function trackTimeOnPage() {
+  let seconds = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
+  let cb = arguments.length > 1 ? arguments[1] : undefined;
   if (seconds < 1) {
     return common.setTimeout(function () {
       cb(seconds);

package/compiled_src/util/common.js

@@ -75,15 +75,23 @@ function parseJSON(str) {
 var f = document.createElement('iframe');
 f.style.display = 'none';
 document.documentElement.appendChild(f);
-var stringify = exports.stringify = f.contentWindow.JSON.stringify;
+var stringify = f.contentWindow.JSON.stringify;
+exports.stringify = stringify;
 var parse = f.contentWindow.JSON.parse;
-var Date = exports.Date = f.contentWindow.Date;
-var requestAnimationFrame = exports.requestAnimationFrame = f.contentWindow.requestAnimationFrame;
-var setTimeout = exports.setTimeout = f.contentWindow.setTimeout.bind(f.contentWindow);
-var setInterval = exports.setInterval = f.contentWindow.setInterval.bind(f.contentWindow);
-var clearInterval = exports.clearInterval = f.contentWindow.clearInterval.bind(f.contentWindow);
-var clearTimeout = exports.clearTimeout = f.contentWindow.clearTimeout.bind(f.contentWindow);
-var XMLHttpRequest = exports.XMLHttpRequest = f.contentWindow.XMLHttpRequest;
+var Date = f.contentWindow.Date;
+exports.Date = Date;
+var requestAnimationFrame = f.contentWindow.requestAnimationFrame;
+exports.requestAnimationFrame = requestAnimationFrame;
+var setTimeout = f.contentWindow.setTimeout.bind(f.contentWindow);
+exports.setTimeout = setTimeout;
+var setInterval = f.contentWindow.setInterval.bind(f.contentWindow);
+exports.setInterval = setInterval;
+var clearInterval = f.contentWindow.clearInterval.bind(f.contentWindow);
+exports.clearInterval = clearInterval;
+var clearTimeout = f.contentWindow.clearTimeout.bind(f.contentWindow);
+exports.clearTimeout = clearTimeout;
+var XMLHttpRequest = f.contentWindow.XMLHttpRequest;
+exports.XMLHttpRequest = XMLHttpRequest;
 function convoOfEv(ev) {
   if (!ev) return '';
   switch (ev.type) {
@@ -151,7 +159,10 @@ function getMsgField(ev, fieldName) {
 function isObject(item) {
   return item && typeof item === 'object' && !Array.isArray(item);
 }
-function merge(target, ...sources) {
+function merge(target) {
+  for (var _len = arguments.length, sources = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+    sources[_key - 1] = arguments[_key];
+  }
   if (!sources.length) return target;
   const source = sources.shift();
   if (isObject(target) && isObject(source)) {
@@ -544,8 +555,9 @@ function setCss(id, $css, css) {
     $css.appendChild(document.createTextNode(css));
   }
 }
-const DEF_CHAT_BUTTON_BACKGROUND_IMAGE_URL = exports.DEF_CHAT_BUTTON_BACKGROUND_IMAGE_URL = 'https://vcdn.subiz-cdn.com/file/bubble_11.svg?v=5';
-const DEFVAL = exports.DEFVAL = {
+const DEF_CHAT_BUTTON_BACKGROUND_IMAGE_URL = 'https://vcdn.subiz-cdn.com/file/bubble_11.svg?v=5';
+exports.DEF_CHAT_BUTTON_BACKGROUND_IMAGE_URL = DEF_CHAT_BUTTON_BACKGROUND_IMAGE_URL;
+const DEFVAL = {
   primary_color: '#0265FF',
   secondary_color: '#555555',
   background: 'linear-gradient(280.16deg, #0053d3 22.03%, #0265ff 78.2%)',
@@ -572,6 +584,7 @@ const DEFVAL = exports.DEFVAL = {
   widget_position: 'fixed',
   z_index: 2000000000
 };
+exports.DEFVAL = DEFVAL;
 function js2css(js, onlyprops, variables) {
   var newjs = {};
   for (var prop in js) {
@@ -950,7 +963,8 @@ function getUrlParameter() {
 }
 var sleep = ms => new Promise(res => setTimeout(res, ms));
 exports.sleep = sleep;
-function formatCurrency(val, currency = 'VND') {
+function formatCurrency(val) {
+  let currency = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'VND';
   let currencyObj = ALL_CURRENCIES.find(cur => cur.code === currency) || {
     name: 'Dong',
     code: 'VND',

package/compiled_src/util/index.js

@@ -21,4 +21,5 @@ sb.Pubsub = require('./pubsub.js').default;
 sb = Object.assign(sb, extractor);
 sb = Object.assign(sb, campaign);
 sb = Object.assign(sb, order);
-var _default = exports.default = sb;
+var _default = sb;
+exports.default = _default;

package/compiled_src/util/order.js

@@ -14,7 +14,8 @@ op.map = common.map;
 op.each = common.each;
 op.size = common.size;
 op.find = common.find;
-function getProductPropName(product, seperator = ' - ') {
+function getProductPropName(product) {
+  let seperator = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : ' - ';
   let options = op.get(product, 'options', []);
   let props = op.get(product, 'props', []);
   let multiPropsOptions = op.filter(options, option => op.size(option.values) > 1);
@@ -25,7 +26,8 @@ function getProductPropName(product, seperator = ' - ') {
   });
   return names.join(seperator);
 }
-function getOrderDisplayName(order = {}) {
+function getOrderDisplayName() {
+  let order = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   return order.number || order.id || '';
 }
 function displayOrderShippingAddress(order, isShorten) {

package/compiled_src/util/pubsub.js

@@ -14,9 +14,12 @@ class Pubsub {
   }
   publish(topic, payload, payload2, payload3) {
     this.listeners[topic] = filter(this.listeners[topic], sub => sub.obj._isMounted);
-    map(this.listeners[topic], ({
-      cb
-    }) => cb(payload, payload2, payload3));
+    map(this.listeners[topic], _ref => {
+      let {
+        cb
+      } = _ref;
+      return cb(payload, payload2, payload3);
+    });
   }
   on2(obj, topic, cb) {
     if (!this.listeners[topic]) this.listeners[topic] = [];