cy-element-ui 1.0.0 → 1.0.1

package/lib/utils/popup/index.js

@@ -0,0 +1,233 @@
+'use strict';
+
+exports.__esModule = true;
+exports.PopupManager = undefined;
+
+var _vue = require('vue');
+
+var _vue2 = _interopRequireDefault(_vue);
+
+var _merge = require('element-ui/lib/utils/merge');
+
+var _merge2 = _interopRequireDefault(_merge);
+
+var _popupManager = require('element-ui/lib/utils/popup/popup-manager');
+
+var _popupManager2 = _interopRequireDefault(_popupManager);
+
+var _scrollbarWidth = require('../scrollbar-width');
+
+var _scrollbarWidth2 = _interopRequireDefault(_scrollbarWidth);
+
+var _dom = require('../dom');
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var idSeed = 1;
+
+var scrollBarWidth = void 0;
+
+exports.default = {
+	props: {
+		visible: {
+			type: Boolean,
+			default: false
+		},
+		openDelay: {},
+		closeDelay: {},
+		zIndex: {},
+		modal: {
+			type: Boolean,
+			default: false
+		},
+		modalFade: {
+			type: Boolean,
+			default: true
+		},
+		modalClass: {},
+		modalAppendToBody: {
+			type: Boolean,
+			default: false
+		},
+		lockScroll: {
+			type: Boolean,
+			default: true
+		},
+		closeOnPressEscape: {
+			type: Boolean,
+			default: false
+		},
+		closeOnClickModal: {
+			type: Boolean,
+			default: false
+		}
+	},
+
+	beforeMount: function beforeMount() {
+		this._popupId = 'popup-' + idSeed++;
+		_popupManager2.default.register(this._popupId, this);
+	},
+	beforeDestroy: function beforeDestroy() {
+		_popupManager2.default.deregister(this._popupId);
+		_popupManager2.default.closeModal(this._popupId);
+
+		this.restoreBodyStyle();
+	},
+	data: function data() {
+		return {
+			opened: false,
+			bodyPaddingRight: null,
+			computedBodyPaddingRight: 0,
+			withoutHiddenClass: true,
+			rendered: false
+		};
+	},
+
+
+	watch: {
+		visible: function visible(val) {
+			var _this = this;
+
+			if (val) {
+				if (this._opening) return;
+				if (!this.rendered) {
+					this.rendered = true;
+					_vue2.default.nextTick(function () {
+						_this.open();
+					});
+				} else {
+					this.open();
+				}
+			} else {
+				this.close();
+			}
+		}
+	},
+
+	methods: {
+		open: function open(options) {
+			var _this2 = this;
+
+			if (!this.rendered) {
+				this.rendered = true;
+			}
+
+			var props = (0, _merge2.default)({}, this.$props || this, options);
+
+			if (this._closeTimer) {
+				clearTimeout(this._closeTimer);
+				this._closeTimer = null;
+			}
+			clearTimeout(this._openTimer);
+
+			var openDelay = Number(props.openDelay);
+			if (openDelay > 0) {
+				this._openTimer = setTimeout(function () {
+					_this2._openTimer = null;
+					_this2.doOpen(props);
+				}, openDelay);
+			} else {
+				this.doOpen(props);
+			}
+		},
+		doOpen: function doOpen(props) {
+			if (this.$isServer) return;
+			if (this.willOpen && !this.willOpen()) return;
+			if (this.opened) return;
+
+			this._opening = true;
+
+			var dom = this.$el;
+
+			var modal = props.modal;
+
+			var zIndex = props.zIndex;
+			if (zIndex) {
+				_popupManager2.default.zIndex = zIndex;
+			}
+
+			if (modal) {
+				if (this._closing) {
+					_popupManager2.default.closeModal(this._popupId);
+					this._closing = false;
+				}
+				_popupManager2.default.openModal(this._popupId, _popupManager2.default.nextZIndex(), this.modalAppendToBody ? undefined : dom, props.modalClass, props.modalFade);
+				if (props.lockScroll) {
+					this.withoutHiddenClass = !(0, _dom.hasClass)(document.body, 'el-popup-parent--hidden');
+					if (this.withoutHiddenClass) {
+						this.bodyPaddingRight = document.body.style.paddingRight;
+						this.computedBodyPaddingRight = parseInt((0, _dom.getStyle)(document.body, 'paddingRight'), 10);
+					}
+					scrollBarWidth = (0, _scrollbarWidth2.default)();
+					var bodyHasOverflow = document.documentElement.clientHeight < document.body.scrollHeight;
+					var bodyOverflowY = (0, _dom.getStyle)(document.body, 'overflowY');
+					if (scrollBarWidth > 0 && (bodyHasOverflow || bodyOverflowY === 'scroll') && this.withoutHiddenClass) {
+						document.body.style.paddingRight = this.computedBodyPaddingRight + scrollBarWidth + 'px';
+					}
+					(0, _dom.addClass)(document.body, 'el-popup-parent--hidden');
+				}
+			}
+
+			if (getComputedStyle(dom).position === 'static') {
+				dom.style.position = 'absolute';
+			}
+
+			dom.style.zIndex = _popupManager2.default.nextZIndex();
+			this.opened = true;
+
+			this.onOpen && this.onOpen();
+
+			this.doAfterOpen();
+		},
+		doAfterOpen: function doAfterOpen() {
+			this._opening = false;
+		},
+		close: function close() {
+			var _this3 = this;
+
+			if (this.willClose && !this.willClose()) return;
+
+			if (this._openTimer !== null) {
+				clearTimeout(this._openTimer);
+				this._openTimer = null;
+			}
+			clearTimeout(this._closeTimer);
+
+			var closeDelay = Number(this.closeDelay);
+
+			if (closeDelay > 0) {
+				this._closeTimer = setTimeout(function () {
+					_this3._closeTimer = null;
+					_this3.doClose();
+				}, closeDelay);
+			} else {
+				this.doClose();
+			}
+		},
+		doClose: function doClose() {
+			this._closing = true;
+
+			this.onClose && this.onClose();
+
+			if (this.lockScroll) {
+				setTimeout(this.restoreBodyStyle, 200);
+			}
+
+			this.opened = false;
+
+			this.doAfterClose();
+		},
+		doAfterClose: function doAfterClose() {
+			_popupManager2.default.closeModal(this._popupId);
+			this._closing = false;
+		},
+		restoreBodyStyle: function restoreBodyStyle() {
+			if (this.modal && this.withoutHiddenClass) {
+				document.body.style.paddingRight = this.bodyPaddingRight;
+				(0, _dom.removeClass)(document.body, 'el-popup-parent--hidden');
+			}
+			this.withoutHiddenClass = true;
+		}
+	}
+};
+exports.PopupManager = _popupManager2.default;

package/lib/utils/popup/popup-manager.js

@@ -0,0 +1,205 @@
+'use strict';
+
+exports.__esModule = true;
+
+var _vue = require('vue');
+
+var _vue2 = _interopRequireDefault(_vue);
+
+var _dom = require('element-ui/lib/utils/dom');
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var hasModal = false;
+var hasInitZIndex = false;
+var zIndex = void 0;
+
+var getModal = function getModal() {
+	if (_vue2.default.prototype.$isServer) return;
+	var modalDom = PopupManager.modalDom;
+	if (modalDom) {
+		hasModal = true;
+	} else {
+		hasModal = false;
+		modalDom = document.createElement('div');
+		PopupManager.modalDom = modalDom;
+
+		modalDom.addEventListener('touchmove', function (event) {
+			event.preventDefault();
+			event.stopPropagation();
+		});
+
+		modalDom.addEventListener('click', function () {
+			PopupManager.doOnModalClick && PopupManager.doOnModalClick();
+		});
+	}
+
+	return modalDom;
+};
+
+var instances = {};
+
+var PopupManager = {
+	modalFade: true,
+
+	getInstance: function getInstance(id) {
+		return instances[id];
+	},
+
+	register: function register(id, instance) {
+		if (id && instance) {
+			instances[id] = instance;
+		}
+	},
+
+	deregister: function deregister(id) {
+		if (id) {
+			instances[id] = null;
+			delete instances[id];
+		}
+	},
+
+	nextZIndex: function nextZIndex() {
+		return PopupManager.zIndex++;
+	},
+
+	modalStack: [],
+
+	doOnModalClick: function doOnModalClick() {
+		var topItem = PopupManager.modalStack[PopupManager.modalStack.length - 1];
+		if (!topItem) return;
+
+		var instance = PopupManager.getInstance(topItem.id);
+		if (instance && instance.closeOnClickModal) {
+			instance.close();
+		}
+	},
+
+	openModal: function openModal(id, zIndex, dom, modalClass, modalFade) {
+		if (_vue2.default.prototype.$isServer) return;
+		if (!id || zIndex === undefined) return;
+		this.modalFade = modalFade;
+
+		var modalStack = this.modalStack;
+
+		for (var i = 0, j = modalStack.length; i < j; i++) {
+			var item = modalStack[i];
+			if (item.id === id) {
+				return;
+			}
+		}
+
+		var modalDom = getModal();
+
+		(0, _dom.addClass)(modalDom, 'v-modal');
+		if (this.modalFade && !hasModal) {
+			(0, _dom.addClass)(modalDom, 'v-modal-enter');
+		}
+		if (modalClass) {
+			var classArr = modalClass.trim().split(/\s+/);
+			classArr.forEach(function (item) {
+				return (0, _dom.addClass)(modalDom, item);
+			});
+		}
+		setTimeout(function () {
+			(0, _dom.removeClass)(modalDom, 'v-modal-enter');
+		}, 200);
+
+		if (dom && dom.parentNode && dom.parentNode.nodeType !== 11) {
+			dom.parentNode.appendChild(modalDom);
+		} else {
+			document.body.appendChild(modalDom);
+		}
+
+		if (zIndex) {
+			modalDom.style.zIndex = zIndex;
+		}
+		modalDom.tabIndex = 0;
+		modalDom.style.display = '';
+
+		this.modalStack.push({ id: id, zIndex: zIndex, modalClass: modalClass });
+	},
+
+	closeModal: function closeModal(id) {
+		var modalStack = this.modalStack;
+		var modalDom = getModal();
+
+		if (modalStack.length > 0) {
+			var topItem = modalStack[modalStack.length - 1];
+			if (topItem.id === id) {
+				if (topItem.modalClass) {
+					var classArr = topItem.modalClass.trim().split(/\s+/);
+					classArr.forEach(function (item) {
+						return (0, _dom.removeClass)(modalDom, item);
+					});
+				}
+
+				modalStack.pop();
+				if (modalStack.length > 0) {
+					modalDom.style.zIndex = modalStack[modalStack.length - 1].zIndex;
+				}
+			} else {
+				for (var i = modalStack.length - 1; i >= 0; i--) {
+					if (modalStack[i].id === id) {
+						modalStack.splice(i, 1);
+						break;
+					}
+				}
+			}
+		}
+
+		if (modalStack.length === 0) {
+			if (this.modalFade) {
+				(0, _dom.addClass)(modalDom, 'v-modal-leave');
+			}
+			setTimeout(function () {
+				if (modalStack.length === 0) {
+					if (modalDom.parentNode) modalDom.parentNode.removeChild(modalDom);
+					modalDom.style.display = 'none';
+					PopupManager.modalDom = undefined;
+				}
+				(0, _dom.removeClass)(modalDom, 'v-modal-leave');
+			}, 200);
+		}
+	}
+};
+
+Object.defineProperty(PopupManager, 'zIndex', {
+	configurable: true,
+	get: function get() {
+		if (!hasInitZIndex) {
+			zIndex = zIndex || (_vue2.default.prototype.$ELEMENT || {}).zIndex || 2000;
+			hasInitZIndex = true;
+		}
+		return zIndex;
+	},
+	set: function set(value) {
+		zIndex = value;
+	}
+});
+
+var getTopPopup = function getTopPopup() {
+	if (_vue2.default.prototype.$isServer) return;
+	if (PopupManager.modalStack.length > 0) {
+		var topPopup = PopupManager.modalStack[PopupManager.modalStack.length - 1];
+		if (!topPopup) return;
+		var instance = PopupManager.getInstance(topPopup.id);
+
+		return instance;
+	}
+};
+
+if (!_vue2.default.prototype.$isServer) {
+	// handle `esc` key when the popup is shown
+	window.addEventListener('keydown', function (event) {
+		if (event.keyCode === 27) {
+			var topPopup = getTopPopup();
+
+			if (topPopup && topPopup.closeOnPressEscape) {
+				topPopup.handleClose ? topPopup.handleClose() : topPopup.handleAction ? topPopup.handleAction('cancel') : topPopup.close();
+			}
+		}
+	});
+}
+
+exports.default = PopupManager;

package/lib/utils/resize-event.js

@@ -0,0 +1,59 @@
+'use strict';
+
+exports.__esModule = true;
+exports.removeResizeListener = exports.addResizeListener = undefined;
+
+var _resizeObserverPolyfill = require('resize-observer-polyfill');
+
+var _resizeObserverPolyfill2 = _interopRequireDefault(_resizeObserverPolyfill);
+
+var _throttleDebounce = require('throttle-debounce');
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var isServer = typeof window === 'undefined';
+
+/* istanbul ignore next */
+var resizeHandler = function resizeHandler(entries) {
+	for (var _iterator = entries, _isArray = Array.isArray(_iterator), _i = 0, _iterator = _isArray ? _iterator : _iterator[Symbol.iterator]();;) {
+		var _ref;
+
+		if (_isArray) {
+			if (_i >= _iterator.length) break;
+			_ref = _iterator[_i++];
+		} else {
+			_i = _iterator.next();
+			if (_i.done) break;
+			_ref = _i.value;
+		}
+
+		var entry = _ref;
+
+		var listeners = entry.target.__resizeListeners__ || [];
+		if (listeners.length) {
+			listeners.forEach(function (fn) {
+				fn();
+			});
+		}
+	}
+};
+
+/* istanbul ignore next */
+var addResizeListener = exports.addResizeListener = function addResizeListener(element, fn) {
+	if (isServer) return;
+	if (!element.__resizeListeners__) {
+		element.__resizeListeners__ = [];
+		element.__ro__ = new _resizeObserverPolyfill2.default((0, _throttleDebounce.debounce)(16, resizeHandler));
+		element.__ro__.observe(element);
+	}
+	element.__resizeListeners__.push(fn);
+};
+
+/* istanbul ignore next */
+var removeResizeListener = exports.removeResizeListener = function removeResizeListener(element, fn) {
+	if (!element || !element.__resizeListeners__) return;
+	element.__resizeListeners__.splice(element.__resizeListeners__.indexOf(fn), 1);
+	if (!element.__resizeListeners__.length) {
+		element.__ro__.disconnect();
+	}
+};

package/lib/utils/scroll-into-view.js

@@ -0,0 +1,38 @@
+'use strict';
+
+exports.__esModule = true;
+exports.default = scrollIntoView;
+
+var _vue = require('vue');
+
+var _vue2 = _interopRequireDefault(_vue);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function scrollIntoView(container, selected) {
+	if (_vue2.default.prototype.$isServer) return;
+
+	if (!selected) {
+		container.scrollTop = 0;
+		return;
+	}
+
+	var offsetParents = [];
+	var pointer = selected.offsetParent;
+	while (pointer && container !== pointer && container.contains(pointer)) {
+		offsetParents.push(pointer);
+		pointer = pointer.offsetParent;
+	}
+	var top = selected.offsetTop + offsetParents.reduce(function (prev, curr) {
+		return prev + curr.offsetTop;
+	}, 0);
+	var bottom = top + selected.offsetHeight;
+	var viewRectTop = container.scrollTop;
+	var viewRectBottom = viewRectTop + container.clientHeight;
+
+	if (top < viewRectTop) {
+		container.scrollTop = top;
+	} else if (bottom > viewRectBottom) {
+		container.scrollTop = bottom - container.clientHeight;
+	}
+}

package/lib/utils/scrollbar-width.js

@@ -0,0 +1,39 @@
+'use strict';
+
+exports.__esModule = true;
+
+exports.default = function () {
+	if (_vue2.default.prototype.$isServer) return 0;
+	if (scrollBarWidth !== undefined) return scrollBarWidth;
+
+	var outer = document.createElement('div');
+	outer.className = 'el-scrollbar__wrap';
+	outer.style.visibility = 'hidden';
+	outer.style.width = '100px';
+	outer.style.position = 'absolute';
+	outer.style.top = '-9999px';
+	document.body.appendChild(outer);
+
+	var widthNoScroll = outer.offsetWidth;
+	outer.style.overflow = 'scroll';
+
+	var inner = document.createElement('div');
+	inner.style.width = '100%';
+	outer.appendChild(inner);
+
+	var widthWithScroll = inner.offsetWidth;
+	outer.parentNode.removeChild(outer);
+	scrollBarWidth = widthNoScroll - widthWithScroll;
+
+	return scrollBarWidth;
+};
+
+var _vue = require('vue');
+
+var _vue2 = _interopRequireDefault(_vue);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var scrollBarWidth = void 0;
+
+;

package/lib/utils/shared.js

@@ -0,0 +1,12 @@
+"use strict";
+
+exports.__esModule = true;
+exports.isDef = isDef;
+exports.isKorean = isKorean;
+function isDef(val) {
+	return val !== undefined && val !== null;
+}
+function isKorean(text) {
+	var reg = /([(\uAC00-\uD7AF)|(\u3130-\u318F)])+/gi;
+	return reg.test(text);
+}

package/lib/utils/types.js

@@ -0,0 +1,52 @@
+'use strict';
+
+exports.__esModule = true;
+exports.isDefined = exports.isUndefined = exports.isFunction = undefined;
+
+var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
+
+exports.isString = isString;
+exports.isObject = isObject;
+exports.isHtmlElement = isHtmlElement;
+
+var _vue = require('vue');
+
+var _vue2 = _interopRequireDefault(_vue);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function isString(obj) {
+	return Object.prototype.toString.call(obj) === '[object String]';
+}
+
+function isObject(obj) {
+	return Object.prototype.toString.call(obj) === '[object Object]';
+}
+
+function isHtmlElement(node) {
+	return node && node.nodeType === Node.ELEMENT_NODE;
+}
+
+/**
+ *  - Inspired:
+ *    https://github.com/jashkenas/underscore/blob/master/modules/isFunction.js
+ */
+var isFunction = function isFunction(functionToCheck) {
+	var getType = {};
+	return functionToCheck && getType.toString.call(functionToCheck) === '[object Function]';
+};
+
+if (typeof /./ !== 'function' && (typeof Int8Array === 'undefined' ? 'undefined' : _typeof(Int8Array)) !== 'object' && (_vue2.default.prototype.$isServer || typeof document.childNodes !== 'function')) {
+	exports.isFunction = isFunction = function isFunction(obj) {
+		return typeof obj === 'function' || false;
+	};
+}
+
+exports.isFunction = isFunction;
+var isUndefined = exports.isUndefined = function isUndefined(val) {
+	return val === void 0;
+};
+
+var isDefined = exports.isDefined = function isDefined(val) {
+	return val !== undefined && val !== null;
+};