framework7-vue 6.3.15 → 7.0.0-beta.11

package/cjs/components/page.js

@@ -1,451 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.default = void 0;
-
-var _vue = require("vue");
-
-var _utils = require("../shared/utils");
-
-var _mixins = require("../shared/mixins");
-
-var _f = require("../shared/f7");
-
-var _pageContent = _interopRequireDefault(require("./page-content"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-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); }
-
-var _default = {
-  name: 'f7-page',
-  props: _extends({
-    name: String,
-    stacked: Boolean,
-    withSubnavbar: {
-      type: Boolean,
-      default: undefined
-    },
-    subnavbar: {
-      type: Boolean,
-      default: undefined
-    },
-    withNavbarLarge: {
-      type: Boolean,
-      default: undefined
-    },
-    navbarLarge: {
-      type: Boolean,
-      default: undefined
-    },
-    noNavbar: Boolean,
-    noToolbar: Boolean,
-    tabs: Boolean,
-    pageContent: {
-      type: Boolean,
-      default: true
-    },
-    noSwipeback: Boolean,
-    // Page Content Props
-    ptr: Boolean,
-    ptrDistance: Number,
-    ptrPreloader: {
-      type: Boolean,
-      default: true
-    },
-    ptrBottom: Boolean,
-    ptrMousewheel: Boolean,
-    infinite: Boolean,
-    infiniteTop: Boolean,
-    infiniteDistance: Number,
-    infinitePreloader: {
-      type: Boolean,
-      default: true
-    },
-    hideBarsOnScroll: Boolean,
-    hideNavbarOnScroll: Boolean,
-    hideToolbarOnScroll: Boolean,
-    messagesContent: Boolean,
-    loginScreen: Boolean
-  }, _mixins.colorProps),
-  emits: ['page:mounted', 'page:init', 'page:reinit', 'page:beforein', 'page:beforeout', 'page:afterout', 'page:afterin', 'page:beforeremove', 'page:beforeunmount', 'page:tabshow', 'page:tabhide', 'ptr:pullstart', 'ptr:pullmove', 'ptr:pullend', 'ptr:refresh', 'ptr:done', 'infinite'],
-  setup: function setup(props, _ref) {
-    var emit = _ref.emit,
-        slots = _ref.slots;
-    var hasSubnavbar = false;
-    var hasNavbarLarge = false;
-    var hasNavbarLargeCollapsed = false;
-    var hasCardExpandableOpened = false;
-    var routerPositionClass = '';
-    var routerForceUnstack = false;
-    var routerPageRole = null;
-    var routerPageRoleDetailRoot = false;
-    var routerPageMasterStack = false;
-    var elRef = (0, _vue.ref)(null); // Main Page Events
-
-    var onPageMounted = function onPageMounted(page) {
-      if (elRef.value !== page.el) return;
-      emit('page:mounted', page);
-    };
-
-    var onPageInit = function onPageInit(page) {
-      if (elRef.value !== page.el) return;
-
-      if (typeof props.withSubnavbar === 'undefined' && typeof props.subnavbar === 'undefined') {
-        if (page.$navbarEl && page.$navbarEl.length && page.$navbarEl.find('.subnavbar').length || page.$el.children('.navbar').find('.subnavbar').length) {
-          hasSubnavbar = true;
-        }
-      }
-
-      if (typeof props.withNavbarLarge === 'undefined' && typeof props.navbarLarge === 'undefined') {
-        if (page.$navbarEl && page.$navbarEl.hasClass('navbar-large')) {
-          hasNavbarLarge = true;
-        }
-      }
-
-      emit('page:init', page);
-    };
-
-    var onPageReinit = function onPageReinit(page) {
-      if (elRef.value !== page.el) return;
-      emit('page:reinit', page);
-    };
-
-    var onPageBeforeIn = function onPageBeforeIn(page) {
-      if (elRef.value !== page.el) return;
-
-      if (!page.swipeBack) {
-        if (page.from === 'next') {
-          routerPositionClass = 'page-next';
-        }
-
-        if (page.from === 'previous') {
-          routerPositionClass = 'page-previous';
-        }
-      }
-
-      emit('page:beforein', page);
-    };
-
-    var onPageBeforeOut = function onPageBeforeOut(page) {
-      if (elRef.value !== page.el) return;
-      emit('page:beforeout', page);
-    };
-
-    var onPageAfterOut = function onPageAfterOut(page) {
-      if (elRef.value !== page.el) return;
-
-      if (page.to === 'next') {
-        routerPositionClass = 'page-next';
-      }
-
-      if (page.to === 'previous') {
-        routerPositionClass = 'page-previous';
-      }
-
-      emit('page:afterout', page);
-    };
-
-    var onPageAfterIn = function onPageAfterIn(page) {
-      if (elRef.value !== page.el) return;
-      routerPositionClass = 'page-current';
-      emit('page:afterin', page);
-    };
-
-    var onPageBeforeRemove = function onPageBeforeRemove(page) {
-      if (elRef.value !== page.el) return;
-      emit('page:beforeremove', page);
-    };
-
-    var onPageBeforeUnmount = function onPageBeforeUnmount(page) {
-      if (elRef.value !== page.el) return;
-      emit('page:beforeunmount', page);
-    }; // Helper events
-
-
-    var onPageStack = function onPageStack(pageEl) {
-      if (elRef.value !== pageEl) return;
-      routerForceUnstack = false;
-    };
-
-    var onPageUnstack = function onPageUnstack(pageEl) {
-      if (elRef.value !== pageEl) return;
-      routerForceUnstack = true;
-    };
-
-    var onPagePosition = function onPagePosition(pageEl, position) {
-      if (elRef.value !== pageEl) return;
-      routerPositionClass = "page-" + position;
-    };
-
-    var onPageRole = function onPageRole(pageEl, rolesData) {
-      if (elRef.value !== pageEl) return;
-      routerPageRole = rolesData.role;
-      routerPageRoleDetailRoot = rolesData.detailRoot;
-    };
-
-    var onPageMasterStack = function onPageMasterStack(pageEl) {
-      if (elRef.value !== pageEl) return;
-      routerPageMasterStack = true;
-    };
-
-    var onPageMasterUnstack = function onPageMasterUnstack(pageEl) {
-      if (elRef.value !== pageEl) return;
-      routerPageMasterStack = false;
-    };
-
-    var onPageNavbarLargeCollapsed = function onPageNavbarLargeCollapsed(pageEl) {
-      if (elRef.value !== pageEl) return;
-      hasNavbarLargeCollapsed = true;
-    };
-
-    var onPageNavbarLargeExpanded = function onPageNavbarLargeExpanded(pageEl) {
-      if (elRef.value !== pageEl) return;
-      hasNavbarLargeCollapsed = false;
-    };
-
-    var onCardOpened = function onCardOpened(cardEl, pageEl) {
-      if (elRef.value !== pageEl) return;
-      hasCardExpandableOpened = true;
-    };
-
-    var onCardClose = function onCardClose(cardEl, pageEl) {
-      if (elRef.value !== pageEl) return;
-      hasCardExpandableOpened = false;
-    };
-
-    var onPageTabShow = function onPageTabShow(pageEl) {
-      if (elRef.value !== pageEl) return;
-      emit('page:tabshow');
-    };
-
-    var onPageTabHide = function onPageTabHide(pageEl) {
-      if (elRef.value !== pageEl) return;
-      emit('page:tabhide');
-    };
-
-    var onPtrPullStart = function onPtrPullStart() {
-      emit('ptr:pullstart');
-    };
-
-    var onPtrPullMove = function onPtrPullMove() {
-      emit('ptr:pullmove');
-    };
-
-    var onPtrPullEnd = function onPtrPullEnd() {
-      emit('ptr:pullend');
-    };
-
-    var onPtrRefresh = function onPtrRefresh(done) {
-      emit('ptr:refresh', done);
-    };
-
-    var onPtrDone = function onPtrDone() {
-      emit('ptr:done');
-    };
-
-    var onInfinite = function onInfinite() {
-      emit('infinite');
-    };
-
-    (0, _vue.onMounted)(function () {
-      (0, _f.f7ready)(function () {
-        _f.f7.on('pageMounted', onPageMounted);
-
-        _f.f7.on('pageInit', onPageInit);
-
-        _f.f7.on('pageReinit', onPageReinit);
-
-        _f.f7.on('pageBeforeIn', onPageBeforeIn);
-
-        _f.f7.on('pageBeforeOut', onPageBeforeOut);
-
-        _f.f7.on('pageAfterOut', onPageAfterOut);
-
-        _f.f7.on('pageAfterIn', onPageAfterIn);
-
-        _f.f7.on('pageBeforeRemove', onPageBeforeRemove);
-
-        _f.f7.on('pageBeforeUnmount', onPageBeforeUnmount);
-
-        _f.f7.on('pageStack', onPageStack);
-
-        _f.f7.on('pageUnstack', onPageUnstack);
-
-        _f.f7.on('pagePosition', onPagePosition);
-
-        _f.f7.on('pageRole', onPageRole);
-
-        _f.f7.on('pageMasterStack', onPageMasterStack);
-
-        _f.f7.on('pageMasterUnstack', onPageMasterUnstack);
-
-        _f.f7.on('pageNavbarLargeCollapsed', onPageNavbarLargeCollapsed);
-
-        _f.f7.on('pageNavbarLargeExpanded', onPageNavbarLargeExpanded);
-
-        _f.f7.on('cardOpened', onCardOpened);
-
-        _f.f7.on('cardClose', onCardClose);
-
-        _f.f7.on('pageTabShow', onPageTabShow);
-
-        _f.f7.on('pageTabHide', onPageTabHide);
-      });
-    });
-    (0, _vue.onBeforeUnmount)(function () {
-      if (!_f.f7) return;
-
-      _f.f7.off('pageMounted', onPageMounted);
-
-      _f.f7.off('pageInit', onPageInit);
-
-      _f.f7.off('pageReinit', onPageReinit);
-
-      _f.f7.off('pageBeforeIn', onPageBeforeIn);
-
-      _f.f7.off('pageBeforeOut', onPageBeforeOut);
-
-      _f.f7.off('pageAfterOut', onPageAfterOut);
-
-      _f.f7.off('pageAfterIn', onPageAfterIn);
-
-      _f.f7.off('pageBeforeRemove', onPageBeforeRemove);
-
-      _f.f7.off('pageBeforeUnmount', onPageBeforeUnmount);
-
-      _f.f7.off('pageStack', onPageStack);
-
-      _f.f7.off('pageUnstack', onPageUnstack);
-
-      _f.f7.off('pagePosition', onPagePosition);
-
-      _f.f7.off('pageRole', onPageRole);
-
-      _f.f7.off('pageMasterStack', onPageMasterStack);
-
-      _f.f7.off('pageMasterUnstack', onPageMasterUnstack);
-
-      _f.f7.off('pageNavbarLargeCollapsed', onPageNavbarLargeCollapsed);
-
-      _f.f7.off('pageNavbarLargeExpanded', onPageNavbarLargeExpanded);
-
-      _f.f7.off('cardOpened', onCardOpened);
-
-      _f.f7.off('cardClose', onCardClose);
-
-      _f.f7.off('pageTabShow', onPageTabShow);
-
-      _f.f7.off('pageTabHide', onPageTabHide);
-    });
-    var classes = (0, _vue.computed)(function () {
-      return (0, _utils.classNames)('page', routerPositionClass, {
-        stacked: props.stacked && !routerForceUnstack,
-        tabs: props.tabs,
-        'page-with-subnavbar': props.subnavbar || props.withSubnavbar,
-        'page-with-navbar-large': props.navbarLarge || props.withNavbarLarge,
-        'no-navbar': props.noNavbar,
-        'no-toolbar': props.noToolbar,
-        'no-swipeback': props.noSwipeback,
-        'page-master': routerPageRole === 'master',
-        'page-master-detail': routerPageRole === 'detail',
-        'page-master-detail-root': routerPageRoleDetailRoot === true,
-        'page-master-stacked': routerPageMasterStack === true,
-        'page-with-navbar-large-collapsed': hasNavbarLargeCollapsed === true,
-        'page-with-card-opened': hasCardExpandableOpened === true,
-        'login-screen-page': props.loginScreen
-      }, (0, _mixins.colorClasses)(props));
-    });
-    var fixedTags = 'navbar toolbar tabbar subnavbar searchbar messagebar fab list-index panel'.split(' ').map(function (tagName) {
-      return "f7-" + tagName;
-    });
-    return function () {
-      var fixedList = [];
-      var staticList = [];
-      var slotsStatic = slots.static,
-          slotsFixed = slots.fixed,
-          slotsDefault = slots.default;
-      var hasSubnavbarComputed = false;
-      var hasNavbarLargeComputed = false;
-      var hasMessages = props.messagesContent;
-      var slotsDefaultRendered = slotsDefault && slotsDefault();
-
-      if (slotsDefaultRendered) {
-        slotsDefaultRendered.forEach(function (vnode) {
-          if (typeof vnode === 'undefined') return;
-          var tag = vnode.type && vnode.type.name ? vnode.type.name : vnode.type;
-          var isFixedTag = false;
-
-          if (!tag) {
-            if (props.pageContent || props.pageContent === '') staticList.push(vnode);
-            return;
-          }
-
-          if (tag === 'f7-subnavbar') hasSubnavbarComputed = true;
-
-          if (tag === 'f7-navbar') {
-            if (vnode.props && (vnode.props.large || vnode.props.large === '')) hasNavbarLargeComputed = true;
-          }
-
-          if (typeof hasMessages === 'undefined' && tag === 'f7-messages') hasMessages = true;
-
-          if (fixedTags.indexOf(tag) >= 0) {
-            isFixedTag = true;
-          }
-
-          if (props.pageContent) {
-            if (isFixedTag) fixedList.push(vnode);else staticList.push(vnode);
-          }
-        });
-      }
-
-      var classesValue = classes.value;
-
-      if ((hasSubnavbarComputed || hasSubnavbar) && typeof props.subnavbar === 'undefined' && typeof props.withSubnavbar === 'undefined' && classesValue.indexOf('page-with-subnavbar') < 0) {
-        classesValue += ' page-with-subnavbar';
-      }
-
-      if ((hasNavbarLargeComputed || hasNavbarLarge) && typeof props.navbarLarge === 'undefined' && typeof props.withNavbarLarge === 'undefined' && classesValue.indexOf('page-with-navbar-large') < 0) {
-        classesValue += ' page-with-navbar-large';
-      }
-
-      if (!props.pageContent) {
-        return (0, _vue.h)('div', {
-          class: classesValue,
-          ref: elRef,
-          'data-name': props.name
-        }, [slotsFixed && slotsFixed(), slotsStatic && slotsStatic(), slotsDefault && slotsDefaultRendered]);
-      }
-
-      return (0, _vue.h)('div', {
-        class: classesValue,
-        ref: elRef,
-        'data-name': props.name
-      }, [fixedList, slotsFixed && slotsFixed(), (0, _vue.h)(_pageContent.default, {
-        ptr: props.ptr,
-        ptrDistance: props.ptrDistance,
-        ptrPreloader: props.ptrPreloader,
-        ptrBottom: props.ptrBottom,
-        ptrMousewheel: props.ptrMousewheel,
-        infinite: props.infinite,
-        infiniteTop: props.infiniteTop,
-        infiniteDistance: props.infiniteDistance,
-        infinitePreloader: props.infinitePreloader,
-        hideBarsOnScroll: props.hideBarsOnScroll,
-        hideNavbarOnScroll: props.hideNavbarOnScroll,
-        hideToolbarOnScroll: props.hideToolbarOnScroll,
-        messagesContent: props.messagesContent || hasMessages,
-        loginScreen: props.loginScreen,
-        onPtrPullStart: onPtrPullStart,
-        onPtrPullMove: onPtrPullMove,
-        onPtrPullEnd: onPtrPullEnd,
-        onPtrRefresh: onPtrRefresh,
-        onPtrDone: onPtrDone,
-        onInfinite: onInfinite
-      }, function () {
-        return [slotsStatic && slotsStatic(), staticList];
-      })]);
-    };
-  }
-};
-exports.default = _default;

package/cjs/components/panel.js

@@ -1,224 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.default = void 0;
-
-var _vue = require("vue");
-
-var _utils = require("../shared/utils");
-
-var _mixins = require("../shared/mixins");
-
-var _f = require("../shared/f7");
-
-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); }
-
-var _hoisted_1 = {
-  key: 0,
-  class: "panel-resize-handler"
-};
-
-function render(_ctx, _cache) {
-  return (0, _vue.openBlock)(), (0, _vue.createBlock)("div", {
-    ref: "elRef",
-    class: _ctx.classes
-  }, [(0, _vue.renderSlot)(_ctx.$slots, "default"), _ctx.resizable ? ((0, _vue.openBlock)(), (0, _vue.createBlock)("div", _hoisted_1)) : (0, _vue.createCommentVNode)("", true)], 2);
-}
-
-var _default = {
-  name: 'f7-panel',
-  render: render,
-  props: _extends({
-    side: String,
-    effect: String,
-    cover: Boolean,
-    reveal: Boolean,
-    push: Boolean,
-    left: Boolean,
-    right: Boolean,
-    opened: Boolean,
-    resizable: Boolean,
-    backdrop: {
-      type: Boolean,
-      default: true
-    },
-    backdropEl: {
-      type: String,
-      default: undefined
-    },
-    containerEl: {
-      type: String,
-      default: undefined
-    },
-    visibleBreakpoint: {
-      type: Number,
-      default: undefined
-    },
-    collapsedBreakpoint: {
-      type: Number,
-      default: undefined
-    },
-    swipe: Boolean,
-    swipeNoFollow: Boolean,
-    swipeOnlyClose: Boolean,
-    swipeActiveArea: {
-      type: Number,
-      default: 0
-    },
-    swipeThreshold: {
-      type: Number,
-      default: 0
-    }
-  }, _mixins.colorProps),
-  emits: ['panel:open', 'panel:opened', 'panel:close', 'panel:closed', 'click', 'panel:backdropclick', 'panel:swipe', 'panel:swipeopen', 'panel:breakpoint', 'panel:collapsedbreakpoint', 'panel:resize', 'update:opened'],
-  setup: function setup(props, _ref) {
-    var emit = _ref.emit;
-    var f7Panel = null;
-    var elRef = (0, _vue.ref)(null);
-    var isOpened = false;
-    var isClosing = false;
-    var isCollapsed = false;
-    var isBreakpoint = false;
-
-    var onOpen = function onOpen(event) {
-      isOpened = true;
-      isClosing = false;
-      emit('panel:open', event);
-      emit('update:opened', true);
-    };
-
-    var onOpened = function onOpened(event) {
-      emit('panel:opened', event);
-    };
-
-    var onClose = function onClose(event) {
-      isOpened = false;
-      isClosing = true;
-      emit('panel:close', event);
-    };
-
-    var onClosed = function onClosed(event) {
-      isClosing = false;
-      emit('panel:closed', event);
-      emit('update:opened', false);
-    };
-
-    var onBackdropClick = function onBackdropClick(event) {
-      emit('click', event);
-      emit('panel:backdropclick', event);
-    };
-
-    var onSwipe = function onSwipe(event) {
-      emit('panel:swipe', event);
-    };
-
-    var onSwipeOpen = function onSwipeOpen(event) {
-      emit('panel:swipeopen', event);
-    };
-
-    var onBreakpoint = function onBreakpoint(event) {
-      isBreakpoint = true;
-      isCollapsed = false;
-      emit('panel:breakpoint', event);
-    };
-
-    var onCollapsedBreakpoint = function onCollapsedBreakpoint(event) {
-      isBreakpoint = false;
-      isCollapsed = true;
-      emit('panel:collapsedbreakpoint', event);
-    };
-
-    var onResize = function onResize() {
-      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-        args[_key] = arguments[_key];
-      }
-
-      emit.apply(void 0, ['panel:resize'].concat(args));
-    };
-
-    (0, _vue.watch)(function () {
-      return props.resizable;
-    }, function (newValue) {
-      if (!f7Panel) return;
-      if (newValue) f7Panel.enableResizable();else f7Panel.disableResizable();
-    });
-    (0, _vue.watch)(function () {
-      return props.opened;
-    }, function (newValue) {
-      if (!f7Panel) return;
-
-      if (newValue) {
-        f7Panel.open();
-      } else {
-        f7Panel.close();
-      }
-    });
-    (0, _vue.onMounted)(function () {
-      (0, _f.f7ready)(function () {
-        var $ = _f.f7.$;
-        if (!$) return;
-
-        if ($('.panel-backdrop').length === 0) {
-          $('<div class="panel-backdrop"></div>').insertBefore(elRef.value);
-        }
-
-        var params = (0, _utils.noUndefinedProps)({
-          el: elRef.value,
-          resizable: props.resizable,
-          backdrop: props.backdrop,
-          backdropEl: props.backdropEl,
-          containerEl: props.containerEl,
-          visibleBreakpoint: props.visibleBreakpoint,
-          collapsedBreakpoint: props.collapsedBreakpoint,
-          swipe: props.swipe,
-          swipeNoFollow: props.swipeNoFollow,
-          swipeOnlyClose: props.swipeOnlyClose,
-          swipeActiveArea: props.swipeActiveArea,
-          swipeThreshold: props.swipeThreshold,
-          on: {
-            open: onOpen,
-            opened: onOpened,
-            close: onClose,
-            closed: onClosed,
-            backdropClick: onBackdropClick,
-            swipe: onSwipe,
-            swipeOpen: onSwipeOpen,
-            collapsedBreakpoint: onCollapsedBreakpoint,
-            breakpoint: onBreakpoint,
-            resize: onResize
-          }
-        });
-        f7Panel = _f.f7.panel.create(params);
-
-        if (props.opened) {
-          f7Panel.open(false);
-        }
-      });
-    });
-    (0, _vue.onBeforeUnmount)(function () {
-      if (f7Panel && f7Panel.destroy) {
-        f7Panel.destroy();
-      }
-
-      f7Panel = null;
-    });
-    var classes = (0, _vue.computed)(function () {
-      var _classNames;
-
-      var sideComputed = props.side || (props.left ? 'left' : 'right');
-      var effectComputed = props.effect || (props.reveal ? 'reveal' : props.push ? 'push' : 'cover'); // eslint-disable-line
-
-      return (0, _utils.classNames)('panel', (_classNames = {
-        'panel-in': isOpened && !isClosing && !isBreakpoint,
-        'panel-in-breakpoint': isBreakpoint,
-        'panel-in-collapsed': isCollapsed,
-        'panel-resizable': props.resizable
-      }, _classNames["panel-" + sideComputed] = sideComputed, _classNames["panel-" + effectComputed] = effectComputed, _classNames), (0, _mixins.colorClasses)(props));
-    });
-    return {
-      elRef: elRef,
-      classes: classes
-    };
-  }
-};
-exports.default = _default;