framework7 6.3.4 → 7.0.0-beta.3

package/shared/class.js

@@ -0,0 +1,143 @@
+import { extend, now } from './utils';
+import EventsClass from './events-class';
+
+class Framework7Class extends EventsClass {
+  constructor(params = {}, parents = []) {
+    super(parents);
+    const self = this;
+    self.params = params;
+
+    if (self.params && self.params.on) {
+      Object.keys(self.params.on).forEach(eventName => {
+        self.on(eventName, self.params.on[eventName]);
+      });
+    }
+  } // eslint-disable-next-line
+
+
+  useModuleParams(module, instanceParams) {
+    if (module.params) {
+      const originalParams = {};
+      Object.keys(module.params).forEach(paramKey => {
+        if (typeof instanceParams[paramKey] === 'undefined') return;
+        originalParams[paramKey] = extend({}, instanceParams[paramKey]);
+      });
+      extend(instanceParams, module.params);
+      Object.keys(originalParams).forEach(paramKey => {
+        extend(instanceParams[paramKey], originalParams[paramKey]);
+      });
+    }
+  }
+
+  useModulesParams(instanceParams) {
+    const instance = this;
+    if (!instance.modules) return;
+    Object.keys(instance.modules).forEach(moduleName => {
+      const module = instance.modules[moduleName]; // Extend params
+
+      if (module.params) {
+        extend(instanceParams, module.params);
+      }
+    });
+  }
+
+  useModule(moduleName = '', moduleParams = {}) {
+    const instance = this;
+    if (!instance.modules) return;
+    const module = typeof moduleName === 'string' ? instance.modules[moduleName] : moduleName;
+    if (!module) return; // Extend instance methods and props
+
+    if (module.instance) {
+      Object.keys(module.instance).forEach(modulePropName => {
+        const moduleProp = module.instance[modulePropName];
+
+        if (typeof moduleProp === 'function') {
+          instance[modulePropName] = moduleProp.bind(instance);
+        } else {
+          instance[modulePropName] = moduleProp;
+        }
+      });
+    } // Add event listeners
+
+
+    if (module.on && instance.on) {
+      Object.keys(module.on).forEach(moduleEventName => {
+        instance.on(moduleEventName, module.on[moduleEventName]);
+      });
+    } // Add vnode hooks
+
+
+    if (module.vnode) {
+      if (!instance.vnodeHooks) instance.vnodeHooks = {};
+      Object.keys(module.vnode).forEach(vnodeId => {
+        Object.keys(module.vnode[vnodeId]).forEach(hookName => {
+          const handler = module.vnode[vnodeId][hookName];
+          if (!instance.vnodeHooks[hookName]) instance.vnodeHooks[hookName] = {};
+          if (!instance.vnodeHooks[hookName][vnodeId]) instance.vnodeHooks[hookName][vnodeId] = [];
+          instance.vnodeHooks[hookName][vnodeId].push(handler.bind(instance));
+        });
+      });
+    } // Module create callback
+
+
+    if (module.create) {
+      module.create.bind(instance)(moduleParams);
+    }
+  }
+
+  useModules(modulesParams = {}) {
+    const instance = this;
+    if (!instance.modules) return;
+    Object.keys(instance.modules).forEach(moduleName => {
+      const moduleParams = modulesParams[moduleName] || {};
+      instance.useModule(moduleName, moduleParams);
+    });
+  }
+
+  static set components(components) {
+    const Class = this;
+    if (!Class.use) return;
+    Class.use(components);
+  }
+
+  static installModule(module, ...params) {
+    const Class = this;
+    if (!Class.prototype.modules) Class.prototype.modules = {};
+    const name = module.name || `${Object.keys(Class.prototype.modules).length}_${now()}`;
+    Class.prototype.modules[name] = module; // Prototype
+
+    if (module.proto) {
+      Object.keys(module.proto).forEach(key => {
+        Class.prototype[key] = module.proto[key];
+      });
+    } // Class
+
+
+    if (module.static) {
+      Object.keys(module.static).forEach(key => {
+        Class[key] = module.static[key];
+      });
+    } // Callback
+
+
+    if (module.install) {
+      module.install.apply(Class, params);
+    }
+
+    return Class;
+  }
+
+  static use(module, ...params) {
+    const Class = this;
+
+    if (Array.isArray(module)) {
+      module.forEach(m => Class.installModule(m));
+      return Class;
+    }
+
+    return Class.installModule(module, ...params);
+  }
+
+}
+
+export default Framework7Class;

package/shared/constructor-methods.js

@@ -0,0 +1,42 @@
+import $ from './dom7';
+export default function ConstructorMethods(parameters = {}) {
+  const {
+    defaultSelector,
+    constructor: Constructor,
+    domProp,
+    app,
+    addMethods
+  } = parameters;
+  const methods = {
+    create(...args) {
+      if (app) return new Constructor(app, ...args);
+      return new Constructor(...args);
+    },
+
+    get(el = defaultSelector) {
+      if (el instanceof Constructor) return el;
+      const $el = $(el);
+      if ($el.length === 0) return undefined;
+      return $el[0][domProp];
+    },
+
+    destroy(el) {
+      const instance = methods.get(el);
+      if (instance && instance.destroy) return instance.destroy();
+      return undefined;
+    }
+
+  };
+
+  if (addMethods && Array.isArray(addMethods)) {
+    addMethods.forEach(methodName => {
+      methods[methodName] = (el = defaultSelector, ...args) => {
+        const instance = methods.get(el);
+        if (instance && instance[methodName]) return instance[methodName](...args);
+        return undefined;
+      };
+    });
+  }
+
+  return methods;
+}

package/{esm/shared → shared}/dom7.js

@@ -1,5 +1,6 @@
+// eslint-disable-next-line
 import * as methods from 'dom7';
-Object.keys(methods).forEach(function (methodName) {
+Object.keys(methods).forEach(methodName => {
   if (methodName === '$') return;
   methods.$.fn[methodName] = methods[methodName];
 });

package/shared/events-class.js

@@ -0,0 +1,100 @@
+class EventsClass {
+  constructor(parents = []) {
+    const self = this;
+    self.eventsParents = parents;
+    self.eventsListeners = {};
+  }
+
+  on(events, handler, priority) {
+    const self = this;
+    if (typeof handler !== 'function') return self;
+    const method = priority ? 'unshift' : 'push';
+    events.split(' ').forEach(event => {
+      if (!self.eventsListeners[event]) self.eventsListeners[event] = [];
+      self.eventsListeners[event][method](handler);
+    });
+    return self;
+  }
+
+  once(events, handler, priority) {
+    const self = this;
+    if (typeof handler !== 'function') return self;
+
+    function onceHandler(...args) {
+      self.off(events, onceHandler);
+
+      if (onceHandler.f7proxy) {
+        delete onceHandler.f7proxy;
+      }
+
+      handler.apply(self, args);
+    }
+
+    onceHandler.f7proxy = handler;
+    return self.on(events, onceHandler, priority);
+  }
+
+  off(events, handler) {
+    const self = this;
+    if (!self.eventsListeners) return self;
+    events.split(' ').forEach(event => {
+      if (typeof handler === 'undefined') {
+        self.eventsListeners[event] = [];
+      } else if (self.eventsListeners[event]) {
+        self.eventsListeners[event].forEach((eventHandler, index) => {
+          if (eventHandler === handler || eventHandler.f7proxy && eventHandler.f7proxy === handler) {
+            self.eventsListeners[event].splice(index, 1);
+          }
+        });
+      }
+    });
+    return self;
+  }
+
+  emit(...args) {
+    const self = this;
+    if (!self.eventsListeners) return self;
+    let events;
+    let data;
+    let context;
+    let eventsParents;
+
+    if (typeof args[0] === 'string' || Array.isArray(args[0])) {
+      events = args[0];
+      data = args.slice(1, args.length);
+      context = self;
+      eventsParents = self.eventsParents;
+    } else {
+      events = args[0].events;
+      data = args[0].data;
+      context = args[0].context || self;
+      eventsParents = args[0].local ? [] : args[0].parents || self.eventsParents;
+    }
+
+    const eventsArray = Array.isArray(events) ? events : events.split(' ');
+    const localEvents = eventsArray.map(eventName => eventName.replace('local::', ''));
+    const parentEvents = eventsArray.filter(eventName => eventName.indexOf('local::') < 0);
+    localEvents.forEach(event => {
+      if (self.eventsListeners && self.eventsListeners[event]) {
+        const handlers = [];
+        self.eventsListeners[event].forEach(eventHandler => {
+          handlers.push(eventHandler);
+        });
+        handlers.forEach(eventHandler => {
+          eventHandler.apply(context, data);
+        });
+      }
+    });
+
+    if (eventsParents && eventsParents.length > 0) {
+      eventsParents.forEach(eventsParent => {
+        eventsParent.emit(parentEvents, ...data);
+      });
+    }
+
+    return self;
+  }
+
+}
+
+export default EventsClass;

package/{esm/shared → shared}/get-device.js

@@ -1,16 +1,15 @@
 import { getWindow } from 'ssr-window';
 import { getSupport } from './get-support';
-var deviceCalculated;
-
-function calcDevice(_temp) {
-  var _ref = _temp === void 0 ? {} : _temp,
-      userAgent = _ref.userAgent;
-
-  var support = getSupport();
-  var window = getWindow();
-  var platform = window.navigator.platform;
-  var ua = userAgent || window.navigator.userAgent;
-  var device = {
+let deviceCalculated;
+
+function calcDevice({
+  userAgent
+} = {}) {
+  const support = getSupport();
+  const window = getWindow();
+  const platform = window.navigator.platform;
+  const ua = userAgent || window.navigator.userAgent;
+  const device = {
     ios: false,
     android: false,
     androidChrome: false,
@@ -29,24 +28,24 @@ function calcDevice(_temp) {
     capacitor: !!window.Capacitor,
     nwjs: false
   };
-  var screenWidth = window.screen.width;
-  var screenHeight = window.screen.height;
-  var android = ua.match(/(Android);?[\s\/]+([\d.]+)?/); // eslint-disable-line
-
-  var ipad = ua.match(/(iPad).*OS\s([\d_]+)/);
-  var ipod = ua.match(/(iPod)(.*OS\s([\d_]+))?/);
-  var iphone = !ipad && ua.match(/(iPhone\sOS|iOS|iPhone;\sCPU\sOS)\s([\d_]+)/);
-  var ie = ua.indexOf('MSIE ') >= 0 || ua.indexOf('Trident/') >= 0;
-  var edge = ua.indexOf('Edge/') >= 0;
-  var firefox = ua.indexOf('Gecko/') >= 0 && ua.indexOf('Firefox/') >= 0;
-  var windows = platform === 'Win32';
-  var electron = ua.toLowerCase().indexOf('electron') >= 0;
-  var nwjs = typeof nw !== 'undefined' && typeof process !== 'undefined' && typeof process.versions !== 'undefined' && typeof process.versions.nw !== 'undefined';
-  var macos = platform === 'MacIntel'; // iPadOs 13 fix
-
-  var iPadScreens = ['1024x1366', '1366x1024', '834x1194', '1194x834', '834x1112', '1112x834', '768x1024', '1024x768', '820x1180', '1180x820', '810x1080', '1080x810'];
-
-  if (!ipad && macos && support.touch && iPadScreens.indexOf(screenWidth + "x" + screenHeight) >= 0) {
+  const screenWidth = window.screen.width;
+  const screenHeight = window.screen.height;
+  const android = ua.match(/(Android);?[\s\/]+([\d.]+)?/); // eslint-disable-line
+
+  let ipad = ua.match(/(iPad).*OS\s([\d_]+)/);
+  const ipod = ua.match(/(iPod)(.*OS\s([\d_]+))?/);
+  const iphone = !ipad && ua.match(/(iPhone\sOS|iOS|iPhone;\sCPU\sOS)\s([\d_]+)/);
+  const ie = ua.indexOf('MSIE ') >= 0 || ua.indexOf('Trident/') >= 0;
+  const edge = ua.indexOf('Edge/') >= 0;
+  const firefox = ua.indexOf('Gecko/') >= 0 && ua.indexOf('Firefox/') >= 0;
+  const windows = platform === 'Win32';
+  const electron = ua.toLowerCase().indexOf('electron') >= 0;
+  const nwjs = typeof nw !== 'undefined' && typeof process !== 'undefined' && typeof process.versions !== 'undefined' && typeof process.versions.nw !== 'undefined';
+  let macos = platform === 'MacIntel'; // iPadOs 13 fix
+
+  const iPadScreens = ['1024x1366', '1366x1024', '834x1194', '1194x834', '834x1112', '1112x834', '768x1024', '1024x768', '820x1180', '1180x820', '810x1080', '1080x810'];
+
+  if (!ipad && macos && support.touch && iPadScreens.indexOf(`${screenWidth}x${screenHeight}`) >= 0) {
     ipad = ua.match(/(Version)\/([\d.]+)/);
     if (!ipad) ipad = [0, 1, '13_0_0'];
     macos = false;
@@ -116,11 +115,11 @@ function calcDevice(_temp) {
 
   device.pixelRatio = window.devicePixelRatio || 1; // Color Scheme
 
-  var DARK = '(prefers-color-scheme: dark)';
-  var LIGHT = '(prefers-color-scheme: light)';
+  const DARK = '(prefers-color-scheme: dark)';
+  const LIGHT = '(prefers-color-scheme: light)';
 
   device.prefersColorScheme = function prefersColorTheme() {
-    var theme;
+    let theme;
 
     if (window.matchMedia && window.matchMedia(LIGHT).matches) {
       theme = 'light';
@@ -137,11 +136,7 @@ function calcDevice(_temp) {
   return device;
 }
 
-function getDevice(overrides, reset) {
-  if (overrides === void 0) {
-    overrides = {};
-  }
-
+function getDevice(overrides = {}, reset) {
   if (!deviceCalculated || reset) {
     deviceCalculated = calcDevice(overrides);
   }

package/{esm/shared → shared}/get-support.js

@@ -1,21 +1,22 @@
 import { getWindow, getDocument } from 'ssr-window';
-var support;
+let support;
 
 function calcSupport() {
-  var window = getWindow();
-  var document = getDocument();
+  const window = getWindow();
+  const document = getDocument();
   return {
     touch: !!('ontouchstart' in window || window.DocumentTouch && document instanceof window.DocumentTouch),
     pointerEvents: !!window.PointerEvent && 'maxTouchPoints' in window.navigator && window.navigator.maxTouchPoints >= 0,
     passiveListener: function checkPassiveListener() {
-      var supportsPassive = false;
+      let supportsPassive = false;
 
       try {
-        var opts = Object.defineProperty({}, 'passive', {
+        const opts = Object.defineProperty({}, 'passive', {
           // eslint-disable-next-line
-          get: function get() {
+          get() {
             supportsPassive = true;
           }
+
         });
         window.addEventListener('testPassiveListener', null, opts);
       } catch (e) {// No support

package/{esm/shared → shared}/history.js

@@ -1,51 +1,57 @@
 import { getWindow, getDocument } from 'ssr-window';
 import $ from './dom7';
 import { extend } from './utils';
-var History = {
+const History = {
   queue: [],
-  clearQueue: function clearQueue() {
+
+  clearQueue() {
     if (History.queue.length === 0) return;
-    var currentQueue = History.queue.shift();
+    const currentQueue = History.queue.shift();
     currentQueue();
   },
+
   routerQueue: [],
-  clearRouterQueue: function clearRouterQueue() {
+
+  clearRouterQueue() {
     if (History.routerQueue.length === 0) return;
-    var currentQueue = History.routerQueue.pop();
-    var router = currentQueue.router,
-        stateUrl = currentQueue.stateUrl,
-        action = currentQueue.action;
-    var animate = router.params.animate;
+    const currentQueue = History.routerQueue.pop();
+    const {
+      router,
+      stateUrl,
+      action
+    } = currentQueue;
+    let animate = router.params.animate;
     if (router.params.browserHistoryAnimate === false) animate = false;
 
     if (action === 'back') {
       router.back({
-        animate: animate,
+        animate,
         browserHistory: false
       });
     }
 
     if (action === 'load') {
       router.navigate(stateUrl, {
-        animate: animate,
+        animate,
         browserHistory: false
       });
     }
   },
-  handle: function handle(e) {
+
+  handle(e) {
     if (History.blockPopstate) return;
-    var app = this; // const mainView = app.views.main;
+    const app = this; // const mainView = app.views.main;
 
-    var state = e.state;
+    let state = e.state;
     History.previousState = History.state;
     History.state = state;
     History.allowChange = true;
     History.clearQueue();
     state = History.state;
     if (!state) state = {};
-    app.views.forEach(function (view) {
-      var router = view.router;
-      var viewState = state[view.id];
+    app.views.forEach(view => {
+      const router = view.router;
+      let viewState = state[view.id];
 
       if (!viewState && view.params.browserHistory) {
         viewState = {
@@ -54,8 +60,8 @@ var History = {
       }
 
       if (!viewState) return;
-      var stateUrl = viewState.url || undefined;
-      var animate = router.params.animate;
+      const stateUrl = viewState.url || undefined;
+      let animate = router.params.animate;
       if (router.params.browserHistoryAnimate === false) animate = false;
 
       if (stateUrl !== router.url) {
@@ -63,43 +69,43 @@ var History = {
           // Go Back
           if (router.allowPageChange) {
             router.back({
-              animate: animate,
+              animate,
               browserHistory: false
             });
           } else {
             History.routerQueue.push({
               action: 'back',
-              router: router
+              router
             });
           }
         } else if (router.allowPageChange) {
           // Load page
           router.navigate(stateUrl, {
-            animate: animate,
+            animate,
             browserHistory: false
           });
         } else {
           History.routerQueue.unshift({
             action: 'load',
-            stateUrl: stateUrl,
-            router: router
+            stateUrl,
+            router
           });
         }
       }
     });
   },
-  initViewState: function initViewState(viewId, viewState) {
-    var _extend;
 
-    var window = getWindow();
-    var newState = extend({}, History.state || {}, (_extend = {}, _extend[viewId] = viewState, _extend));
+  initViewState(viewId, viewState) {
+    const window = getWindow();
+    const newState = extend({}, History.state || {}, {
+      [viewId]: viewState
+    });
     History.state = newState;
     window.history.replaceState(newState, '');
   },
-  push: function push(viewId, viewState, url) {
-    var _extend2;
 
-    var window = getWindow();
+  push(viewId, viewState, url) {
+    const window = getWindow();
 
     if (url.substr(-3) === '#!/') {
       // eslint-disable-next-line
@@ -107,21 +113,22 @@ var History = {
     }
 
     if (!History.allowChange) {
-      History.queue.push(function () {
+      History.queue.push(() => {
         History.push(viewId, viewState, url);
       });
       return;
     }
 
     History.previousState = History.state;
-    var newState = extend({}, History.previousState || {}, (_extend2 = {}, _extend2[viewId] = viewState, _extend2));
+    const newState = extend({}, History.previousState || {}, {
+      [viewId]: viewState
+    });
     History.state = newState;
     window.history.pushState(newState, '', url);
   },
-  replace: function replace(viewId, viewState, url) {
-    var _extend3;
 
-    var window = getWindow();
+  replace(viewId, viewState, url) {
+    const window = getWindow();
 
     if (url.substr(-3) === '#!/') {
       // eslint-disable-next-line
@@ -129,37 +136,43 @@ var History = {
     }
 
     if (!History.allowChange) {
-      History.queue.push(function () {
+      History.queue.push(() => {
         History.replace(viewId, viewState, url);
       });
       return;
     }
 
     History.previousState = History.state;
-    var newState = extend({}, History.previousState || {}, (_extend3 = {}, _extend3[viewId] = viewState, _extend3));
+    const newState = extend({}, History.previousState || {}, {
+      [viewId]: viewState
+    });
     History.state = newState;
     window.history.replaceState(newState, '', url);
   },
-  go: function go(index) {
-    var window = getWindow();
+
+  go(index) {
+    const window = getWindow();
     History.allowChange = false;
     window.history.go(index);
   },
-  back: function back() {
-    var window = getWindow();
+
+  back() {
+    const window = getWindow();
     History.allowChange = false;
     window.history.back();
   },
+
   allowChange: true,
   previousState: {},
   state: {},
   blockPopstate: true,
-  init: function init(app) {
-    var window = getWindow();
-    var document = getDocument();
+
+  init(app) {
+    const window = getWindow();
+    const document = getDocument();
     History.state = window.history.state;
-    $(window).on('load', function () {
-      setTimeout(function () {
+    $(window).on('load', () => {
+      setTimeout(() => {
         History.blockPopstate = false;
       }, 0);
     });
@@ -170,5 +183,6 @@ var History = {
 
     $(window).on('popstate', History.handle.bind(app));
   }
+
 };
 export default History;