@opentiny/vue-renderless 3.1.0-alpha.0

package/common/deps/dom.js

@@ -0,0 +1,190 @@
+import _typeof from "@babel/runtime/helpers/typeof";
+import { hasOwn, isObject, isNull } from '@opentiny/vue-renderless/common/type';
+var isServer = typeof window === 'undefined';
+var SPECIAL_CHARS_REGEXP = /([:\-_]+(.))/g;
+var MOZ_HACK_REGEXP = /^moz([A-Z])/;
+var ieVersion = isServer ? 0 : Number(document.documentMode);
+var trim = function trim(string) {
+  return (string || '').replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, '');
+};
+var camelCase = function camelCase(name) {
+  return name.replace(SPECIAL_CHARS_REGEXP, function (_, separator, letter, offset) {
+    return offset ? letter.toUpperCase() : letter;
+  }).replace(MOZ_HACK_REGEXP, 'Moz$1');
+};
+export var on = function () {
+  if (!isServer) {
+    return function (el, event, handler) {
+      if (el && event && handler) {
+        el.addEventListener(event, handler, false);
+      }
+    };
+  } else {
+    return function (el, event, handler) {
+      if (el && event && handler) {
+        el.attachEvent('on' + event, handler);
+      }
+    };
+  }
+}();
+export var off = function () {
+  if (!isServer) {
+    return function (el, event, handler) {
+      if (el && event) {
+        el.removeEventListener(event, handler, false);
+      }
+    };
+  } else {
+    return function (el, event, handler) {
+      if (el && event) {
+        el.detachEvent('on' + event, handler);
+      }
+    };
+  }
+}();
+export var once = function once(el, event, fn) {
+  var listener = function listener() {
+    if (fn) {
+      fn.apply(this, arguments);
+    }
+    off(el, event, listener);
+  };
+  on(el, event, listener);
+};
+export var hasClass = function hasClass(el, clazz) {
+  if (!el || !clazz) return false;
+  if (clazz.indexOf(' ') !== -1) {
+    throw new Error('className should not contain space.');
+  }
+  if (el.classList) {
+    return el.classList.contains(clazz);
+  }
+  return (' ' + el.className + ' ').indexOf(' ' + clazz + ' ') > -1;
+};
+export var addClass = function addClass(el, clazz) {
+  if (!el) {
+    return;
+  }
+  var classes = (clazz || '').split(' ');
+  var curClass = el.className;
+  for (var i = 0, len = classes.length; i < len; i++) {
+    var clsName = classes[i];
+    if (clsName) {
+      if (el.classList) {
+        el.classList.add(clsName);
+      } else if (!hasClass(el, clsName)) {
+        curClass += ' ' + clsName;
+      }
+    }
+  }
+  if (!el.classList) {
+    el.className = curClass;
+  }
+};
+export var removeClass = function removeClass(el, clazz) {
+  if (!el || !clazz) {
+    return;
+  }
+  var classes = clazz.split(' ');
+  var curClass = ' ' + el.className + ' ';
+  for (var i = 0, len = classes.length; i < len; i++) {
+    var clsName = classes[i];
+    if (clsName) {
+      if (el.classList) {
+        el.classList.remove(clsName);
+      } else if (hasClass(el, clsName)) {
+        curClass = curClass.replace(' ' + clsName + ' ', ' ');
+      }
+    }
+  }
+  if (!el.classList) {
+    el.className = trim(curClass);
+  }
+};
+export var getStyle = function getStyle(el, styleName) {
+  if (isServer) return;
+  if (!el || !styleName) return null;
+  styleName = camelCase(styleName);
+  if (styleName === 'float') {
+    styleName = 'cssFloat';
+  }
+  try {
+    var computed = document.defaultView.getComputedStyle(el, '');
+    return el.style[styleName] || computed ? computed[styleName] : null;
+  } catch (e) {
+    return el.style[styleName];
+  }
+};
+export var setStyle = function setStyle(el, name, value) {
+  if (!el || !name) {
+    return;
+  }
+  if (_typeof(name) === 'object') {
+    for (var prop in name) {
+      if (hasOwn.call(name, prop)) {
+        setStyle(el, prop, name[prop]);
+      }
+    }
+  } else {
+    name = camelCase(name);
+    if (name === 'opacity' && ieVersion < 9) {
+      el.style.filter = isNaN(value) ? '' : 'alpha(opacity=' + value * 100 + ')';
+    } else {
+      el.style[name] = value;
+    }
+  }
+};
+export var isScroll = function isScroll(el, vertical) {
+  if (isServer) return;
+  var determinedDirection = !isNull(vertical);
+  var overflow;
+  if (determinedDirection) {
+    overflow = vertical ? getStyle(el, 'overflow-y') : getStyle(el, 'overflow-x');
+  } else {
+    overflow = getStyle(el, 'overflow');
+  }
+  return overflow.match(/(scroll|auto)/);
+};
+export var getScrollContainer = function getScrollContainer(el, vertical) {
+  if (isServer) return;
+  var parent = el;
+  while (parent) {
+    if (~[window, document, document.documentElement].indexOf(parent)) {
+      return window;
+    }
+    if (isScroll(parent, vertical)) {
+      return parent;
+    }
+    parent = parent.parentNode;
+  }
+  return parent;
+};
+export var isInContainer = function isInContainer(el, container) {
+  if (isServer || !el || !container) return false;
+  var elRect = el.getBoundingClientRect();
+  var containerRect;
+  if (~[window, document, document.documentElement].indexOf(container) || isNull(container)) {
+    containerRect = {
+      top: 0,
+      right: window.innerWidth,
+      bottom: window.innerHeight,
+      left: 0
+    };
+  } else {
+    containerRect = container.getBoundingClientRect();
+  }
+  return elRect.top < containerRect.bottom && elRect.bottom > containerRect.top && elRect.right > containerRect.left && elRect.left < containerRect.right;
+};
+export var isVNode = function isVNode(node) {
+  return node !== null && isObject(node) && hasOwn.call(node, 'componentOptions');
+};
+export var getDomNode = function getDomNode() {
+  var documentElement = document.documentElement;
+  var bodyElem = document.body;
+  return {
+    scrollTop: documentElement.scrollTop || bodyElem.scrollTop,
+    scrollLeft: documentElement.scrollLeft || bodyElem.scrollLeft,
+    visibleHeight: documentElement.clientHeight || bodyElem.clientHeight,
+    visibleWidth: documentElement.clientWidth || bodyElem.clientWidth
+  };
+};

package/common/deps/fullscreen/apis.js

@@ -0,0 +1,157 @@
+var _this = this;
+import { extend } from '@opentiny/vue-renderless/common/object';
+import { on, off } from '@opentiny/vue-renderless/common/deps/dom';
+import screenfull from '@opentiny/vue-renderless/common/deps/fullscreen/screenfull';
+var defaults = {
+  callback: function callback() {
+    return undefined;
+  },
+  fullscreenClass: 'fullscreen',
+  pageOnly: false,
+  teleport: false
+};
+var token;
+var parentNode;
+var setStyle = function setStyle(element, style) {
+  element.style.position = style.position;
+  element.style.left = style.left;
+  element.style.top = style.top;
+  element.style.width = style.width;
+  element.style.height = style.height;
+  element.style.zIndex = style.zIndex;
+};
+var resetElement = function resetElement(api) {
+  var targetEle = api.targetEle;
+  if (targetEle) {
+    targetEle.classList.remove(api.opts.fullscreenClass);
+    if (api.opts.teleport || api.opts.pageOnly) {
+      if (api.opts.teleport && parentNode) {
+        parentNode.insertBefore(targetEle, token);
+        parentNode.removeChild(token);
+      }
+      if (targetEle.__styleCache) {
+        setStyle(targetEle, targetEle.__styleCache);
+      }
+    }
+  }
+};
+var setTargetStyle = function setTargetStyle(target, options) {
+  var _target$style = target.style,
+    position = _target$style.position,
+    left = _target$style.left,
+    top = _target$style.top,
+    width = _target$style.width,
+    height = _target$style.height,
+    zIndex = _target$style.zIndex;
+  target.classList.add(options.fullscreenClass);
+  if (options.teleport || options.pageOnly) {
+    var style = {
+      position: 'fixed',
+      left: '0',
+      top: '0',
+      width: '100%',
+      height: '100%'
+    };
+    target.__styleCache = {
+      position: position,
+      left: left,
+      top: top,
+      width: width,
+      height: height,
+      zIndex: zIndex
+    };
+    options.zIndex && (style.zIndex = options.zIndex);
+    setStyle(target, style);
+  }
+};
+var getOptions = function getOptions(screenfull, options, target) {
+  options = extend({}, defaults, options);
+  if (target === document.body) {
+    options.teleport = false;
+  }
+  if (!screenfull.isEnabled) {
+    options.pageOnly = true;
+  }
+  return options;
+};
+var api = {
+  targetElement: null,
+  opts: null,
+  isEnabled: screenfull.isEnabled,
+  isFullScreen: false,
+  toggle: function toggle(target, options, force) {
+    if (force === undefined) {
+      return !_this.isFullScreen ? _this.request(target, options) : _this.exit();
+    }
+    return force ? _this.request(target, options) : _this.exit();
+  },
+  request: function request(targetEle, options) {
+    if (_this.isFullScreen) {
+      return Promise.resolve();
+    }
+    if (!targetEle) {
+      targetEle = document.body;
+    }
+    _this.opts = getOptions(screenfull, options, targetEle);
+    setTargetStyle(targetEle, _this.opts);
+    if (_this.opts.teleport) {
+      parentNode = targetEle.parentNode;
+      if (parentNode) {
+        token = document.createComment('fullscreen-token');
+        parentNode.insertBefore(token, targetEle);
+        document.body.appendChild(targetEle);
+      }
+    }
+    if (_this.opts.pageOnly) {
+      var keypressCallback = function keypressCallback(e) {
+        if (e.key === 'Escape') {
+          off(document, 'keyup', keypressCallback);
+          _this.exit();
+        }
+      };
+      _this.isFullScreen = true;
+      _this.targetElement = targetEle;
+      off(document, 'keyup', keypressCallback);
+      on(document, 'keyup', keypressCallback);
+      if (_this.opts.callback) {
+        _this.opts.callback(_this.isFullScreen);
+      }
+      return Promise.resolve();
+    } else {
+      var fullScreenCallback = function fullScreenCallback() {
+        if (!screenfull.isFullScreen) {
+          screenfull.off('change', fullScreenCallback);
+          resetElement(_this);
+        }
+        _this.isFullScreen = screenfull.isFullScreen;
+        _this.targetElement = !_this.opts.teleport ? screenfull.targetElement : targetEle || null;
+        if (_this.opts.callback) {
+          _this.opts.callback(screenfull.isFullScreen);
+        }
+      };
+      screenfull.on('change', fullScreenCallback);
+      return screenfull.request(_this.opts.teleport ? document.body : targetEle);
+    }
+  },
+  exit: function exit() {
+    if (!this.isFullScreen) {
+      return Promise.resolve();
+    }
+    if (this.opts.pageOnly) {
+      resetElement(this);
+      this.isFullScreen = false;
+      this.targetElement = null;
+      if (this.opts.callback) {
+        this.opts.callback(this.isFullScreen);
+      }
+      return Promise.resolve();
+    }
+    return screenfull.exit();
+  }
+};
+api.support = api.isEnabled;
+api.getState = function () {
+  return api.isFullScreen;
+};
+api.enter = api.request;
+export default api;

package/common/deps/fullscreen/screenfull.js

@@ -0,0 +1,106 @@
+import { on as _on, off as _off } from '@opentiny/vue-renderless/common/deps/dom';
+var fullscreenApi = ['fullscreenElement', 'fullscreenEnabled', 'requestFullscreen', 'exitFullscreen', 'fullscreenchange', 'fullscreenerror'];
+var fullscreenApiMoz = ['mozFullScreenElement', 'mozFullScreenEnabled', 'mozRequestFullScreen', 'mozCancelFullScreen', 'mozfullscreenchange', 'mozfullscreenerror'];
+var fullscreenApiWebkit = ['webkitFullscreenElement', 'webkitFullscreenEnabled', 'webkitRequestFullscreen', 'webkitExitFullscreen', 'webkitfullscreenchange', 'webkitfullscreenerror'];
+var fullscreenApiMs = ['msFullscreenElement', 'msFullscreenEnabled', 'msRequestFullscreen', 'msExitFullscreen', 'MSFullscreenChange', 'MSFullscreenError'];
+var fullscreenApiMap = [fullscreenApi, fullscreenApiWebkit, fullscreenApiMoz, fullscreenApiMs];
+var document = typeof window !== 'undefined' && typeof window.document !== 'undefined' ? window.document : {};
+var fullscreenEvents = null;
+var getFullScreenEvents = function getFullScreenEvents() {
+  for (var i = 0, len = fullscreenApiMap.length; i < len; i++) {
+    var eventName = fullscreenApiMap[i];
+    if (eventName && eventName[1] in document) {
+      fullscreenEvents = {};
+      for (i = 0; i < eventName.length; i++) {
+        fullscreenEvents[fullscreenApiMap[0][i]] = eventName[i];
+      }
+      return;
+    }
+  }
+};
+getFullScreenEvents();
+var eventNameMap = {
+  change: fullscreenEvents && fullscreenEvents.fullscreenchange,
+  error: fullscreenEvents && fullscreenEvents.fullscreenerror
+};
+var screenfull = {
+  request: function request(element, options) {
+    var _this = this;
+    return new Promise(function (resolve, reject) {
+      var onFullscreenEntered = function onFullscreenEntered() {
+        _this.off('change', onFullscreenEntered);
+        resolve();
+      };
+      _this.on('change', onFullscreenEntered);
+      element = element || document.documentElement;
+      if (element[fullscreenEvents && fullscreenEvents.requestFullscreen]) {
+        var promiseReturn = element[fullscreenEvents && fullscreenEvents.requestFullscreen](options);
+        if (promiseReturn instanceof Promise) {
+          promiseReturn.then(onFullscreenEntered)["catch"](reject);
+        }
+      }
+    });
+  },
+  exit: function exit() {
+    var _this2 = this;
+    return new Promise(function (resolve, reject) {
+      if (!_this2.isFullscreen) {
+        resolve();
+        return;
+      }
+      var onFullscreenExit = function onFullscreenExit() {
+        _this2.off('change', onFullscreenExit);
+        resolve();
+      };
+      _this2.on('change', onFullscreenExit);
+      if (document[fullscreenEvents && fullscreenEvents.exitFullscreen]) {
+        var promiseReturn = document[fullscreenEvents && fullscreenEvents.exitFullscreen]();
+        if (promiseReturn instanceof Promise) {
+          promiseReturn.then(onFullscreenExit)["catch"](reject);
+        }
+      }
+    });
+  },
+  toggle: function toggle(element, options) {
+    return this.isFullscreen ? this.exit() : this.request(element, options);
+  },
+  onchange: function onchange(callback) {
+    this.on('change', callback);
+  },
+  onerror: function onerror(callback) {
+    this.on('error', callback);
+  },
+  on: function on(event, callback) {
+    var eventName = eventNameMap[event];
+    if (eventName) {
+      _on(document, eventName, callback);
+    }
+  },
+  off: function off(event, callback) {
+    var eventName = eventNameMap[event];
+    if (eventName) {
+      _off(document, eventName, callback);
+    }
+  },
+  raw: fullscreenEvents
+};
+Object.defineProperties(screenfull, {
+  isFullscreen: {
+    get: function get() {
+      return !!document[fullscreenEvents && fullscreenEvents.fullscreenElement];
+    }
+  },
+  element: {
+    enumerable: true,
+    get: function get() {
+      return document[fullscreenEvents && fullscreenEvents.fullscreenElement];
+    }
+  },
+  isEnabled: {
+    enumerable: true,
+    get: function get() {
+      return !!document[fullscreenEvents && fullscreenEvents.fullscreenEnabled];
+    }
+  }
+});
+export default screenfull;

package/common/deps/letter-only.js

@@ -0,0 +1,15 @@
+import { on, off } from '@opentiny/vue-renderless/common/deps/dom';
+var checkValue = function checkValue(event) {
+  if (event.charCode >= 48 && event.charCode <= 57) {
+    event.preventDefault();
+  }
+  return true;
+};
+export default {
+  bind: function bind(element) {
+    on(element, 'keypress', checkValue);
+  },
+  unbind: function unbind(element) {
+    off(element, 'keypress', checkValue);
+  }
+};

package/common/deps/memorize.js

@@ -0,0 +1,149 @@
+import _typeof from "@babel/runtime/helpers/typeof";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+var Memorize = function () {
+  function Memorize(value) {
+    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    _classCallCheck(this, Memorize);
+    if (value && _typeof(value) === 'object') {
+      options = value;
+    } else {
+      value = [];
+    }
+    if (typeof options.key !== 'string' || !options.key) {
+      throw Error('Memorize Initialization error.');
+    }
+    this._prefix = 'tiny_memorize_';
+    this._customField1 = 'frequency';
+    this._customField2 = 'time';
+    this._sortBy = (options.sortBy || 'frequency').toUpperCase();
+    this._sort = (options.sort || 'desc').toUpperCase();
+    this._dataKey = options.dataKey || 'value';
+    this._highlightClass = options.highlightClass || 'memorize-highlight';
+    this._highlightNum = options.highlightNum || Infinity;
+    this._cacheNum = options.cacheNum || Infinity;
+    this._serialize = options.serialize || JSON.stringify;
+    this._deserialize = options.deserialize || JSON.parse;
+    this.setKey(options.key);
+    this.assemble(value);
+  }
+  _createClass(Memorize, [{
+    key: "setKey",
+    value: function setKey(storeKey) {
+      this._storeKey = this._prefix + (storeKey || +new Date());
+    }
+  }, {
+    key: "getValue",
+    value: function getValue() {
+      var isSort = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+      var storeVlue = window.localStorage[this._storeKey] || '';
+      if (storeVlue) {
+        try {
+          var list = this._deserialize(storeVlue);
+          return isSort ? this.sort(list) : list;
+        } catch (e) {
+          return [];
+        }
+      }
+      return [];
+    }
+  }, {
+    key: "setValue",
+    value: function setValue(value) {
+      try {
+        window.localStorage.setItem(this._storeKey, this._serialize(value));
+      } catch (e) {
+        throw Error('Memorize set localStorage error.');
+      }
+    }
+  }, {
+    key: "clear",
+    value: function clear() {
+      window.localStorage.removeItem(this._storeKey);
+    }
+  }, {
+    key: "add",
+    value: function add(dataKey) {
+      var list = this.getValue(false);
+      var newData = {
+        key: dataKey
+      };
+      newData[this._customField1] = 1;
+      newData[this._customField2] = +new Date();
+      if (list.length < this._cacheNum) {
+        list.push(newData);
+        this.setValue(list);
+      }
+    }
+  }, {
+    key: "updateByKey",
+    value: function updateByKey(dataKey) {
+      var _this = this;
+      var isChanged = false;
+      var list = this.getValue(false);
+      list.some(function (item) {
+        if (item.key === dataKey) {
+          item[_this._customField1] = (item[_this._customField1] || 0) + 1;
+          item[_this._customField2] = +new Date();
+          isChanged = true;
+          return true;
+        }
+        return false;
+      });
+      isChanged ? this.setValue(list) : this.add(dataKey);
+    }
+  }, {
+    key: "sort",
+    value: function sort(list) {
+      var _this2 = this;
+      if (Array.isArray(list)) {
+        return list.sort(function (x, y) {
+          var isDesc = _this2._sort === 'DESC';
+          var compare = isDesc ? [-1, 1] : [1, -1];
+          var sortField = _this2._sortBy === 'FREQUENCY' ? _this2._customField1 : _this2._customField2;
+          var xField = x[sortField];
+          var yField = y[sortField];
+          if (isNaN(xField)) {
+            return isDesc ? -1 : 1;
+          } else if (isNaN(yField)) {
+            return -1;
+          }
+          return xField > yField ? compare[0] : compare[1];
+        });
+      } else {
+        return list;
+      }
+    }
+  }, {
+    key: "assemble",
+    value: function assemble(list) {
+      var _this3 = this;
+      var storeValue = this.getValue(true);
+      if (!(Array.isArray(list) && list.length) || !storeValue.length) {
+        return list;
+      }
+      var matchCount = 0;
+      var handler = function handler(storeItem) {
+        return function (listItem, index) {
+          if (listItem[_this3._dataKey] === storeItem.key) {
+            matchCount++;
+            list.splice(index, 1);
+            if (matchCount <= _this3._highlightNum) {
+              listItem._highlightClass = _this3._highlightClass;
+            }
+            list.unshift(listItem);
+            return true;
+          }
+          return false;
+        };
+      };
+      for (var i = storeValue.length - 1; i > -1; i--) {
+        var storeItem = storeValue[i];
+        list.some(handler(storeItem));
+      }
+      return list;
+    }
+  }]);
+  return Memorize;
+}();
+export default Memorize;

package/common/deps/number-only.js

@@ -0,0 +1,16 @@
+import { on, off } from '@opentiny/vue-renderless/common/deps/dom';
+var checkValue = function checkValue(event) {
+  event.target.value = event.target.value.replace(/[^0-9]/g, '');
+  if (event.charCode >= 48 && event.charCode <= 57) {
+    return true;
+  }
+  event.preventDefault();
+};
+export default {
+  bind: function bind(element) {
+    on(element, 'keypress', checkValue);
+  },
+  unbind: function unbind(element) {
+    off(element, 'keypress', checkValue);
+  }
+};