framework7 6.3.16 → 7.0.0-beta.12

package/cjs/components/tooltip/tooltip.js

@@ -1,146 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.default = void 0;
-
-var _dom = _interopRequireDefault(require("../../shared/dom7"));
-
-var _tooltipClass = _interopRequireDefault(require("./tooltip-class"));
-
-var _constructorMethods = _interopRequireDefault(require("../../shared/constructor-methods"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-var _default = {
-  name: 'tooltip',
-  static: {
-    Tooltip: _tooltipClass.default
-  },
-  create: function create() {
-    var app = this;
-    app.tooltip = (0, _constructorMethods.default)({
-      defaultSelector: '.tooltip',
-      constructor: _tooltipClass.default,
-      app: app,
-      domProp: 'f7Tooltip'
-    });
-
-    app.tooltip.show = function show(el) {
-      var $el = (0, _dom.default)(el);
-      if ($el.length === 0) return undefined;
-      var tooltip = $el[0].f7Tooltip;
-      if (!tooltip) return undefined;
-      tooltip.show($el[0]);
-      return tooltip;
-    };
-
-    app.tooltip.hide = function hide(el) {
-      var $el = (0, _dom.default)(el);
-      if ($el.length === 0) return undefined;
-      var tooltip = $el[0].f7Tooltip;
-      if (!tooltip) return undefined;
-      tooltip.hide();
-      return tooltip;
-    };
-
-    app.tooltip.setText = function text(el, newText) {
-      var $el = (0, _dom.default)(el);
-      if ($el.length === 0) return undefined;
-      var tooltip = $el[0].f7Tooltip;
-      if (!tooltip) return undefined;
-      tooltip.setText(newText);
-      return tooltip;
-    };
-  },
-  params: {
-    tooltip: {
-      targetEl: null,
-      delegated: false,
-      text: null,
-      cssClass: null,
-      render: null,
-      offset: 0,
-      trigger: 'hover',
-      containerEl: undefined
-    }
-  },
-  on: {
-    tabMounted: function tabMounted(tabEl) {
-      var app = this;
-      (0, _dom.default)(tabEl).find('.tooltip-init').each(function (el) {
-        var text = (0, _dom.default)(el).attr('data-tooltip');
-        if (!text) return;
-        app.tooltip.create({
-          targetEl: el,
-          text: text
-        });
-      });
-    },
-    tabBeforeRemove: function tabBeforeRemove(tabEl) {
-      (0, _dom.default)(tabEl).find('.tooltip-init').each(function (el) {
-        if (el.f7Tooltip) el.f7Tooltip.destroy();
-      });
-    },
-    pageInit: function pageInit(page) {
-      var app = this;
-      page.$el.find('.tooltip-init').each(function (el) {
-        var text = (0, _dom.default)(el).attr('data-tooltip');
-        if (!text) return;
-        app.tooltip.create({
-          targetEl: el,
-          text: text
-        });
-      });
-
-      if (app.theme === 'ios' && page.view && page.view.router.dynamicNavbar && page.$navbarEl && page.$navbarEl.length > 0) {
-        page.$navbarEl.find('.tooltip-init').each(function (el) {
-          var text = (0, _dom.default)(el).attr('data-tooltip');
-          if (!text) return;
-          app.tooltip.create({
-            targetEl: el,
-            text: text
-          });
-        });
-      }
-    },
-    pageBeforeRemove: function pageBeforeRemove(page) {
-      var app = this;
-      page.$el.find('.tooltip-init').each(function (el) {
-        if (el.f7Tooltip) el.f7Tooltip.destroy();
-      });
-
-      if (app.theme === 'ios' && page.view && page.view.router.dynamicNavbar && page.$navbarEl && page.$navbarEl.length > 0) {
-        page.$navbarEl.find('.tooltip-init').each(function (el) {
-          if (el.f7Tooltip) el.f7Tooltip.destroy();
-        });
-      }
-    }
-  },
-  vnode: {
-    'tooltip-init': {
-      insert: function insert(vnode) {
-        var app = this;
-        var el = vnode.elm;
-        var text = (0, _dom.default)(el).attr('data-tooltip');
-        if (!text) return;
-        app.tooltip.create({
-          targetEl: el,
-          text: text
-        });
-      },
-      update: function update(vnode) {
-        var el = vnode.elm;
-        if (!el.f7Tooltip) return;
-
-        if (vnode && vnode.data && vnode.data.attrs && vnode.data.attrs['data-tooltip']) {
-          el.f7Tooltip.setText(vnode.data.attrs['data-tooltip']);
-        }
-      },
-      destroy: function destroy(vnode) {
-        var el = vnode.elm;
-        if (el.f7Tooltip) el.f7Tooltip.destroy();
-      }
-    }
-  }
-};
-exports.default = _default;

package/cjs/components/touch-ripple/touch-ripple-class.js

@@ -1,110 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.default = void 0;
-
-var _dom = _interopRequireDefault(require("../../shared/dom7"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-var TouchRipple = /*#__PURE__*/function () {
-  function TouchRipple(app, $el, x, y) {
-    var ripple = this;
-    if (!$el) return undefined;
-
-    var _$el$0$getBoundingCli = $el[0].getBoundingClientRect(),
-        left = _$el$0$getBoundingCli.left,
-        top = _$el$0$getBoundingCli.top,
-        width = _$el$0$getBoundingCli.width,
-        height = _$el$0$getBoundingCli.height;
-
-    var center = {
-      x: x - left,
-      y: y - top
-    };
-    var diameter = Math.max(Math.pow(Math.pow(height, 2) + Math.pow(width, 2), 0.5), 48);
-    var isInset = false;
-    var insetElements = app.params.touch.touchRippleInsetElements || '';
-
-    if (insetElements && $el.is(insetElements)) {
-      isInset = true;
-    }
-
-    if (isInset) {
-      diameter = Math.max(Math.min(width, height), 48);
-    }
-
-    if (!isInset && $el.css('overflow') === 'hidden') {
-      var distanceFromCenter = Math.pow(Math.pow(center.x - width / 2, 2) + Math.pow(center.y - height / 2, 2), 0.5);
-      var scale = (diameter / 2 + distanceFromCenter) / (diameter / 2);
-      ripple.rippleTransform = "translate3d(0px, 0px, 0) scale(" + scale + ")";
-    } else {
-      // prettier-ignore
-      ripple.rippleTransform = "translate3d(" + (-center.x + width / 2) + "px, " + (-center.y + height / 2) + "px, 0) scale(1)";
-    }
-
-    if (isInset) {
-      $el.addClass('ripple-inset');
-    }
-
-    ripple.$rippleWaveEl = (0, _dom.default)("<div class=\"ripple-wave\" style=\"width: " + diameter + "px; height: " + diameter + "px; margin-top:-" + diameter / 2 + "px; margin-left:-" + diameter / 2 + "px; left:" + center.x + "px; top:" + center.y + "px; --f7-ripple-transform: " + ripple.rippleTransform + "\"></div>");
-    $el.prepend(ripple.$rippleWaveEl);
-    ripple.$rippleWaveEl.animationEnd(function () {
-      if (!ripple.$rippleWaveEl) return;
-      if (ripple.$rippleWaveEl.hasClass('ripple-wave-out')) return;
-      ripple.$rippleWaveEl.addClass('ripple-wave-in');
-
-      if (ripple.shouldBeRemoved) {
-        ripple.out();
-      }
-    });
-    return ripple;
-  }
-
-  var _proto = TouchRipple.prototype;
-
-  _proto.destroy = function destroy() {
-    var ripple = this;
-
-    if (ripple.$rippleWaveEl) {
-      ripple.$rippleWaveEl.remove();
-    }
-
-    Object.keys(ripple).forEach(function (key) {
-      ripple[key] = null;
-      delete ripple[key];
-    });
-    ripple = null;
-  };
-
-  _proto.out = function out() {
-    var ripple = this;
-    var $rippleWaveEl = this.$rippleWaveEl;
-    clearTimeout(ripple.removeTimeout);
-    $rippleWaveEl.addClass('ripple-wave-out');
-    ripple.removeTimeout = setTimeout(function () {
-      ripple.destroy();
-    }, 300);
-    $rippleWaveEl.animationEnd(function () {
-      clearTimeout(ripple.removeTimeout);
-      ripple.destroy();
-    });
-  };
-
-  _proto.remove = function remove() {
-    var ripple = this;
-    if (ripple.shouldBeRemoved) return;
-    ripple.removeTimeout = setTimeout(function () {
-      ripple.destroy();
-    }, 400);
-    ripple.shouldBeRemoved = true;
-
-    if (ripple.$rippleWaveEl.hasClass('ripple-wave-in')) {
-      ripple.out();
-    }
-  };
-
-  return TouchRipple;
-}();
-
-exports.default = TouchRipple;

package/cjs/components/touch-ripple/touch-ripple.js

@@ -1,34 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.default = void 0;
-
-var _touchRippleClass = _interopRequireDefault(require("./touch-ripple-class"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _construct(Parent, args, Class) { if (_isNativeReflectConstruct()) { _construct = Reflect.construct; } else { _construct = function _construct(Parent, args, Class) { var a = [null]; a.push.apply(a, args); var Constructor = Function.bind.apply(Parent, a); var instance = new Constructor(); if (Class) _setPrototypeOf(instance, Class.prototype); return instance; }; } return _construct.apply(null, arguments); }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-
-var _default = {
-  name: 'touch-ripple',
-  static: {
-    TouchRipple: _touchRippleClass.default
-  },
-  create: function create() {
-    var app = this;
-    app.touchRipple = {
-      create: function create() {
-        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-          args[_key] = arguments[_key];
-        }
-
-        return _construct(_touchRippleClass.default, args);
-      }
-    };
-  }
-};
-exports.default = _default;

package/cjs/components/treeview/treeview.js

@@ -1,88 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.default = void 0;
-
-var _dom = _interopRequireDefault(require("../../shared/dom7"));
-
-var _utils = require("../../shared/utils");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-var Treeview = {
-  open: function open(itemEl) {
-    var app = this;
-    var $itemEl = (0, _dom.default)(itemEl).eq(0);
-    if (!$itemEl.length) return;
-    $itemEl.addClass('treeview-item-opened');
-    $itemEl.trigger('treeview:open');
-    app.emit('treeviewOpen', $itemEl[0]);
-
-    function done(cancel) {
-      if (cancel) {
-        $itemEl.removeClass('treeview-item-opened');
-        $itemEl.trigger('treeview:close');
-        app.emit('treeviewClose', $itemEl[0]);
-      } else {
-        $itemEl[0].f7TreeviewChildrenLoaded = true;
-      }
-
-      $itemEl.find('.treeview-toggle').removeClass('treeview-toggle-hidden');
-      $itemEl.find('.treeview-preloader').remove();
-    }
-
-    if ($itemEl.hasClass('treeview-load-children') && !$itemEl[0].f7TreeviewChildrenLoaded) {
-      var preloaders = {
-        iosPreloaderContent: _utils.iosPreloaderContent,
-        mdPreloaderContent: _utils.mdPreloaderContent,
-        auroraPreloaderContent: _utils.auroraPreloaderContent
-      };
-      $itemEl.trigger('treeview:loadchildren', done);
-      app.emit('treeviewLoadChildren', $itemEl[0], done);
-      $itemEl.find('.treeview-toggle').addClass('treeview-toggle-hidden');
-      $itemEl.find('.treeview-item-root').prepend("<div class=\"preloader treeview-preloader\">" + preloaders[app.theme + "PreloaderContent"] + "</div>");
-    }
-  },
-  close: function close(itemEl) {
-    var app = this;
-    var $itemEl = (0, _dom.default)(itemEl).eq(0);
-    if (!$itemEl.length) return;
-    $itemEl.removeClass('treeview-item-opened');
-    $itemEl.trigger('treeview:close');
-    app.emit('treeviewClose', $itemEl[0]);
-  },
-  toggle: function toggle(itemEl) {
-    var app = this;
-    var $itemEl = (0, _dom.default)(itemEl).eq(0);
-    if (!$itemEl.length) return;
-    var wasOpened = $itemEl.hasClass('treeview-item-opened');
-    app.treeview[wasOpened ? 'close' : 'open']($itemEl);
-  }
-};
-var _default = {
-  name: 'treeview',
-  create: function create() {
-    var app = this;
-    (0, _utils.bindMethods)(app, {
-      treeview: Treeview
-    });
-  },
-  clicks: {
-    '.treeview-toggle': function toggle($clickedEl, clickedData, e) {
-      var app = this;
-      if ($clickedEl.parents('.treeview-item-toggle').length) return;
-      var $treeviewItemEl = $clickedEl.parents('.treeview-item').eq(0);
-      if (!$treeviewItemEl.length) return;
-      e.preventF7Router = true;
-      app.treeview.toggle($treeviewItemEl[0]);
-    },
-    '.treeview-item-toggle': function toggle($clickedEl, clickedData, e) {
-      var app = this;
-      var $treeviewItemEl = $clickedEl.closest('.treeview-item').eq(0);
-      if (!$treeviewItemEl.length) return;
-      e.preventF7Router = true;
-      app.treeview.toggle($treeviewItemEl[0]);
-    }
-  }
-};
-exports.default = _default;

package/cjs/components/typography/typography.js

@@ -1,8 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.default = void 0;
-var _default = {
-  name: 'typography'
-};
-exports.default = _default;

package/cjs/components/view/resizable-view.js

@@ -1,155 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.default = void 0;
-
-var _dom = _interopRequireDefault(require("../../shared/dom7"));
-
-var _utils = require("../../shared/utils");
-
-var _getSupport = require("../../shared/get-support");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function resizableView(view) {
-  var app = view.app;
-  var support = (0, _getSupport.getSupport)();
-  if (view.resizableInitialized) return;
-  (0, _utils.extend)(view, {
-    resizable: true,
-    resizableWidth: null,
-    resizableInitialized: true
-  });
-  var $htmlEl = (0, _dom.default)('html');
-  var $el = view.$el;
-  if (!$el) return;
-  var $resizeHandlerEl;
-  var isTouched;
-  var isMoved;
-  var touchesStart = {};
-  var touchesDiff;
-  var width;
-  var minWidth;
-  var maxWidth;
-
-  function transformCSSWidth(v) {
-    if (!v) return null;
-
-    if (v.indexOf('%') >= 0 || v.indexOf('vw') >= 0) {
-      return parseInt(v, 10) / 100 * app.width;
-    }
-
-    var newV = parseInt(v, 10);
-    if (Number.isNaN(newV)) return null;
-    return newV;
-  }
-
-  function isResizable() {
-    return view.resizable && $el.hasClass('view-resizable') && $el.hasClass('view-master-detail');
-  }
-
-  function handleTouchStart(e) {
-    if (!isResizable()) return;
-    touchesStart.x = e.type === 'touchstart' ? e.targetTouches[0].pageX : e.pageX;
-    touchesStart.y = e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY;
-    isMoved = false;
-    isTouched = true;
-    var $pageMasterEl = $el.children('.page-master');
-    minWidth = transformCSSWidth($pageMasterEl.css('min-width'));
-    maxWidth = transformCSSWidth($pageMasterEl.css('max-width'));
-  }
-
-  function handleTouchMove(e) {
-    if (!isTouched) return;
-    e.f7PreventSwipePanel = true;
-    var pageX = e.type === 'touchmove' ? e.targetTouches[0].pageX : e.pageX;
-
-    if (!isMoved) {
-      width = $resizeHandlerEl[0].offsetLeft + $resizeHandlerEl[0].offsetWidth;
-      $el.addClass('view-resizing');
-      $htmlEl.css('cursor', 'col-resize');
-    }
-
-    isMoved = true;
-    e.preventDefault();
-    touchesDiff = pageX - touchesStart.x;
-    var newWidth = width + touchesDiff;
-
-    if (minWidth && !Number.isNaN(minWidth)) {
-      newWidth = Math.max(newWidth, minWidth);
-    }
-
-    if (maxWidth && !Number.isNaN(maxWidth)) {
-      newWidth = Math.min(newWidth, maxWidth);
-    }
-
-    newWidth = Math.min(Math.max(newWidth, 0), app.width);
-    view.resizableWidth = newWidth;
-    $htmlEl[0].style.setProperty('--f7-page-master-width', newWidth + "px");
-    $el.trigger('view:resize', newWidth);
-    view.emit('local::resize viewResize', view, newWidth);
-  }
-
-  function handleTouchEnd() {
-    (0, _dom.default)('html').css('cursor', '');
-
-    if (!isTouched || !isMoved) {
-      isTouched = false;
-      isMoved = false;
-      return;
-    }
-
-    isTouched = false;
-    isMoved = false;
-    $htmlEl[0].style.setProperty('--f7-page-master-width', view.resizableWidth + "px");
-    $el.removeClass('view-resizing');
-  }
-
-  function handleResize() {
-    if (!view.resizableWidth) return;
-    minWidth = transformCSSWidth($resizeHandlerEl.css('min-width'));
-    maxWidth = transformCSSWidth($resizeHandlerEl.css('max-width'));
-
-    if (minWidth && !Number.isNaN(minWidth) && view.resizableWidth < minWidth) {
-      view.resizableWidth = Math.max(view.resizableWidth, minWidth);
-    }
-
-    if (maxWidth && !Number.isNaN(maxWidth) && view.resizableWidth > maxWidth) {
-      view.resizableWidth = Math.min(view.resizableWidth, maxWidth);
-    }
-
-    view.resizableWidth = Math.min(Math.max(view.resizableWidth, 0), app.width);
-    $htmlEl[0].style.setProperty('--f7-page-master-width', view.resizableWidth + "px");
-  }
-
-  $resizeHandlerEl = view.$el.children('.view-resize-handler');
-
-  if (!$resizeHandlerEl.length) {
-    view.$el.append('<div class="view-resize-handler"></div>');
-    $resizeHandlerEl = view.$el.children('.view-resize-handler');
-  }
-
-  view.$resizeHandlerEl = $resizeHandlerEl;
-  $el.addClass('view-resizable'); // Add Events
-
-  var passive = support.passiveListener ? {
-    passive: true
-  } : false;
-  view.$el.on(app.touchEvents.start, '.view-resize-handler', handleTouchStart, passive);
-  app.on('touchmove:active', handleTouchMove);
-  app.on('touchend:passive', handleTouchEnd);
-  app.on('resize', handleResize);
-  view.on('beforeOpen', handleResize);
-  view.once('viewDestroy', function () {
-    $el.removeClass('view-resizable');
-    view.$resizeHandlerEl.remove();
-    view.$el.off(app.touchEvents.start, '.view-resize-handler', handleTouchStart, passive);
-    app.off('touchmove:active', handleTouchMove);
-    app.off('touchend:passive', handleTouchEnd);
-    app.off('resize', handleResize);
-    view.off('beforeOpen', handleResize);
-  });
-}
-
-var _default = resizableView;
-exports.default = _default;