framework7 7.0.8 → 8.0.0-beta.1

package/modules/router/tab.js

@@ -2,12 +2,10 @@ import $ from '../../shared/dom7.js';
 import { extend } from '../../shared/utils.js';
 import History from '../../shared/history.js';
 import asyncComponent from './async-component.js';
-
 function tabLoad(tabRoute, loadOptions) {
   if (loadOptions === void 0) {
     loadOptions = {};
   }
-
   const router = this;
   const options = extend({
     animate: router.params.animate,
@@ -19,40 +17,37 @@ function tabLoad(tabRoute, loadOptions) {
   }, loadOptions);
   let currentRoute;
   let previousRoute;
-
   if (options.route) {
     // Set Route
     if (!options.preload && options.route !== router.currentRoute) {
       previousRoute = router.previousRoute;
       router.currentRoute = options.route;
     }
-
     if (options.preload) {
       currentRoute = options.route;
       previousRoute = router.currentRoute;
     } else {
       currentRoute = router.currentRoute;
       if (!previousRoute) previousRoute = router.previousRoute;
-    } // Update Browser History
-
+    }
 
+    // Update Browser History
     if (router.params.browserHistory && options.browserHistory && !options.reloadPrevious) {
       History[router.params.browserHistoryTabs](router.view.id, {
         url: options.route.url
       }, (router.params.browserHistoryRoot || '') + router.params.browserHistorySeparator + options.route.url);
-    } // Update Router History
-
+    }
 
+    // Update Router History
     if (options.history) {
       router.history[Math.max(router.history.length - 1, 0)] = options.route.url;
       router.saveHistory();
     }
-  } // Show Tab
-
+  }
 
+  // Show Tab
   const $parentPageEl = $(options.parentPageEl || router.currentPageEl);
   let tabEl;
-
   if ($parentPageEl.length && $parentPageEl.find(`#${tabRoute.id}`).length) {
     tabEl = $parentPageEl.find(`#${tabRoute.id}`).eq(0);
   } else if (router.view.selector) {
@@ -60,7 +55,6 @@ function tabLoad(tabRoute, loadOptions) {
   } else {
     tabEl = `#${tabRoute.id}`;
   }
-
   const tabShowResult = router.app.tab.show({
     tabEl,
     animate: options.animate,
@@ -72,16 +66,14 @@ function tabLoad(tabRoute, loadOptions) {
     animated,
     onTabsChanged
   } = tabShowResult;
-
   if ($newTabEl && $newTabEl.parents('.page').length > 0 && options.route) {
     const tabParentPageData = $newTabEl.parents('.page')[0].f7Page;
-
     if (tabParentPageData && options.route) {
       tabParentPageData.route = options.route;
     }
-  } // Tab Content Loaded
-
+  }
 
+  // Tab Content Loaded
   function onTabLoaded(contentEl) {
     // Remove theme elements
     router.removeThemeElements($newTabEl);
@@ -89,29 +81,24 @@ function tabLoad(tabRoute, loadOptions) {
     if (typeof contentEl !== 'string') tabEventTarget = $(contentEl);
     tabEventTarget.trigger('tab:init tab:mounted', tabRoute);
     router.emit('tabInit tabMounted', $newTabEl[0], tabRoute);
-
     if ($oldTabEl && $oldTabEl.length) {
       if (animated) {
         onTabsChanged(() => {
           router.emit('routeChanged', router.currentRoute, router.previousRoute, router);
-
           if (router.params.unloadTabContent) {
             router.tabRemove($oldTabEl, $newTabEl, tabRoute);
           }
         });
       } else {
         router.emit('routeChanged', router.currentRoute, router.previousRoute, router);
-
         if (router.params.unloadTabContent) {
           router.tabRemove($oldTabEl, $newTabEl, tabRoute);
         }
       }
     }
   }
-
   if ($newTabEl[0].f7RouterTabLoaded) {
     if (!$oldTabEl || !$oldTabEl.length) return router;
-
     if (animated) {
       onTabsChanged(() => {
         router.emit('routeChanged', router.currentRoute, router.previousRoute, router);
@@ -119,11 +106,10 @@ function tabLoad(tabRoute, loadOptions) {
     } else {
       router.emit('routeChanged', router.currentRoute, router.previousRoute, router);
     }
-
     return router;
-  } // Load Tab Content
-
+  }
 
+  // Load Tab Content
   function loadTab(loadTabParams, loadTabOptions) {
     // Load Tab Props
     const {
@@ -132,17 +118,15 @@ function tabLoad(tabRoute, loadOptions) {
       el,
       component,
       componentUrl
-    } = loadTabParams; // Component/Template Callbacks
-
+    } = loadTabParams;
+    // Component/Template Callbacks
     function resolve(contentEl) {
       router.allowPageChange = true;
       if (!contentEl) return;
-
       if (typeof contentEl === 'string') {
         $newTabEl.html(contentEl);
       } else {
         $newTabEl.html('');
-
         if (contentEl.f7Component) {
           contentEl.f7Component.mount(componentEl => {
             $newTabEl.append(componentEl);
@@ -151,16 +135,13 @@ function tabLoad(tabRoute, loadOptions) {
           $newTabEl.append(contentEl);
         }
       }
-
       $newTabEl[0].f7RouterTabLoaded = true;
       onTabLoaded(contentEl);
     }
-
     function reject() {
       router.allowPageChange = true;
       return router;
     }
-
     if (content) {
       resolve(content);
     } else if (el) {
@@ -186,7 +167,6 @@ function tabLoad(tabRoute, loadOptions) {
         router.xhrAbortController.abort();
         router.xhrAbortController = false;
       }
-
       router.xhrRequest(url, loadTabOptions).then(tabContent => {
         resolve(tabContent);
       }).catch(() => {
@@ -194,7 +174,6 @@ function tabLoad(tabRoute, loadOptions) {
       });
     }
   }
-
   let hasContentLoadProp;
   'url content component el componentUrl'.split(' ').forEach(tabLoadProp => {
     if (tabRoute[tabLoadProp]) {
@@ -203,16 +182,15 @@ function tabLoad(tabRoute, loadOptions) {
         [tabLoadProp]: tabRoute[tabLoadProp]
       }, options);
     }
-  }); // Async
+  });
 
+  // Async
   function asyncResolve(resolveParams, resolveOptions) {
     loadTab(resolveParams, extend(options, resolveOptions));
   }
-
   function asyncReject() {
     router.allowPageChange = true;
   }
-
   if (tabRoute.async) {
     tabRoute.async.call(router, {
       router,
@@ -227,19 +205,15 @@ function tabLoad(tabRoute, loadOptions) {
   } else if (!hasContentLoadProp) {
     router.allowPageChange = true;
   }
-
   return router;
 }
-
 function tabRemove($oldTabEl, $newTabEl, tabRoute) {
   const router = this;
   let hasTabComponentChild;
-
   if ($oldTabEl[0]) {
     $oldTabEl[0].f7RouterTabLoaded = false;
     delete $oldTabEl[0].f7RouterTabLoaded;
   }
-
   $oldTabEl.children().each(tabChild => {
     if (tabChild.f7Component) {
       hasTabComponentChild = true;
@@ -247,13 +221,10 @@ function tabRemove($oldTabEl, $newTabEl, tabRoute) {
       tabChild.f7Component.destroy();
     }
   });
-
   if (!hasTabComponentChild) {
     $oldTabEl.trigger('tab:beforeremove', tabRoute);
   }
-
   router.emit('tabBeforeRemove', $oldTabEl[0], $newTabEl[0], tabRoute);
   router.removeTabContent($oldTabEl[0], tabRoute);
 }
-
 export { tabLoad, tabRemove };

package/modules/service-worker/service-worker.js

@@ -2,17 +2,14 @@ import { getWindow } from 'ssr-window';
 import { extend } from '../../shared/utils.js';
 const SW = {
   registrations: [],
-
   register(path, scope) {
     const app = this;
     const window = getWindow();
-
     if (!('serviceWorker' in window.navigator) || !app.serviceWorker.container) {
       return new Promise((resolve, reject) => {
         reject(new Error('Service worker is not supported'));
       });
     }
-
     return new Promise((resolve, reject) => {
       app.serviceWorker.container.register(path, scope ? {
         scope
@@ -26,17 +23,14 @@ const SW = {
       });
     });
   },
-
   unregister(registration) {
     const app = this;
     const window = getWindow();
-
     if (!('serviceWorker' in window.navigator) || !app.serviceWorker.container) {
       return new Promise((resolve, reject) => {
         reject(new Error('Service worker is not supported'));
       });
     }
-
     let registrations;
     if (!registration) registrations = SW.registrations;else if (Array.isArray(registration)) registrations = registration;else registrations = [registration];
     return Promise.all(registrations.map(reg => new Promise((resolve, reject) => {
@@ -44,7 +38,6 @@ const SW = {
         if (SW.registrations.indexOf(reg) >= 0) {
           SW.registrations.splice(SW.registrations.indexOf(reg), 1);
         }
-
         app.emit('serviceWorkerUnregisterSuccess', reg);
         resolve();
       }).catch(error => {
@@ -53,7 +46,6 @@ const SW = {
       });
     })));
   }
-
 };
 export default {
   name: 'sw',
@@ -63,7 +55,6 @@ export default {
       scope: undefined
     }
   },
-
   create() {
     const app = this;
     const window = getWindow();
@@ -76,7 +67,6 @@ export default {
       }
     });
   },
-
   on: {
     init() {
       const window = getWindow();
@@ -92,6 +82,5 @@ export default {
         app.serviceWorker.register(path, scope);
       });
     }
-
   }
 };

package/modules/store/create-store.js

@@ -1,19 +1,20 @@
 /* eslint-disable no-underscore-dangle */
 import { extend } from '../../shared/utils.js';
-
 function createStore(storeParams) {
   if (storeParams === void 0) {
     storeParams = {};
   }
-
   const store = {
     __store: true
   };
-  const originalState = { ...(storeParams.state || {})
+  const originalState = {
+    ...(storeParams.state || {})
   };
-  const actions = { ...(storeParams.actions || {})
+  const actions = {
+    ...(storeParams.actions || {})
   };
-  const getters = { ...(storeParams.getters || {})
+  const getters = {
+    ...(storeParams.getters || {})
   };
   const state = extend({}, originalState);
   let propsQueue = [];
@@ -23,13 +24,11 @@ function createStore(storeParams) {
     gettersDependencies[getterKey] = [];
     gettersCallbacks[getterKey] = [];
   });
-
   const getGetterValue = getterKey => {
     return getters[getterKey]({
       state: store.state
     });
   };
-
   const addGetterDependencies = (getterKey, deps) => {
     if (!gettersDependencies[getterKey]) gettersDependencies[getterKey] = [];
     deps.forEach(dep => {
@@ -38,12 +37,10 @@ function createStore(storeParams) {
       }
     });
   };
-
   const addGetterCallback = (getterKey, callback) => {
     if (!gettersCallbacks[getterKey]) gettersCallbacks[getterKey] = [];
     gettersCallbacks[getterKey].push(callback);
   };
-
   const runGetterCallbacks = stateKey => {
     const keys = Object.keys(gettersDependencies).filter(getterKey => {
       return gettersDependencies[getterKey].indexOf(stateKey) >= 0;
@@ -55,55 +52,45 @@ function createStore(storeParams) {
       });
     });
   };
-
   const removeGetterCallback = callback => {
     Object.keys(gettersCallbacks).forEach(stateKey => {
       const callbacks = gettersCallbacks[stateKey];
-
       if (callbacks.indexOf(callback) >= 0) {
         callbacks.splice(callbacks.indexOf(callback), 1);
       }
     });
-  }; // eslint-disable-next-line
-
+  };
 
+  // eslint-disable-next-line
   store.__removeCallback = callback => {
     removeGetterCallback(callback);
   };
-
   const getterValue = function (getterKey, addCallback) {
     if (addCallback === void 0) {
       addCallback = true;
     }
-
     if (getterKey === 'constructor') return undefined;
     propsQueue = [];
     const value = getGetterValue(getterKey);
     addGetterDependencies(getterKey, propsQueue);
-
     const onUpdated = callback => {
       addGetterCallback(getterKey, callback);
     };
-
     const obj = {
       value,
       onUpdated
     };
-
     if (!addCallback) {
       return obj;
     }
-
     const callback = v => {
       obj.value = v;
     };
-
     obj.__callback = callback;
-    addGetterCallback(getterKey, callback); // eslint-disable-next-line
-
+    addGetterCallback(getterKey, callback);
+    // eslint-disable-next-line
     return obj;
   };
-
   store.state = new Proxy(state, {
     set: (target, prop, value) => {
       target[prop] = value;
@@ -121,7 +108,6 @@ function createStore(storeParams) {
       if (!target[prop]) {
         return undefined;
       }
-
       return getterValue(prop, true);
     }
   });
@@ -131,18 +117,15 @@ function createStore(storeParams) {
       if (!target[prop]) {
         return undefined;
       }
-
       return getterValue(prop, false);
     }
   });
-
   store.dispatch = (actionName, data) => {
     return new Promise((resolve, reject) => {
       if (!actions[actionName]) {
         reject();
         throw new Error(`Framework7: Store action "${actionName}" is not found`);
       }
-
       const result = actions[actionName]({
         state: store.state,
         dispatch: store.dispatch
@@ -150,8 +133,6 @@ function createStore(storeParams) {
       resolve(result);
     });
   };
-
   return store;
 }
-
 export default createStore;

package/modules/touch/touch.d.ts

@@ -24,15 +24,13 @@ export namespace Touch {
           tapHoldPreventClicks?: boolean;
           /** When enabled, app will add "active-state" class to currently touched (:active) element.. (default true) */
           activeState?: boolean;
-          /** CSS selector of elements where enabled activeState will add appropriate active class. (default a, button, label, span, .actions-button, .stepper-button, .stepper-button-plus, .stepper-button-minus, .card-expandable, .menu-item, .link, .item-link) */
+          /** CSS selector of elements where enabled activeState will add appropriate active class. (default a, button, label, span, .actions-button, .stepper-button, .stepper-button-plus, .stepper-button-minus, .card-expandable, .link, .item-link) */
           activeStateElements?: string;
           /** Enables MD-theme specific touch ripple effect. (default true) */
           mdTouchRipple?: boolean;
           /** Enables iOS-theme specific touch ripple effect. (default false) */
           iosTouchRipple?: boolean;
-          /** Enables Aurora-theme specific touch ripple effect. (default false) */
-          auroraTouchRipple?: boolean;
-          /** CSS selector of elements to apply touch ripple effect on click. (default .ripple, .link, .item-link, .list-button, .links-list a, .button, button, .input-clear-button, .dialog-button, .tab-link, .item-radio, .item-checkbox, .actions-button, .searchbar-disable-button, .fab a, .checkbox, .radio, .data-table .sortable-cell:not(.input-cell), .notification-close-button, .stepper-button, .stepper-button-minus, .stepper-button-plus, .menu-item-content) */
+          /** CSS selector of elements to apply touch ripple effect on click. (default .ripple, .link, .item-link, .list-button, .links-list a, .button, button, .input-clear-button, .dialog-button, .tab-link, .item-radio, .item-checkbox, .actions-button, .searchbar-disable-button, .fab a, .checkbox, .radio, .data-table .sortable-cell:not(.input-cell), .notification-close-button, .stepper-button, .stepper-button-minus, .stepper-button-plus) */
           touchRippleElements?: string;
           /** CSS selector of elements to with inset touch ripple effect. (default .ripple-inset, .icon-only, .searchbar-disable-button, .input-clear-button, .notification-close-button, .md .navbar .link.back) */
           touchRippleInsetElements?: string;