framework7 7.0.8 → 8.0.0-beta.1

package/modules/component/snabbdom/tovnode.js

@@ -3,7 +3,6 @@ import htmlDomApi from './htmldomapi.js';
 export function toVNode(node, domApi) {
   var api = domApi !== undefined ? domApi : htmlDomApi;
   var text;
-
   if (api.isElement(node)) {
     var id = node.id ? '#' + node.id : '';
     var cn = node.getAttribute('class');
@@ -13,22 +12,18 @@ export function toVNode(node, domApi) {
     var children = [];
     var name_1;
     var i = void 0,
-        n = void 0;
+      n = void 0;
     var elmAttrs = node.attributes;
     var elmChildren = node.childNodes;
-
     for (i = 0, n = elmAttrs.length; i < n; i++) {
       name_1 = elmAttrs[i].nodeName;
-
       if (name_1 !== 'id' && name_1 !== 'class') {
         attrs[name_1] = elmAttrs[i].nodeValue;
       }
     }
-
     for (i = 0, n = elmChildren.length; i < n; i++) {
       children.push(toVNode(elmChildren[i]));
     }
-
     return vnode(sel, {
       attrs: attrs
     }, children, undefined, node);

package/modules/component/vdom.js

@@ -1,5 +1,4 @@
 /* eslint no-use-before-define: "off" */
-
 /* eslint import/no-named-as-default: "off" */
 import h from './snabbdom/h.js';
 import customComponents from './custom-components.js';
@@ -7,37 +6,30 @@ import { isObject, eventNameToColonCase } from '../../shared/utils.js';
 const SELF_CLOSING = 'area base br col command embed hr img input keygen link menuitem meta param source track wbr'.split(' ');
 const PROPS_ATTRS = 'hidden checked disabled readonly selected autofocus autoplay required multiple value indeterminate routeProps innerHTML'.split(' ');
 const BOOLEAN_PROPS = 'hidden checked disabled readonly selected autofocus autoplay required multiple readOnly indeterminate'.split(' ');
-
 const getTagName = treeNode => {
   return typeof treeNode.type === 'function' ? treeNode.type.name || 'CustomComponent' : treeNode.type;
 };
-
 const toCamelCase = name => {
   return name.split('-').map((word, index) => {
     if (index === 0) return word.toLowerCase();
     return word[0].toUpperCase() + word.substr(1);
   }).join('');
 };
-
 const propsFromAttrs = function () {
   const context = {};
-
   for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
     args[_key] = arguments[_key];
   }
-
   args.forEach(function (obj) {
     if (obj === void 0) {
       obj = {};
     }
-
     Object.keys(obj).forEach(key => {
       context[toCamelCase(key)] = obj[key];
     });
   });
   return context;
 };
-
 const createCustomComponent = _ref => {
   let {
     f7,
@@ -54,13 +46,11 @@ const createCustomComponent = _ref => {
       Object.keys(vnode.data.on).forEach(eventName => {
         c.$el.on(eventName, vnode.data.on[eventName]);
       });
-    } // eslint-disable-next-line
-
-
+    }
+    // eslint-disable-next-line
     vnode.elm.__component__ = c;
   });
 };
-
 const updateCustomComponent = vnode => {
   // eslint-disable-next-line
   const component = vnode && vnode.elm && vnode.elm.__component__;
@@ -70,23 +60,19 @@ const updateCustomComponent = vnode => {
   Object.assign(component.props, newProps);
   component.update();
 };
-
 const destroyCustomComponent = vnode => {
   // eslint-disable-next-line
   const component = vnode && vnode.elm && vnode.elm.__component__;
-
   if (component) {
     const {
       el,
       $el
     } = component;
-
     if (vnode.data && vnode.data.on && $el) {
       Object.keys(vnode.data.on).forEach(eventName => {
         $el.off(eventName, vnode.data.on[eventName]);
       });
     }
-
     if (component.destroy) component.destroy();
     if (el && el.parentNode) el.parentNode.removeChild(el);
     delete vnode.elm.__component__; // eslint-disable-line
@@ -96,7 +82,6 @@ const destroyCustomComponent = vnode => {
 const isCustomComponent = treeNodeType => {
   return typeof treeNodeType === 'function' || treeNodeType && treeNodeType.indexOf('-') > 0 && customComponents[treeNodeType];
 };
-
 function getHooks(treeNode, data, f7, initial, isRoot) {
   const hooks = {};
   const insert = [];
@@ -105,15 +90,12 @@ function getHooks(treeNode, data, f7, initial, isRoot) {
   const postpatch = [];
   let isFakeElement = false;
   let tagName = getTagName(treeNode);
-
   if (data && data.attrs && data.attrs.component) {
     tagName = data.attrs.component;
     delete data.attrs.component;
     isFakeElement = true;
   }
-
   const isCustom = isCustomComponent(treeNode.type);
-
   if (isCustom) {
     insert.push(vnode => {
       if (vnode.sel !== tagName && !isFakeElement) return;
@@ -131,7 +113,6 @@ function getHooks(treeNode, data, f7, initial, isRoot) {
       updateCustomComponent(vnode);
     });
   }
-
   if (!isCustom) {
     if (!data || !data.attrs || !data.attrs.class) return hooks;
     const classNames = data.attrs.class;
@@ -139,55 +120,45 @@ function getHooks(treeNode, data, f7, initial, isRoot) {
       if (!initial) {
         insert.push(...f7.getVnodeHooks('insert', className));
       }
-
       destroy.push(...f7.getVnodeHooks('destroy', className));
       update.push(...f7.getVnodeHooks('update', className));
       postpatch.push(...f7.getVnodeHooks('postpatch', className));
     });
   }
-
   if (isRoot && !initial) {
     postpatch.push((oldVnode, vnode) => {
       const vn = vnode || oldVnode;
       if (!vn) return;
-
       if (vn.data && vn.data.component) {
         vn.data.component.hook('onUpdated');
       }
     });
   }
-
   if (insert.length === 0 && destroy.length === 0 && update.length === 0 && postpatch.length === 0) {
     return hooks;
   }
-
   if (insert.length) {
     hooks.insert = vnode => {
       insert.forEach(f => f(vnode));
     };
   }
-
   if (destroy.length) {
     hooks.destroy = vnode => {
       destroy.forEach(f => f(vnode));
     };
   }
-
   if (update.length) {
     hooks.update = (oldVnode, vnode) => {
       update.forEach(f => f(oldVnode, vnode));
     };
   }
-
   if (postpatch.length) {
     hooks.postpatch = (oldVnode, vnode) => {
       postpatch.forEach(f => f(oldVnode, vnode));
     };
   }
-
   return hooks;
 }
-
 const getEventHandler = function (eventHandler, _temp) {
   let {
     stop,
@@ -195,7 +166,6 @@ const getEventHandler = function (eventHandler, _temp) {
     once
   } = _temp === void 0 ? {} : _temp;
   let fired = false;
-
   function handler() {
     const e = arguments.length <= 0 ? undefined : arguments[0];
     if (once && fired) return;
@@ -204,10 +174,8 @@ const getEventHandler = function (eventHandler, _temp) {
     fired = true;
     eventHandler(...arguments);
   }
-
   return handler;
 };
-
 const getData = (treeNode, component, f7, initial, isRoot) => {
   const data = {
     component,
@@ -217,26 +185,21 @@ const getData = (treeNode, component, f7, initial, isRoot) => {
   Object.keys(treeNode.props).forEach(attrName => {
     const attrValue = treeNode.props[attrName];
     if (typeof attrValue === 'undefined') return;
-
     if (PROPS_ATTRS.indexOf(attrName) >= 0) {
       // Props
       if (!data.props) data.props = {};
-
       if (attrName === 'readonly') {
         // eslint-disable-next-line
         attrName = 'readOnly';
       }
-
       if (attrName === 'routeProps') {
         // eslint-disable-next-line
         attrName = 'f7RouteProps';
       }
-
       if (tagName === 'option' && attrName === 'value') {
         if (!data.attrs) data.attrs = {};
         data.attrs.value = attrValue;
       }
-
       if (BOOLEAN_PROPS.indexOf(attrName) >= 0) {
         // eslint-disable-next-line
         data.props[attrName] = attrValue === false ? false : true;
@@ -253,7 +216,6 @@ const getData = (treeNode, component, f7, initial, isRoot) => {
       let stop = false;
       let prevent = false;
       let once = false;
-
       if (eventName.indexOf('.') >= 0) {
         eventName.split('.').forEach((eventNamePart, eventNameIndex) => {
           if (eventNameIndex === 0) eventName = eventNamePart;else {
@@ -263,7 +225,6 @@ const getData = (treeNode, component, f7, initial, isRoot) => {
           }
         });
       }
-
       data.on[eventName] = getEventHandler(attrValue, {
         stop,
         prevent,
@@ -280,98 +241,79 @@ const getData = (treeNode, component, f7, initial, isRoot) => {
     } else {
       // Rest of attribures
       if (!data.attrs) data.attrs = {};
-      data.attrs[attrName] = attrValue; // ID -> Key
+      data.attrs[attrName] = attrValue;
 
+      // ID -> Key
       if (attrName === 'id' && !data.key && !isRoot) {
         data.key = attrValue;
       }
     }
   });
   const hooks = getHooks(treeNode, data, f7, initial, isRoot);
-
   hooks.prepatch = (oldVnode, vnode) => {
     if (!oldVnode || !vnode) return;
-
     if (oldVnode && oldVnode.data && oldVnode.data.props) {
       Object.keys(oldVnode.data.props).forEach(key => {
         if (BOOLEAN_PROPS.indexOf(key) < 0) return;
         if (!vnode.data) vnode.data = {};
         if (!vnode.data.props) vnode.data.props = {};
-
         if (oldVnode.data.props[key] === true && !(key in vnode.data.props)) {
           vnode.data.props[key] = false;
         }
       });
     }
   };
-
   data.hook = hooks;
   return data;
 };
-
 const getChildren = (treeNode, component, f7, initial) => {
   if (treeNode && treeNode.type && SELF_CLOSING.indexOf(treeNode.type) >= 0) {
     return [];
   }
-
   const children = [];
   const nodes = treeNode.children;
-
   for (let i = 0; i < nodes.length; i += 1) {
     const childNode = nodes[i];
     const child = treeNodeToVNode(childNode, component, f7, initial, false);
-
     if (Array.isArray(child)) {
       children.push(...child);
     } else if (child) {
       children.push(child);
     }
   }
-
   return children;
 };
-
 const getSlots = (treeNode, component, f7, initial) => {
   const slotName = treeNode.props.name || 'default';
   const slotNodes = (component.children || []).filter(childTreeNode => {
     let childSlotName = 'default';
-
     if (childTreeNode.props) {
       childSlotName = childTreeNode.props.slot || 'default';
     }
-
     return childSlotName === slotName;
   });
-
   if (slotNodes.length === 0) {
     return getChildren(treeNode, component, f7, initial);
   }
-
   return slotNodes.map(subTreeNode => treeNodeToVNode(subTreeNode, component, f7, initial));
 };
-
 const isTreeNode = treeNode => {
   return isObject(treeNode) && 'props' in treeNode && 'type' in treeNode && 'children' in treeNode;
 };
-
 const treeNodeToVNode = (treeNode, component, f7, initial, isRoot) => {
   if (!isTreeNode(treeNode)) {
     return String(treeNode);
   }
-
   if (treeNode.type === 'slot') {
     return getSlots(treeNode, component, f7, initial);
   }
-
   const data = getData(treeNode, component, f7, initial, isRoot);
   const children = isCustomComponent(treeNode.type) ? [] : getChildren(treeNode, component, f7, initial);
   return h(getTagName(treeNode), data, children);
 };
-
 export default function vdom(tree, component, initial) {
   if (tree === void 0) {
     tree = {};
   }
-
   return treeNodeToVNode(tree, component, component.f7, initial, true);
 }

package/modules/demo-module.js

@@ -1,16 +1,13 @@
 export default {
   // Module Name
   name: 'demo-module',
-
   install(params) {
     const Class = this;
     console.log(Class, params);
   },
-
   create(instance) {
     console.log('init', instance);
   },
-
   // App Params related to module
   params: {
     a: 1,
@@ -22,7 +19,6 @@ export default {
     demo() {
       return 'demo-module-proto-method';
     },
-
     demoStatic: 'demo-module-proto-static'
   },
   // Extend Class, e.g. Class.myMethod
@@ -30,23 +26,19 @@ export default {
     demo() {
       return 'demo-module-class-method';
     },
-
     demoStatic: 'demo-module-class-static'
   },
   // Initialized instance Props & Methods
   instance: {
     demoProp: true,
-
     demoMethod() {
       return 'demo-method';
     }
-
   },
   // Add Event Listeners
   on: {
     demoEvent(a, b) {
       console.log('demo-event', a, b);
     }
-
   }
 };

package/modules/device/device.js

@@ -13,37 +13,32 @@ export default {
       const html = document.querySelector('html');
       const metaStatusbar = document.querySelector('meta[name="apple-mobile-web-app-status-bar-style"]');
       if (!html) return;
-
       if (device.standalone && device.ios && metaStatusbar && metaStatusbar.content === 'black-translucent') {
         classNames.push('device-full-viewport');
-      } // Pixel Ratio
-
-
-      classNames.push(`device-pixel-ratio-${Math.floor(device.pixelRatio)}`); // OS classes
+      }
 
+      // Pixel Ratio
+      classNames.push(`device-pixel-ratio-${Math.floor(device.pixelRatio)}`);
+      // OS classes
       if (device.os && !device.desktop) {
         classNames.push(`device-${device.os}`);
       } else if (device.desktop) {
         classNames.push('device-desktop');
-
         if (device.os) {
           classNames.push(`device-${device.os}`);
         }
       }
-
       if (device.cordova) {
         classNames.push('device-cordova');
       }
-
       if (device.capacitor) {
         classNames.push('device-capacitor');
-      } // Add html classes
-
+      }
 
+      // Add html classes
       classNames.forEach(className => {
         html.classList.add(className);
       });
     }
-
   }
 };

package/modules/history/history.js

@@ -8,6 +8,5 @@ export default {
     init() {
       History.init(this);
     }
-
   }
 };

package/modules/resize/resize.js

@@ -2,10 +2,8 @@ import { getWindow, getDocument } from 'ssr-window';
 import { getDevice } from '../../shared/get-device.js';
 export default {
   name: 'resize',
-
   create() {
     const app = this;
-
     app.getSize = () => {
       if (!app.el) return {
         width: 0,
@@ -27,27 +25,28 @@ export default {
       };
     };
   },
-
   on: {
     init() {
       const app = this;
-      const window = getWindow(); // Get Size
+      const window = getWindow();
 
-      app.getSize(); // Emit resize
+      // Get Size
+      app.getSize();
 
+      // Emit resize
       window.addEventListener('resize', () => {
         app.emit('resize');
-      }, false); // Emit orientationchange
+      }, false);
 
+      // Emit orientationchange
       window.addEventListener('orientationchange', () => {
         app.emit('orientationchange');
       });
     },
-
     orientationchange() {
       const document = getDocument();
-      const device = getDevice(); // Fix iPad weird body scroll
-
+      const device = getDevice();
+      // Fix iPad weird body scroll
       if (device.ipad) {
         document.body.scrollLeft = 0;
         setTimeout(() => {
@@ -55,11 +54,9 @@ export default {
         }, 0);
       }
     },
-
     resize() {
       const app = this;
       app.getSize();
     }
-
   }
 };

package/modules/router/async-component.js

@@ -10,14 +10,11 @@ export default function asyncComponent(router, component, resolve, reject) {
       throw new Error(err);
     });
   }
-
   if (component instanceof Promise) {
     resolvePromise(component);
     return;
   }
-
   const asyncComponentResult = component.call(router);
-
   if (asyncComponentResult instanceof Promise) {
     resolvePromise(asyncComponentResult);
   } else {