framework7 6.3.16 → 7.0.0-beta.12

package/{esm/components → components}/messages/messages-class.js

@@ -1,33 +1,17 @@
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-
-function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
-
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-
-import $ from '../../shared/dom7';
-import { extend, deleteProps } from '../../shared/utils';
-import Framework7Class from '../../shared/class';
+import $ from '../../shared/dom7.js';
+import { extend, deleteProps } from '../../shared/utils.js';
+import Framework7Class from '../../shared/class.js';
 /** @jsx $jsx */
 
-import $jsx from '../../shared/$jsx';
-
-var Messages = /*#__PURE__*/function (_Framework7Class) {
-  _inheritsLoose(Messages, _Framework7Class);
-
-  function Messages(app, params) {
-    var _this;
-
-    if (params === void 0) {
-      params = {};
-    }
-
-    _this = _Framework7Class.call(this, params, [app]) || this;
-
-    var m = _assertThisInitialized(_this);
+import $jsx from '../../shared/$jsx.js';
 
-    var defaults = {
+class Messages extends Framework7Class {
+  constructor(app, params = {}) {
+    super(params, [app]);
+    const m = this;
+    const defaults = {
       autoLayout: true,
       messages: [],
       newMessagesFirst: false,
@@ -46,31 +30,29 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
 
     m.useModulesParams(defaults);
     m.params = extend(defaults, params);
-    var $el = $(params.el).eq(0);
-    if ($el.length === 0) return m || _assertThisInitialized(_this);
-    if ($el[0].f7Messages) return $el[0].f7Messages || _assertThisInitialized(_this);
+    const $el = $(params.el).eq(0);
+    if ($el.length === 0) return m;
+    if ($el[0].f7Messages) return $el[0].f7Messages;
     $el[0].f7Messages = m;
-    var $pageContentEl = $el.closest('.page-content').eq(0);
+    const $pageContentEl = $el.closest('.page-content').eq(0);
     extend(m, {
       messages: m.params.messages,
-      $el: $el,
+      $el,
       el: $el[0],
-      $pageContentEl: $pageContentEl,
+      $pageContentEl,
       pageContentEl: $pageContentEl[0]
     }); // Install Modules
 
     m.useModules(); // Init
 
     m.init();
-    return m || _assertThisInitialized(_this);
+    return m;
   } // eslint-disable-next-line
 
 
-  var _proto = Messages.prototype;
-
-  _proto.getMessageData = function getMessageData(messageEl) {
-    var $messageEl = $(messageEl);
-    var data = {
+  getMessageData(messageEl) {
+    const $messageEl = $(messageEl);
+    const data = {
       name: $messageEl.find('.message-name').html(),
       header: $messageEl.find('.message-header').html(),
       textHeader: $messageEl.find('.message-text-header').html(),
@@ -89,14 +71,14 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
     }
 
     if (data.text && data.textHeader) {
-      data.text = data.text.replace("<div class=\"message-text-header\">" + data.textHeader + "</div>", '');
+      data.text = data.text.replace(`<div class="message-text-header">${data.textHeader}</div>`, '');
     }
 
     if (data.text && data.textFooter) {
-      data.text = data.text.replace("<div class=\"message-text-footer\">" + data.textFooter + "</div>", '');
+      data.text = data.text.replace(`<div class="message-text-footer">${data.textFooter}</div>`, '');
     }
 
-    var avatar = $messageEl.find('.message-avatar').css('background-image');
+    let avatar = $messageEl.find('.message-avatar').css('background-image');
     if (avatar === 'none' || avatar === '') avatar = undefined;
 
     if (avatar && typeof avatar === 'string') {
@@ -107,20 +89,20 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
 
     data.avatar = avatar;
     return data;
-  };
+  }
 
-  _proto.getMessagesData = function getMessagesData() {
-    var m = this;
-    var data = [];
-    m.$el.find('.message, .messages-title').each(function (messageEl) {
+  getMessagesData() {
+    const m = this;
+    const data = [];
+    m.$el.find('.message, .messages-title').each(messageEl => {
       data.push(m.getMessageData(messageEl));
     });
     return data;
-  };
+  }
 
-  _proto.renderMessage = function renderMessage(messageToRender) {
-    var m = this;
-    var message = extend({
+  renderMessage(messageToRender) {
+    const m = this;
+    const message = extend({
       type: 'sent',
       attrs: {}
     }, messageToRender);
@@ -130,14 +112,14 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
     }
 
     if (message.isTitle) {
-      return "<div class=\"messages-title\">" + message.text + "</div>";
+      return `<div class="messages-title">${message.text}</div>`;
     }
 
     return $jsx("div", _extends({
-      class: "message message-" + message.type + " " + (message.isTyping ? 'message-typing' : '') + " " + (message.cssClass || '')
+      class: `message message-${message.type} ${message.isTyping ? 'message-typing' : ''} ${message.cssClass || ''}`
     }, message.attrs), message.avatar && $jsx("div", {
       class: "message-avatar",
-      style: "background-image:url(" + message.avatar + ")"
+      style: `background-image:url(${message.avatar})`
     }), $jsx("div", {
       class: "message-content"
     }, message.name && $jsx("div", {
@@ -163,101 +145,75 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
     }, message.textFooter)), message.footer && $jsx("div", {
       class: "message-footer"
     }, message.footer)));
-  };
+  }
 
-  _proto.renderMessages = function renderMessages(messagesToRender, method) {
-    if (messagesToRender === void 0) {
-      messagesToRender = this.messages;
-    }
-
-    if (method === void 0) {
-      method = this.params.newMessagesFirst ? 'prepend' : 'append';
-    }
-
-    var m = this;
-    var html = messagesToRender.map(function (message) {
-      return m.renderMessage(message);
-    }).join('');
+  renderMessages(messagesToRender = this.messages, method = this.params.newMessagesFirst ? 'prepend' : 'append') {
+    const m = this;
+    const html = messagesToRender.map(message => m.renderMessage(message)).join('');
     m.$el[method](html);
-  };
-
-  _proto.isFirstMessage = function isFirstMessage() {
-    var _m$params;
+  }
 
-    var m = this;
-    if (m.params.firstMessageRule) return (_m$params = m.params).firstMessageRule.apply(_m$params, arguments);
+  isFirstMessage(...args) {
+    const m = this;
+    if (m.params.firstMessageRule) return m.params.firstMessageRule(...args);
     return false;
-  };
+  }
 
-  _proto.isLastMessage = function isLastMessage() {
-    var _m$params2;
-
-    var m = this;
-    if (m.params.lastMessageRule) return (_m$params2 = m.params).lastMessageRule.apply(_m$params2, arguments);
+  isLastMessage(...args) {
+    const m = this;
+    if (m.params.lastMessageRule) return m.params.lastMessageRule(...args);
     return false;
-  };
-
-  _proto.isTailMessage = function isTailMessage() {
-    var _m$params3;
+  }
 
-    var m = this;
-    if (m.params.tailMessageRule) return (_m$params3 = m.params).tailMessageRule.apply(_m$params3, arguments);
+  isTailMessage(...args) {
+    const m = this;
+    if (m.params.tailMessageRule) return m.params.tailMessageRule(...args);
     return false;
-  };
+  }
 
-  _proto.isSameNameMessage = function isSameNameMessage() {
-    var _m$params4;
-
-    var m = this;
-    if (m.params.sameNameMessageRule) return (_m$params4 = m.params).sameNameMessageRule.apply(_m$params4, arguments);
+  isSameNameMessage(...args) {
+    const m = this;
+    if (m.params.sameNameMessageRule) return m.params.sameNameMessageRule(...args);
     return false;
-  };
-
-  _proto.isSameHeaderMessage = function isSameHeaderMessage() {
-    var _m$params5;
+  }
 
-    var m = this;
-    if (m.params.sameHeaderMessageRule) return (_m$params5 = m.params).sameHeaderMessageRule.apply(_m$params5, arguments);
+  isSameHeaderMessage(...args) {
+    const m = this;
+    if (m.params.sameHeaderMessageRule) return m.params.sameHeaderMessageRule(...args);
     return false;
-  };
-
-  _proto.isSameFooterMessage = function isSameFooterMessage() {
-    var _m$params6;
+  }
 
-    var m = this;
-    if (m.params.sameFooterMessageRule) return (_m$params6 = m.params).sameFooterMessageRule.apply(_m$params6, arguments);
+  isSameFooterMessage(...args) {
+    const m = this;
+    if (m.params.sameFooterMessageRule) return m.params.sameFooterMessageRule(...args);
     return false;
-  };
+  }
 
-  _proto.isSameAvatarMessage = function isSameAvatarMessage() {
-    var _m$params7;
-
-    var m = this;
-    if (m.params.sameAvatarMessageRule) return (_m$params7 = m.params).sameAvatarMessageRule.apply(_m$params7, arguments);
+  isSameAvatarMessage(...args) {
+    const m = this;
+    if (m.params.sameAvatarMessageRule) return m.params.sameAvatarMessageRule(...args);
     return false;
-  };
-
-  _proto.isCustomClassMessage = function isCustomClassMessage() {
-    var _m$params8;
+  }
 
-    var m = this;
-    if (m.params.customClassMessageRule) return (_m$params8 = m.params).customClassMessageRule.apply(_m$params8, arguments);
+  isCustomClassMessage(...args) {
+    const m = this;
+    if (m.params.customClassMessageRule) return m.params.customClassMessageRule(...args);
     return undefined;
-  };
+  }
 
-  _proto.layout = function layout() {
-    var m = this;
-    m.$el.find('.message, .messages-title').each(function (messageEl, index) {
-      var $messageEl = $(messageEl);
+  layout() {
+    const m = this;
+    m.$el.find('.message, .messages-title').each((messageEl, index) => {
+      const $messageEl = $(messageEl);
 
       if (!m.messages) {
         m.messages = m.getMessagesData();
       }
 
-      var classes = [];
-      var message = m.messages[index];
-      var previousMessage = m.messages[index - 1];
-      var nextMessage = m.messages[index + 1];
+      const classes = [];
+      const message = m.messages[index];
+      const previousMessage = m.messages[index - 1];
+      const nextMessage = m.messages[index + 1];
 
       if (m.isFirstMessage(message, previousMessage, nextMessage)) {
         classes.push('message-first');
@@ -287,40 +243,36 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
         classes.push('message-same-avatar');
       }
 
-      var customMessageClasses = m.isCustomClassMessage(message, previousMessage, nextMessage);
+      let customMessageClasses = m.isCustomClassMessage(message, previousMessage, nextMessage);
 
       if (customMessageClasses && customMessageClasses.length) {
         if (typeof customMessageClasses === 'string') {
           customMessageClasses = customMessageClasses.split(' ');
         }
 
-        customMessageClasses.forEach(function (customClass) {
+        customMessageClasses.forEach(customClass => {
           classes.push(customClass);
         });
       }
 
       $messageEl.removeClass('message-first message-last message-tail message-same-name message-same-header message-same-footer message-same-avatar');
-      classes.forEach(function (className) {
+      classes.forEach(className => {
         $messageEl.addClass(className);
       });
     });
-  };
+  }
 
-  _proto.clear = function clear() {
-    var m = this;
+  clear() {
+    const m = this;
     m.messages = [];
     m.$el.html('');
-  };
+  }
 
-  _proto.removeMessage = function removeMessage(messageToRemove, layout) {
-    if (layout === void 0) {
-      layout = true;
-    }
-
-    var m = this; // Index or El
+  removeMessage(messageToRemove, layout = true) {
+    const m = this; // Index or El
 
-    var index;
-    var $el;
+    let index;
+    let $el;
 
     if (typeof messageToRemove === 'number') {
       index = messageToRemove;
@@ -341,51 +293,39 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
     m.messages.splice(index, 1);
     if (m.params.autoLayout && layout) m.layout();
     return m;
-  };
-
-  _proto.removeMessages = function removeMessages(messagesToRemove, layout) {
-    if (layout === void 0) {
-      layout = true;
-    }
+  }
 
-    var m = this;
+  removeMessages(messagesToRemove, layout = true) {
+    const m = this;
 
     if (Array.isArray(messagesToRemove)) {
-      var messagesToRemoveEls = [];
-      messagesToRemove.forEach(function (messageToRemoveIndex) {
+      const messagesToRemoveEls = [];
+      messagesToRemove.forEach(messageToRemoveIndex => {
         messagesToRemoveEls.push(m.$el.find('.message, .messages-title').eq(messageToRemoveIndex));
       });
-      messagesToRemoveEls.forEach(function (messageToRemove) {
+      messagesToRemoveEls.forEach(messageToRemove => {
         m.removeMessage(messageToRemove, false);
       });
     } else {
-      $(messagesToRemove).each(function (messageToRemove) {
+      $(messagesToRemove).each(messageToRemove => {
         m.removeMessage(messageToRemove, false);
       });
     }
 
     if (m.params.autoLayout && layout) m.layout();
     return m;
-  };
+  }
 
-  _proto.addMessage = function addMessage() {
-    var m = this;
-    var messageToAdd;
-    var animate;
-    var method;
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
+  addMessage(...args) {
+    const m = this;
+    let messageToAdd;
+    let animate;
+    let method;
 
     if (typeof args[1] === 'boolean') {
-      messageToAdd = args[0];
-      animate = args[1];
-      method = args[2];
+      [messageToAdd, animate, method] = args;
     } else {
-      messageToAdd = args[0];
-      method = args[1];
-      animate = args[2];
+      [messageToAdd, method, animate] = args;
     }
 
     if (typeof animate === 'undefined') {
@@ -397,44 +337,36 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
     }
 
     return m.addMessages([messageToAdd], animate, method);
-  };
+  }
 
-  _proto.setScrollData = function setScrollData() {
-    var m = this; // Define scroll positions before new messages added
+  setScrollData() {
+    const m = this; // Define scroll positions before new messages added
 
-    var scrollHeightBefore = m.pageContentEl.scrollHeight;
-    var heightBefore = m.pageContentEl.offsetHeight;
-    var scrollBefore = m.pageContentEl.scrollTop;
+    const scrollHeightBefore = m.pageContentEl.scrollHeight;
+    const heightBefore = m.pageContentEl.offsetHeight;
+    const scrollBefore = m.pageContentEl.scrollTop;
     m.scrollData = {
-      scrollHeightBefore: scrollHeightBefore,
-      heightBefore: heightBefore,
-      scrollBefore: scrollBefore
+      scrollHeightBefore,
+      heightBefore,
+      scrollBefore
     };
     return {
-      scrollHeightBefore: scrollHeightBefore,
-      heightBefore: heightBefore,
-      scrollBefore: scrollBefore
+      scrollHeightBefore,
+      heightBefore,
+      scrollBefore
     };
-  };
+  }
 
-  _proto.addMessages = function addMessages() {
-    var m = this;
-    var messagesToAdd;
-    var animate;
-    var method;
-
-    for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
-      args[_key2] = arguments[_key2];
-    }
+  addMessages(...args) {
+    const m = this;
+    let messagesToAdd;
+    let animate;
+    let method;
 
     if (typeof args[1] === 'boolean') {
-      messagesToAdd = args[0];
-      animate = args[1];
-      method = args[2];
+      [messagesToAdd, animate, method] = args;
     } else {
-      messagesToAdd = args[0];
-      method = args[1];
-      animate = args[2];
+      [messagesToAdd, method, animate] = args;
     }
 
     if (typeof animate === 'undefined') {
@@ -445,16 +377,14 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
       method = m.params.newMessagesFirst ? 'prepend' : 'append';
     }
 
-    var _m$setScrollData = m.setScrollData(),
-        scrollHeightBefore = _m$setScrollData.scrollHeightBefore,
-        scrollBefore = _m$setScrollData.scrollBefore; // Add message to DOM and data
-
+    const {
+      scrollHeightBefore,
+      scrollBefore
+    } = m.setScrollData(); // Add message to DOM and data
 
-    var messagesHTML = '';
-    var typingMessage = m.messages.filter(function (el) {
-      return el.isTyping;
-    })[0];
-    messagesToAdd.forEach(function (messageToAdd) {
+    let messagesHTML = '';
+    const typingMessage = m.messages.filter(el => el.isTyping)[0];
+    messagesToAdd.forEach(messageToAdd => {
       if (typingMessage) {
         if (method === 'append') {
           m.messages.splice(m.messages.indexOf(typingMessage), 0, messageToAdd);
@@ -467,7 +397,7 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
 
       messagesHTML += m.renderMessage(messageToAdd);
     });
-    var $messagesEls = $(messagesHTML);
+    const $messagesEls = $(messagesHTML);
 
     if (animate) {
       if (method === 'append' && !m.params.newMessagesFirst) {
@@ -501,17 +431,11 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
     }
 
     return m;
-  };
+  }
 
-  _proto.showTyping = function showTyping(message) {
-    if (message === void 0) {
-      message = {};
-    }
-
-    var m = this;
-    var typingMessage = m.messages.filter(function (el) {
-      return el.isTyping;
-    })[0];
+  showTyping(message = {}) {
+    const m = this;
+    const typingMessage = m.messages.filter(el => el.isTyping)[0];
 
     if (typingMessage) {
       m.removeMessage(m.messages.indexOf(typingMessage));
@@ -522,13 +446,13 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
       isTyping: true
     }, message));
     return m;
-  };
+  }
 
-  _proto.hideTyping = function hideTyping() {
-    var m = this;
-    var typingMessageIndex;
-    var typingFound;
-    m.messages.forEach(function (message, index) {
+  hideTyping() {
+    const m = this;
+    let typingMessageIndex;
+    let typingFound;
+    m.messages.forEach((message, index) => {
       if (message.isTyping) typingMessageIndex = index;
     });
 
@@ -540,7 +464,7 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
     }
 
     if (!typingFound) {
-      var $typingMessageEl = m.$el.find('.message-typing');
+      const $typingMessageEl = m.$el.find('.message-typing');
 
       if ($typingMessageEl.length) {
         m.removeMessage($typingMessageEl);
@@ -548,17 +472,18 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
     }
 
     return m;
-  };
+  }
 
-  _proto.scrollWithEdgeCheck = function scrollWithEdgeCheck(animate) {
-    var m = this;
-    var _m$scrollData = m.scrollData,
-        scrollBefore = _m$scrollData.scrollBefore,
-        scrollHeightBefore = _m$scrollData.scrollHeightBefore,
-        heightBefore = _m$scrollData.heightBefore;
+  scrollWithEdgeCheck(animate) {
+    const m = this;
+    const {
+      scrollBefore,
+      scrollHeightBefore,
+      heightBefore
+    } = m.scrollData;
 
     if (m.params.scrollMessagesOnEdge) {
-      var onEdge = false;
+      let onEdge = false;
 
       if (m.params.newMessagesFirst && scrollBefore === 0) {
         onEdge = true;
@@ -572,26 +497,22 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
     } else {
       m.scroll(animate ? undefined : 0);
     }
-  };
-
-  _proto.scroll = function scroll(duration, scrollTop) {
-    if (duration === void 0) {
-      duration = 300;
-    }
+  }
 
-    var m = this;
-    var currentScroll = m.pageContentEl.scrollTop;
-    var newScrollTop;
+  scroll(duration = 300, scrollTop) {
+    const m = this;
+    const currentScroll = m.pageContentEl.scrollTop;
+    let newScrollTop;
     if (typeof scrollTop !== 'undefined') newScrollTop = scrollTop;else {
       newScrollTop = m.params.newMessagesFirst ? 0 : m.pageContentEl.scrollHeight - m.pageContentEl.offsetHeight;
       if (newScrollTop === currentScroll) return m;
     }
     m.$pageContentEl.scrollTop(newScrollTop, duration);
     return m;
-  };
+  }
 
-  _proto.init = function init() {
-    var m = this;
+  init() {
+    const m = this;
 
     if (!m.messages || m.messages.length === 0) {
       m.messages = m.getMessagesData();
@@ -603,10 +524,10 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
 
     if (m.params.autoLayout) m.layout();
     if (m.params.scrollMessages) m.scroll(0);
-  };
+  }
 
-  _proto.destroy = function destroy() {
-    var m = this;
+  destroy() {
+    const m = this;
     m.emit('local::beforeDestroy messagesBeforeDestroy', m);
     m.$el.trigger('messages:beforedestroy');
 
@@ -616,9 +537,8 @@ var Messages = /*#__PURE__*/function (_Framework7Class) {
     }
 
     deleteProps(m);
-  };
+  }
 
-  return Messages;
-}(Framework7Class);
+}
 
 export default Messages;