framework7 6.3.4 → 7.0.0-beta.3

package/components/tabs/tabs.umd.js

@@ -0,0 +1 @@
+(function framework7ComponentLoader(t,a){void 0===a&&(a=!0);var e=t.$,n=t.utils,i=(t.getDevice,t.getSupport,t.Class,t.Modal,t.ConstructorMethods,t.ModalMethods,n.extend);const s={show(...t){const a=this;let n,i,s,r,l;1===t.length&&t[0]&&t[0].constructor===Object?(n=t[0].tabEl,i=t[0].tabLinkEl,s=t[0].animate,r=t[0].tabRoute,l=t[0].animatedInit):([n,i,s,r]=t,"boolean"==typeof t[1]&&([n,s,i,r]=t,t.length>2&&i.constructor===Object&&([n,s,r,i]=t))),void 0===s&&(s=!0);const o=e(n);if(r&&o[0]&&(o[0].f7TabRoute=r),!l&&(0===o.length||o.hasClass("tab-active")))return{$newTabEl:o,newTabEl:o[0]};let b;i&&(b=e(i));const h=o.parent(".tabs");if(0===h.length)return{$newTabEl:o,newTabEl:o[0]};a.swipeout&&(a.swipeout.allowOpen=!0);const d=[];function g(){d.forEach((t=>{t()}))}let c,p=!1;if(h.parent().hasClass("tabs-animated-wrap")){h.parent()[s?"removeClass":"addClass"]("not-animated");const t=parseFloat(h.css("transition-duration").replace(",","."));s&&t&&(h.transitionEnd(g),p=!0);const e=100*(a.rtl?o.index():-o.index());h.transform(`translate3d(${e}%,0,0)`)}h.parent().hasClass("tabs-swipeable-wrap")&&a.swiper&&(c=h.parent()[0].swiper,c&&c.activeIndex!==o.index()?(p=!0,c.once("slideChangeTransitionEnd",(()=>{g()})).slideTo(o.index(),s?void 0:0)):c&&c.animating&&(p=!0,c.once("slideChangeTransitionEnd",(()=>{g()}))));const u=h.children(".tab-active");if(u.removeClass("tab-active"),!l&&(!c||c&&!c.animating||c&&r)&&(u.hasClass("view")&&u.children(".page").length&&u.children(".page").each((t=>{e(t).trigger("page:tabhide"),a.emit("pageTabHide",t)})),u.trigger("tab:hide"),a.emit("tabHide",u[0])),o.addClass("tab-active"),!l&&(!c||c&&!c.animating||c&&r)&&(o.hasClass("view")&&o.children(".page").length&&o.children(".page").each((t=>{e(t).trigger("page:tabshow"),a.emit("pageTabShow",t)})),o.trigger("tab:show"),a.emit("tabShow",o[0])),!b&&(b=e("string"==typeof n?`.tab-link[href="${n}"]`:`.tab-link[href="#${o.attr("id")}"]`),(!b||b&&0===b.length)&&e("[data-tab]").each((t=>{o.is(e(t).attr("data-tab"))&&(b=e(t))})),r&&(!b||b&&0===b.length)&&(b=e(`[data-route-tab-id="${r.route.tab.id}"]`),0===b.length&&(b=e(`.tab-link[href="${r.url}"]`))),b.length>1&&o.parents(".page").length&&(b=b.filter((t=>e(t).parents(".page")[0]===o.parents(".page")[0])),"ios"===a.theme&&0===b.length&&r))){const t=o.parents(".page"),n=e(a.navbar.getElByPage(t));b=n.find(`[data-route-tab-id="${r.route.tab.id}"]`),0===b.length&&(b=n.find(`.tab-link[href="${r.url}"]`))}if(b.length>0){let t;if(u&&u.length>0){const a=u.attr("id");a&&(t=e(`.tab-link[href="#${a}"]`),(!t||t&&0===t.length)&&(t=e(`.tab-link[data-route-tab-id="${a}"]`))),(!t||t&&0===t.length)&&e("[data-tab]").each((a=>{u.is(e(a).attr("data-tab"))&&(t=e(a))})),(!t||t&&0===t.length)&&(t=b.siblings(".tab-link-active"))}else r&&(t=b.siblings(".tab-link-active"));if(t&&t.length>1&&u&&u.parents(".page").length&&(t=t.filter((t=>e(t).parents(".page")[0]===u.parents(".page")[0]))),t&&t.length>0&&t.removeClass("tab-link-active"),b&&b.length>0&&(b.addClass("tab-link-active"),"ios"!==a.theme&&a.toolbar)){const t=b.parents(".tabbar, .tabbar-labels");t.length>0&&a.toolbar.setHighlight(t)}}return{$newTabEl:o,newTabEl:o[0],$oldTabEl:u,oldTabEl:u[0],onTabsChanged:function(t){d.push(t)},animated:p}}};var r={name:"tabs",create(){i(this,{tab:{show:s.show.bind(this)}})},on:{"pageInit tabMounted":function(t){const a=e(t.el||t).find(".tabs-animated-wrap > .tabs > .tab-active")[0];if(!a)return;this.tab.show({tabEl:a,animatedInit:!0,animate:!1})}},clicks:{".tab-link":function(t,a={}){if(t.attr("href")&&0===t.attr("href").indexOf("#")||t.attr("data-tab")){this.tab.show({tabEl:a.tab||t.attr("href"),tabLinkEl:t,animate:a.animate})}}}};if(a){if(t.prototype.modules&&t.prototype.modules[r.name])return;t.use(r),t.instance&&(t.instance.useModuleParams(r,t.instance.params),t.instance.useModule(r))}return r}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))

package/{esm/components → components}/text-editor/text-editor-class.js

@@ -1,15 +1,9 @@
-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 { getWindow, getDocument } from 'ssr-window';
 import $ from '../../shared/dom7';
 import { extend, deleteProps } from '../../shared/utils';
 import Framework7Class from '../../shared/class';
 import { getDevice } from '../../shared/get-device';
-var textEditorButtonsMap = {
+const textEditorButtonsMap = {
   // f7-icon, material-icon, command
   bold: ['bold', 'format_bold', 'bold'],
   italic: ['italic', 'format_italic', 'italic'],
@@ -33,28 +27,22 @@ var textEditorButtonsMap = {
   outdent: ['decrease_indent', 'format_indent_decrease', 'outdent']
 };
 
-var TextEditor = /*#__PURE__*/function (_Framework7Class) {
-  _inheritsLoose(TextEditor, _Framework7Class);
-
-  function TextEditor(app, params) {
-    var _this;
-
-    _this = _Framework7Class.call(this, params, [app]) || this;
-
-    var self = _assertThisInitialized(_this);
-
-    var document = getDocument();
-    var device = getDevice();
-    var defaults = extend({}, app.params.textEditor); // Extend defaults with modules params
+class TextEditor extends Framework7Class {
+  constructor(app, params) {
+    super(params, [app]);
+    const self = this;
+    const document = getDocument();
+    const device = getDevice();
+    const defaults = extend({}, app.params.textEditor); // Extend defaults with modules params
 
     self.useModulesParams(defaults);
     self.params = extend(defaults, params);
-    var el = self.params.el;
-    if (!el) return self || _assertThisInitialized(_this);
-    var $el = $(el);
-    if ($el.length === 0) return self || _assertThisInitialized(_this);
-    if ($el[0].f7TextEditor) return $el[0].f7TextEditor || _assertThisInitialized(_this);
-    var $contentEl = $el.children('.text-editor-content');
+    const el = self.params.el;
+    if (!el) return self;
+    const $el = $(el);
+    if ($el.length === 0) return self;
+    if ($el[0].f7TextEditor) return $el[0].f7TextEditor;
+    let $contentEl = $el.children('.text-editor-content');
 
     if (!$contentEl.length) {
       $el.append('<div class="text-editor-content" contenteditable></div>');
@@ -62,10 +50,10 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
     }
 
     extend(self, {
-      app: app,
-      $el: $el,
+      app,
+      $el,
       el: $el[0],
-      $contentEl: $contentEl,
+      $contentEl,
       contentEl: $contentEl[0]
     });
 
@@ -143,29 +131,27 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
     self.useModules(); // Init
 
     self.init();
-    return self || _assertThisInitialized(_this);
+    return self;
   }
 
-  var _proto = TextEditor.prototype;
-
-  _proto.setValue = function setValue(newValue) {
-    var self = this;
-    var currentValue = self.value;
+  setValue(newValue) {
+    const self = this;
+    const currentValue = self.value;
     if (currentValue === newValue) return self;
     self.value = newValue;
     self.$contentEl.html(newValue);
     self.$el.trigger('texteditor:change', self.value);
     self.emit('local::change textEditorChange', self, self.value);
     return self;
-  };
+  }
 
-  _proto.getValue = function getValue() {
-    var self = this;
+  getValue() {
+    const self = this;
     return self.value;
-  };
+  }
 
-  _proto.clearValue = function clearValue() {
-    var self = this;
+  clearValue() {
+    const self = this;
     self.setValue('');
 
     if (self.params.placeholder && !self.$contentEl.html()) {
@@ -173,18 +159,18 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
     }
 
     return self;
-  };
+  }
 
-  _proto.createLink = function createLink() {
-    var self = this;
-    var window = getWindow();
-    var document = getDocument();
-    var currentSelection = window.getSelection();
-    var selectedNodes = [];
-    var $selectedLinks;
+  createLink() {
+    const self = this;
+    const window = getWindow();
+    const document = getDocument();
+    const currentSelection = window.getSelection();
+    const selectedNodes = [];
+    let $selectedLinks;
 
     if (currentSelection && currentSelection.anchorNode && $(currentSelection.anchorNode).parents(self.$el).length) {
-      var anchorNode = currentSelection.anchorNode;
+      let anchorNode = currentSelection.anchorNode;
 
       while (anchorNode) {
         selectedNodes.push(anchorNode);
@@ -198,14 +184,14 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
         }
       }
 
-      var selectedNodesLinks = [];
-      var $selectedNodes = $(selectedNodes);
+      const selectedNodesLinks = [];
+      const $selectedNodes = $(selectedNodes);
 
-      for (var i = 0; i < $selectedNodes.length; i += 1) {
-        var childNodes = $selectedNodes[i].children;
+      for (let i = 0; i < $selectedNodes.length; i += 1) {
+        const childNodes = $selectedNodes[i].children;
 
         if (childNodes) {
-          for (var j = 0; j < childNodes.length; j += 1) {
+          for (let j = 0; j < childNodes.length; j += 1) {
             if ($(childNodes[j]).is('a')) {
               selectedNodesLinks.push(childNodes[j]);
             }
@@ -217,9 +203,9 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
     }
 
     if ($selectedLinks && $selectedLinks.length) {
-      $selectedLinks.each(function (linkNode) {
-        var selection = window.getSelection();
-        var range = document.createRange();
+      $selectedLinks.each(linkNode => {
+        const selection = window.getSelection();
+        const range = document.createRange();
         range.selectNodeContents(linkNode);
         selection.removeAllRanges();
         selection.addRange(range);
@@ -229,9 +215,9 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
       return self;
     }
 
-    var currentRange = self.getSelectionRange();
+    const currentRange = self.getSelectionRange();
     if (!currentRange) return self;
-    var dialog = self.app.dialog.prompt(self.params.linkUrlText, '', function (link) {
+    const dialog = self.app.dialog.prompt(self.params.linkUrlText, '', link => {
       if (link && link.trim().length) {
         self.setSelectionRange(currentRange);
         document.execCommand('createLink', false, link.trim());
@@ -243,14 +229,14 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
     });
     dialog.$el.find('input').focus();
     return self;
-  };
+  }
 
-  _proto.insertImage = function insertImage() {
-    var self = this;
-    var document = getDocument();
-    var currentRange = self.getSelectionRange();
+  insertImage() {
+    const self = this;
+    const document = getDocument();
+    const currentRange = self.getSelectionRange();
     if (!currentRange) return self;
-    var dialog = self.app.dialog.prompt(self.params.imageUrlText, '', function (imageUrl) {
+    const dialog = self.app.dialog.prompt(self.params.imageUrlText, '', imageUrl => {
       if (imageUrl && imageUrl.trim().length) {
         self.setSelectionRange(currentRange);
         document.execCommand('insertImage', false, imageUrl.trim());
@@ -262,25 +248,25 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
     });
     dialog.$el.find('input').focus();
     return self;
-  };
+  }
 
-  _proto.removePlaceholder = function removePlaceholder() {
-    var self = this;
+  removePlaceholder() {
+    const self = this;
     self.$contentEl.find('.text-editor-placeholder').remove();
-  };
+  }
 
-  _proto.insertPlaceholder = function insertPlaceholder() {
-    var self = this;
-    self.$contentEl.append("<div class=\"text-editor-placeholder\">" + self.params.placeholder + "</div>");
-  };
+  insertPlaceholder() {
+    const self = this;
+    self.$contentEl.append(`<div class="text-editor-placeholder">${self.params.placeholder}</div>`);
+  }
 
-  _proto.onSelectionChange = function onSelectionChange() {
-    var self = this;
-    var window = getWindow();
-    var document = getDocument();
+  onSelectionChange() {
+    const self = this;
+    const window = getWindow();
+    const document = getDocument();
     if (self.params.mode === 'toolbar') return;
-    var selection = window.getSelection();
-    var selectionIsInContent = $(selection.anchorNode).parents(self.contentEl).length || selection.anchorNode === self.contentEl;
+    const selection = window.getSelection();
+    const selectionIsInContent = $(selection.anchorNode).parents(self.contentEl).length || selection.anchorNode === self.contentEl;
 
     if (self.params.mode === 'keyboard-toolbar') {
       if (!selectionIsInContent) {
@@ -293,7 +279,7 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
     }
 
     if (self.params.mode === 'popover') {
-      var selectionIsInPopover = $(selection.anchorNode).parents(self.popover.el).length || selection.anchorNode === self.popover.el;
+      const selectionIsInPopover = $(selection.anchorNode).parents(self.popover.el).length || selection.anchorNode === self.popover.el;
 
       if (!selectionIsInContent && !selectionIsInPopover) {
         self.closePopover();
@@ -301,58 +287,58 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
       }
 
       if (!selection.isCollapsed && selection.rangeCount) {
-        var range = selection.getRangeAt(0);
-        var rect = range.getBoundingClientRect();
-        var rootEl = self.app.$el[0] || document.body;
+        const range = selection.getRangeAt(0);
+        const rect = range.getBoundingClientRect();
+        const rootEl = self.app.$el[0] || document.body;
         self.openPopover(rect.x + (window.scrollX || 0) - rootEl.offsetLeft, rect.y + (window.scrollY || 0) - rootEl.offsetTop, rect.width, rect.height);
       } else if (selection.isCollapsed) {
         self.closePopover();
       }
     }
-  };
+  }
 
-  _proto.onPaste = function onPaste(e) {
-    var self = this;
-    var document = getDocument();
+  onPaste(e) {
+    const self = this;
+    const document = getDocument();
 
     if (self.params.clearFormattingOnPaste && e.clipboardData && e.clipboardData.getData) {
-      var text = e.clipboardData.getData('text/plain');
+      const text = e.clipboardData.getData('text/plain');
       e.preventDefault();
       document.execCommand('insertText', false, text);
     }
-  };
+  }
 
-  _proto.onInput = function onInput() {
-    var self = this;
-    var value = self.$contentEl.html();
+  onInput() {
+    const self = this;
+    const value = self.$contentEl.html();
     self.value = value;
     self.$el.trigger('texteditor:input');
     self.emit('local:input textEditorInput', self, self.value);
     self.$el.trigger('texteditor:change', self.value);
     self.emit('local::change textEditorChange', self, self.value);
-  };
+  }
 
-  _proto.onFocus = function onFocus() {
-    var self = this;
+  onFocus() {
+    const self = this;
     self.removePlaceholder();
     self.$contentEl.focus();
     self.$el.trigger('texteditor:focus');
     self.emit('local::focus textEditorFocus', self);
-  };
+  }
 
-  _proto.onBlur = function onBlur() {
-    var self = this;
-    var window = getWindow();
-    var document = getDocument();
+  onBlur() {
+    const self = this;
+    const window = getWindow();
+    const document = getDocument();
 
     if (self.params.placeholder && self.$contentEl.html() === '') {
       self.insertPlaceholder();
     }
 
     if (self.params.mode === 'popover') {
-      var selection = window.getSelection();
-      var selectionIsInContent = $(selection.anchorNode).parents(self.contentEl).length || selection.anchorNode === self.contentEl;
-      var inPopover = document.activeElement && self.popover && $(document.activeElement).closest(self.popover.$el).length;
+      const selection = window.getSelection();
+      const selectionIsInContent = $(selection.anchorNode).parents(self.contentEl).length || selection.anchorNode === self.contentEl;
+      const inPopover = document.activeElement && self.popover && $(document.activeElement).closest(self.popover.$el).length;
 
       if (!inPopover && !selectionIsInContent) {
         self.closePopover();
@@ -360,34 +346,33 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
     }
 
     if (self.params.mode === 'keyboard-toolbar') {
-      var _selection = window.getSelection();
-
-      var _selectionIsInContent = $(_selection.anchorNode).parents(self.contentEl).length || _selection.anchorNode === self.contentEl;
+      const selection = window.getSelection();
+      const selectionIsInContent = $(selection.anchorNode).parents(self.contentEl).length || selection.anchorNode === self.contentEl;
 
-      if (!_selectionIsInContent) {
+      if (!selectionIsInContent) {
         self.closeKeyboardToolbar();
       }
     }
 
     self.$el.trigger('texteditor:blur');
     self.emit('local::blur textEditorBlur', self);
-  };
-
-  _proto.onButtonClick = function onButtonClick(e) {
-    var self = this;
-    var window = getWindow();
-    var document = getDocument();
-    var selection = window.getSelection();
-    var selectionIsInContent = $(selection.anchorNode).parents(self.contentEl).length || selection.anchorNode === self.contentEl;
+  }
+
+  onButtonClick(e) {
+    const self = this;
+    const window = getWindow();
+    const document = getDocument();
+    const selection = window.getSelection();
+    const selectionIsInContent = $(selection.anchorNode).parents(self.contentEl).length || selection.anchorNode === self.contentEl;
     if (!selectionIsInContent) return;
-    var $buttonEl = $(e.target).closest('button');
+    const $buttonEl = $(e.target).closest('button');
 
     if ($buttonEl.parents('form').length) {
       e.preventDefault();
     }
 
-    var button = $buttonEl.attr('data-button');
-    var buttonData = self.params.customButtons && self.params.customButtons[button];
+    const button = $buttonEl.attr('data-button');
+    const buttonData = self.params.customButtons && self.params.customButtons[button];
     if (!button || !(textEditorButtonsMap[button] || buttonData)) return;
     $buttonEl.trigger('texteditor:buttonclick', button);
     self.emit('local::buttonClick textEditorButtonClick', self, button);
@@ -397,7 +382,7 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
       return;
     }
 
-    var command = textEditorButtonsMap[button][2];
+    const command = textEditorButtonsMap[button][2];
 
     if (command === 'createLink') {
       self.createLink();
@@ -410,8 +395,8 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
     }
 
     if (command.indexOf('formatBlock') === 0) {
-      var tagName = command.split('.')[1];
-      var $anchorNode = $(selection.anchorNode);
+      const tagName = command.split('.')[1];
+      const $anchorNode = $(selection.anchorNode);
 
       if ($anchorNode.parents(tagName.toLowerCase()).length || $anchorNode.is(tagName)) {
         document.execCommand('formatBlock', false, 'div');
@@ -424,14 +409,14 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
 
     document.execCommand(command, false);
   } // eslint-disable-next-line
-  ;
 
-  _proto.getSelectionRange = function getSelectionRange() {
-    var window = getWindow();
-    var document = getDocument();
+
+  getSelectionRange() {
+    const window = getWindow();
+    const document = getDocument();
 
     if (window.getSelection) {
-      var sel = window.getSelection();
+      const sel = window.getSelection();
 
       if (sel.getRangeAt && sel.rangeCount) {
         return sel.getRangeAt(0);
@@ -442,43 +427,43 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
 
     return null;
   } // eslint-disable-next-line
-  ;
 
-  _proto.setSelectionRange = function setSelectionRange(range) {
-    var window = getWindow();
-    var document = getDocument();
+
+  setSelectionRange(range) {
+    const window = getWindow();
+    const document = getDocument();
 
     if (range) {
       if (window.getSelection) {
-        var sel = window.getSelection();
+        const sel = window.getSelection();
         sel.removeAllRanges();
         sel.addRange(range);
       } else if (document.selection && range.select) {
         range.select();
       }
     }
-  };
+  }
 
-  _proto.renderButtons = function renderButtons() {
-    var self = this;
-    var html = '';
+  renderButtons() {
+    const self = this;
+    let html = '';
 
     function renderButton(button) {
-      var iconClass = self.app.theme === 'md' ? 'material-icons' : 'f7-icons';
+      const iconClass = self.app.theme === 'md' ? 'material-icons' : 'f7-icons';
 
       if (self.params.customButtons && self.params.customButtons[button]) {
-        var buttonData = self.params.customButtons[button];
-        return "<button type=\"button\" class=\"text-editor-button\" data-button=\"" + button + "\">" + (buttonData.content || '') + "</button>";
+        const buttonData = self.params.customButtons[button];
+        return `<button type="button" class="text-editor-button" data-button="${button}">${buttonData.content || ''}</button>`;
       }
 
       if (!textEditorButtonsMap[button]) return '';
-      var iconContent = textEditorButtonsMap[button][self.app.theme === 'md' ? 1 : 0];
-      return ("<button type=\"button\" class=\"text-editor-button\" data-button=\"" + button + "\">" + (iconContent.indexOf('<') >= 0 ? iconContent : "<i class=\"" + iconClass + "\">" + iconContent + "</i>") + "</button>").trim();
+      const iconContent = textEditorButtonsMap[button][self.app.theme === 'md' ? 1 : 0];
+      return `<button type="button" class="text-editor-button" data-button="${button}">${iconContent.indexOf('<') >= 0 ? iconContent : `<i class="${iconClass}">${iconContent}</i>`}</button>`.trim();
     }
 
-    self.params.buttons.forEach(function (button, buttonIndex) {
+    self.params.buttons.forEach((button, buttonIndex) => {
       if (Array.isArray(button)) {
-        button.forEach(function (b) {
+        button.forEach(b => {
           html += renderButton(b);
         });
 
@@ -490,53 +475,57 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
       }
     });
     return html;
-  };
+  }
 
-  _proto.createToolbar = function createToolbar() {
-    var self = this;
-    self.$el.prepend("<div class=\"text-editor-toolbar\">" + self.renderButtons() + "</div>");
-  };
+  createToolbar() {
+    const self = this;
+    self.$el.prepend(`<div class="text-editor-toolbar">${self.renderButtons()}</div>`);
+  }
 
-  _proto.createKeyboardToolbar = function createKeyboardToolbar() {
-    var self = this;
-    self.$keyboardToolbarEl = $("<div class=\"toolbar toolbar-bottom text-editor-keyboard-toolbar\"><div class=\"toolbar-inner\">" + self.renderButtons() + "</div></div>");
-  };
+  createKeyboardToolbar() {
+    const self = this;
+    self.$keyboardToolbarEl = $(`<div class="toolbar toolbar-bottom text-editor-keyboard-toolbar"><div class="toolbar-inner">${self.renderButtons()}</div></div>`);
+  }
 
-  _proto.createPopover = function createPopover() {
-    var self = this;
+  createPopover() {
+    const self = this;
     self.popover = self.app.popover.create({
-      content: "\n        <div class=\"popover theme-dark text-editor-popover\">\n          <div class=\"popover-inner\">" + self.renderButtons() + "</div>\n        </div>\n      ",
+      content: `
+        <div class="popover dark text-editor-popover">
+          <div class="popover-inner">${self.renderButtons()}</div>
+        </div>
+      `,
       closeByOutsideClick: false,
       backdrop: false
     });
-  };
+  }
 
-  _proto.openKeyboardToolbar = function openKeyboardToolbar() {
-    var self = this;
+  openKeyboardToolbar() {
+    const self = this;
     if (self.$keyboardToolbarEl.parent(self.app.$el).length) return;
     self.$el.trigger('texteditor:keyboardopen');
     self.emit('local::keyboardOpen textEditorKeyboardOpen', self);
     self.app.$el.append(self.$keyboardToolbarEl);
-  };
+  }
 
-  _proto.closeKeyboardToolbar = function closeKeyboardToolbar() {
-    var self = this;
+  closeKeyboardToolbar() {
+    const self = this;
     self.$keyboardToolbarEl.remove();
     self.$el.trigger('texteditor:keyboardclose');
     self.emit('local::keyboardClose textEditorKeyboardClose', self);
-  };
+  }
 
-  _proto.openPopover = function openPopover(targetX, targetY, targetWidth, targetHeight) {
-    var self = this;
+  openPopover(targetX, targetY, targetWidth, targetHeight) {
+    const self = this;
     if (!self.popover) return;
     Object.assign(self.popover.params, {
-      targetX: targetX,
-      targetY: targetY,
-      targetWidth: targetWidth,
-      targetHeight: targetHeight
+      targetX,
+      targetY,
+      targetWidth,
+      targetHeight
     });
     clearTimeout(self.popoverTimeout);
-    self.popoverTimeout = setTimeout(function () {
+    self.popoverTimeout = setTimeout(() => {
       if (!self.popover) return;
 
       if (self.popover.opened) {
@@ -547,22 +536,22 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
         self.popover.open();
       }
     }, 400);
-  };
+  }
 
-  _proto.closePopover = function closePopover() {
-    var self = this;
+  closePopover() {
+    const self = this;
     clearTimeout(self.popoverTimeout);
     if (!self.popover || !self.popover.opened) return;
-    self.popoverTimeout = setTimeout(function () {
+    self.popoverTimeout = setTimeout(() => {
       if (!self.popover) return;
       self.$el.trigger('texteditor:popoverclose');
       self.emit('local::popoverClose textEditorPopoverClose', self);
       self.popover.close();
     }, 400);
-  };
+  }
 
-  _proto.init = function init() {
-    var self = this;
+  init() {
+    const self = this;
 
     if (self.value) {
       self.$contentEl.html(self.value);
@@ -586,10 +575,10 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
     self.$el.trigger('texteditor:init');
     self.emit('local::init textEditorInit', self);
     return self;
-  };
+  }
 
-  _proto.destroy = function destroy() {
-    var self = this;
+  destroy() {
+    let self = this;
     self.$el.trigger('texteditor:beforedestroy');
     self.emit('local::beforeDestroy textEditorBeforeDestroy', self);
     self.detachEvents();
@@ -606,9 +595,8 @@ var TextEditor = /*#__PURE__*/function (_Framework7Class) {
     delete self.$el[0].f7TextEditor;
     deleteProps(self);
     self = null;
-  };
+  }
 
-  return TextEditor;
-}(Framework7Class);
+}
 
 export default TextEditor;