@wiajs/core 0.1.12 → 0.1.16

package/dist/core.esm.js

@@ -1,6 +1,6 @@
 /*!
-  * wia core v0.1.12
-  * (c) 2020 Sibyl Yu
+  * wia core v0.1.16
+  * (c) 2021 Sibyl Yu
   * @license MIT
   */
 /**
@@ -8,9 +8,7 @@
  * return Promise objext.
  * get move to base.js
  */
-var Ajax =
-/*#__PURE__*/
-function () {
+var Ajax = /*#__PURE__*/function () {
   function Ajax() {}
 
   var _proto = Ajax.prototype;
@@ -116,7 +114,8 @@ function _createClass(Constructor, protoProps, staticProps) {
 function _inheritsLoose(subClass, superClass) {
   subClass.prototype = Object.create(superClass.prototype);
   subClass.prototype.constructor = subClass;
-  subClass.__proto__ = superClass;
+
+  _setPrototypeOf(subClass, superClass);
 }
 
 function _setPrototypeOf(o, p) {
@@ -128,13 +127,13 @@ function _setPrototypeOf(o, p) {
   return _setPrototypeOf(o, p);
 }
 
-function isNativeReflectConstruct() {
+function _isNativeReflectConstruct() {
   if (typeof Reflect === "undefined" || !Reflect.construct) return false;
   if (Reflect.construct.sham) return false;
   if (typeof Proxy === "function") return true;
 
   try {
-    Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
+    Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
     return true;
   } catch (e) {
     return false;
@@ -142,7 +141,7 @@ function isNativeReflectConstruct() {
 }
 
 function _construct(Parent, args, Class) {
-  if (isNativeReflectConstruct()) {
+  if (_isNativeReflectConstruct()) {
     _construct = Reflect.construct;
   } else {
     _construct = function _construct(Parent, args, Class) {
@@ -184,8 +183,8 @@ var Utils = {
 
     return $.uid(mask, map);
   },
-  mdPreloaderContent: "\n    <span class=\"preloader-inner\">\n      <span class=\"preloader-inner-gap\"></span>\n      <span class=\"preloader-inner-left\">\n          <span class=\"preloader-inner-half-circle\"></span>\n      </span>\n      <span class=\"preloader-inner-right\">\n          <span class=\"preloader-inner-half-circle\"></span>\n      </span>\n    </span>\n  ".trim(),
-  iosPreloaderContent: ("\n    <span class=\"preloader-inner\">\n      " + [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11].map(function () {
+  mdPreloaderContent: "\n    <span class=\"preloader-inner\">\n\t\t\t<svg viewBox=\"0 0 36 36\">\n\t\t\t\t<circle cx=\"18\" cy=\"18\" r=\"16\"></circle>\n\t\t\t</svg>\n    </span>\n  ".trim(),
+  iosPreloaderContent: ("\n    <span class=\"preloader-inner\">\n\t\t\t" + [0, 1, 2, 3, 4, 5, 6, 7].map(function () {
     return '<span class="preloader-inner-line"></span>';
   }).join('') + "\n    </span>\n  ").trim(),
   auroraPreloaderContent: "\n    <span class=\"preloader-inner\">\n      <span class=\"preloader-inner-circle\"></span>\n    </span>\n  ",
@@ -312,6 +311,22 @@ var Utils = {
     args.splice(0, 1);
     return (_$2 = $).assign.apply(_$2, [to].concat(args));
   },
+  // ���෽������ʵ�������������ԡ���������
+  bindMethods: function bindMethods(instance, obj) {
+    var _this = this;
+
+    Object.keys(obj).forEach(function (key) {
+      if (_this.isObject(obj[key])) {
+        Object.keys(obj[key]).forEach(function (subKey) {
+          if (typeof obj[key][subKey] === 'function') {
+            obj[key][subKey] = obj[key][subKey].bind(instance);
+          }
+        });
+      }
+
+      instance[key] = obj[key];
+    });
+  },
   colorHexToRgb: function colorHexToRgb(hex) {
     var h = hex.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i, function (m, r, g, b) {
       return r + r + g + g + b + b;
@@ -427,9 +442,7 @@ var Utils = {
  * 需要支持事件的对象，可以从这个类继承，则类实例具备事件功能。
  * Fork from Framework7，
  */
-var Event =
-/*#__PURE__*/
-function () {
+var Event = /*#__PURE__*/function () {
   function Event(params, parents) {
     if (params === void 0) {
       params = {};
@@ -558,9 +571,7 @@ function () {
   return Event;
 }();
 
-var Module =
-/*#__PURE__*/
-function (_Event) {
+var Module = /*#__PURE__*/function (_Event) {
   _inheritsLoose(Module, _Event);
 
   function Module(params, parents) {
@@ -604,7 +615,7 @@ function (_Event) {
     });
   }
   /**
-   * 将扩展模块的相关事件加载到类实例
+   * 将扩展模块的相关方法、事件加载到类实例
    * @param {*} moduleName 扩展模块名称
    * @param {*} moduleParams 
    */
@@ -635,7 +646,7 @@ function (_Event) {
           instance[modulePropName] = moduleProp;
         }
       });
-    } // 将扩展模块中的on加载到事件侦听中，Add event listeners
+    } // 将扩展模块中的on加载到实例的事件侦听中，比如 init 在实例初始化时被调用
 
 
     if (module.on && instance.on) {
@@ -655,7 +666,7 @@ function (_Event) {
           instance.vnodeHooks[hookName][vnodeId].push(handler.bind(instance));
         });
       });
-    } // 模块实例化回调，Module create callback
+    } // 执行模块的create方法，模块实例化回调，Module create callback
 
 
     if (module.create) {
@@ -663,7 +674,7 @@ function (_Event) {
     }
   }
   /**
-   * 初始化实例原型中的所有扩展模块中定义的相关回调
+   * 实例创建初始化时，执行扩展模块中定义的相关回调
    * @param {*} modulesParams 
    */
   ;
@@ -682,7 +693,7 @@ function (_Event) {
   };
 
   /**
-   * 将模块类加载到指定类上，用于扩展类
+   * 将模块类装配到指定类的modules属性，用于扩展类
    * @param {*} module 模块类
    * @param  {...any} params 参数
    */
@@ -764,7 +775,7 @@ function Constructors (parameters) {
 
   var _parameters = parameters,
       defaultSelector = _parameters.defaultSelector,
-      constructor = _parameters.constructor,
+      Constructor = _parameters.constructor,
       domProp = _parameters.domProp,
       app = _parameters.app,
       addMethods = _parameters.addMethods;
@@ -774,15 +785,15 @@ function Constructors (parameters) {
         args[_key] = arguments[_key];
       }
 
-      if (app) return _construct(constructor, [app].concat(args));
-      return _construct(constructor, args);
+      if (app) return _construct(Constructor, [app].concat(args));
+      return _construct(Constructor, args);
     },
     get: function get(el) {
       if (el === void 0) {
         el = defaultSelector;
       }
 
-      if (el instanceof constructor) return el;
+      if (el instanceof Constructor) return el;
       var $el = $(el);
       if ($el.length === 0) return undefined;
       return $el[0][domProp];
@@ -1111,7 +1122,7 @@ function initClicks(app) {
     var $clickedEl = $(e.target);
     var $clickedLinkEl = $clickedEl.closest('a');
     var isLink = $clickedLinkEl.length > 0;
-    var url = isLink && $clickedLinkEl.attr('href'); // call Modules Clicks
+    isLink && $clickedLinkEl.attr('href'); // call Modules Clicks
 
     Object.keys(app.modules).forEach(function (moduleName) {
       var moduleClicks = app.modules[moduleName].clicks;
@@ -1237,44 +1248,35 @@ var SW$1 = {
   }
 };
 
-var Support = $.support;
-var Device = $.device;
+var Support$1 = $.support;
+var Device$1 = $.device;
+/**
+ * 应用类，每个wia应用从该类继承，由 首页加载创建或者路由创建
+ */
 
-var App =
-/*#__PURE__*/
-function (_Module) {
+var App = /*#__PURE__*/function (_Module) {
   _inheritsLoose(App, _Module);
 
-  function App(params) {
+  function App(opt) {
     var _this;
 
-    _this = _Module.call(this, params) || this;
-
-    if (App.instance) {
-      throw new Error("App is already initialized and can't be initialized more than once");
-    }
-
-    var passedParams = $.extend({}, params); // App Instance
+    _this = _Module.call(this, opt) || this;
+    var passedParams = $.extend({}, opt);
 
     var app = _assertThisInitialized(_this);
 
-    app.device = Device;
-    app.support = Support;
-    App.instance = app;
-    $.app = app;
-    $.App = App; // Default
+    app.device = Device$1;
+    app.support = Support$1; // Default
 
-    var defaults = {
-      version: '1.0.0',
-      id: 'pub.wia.testapp',
+    var def = {
+      version: '0.0.1',
       root: 'body',
       theme: 'auto',
       language: window.navigator.language,
       routes: [],
-      name: 'wia',
       lazyModulesPath: null,
       initOnDeviceReady: true,
-      init: true,
+      // init: true, // 路由加载时，为 false，，为true
       autoDarkTheme: false,
       iosTranslucentBars: true,
       iosTranslucentModals: true,
@@ -1282,15 +1284,14 @@ function (_Module) {
       componentUrl: undefined
     }; // Extend defaults with modules params
 
-    app.useModulesParams(defaults); // Extend defaults with passed params
+    app.useModulesParams(def); // Extend defaults with passed params
 
-    app.params = $.extend(defaults, params);
+    app.params = $.extend(def, opt);
     var $rootEl = $(app.params.root);
     $.extend(app, {
-      // App Id
-      id: app.params.id,
-      // App Name
+      owner: app.params.owner,
       name: app.params.name,
+      id: app.params.owner + "." + app.params.name,
       // App version
       version: app.params.version,
       // Routes
@@ -1299,6 +1300,7 @@ function (_Module) {
       language: app.params.language,
       // Root
       root: $rootEl,
+      $el: $rootEl,
       cfg: app.params.cfg,
       // app config
       api: app.params.api,
@@ -1308,8 +1310,8 @@ function (_Module) {
       // Theme
       theme: function getTheme() {
         if (app.params.theme === 'auto') {
-          if (Device.ios) return 'ios';
-          if (Device.desktop && Device.electron) return 'aurora';
+          if (Device$1.ios) return 'ios';
+          if (Device$1.desktop) return 'aurora';
           return 'md';
         }
 
@@ -1324,16 +1326,13 @@ function (_Module) {
       app.root[0].wia = app;
     }
 
-    if (Device.ios && Device.webView) {
-      // Strange hack required for iOS 8 webview to work on inputs
-      window.addEventListener('touchstart', function () {});
-    }
-
     app.touchEvents = {
-      start: Support.touch ? 'touchstart' : Support.pointerEvents ? 'pointerdown' : 'mousedown',
-      move: Support.touch ? 'touchmove' : Support.pointerEvents ? 'pointermove' : 'mousemove',
-      end: Support.touch ? 'touchend' : Support.pointerEvents ? 'pointerup' : 'mouseup'
-    }; // 加载use插入的模块类相关方法（如：create、get、destroy），Load Use Modules
+      start: Support$1.touch ? 'touchstart' : Support$1.pointerEvents ? 'pointerdown' : 'mousedown',
+      move: Support$1.touch ? 'touchmove' : Support$1.pointerEvents ? 'pointermove' : 'mousemove',
+      end: Support$1.touch ? 'touchend' : Support$1.pointerEvents ? 'pointerup' : 'mouseup'
+    }; // 加载use插入的模块类，每个模块作为app的一个属性，合并到实例。
+    // 模块包括相关属性及方法（如：create、get、destroy）
+    // 调用每个模块的 create 方法
 
     app.useModules(); // 初始化数据，Init Data & Methods
 
@@ -1367,39 +1366,46 @@ function (_Module) {
 
 
     function init() {
-      if (Device.cordova && app.params.initOnDeviceReady) {
+      if (Device$1.cordova && app.params.initOnDeviceReady) {
         $(document).on('deviceready', function () {
           app.init();
         });
       } else {
         app.init();
       }
-    }
+    } // 应用初始化，路由跳转时不执行初始化
 
-    if (app.params.component || app.params.componentUrl) {
-      app.router.componentLoader(app.params.component, app.params.componentUrl, {
-        componentOptions: {
-          el: app.root[0]
-        }
-      }, function (el) {
-        app.root = $(el);
-        app.root[0].f7 = app;
-        app.rootComponent = el.f7Component;
-        if (app.params.init) init();
-      });
-    } else if (app.params.init) {
-      init();
-    } // Return app instance
 
+    if (app.params.init) init(); // Return app instance
 
     return app || _assertThisInitialized(_this);
+  } // 首次加载事件，全局只触发一次
+
+
+  var _proto = App.prototype;
+
+  _proto.load = function load(param) {
+    this.emit('local::load appLoad', param);
+  } // 从后台切换到前台显示事件
+  ;
+
+  _proto.show = function show(url, data) {
+    this.emit('local::show appShow', url, data);
+  } // 从前台显示切换到后台事件
+  ;
+
+  _proto.hide = function hide() {
+    this.emit('local::hide appHide');
+  } // 卸载应用事件
+  ;
+
+  _proto.unload = function unload() {
+    this.emit('local::unload appUnload');
   }
   /**
    * 初始化数据
    */
-
-
-  var _proto = App.prototype;
+  ;
 
   _proto.initData = function initData() {
     var app = this; // Data
@@ -1448,12 +1454,19 @@ function (_Module) {
     var app = this;
     if (app.mq.dark) app.mq.dark.removeListener(app.colorSchemeListener);
     if (app.mq.light) app.mq.light.removeListener(app.colorSchemeListener);
-  } // 初始化
+  } // 初始化，包括控制 html 样式，wia app 启动时需要执行，切换app时，不需要
   ;
 
   _proto.init = function init() {
     var app = this;
     if (app.initialized) return app;
+    $.App = App;
+
+    if (Device$1.ios && Device$1.webView) {
+      // Strange hack required for iOS 8 webview to work on inputs
+      window.addEventListener('touchstart', function () {});
+    }
+
     app.root.addClass('framework7-initializing'); // RTL attr
 
     if (app.rtl) {
@@ -1481,11 +1494,11 @@ function (_Module) {
 
     $('html').removeClass('ios md aurora').addClass(app.theme); // iOS Translucent
 
-    if (app.params.iosTranslucentBars && app.theme === 'ios' && Device.ios) {
+    if (app.params.iosTranslucentBars && app.theme === 'ios' && Device$1.ios) {
       $('html').addClass('ios-translucent-bars');
     }
 
-    if (app.params.iosTranslucentModals && app.theme === 'ios' && Device.ios) {
+    if (app.params.iosTranslucentModals && app.theme === 'ios' && Device$1.ios) {
       $('html').addClass('ios-translucent-modals');
     } // Init class
 
@@ -1495,7 +1508,8 @@ function (_Module) {
     });
     initStyle(); // Emit, init other modules
 
-    app.initialized = true;
+    app.initialized = true; // 发起init 事件，模块 on 里面有 init方法的会被触发
+
     app.emit('init');
     return app;
   } // eslint-disable-next-line
@@ -1554,53 +1568,56 @@ function (_Module) {
  */
 
 
+App.apps = {};
+
 function initStyle() {
   var classNames = [];
   var html = document.querySelector('html');
   var 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') {
+  if (Device$1.standalone && Device$1.ios && metaStatusbar && metaStatusbar.content === 'black-translucent') {
     classNames.push('device-full-viewport');
   } // Pixel Ratio
 
 
-  classNames.push("device-pixel-ratio-" + Math.floor(Device.pixelRatio)); // OS classes
+  classNames.push("device-pixel-ratio-" + Math.floor(Device$1.pixelRatio)); // OS classes
 
-  if (Device.os && !Device.desktop) {
-    classNames.push("device-" + Device.os);
-  } else if (Device.desktop) {
+  if (Device$1.os && !Device$1.desktop) {
+    classNames.push("device-" + Device$1.os);
+  } else if (Device$1.desktop) {
     classNames.push('device-desktop');
 
-    if (Device.os) {
-      classNames.push("device-" + Device.os);
+    if (Device$1.os) {
+      classNames.push("device-" + Device$1.os);
     }
   }
 
-  if (Device.cordova || Device.phonegap) {
+  if (Device$1.cordova || Device$1.phonegap) {
     classNames.push('device-cordova');
   } // Add html classes
 
 
   classNames.forEach(function (className) {
-    html.classList.add(className);
+    html.classList.add(className); // console.log({className});
   });
-}
+} // App 类 静态方法、属性
+
 
 App.ModalMethods = Modals;
 App.ConstructorMethods = Constructors; // 动态加载模块（base里面已经内置动态加载，这个方法应该用不上）
 
 App.loadModule = loadModule;
 
-App.loadModules = function loadModules(modules) {
+App.loadModules = function (modules) {
   return Promise.all(modules.map(function (module) {
     return App.loadModule(module);
   }));
 }; // app 加载到 app实例的一些扩展模块
 
 
-App.support = Support;
-App.device = Device;
+App.support = Support$1;
+App.device = Device$1;
 App.utils = Utils; // 添加应用缺省模块
 
 App.use([Resize, // 控制屏幕大小
@@ -1660,9 +1677,7 @@ var _dpr = window.devicePixelRatio || window.screen.deviceXDPI / window.screen.l
  */
 
 
-var Lazy =
-/*#__PURE__*/
-function () {
+var Lazy = /*#__PURE__*/function () {
   // 实例属性
   function Lazy(opt) {
     _opt = $.assign({}, _opts, opt);
@@ -1821,9 +1836,7 @@ function _update(root) {
   return this;
 }
 
-var Page =
-/*#__PURE__*/
-function (_Event) {
+var Page = /*#__PURE__*/function (_Event) {
   _inheritsLoose(Page, _Event);
 
   function Page(app, name, title, style) {
@@ -1839,7 +1852,11 @@ function (_Event) {
     _this.style = style || "./page/" + name + ".css";
     _this.path = "" + name; // url 路径，不使用正则，直接查找
 
-    _this.view = null; // 页面的div层Dom对象，router创建实例时赋值
+    _this.view = null; // 页面的div层$Dom对象，router创建实例时赋值
+
+    _this.el = null; // $dom
+
+    _this.$el = null; // $dom
 
     _this.html = ''; // 页面html文本，router创建实例时赋值
 
@@ -1879,15 +1896,43 @@ function (_Event) {
     // $.assign(this, {page, param, back});
     // $.assign(this.data, param);
     // 隐藏所有模板
+    this.init();
     this.emit('local::ready pageReady', view, param, back);
-    view.qus('[name$=-tp]').hide();
+  }
+  /**
+   * 对页面进行初始化处理，或页面内容动态变更时，对局部页面容器进行初始化
+   * 具备name属性的dom节点直接赋值给页面view
+   * 只挂载一个，多个同名name，最后一个起作用，因此一个页面内，name不要重复
+   * 同节点多次调用不覆盖，同名不同dom节点，覆盖
+   * 覆盖后，原直接节点属性的 bind 会失效，需真的新的$dom重新bind
+   * @param {*} v dom 容器，默认为页面实例的view
+   */
+  ;
+
+  _proto.init = function init(v) {
+    var view = this.view;
+    v = v ? $(v) : view; // 页面上带name属性节点，直接作为page.view的属性，方便页面代码直接调用
+
+    var ns = v.qus('[name]');
+    ns === null || ns === void 0 ? void 0 : ns.forEach(function (n) {
+      var $n = $(n);
+      var name = $n.attr('name');
+      if (!view[name] || view[name].dom !== n) view[name] = $n;
+    }); // 隐藏所有模板
+
+    v.qus('[name$=-tp]').hide(); // 防止空链接，刷新页面
+
+    v.qus('a[href=""]').attr('href', 'javascript:;');
   } // 显示已加载的页面
   // view：页面Dom层，param：参数
   ;
 
   _proto.show = function show(view, param) {
-    // 防止空链接，刷新页面
-    view.qus('a[href=""]').attr('href', 'javascript:;');
+    // 隐藏所有模板
+    view.qus('[name$=-tp]').hide(); // 防止空链接，刷新页面
+
+    view.qus('a[href=""]').attr('href', 'javascript:;'); // this.init();
+
     if (this.reset) this.reset();
     this.emit('local::show pageShow', view, param);
   } // 回退显示已加载的页面
@@ -1895,7 +1940,9 @@ function (_Event) {
   ;
 
   _proto.back = function back(view, param) {
-    // 防止空链接，刷新页面
+    // 隐藏所有模板
+    view.qus('[name$=-tp]').hide(); // 防止空链接，刷新页面
+
     view.qus('a[href=""]').attr('href', 'javascript:;');
     this.emit('local::back pageBack', view, param);
   };
@@ -1916,9 +1963,7 @@ function clearDialogsQueue() {
   dialog.open();
 }
 
-var Modal =
-/*#__PURE__*/
-function (_Event) {
+var Modal = /*#__PURE__*/function (_Event) {
   _inheritsLoose(Modal, _Event);
 
   function Modal(app, params) {
@@ -2151,9 +2196,43 @@ function (_Event) {
   return Modal;
 }(Event);
 
+// replace react, use by @babel/plugin-transform-react-jsx
+
+/* eslint-disable prefer-rest-params */
+function jsx(tag, props) {
+  var attrs = props || {};
+
+  for (var _len = arguments.length, args = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+    args[_key - 2] = arguments[_key];
+  }
+
+  var children = args || [];
+  var attrsString = Object.keys(attrs).map(function (attr) {
+    if (attr[0] === '_') {
+      if (attrs[attr]) return attr.replace('_', '');
+      return '';
+    }
+
+    return attr + "=\"" + attrs[attr] + "\"";
+  }).filter(function (attr) {
+    return !!attr;
+  }).join(' ');
+
+  if (['path', 'img', 'circle', 'polygon', 'line', 'input'].indexOf(tag) >= 0) {
+    return ("<" + tag + " " + attrsString + " />").trim();
+  }
+
+  var childrenContent = children.filter(function (c) {
+    return !!c;
+  }).map(function (c) {
+    return Array.isArray(c) ? c.join('') : c;
+  }).join('');
+  return ("<" + tag + " " + attrsString + ">" + childrenContent + "</" + tag + ">").trim();
+}
+
 // export {default as Device} from './device';
 
-var Support$1 = $.support;
-var Device$1 = $.device;
+var Support = $.support;
+var Device = $.device;
 
-export { Ajax, App, Constructors, Device$1 as Device, Event, Lazy, Modal, Modals, Module, Page, Resize, SW$1 as SW, Support$1 as Support, Utils, loadModule };
+export { Ajax, App, Constructors, Device, Event, Lazy, Modal, Modals, Module, Page, Resize, SW$1 as SW, Support, Utils, jsx, loadModule };