cy-element-ui 1.0.0

package/src/utils/util.js

@@ -0,0 +1,245 @@
+import Vue from 'vue';
+import { isString, isObject } from 'element-ui/src/utils/types';
+
+const hasOwnProperty = Object.prototype.hasOwnProperty;
+
+export function noop() {};
+
+export function hasOwn(obj, key) {
+	return hasOwnProperty.call(obj, key);
+};
+
+function extend(to, _from) {
+	for (let key in _from) {
+		to[key] = _from[key];
+	}
+	return to;
+};
+
+export function toObject(arr) {
+	var res = {};
+	for (let i = 0; i < arr.length; i++) {
+		if (arr[i]) {
+			extend(res, arr[i]);
+		}
+	}
+	return res;
+};
+
+export const getValueByPath = function(object, prop) {
+	prop = prop || '';
+	const paths = prop.split('.');
+	let current = object;
+	let result = null;
+	for (let i = 0, j = paths.length; i < j; i++) {
+		const path = paths[i];
+		if (!current) break;
+
+		if (i === j - 1) {
+			result = current[path];
+			break;
+		}
+		current = current[path];
+	}
+	return result;
+};
+
+export function getPropByPath(obj, path, strict) {
+	let tempObj = obj;
+	path = path.replace(/\[(\w+)\]/g, '.$1');
+	path = path.replace(/^\./, '');
+
+	let keyArr = path.split('.');
+	let i = 0;
+	for (let len = keyArr.length; i < len - 1; ++i) {
+		if (!tempObj && !strict) break;
+		let key = keyArr[i];
+		if (key in tempObj) {
+			tempObj = tempObj[key];
+		} else {
+			if (strict) {
+				throw new Error('please transfer a valid prop path to form item!');
+			}
+			break;
+		}
+	}
+	return {
+		o: tempObj,
+		k: keyArr[i],
+		v: tempObj ? tempObj[keyArr[i]] : null
+	};
+};
+
+export const generateId = function() {
+	return Math.floor(Math.random() * 10000);
+};
+
+export const valueEquals = (a, b) => {
+	// see: https://stackoverflow.com/questions/3115982/how-to-check-if-two-arrays-are-equal-with-javascript
+	if (a === b) return true;
+	if (!(a instanceof Array)) return false;
+	if (!(b instanceof Array)) return false;
+	if (a.length !== b.length) return false;
+	for (let i = 0; i !== a.length; ++i) {
+		if (a[i] !== b[i]) return false;
+	}
+	return true;
+};
+
+export const escapeRegexpString = (value = '') => String(value).replace(/[|\\{}()[\]^$+*?.]/g, '\\$&');
+
+// TODO: use native Array.find, Array.findIndex when IE support is dropped
+export const arrayFindIndex = function(arr, pred) {
+	for (let i = 0; i !== arr.length; ++i) {
+		if (pred(arr[i])) {
+			return i;
+		}
+	}
+	return -1;
+};
+
+export const arrayFind = function(arr, pred) {
+	const idx = arrayFindIndex(arr, pred);
+	return idx !== -1 ? arr[idx] : undefined;
+};
+
+// coerce truthy value to array
+export const coerceTruthyValueToArray = function(val) {
+	if (Array.isArray(val)) {
+		return val;
+	} else if (val) {
+		return [val];
+	} else {
+		return [];
+	}
+};
+
+export const isIE = function() {
+	return !Vue.prototype.$isServer && !isNaN(Number(document.documentMode));
+};
+
+export const isEdge = function() {
+	return !Vue.prototype.$isServer && navigator.userAgent.indexOf('Edge') > -1;
+};
+
+export const isFirefox = function() {
+	return !Vue.prototype.$isServer && !!window.navigator.userAgent.match(/firefox/i);
+};
+
+export const autoprefixer = function(style) {
+	if (typeof style !== 'object') return style;
+	const rules = ['transform', 'transition', 'animation'];
+	const prefixes = ['ms-', 'webkit-'];
+	rules.forEach(rule => {
+		const value = style[rule];
+		if (rule && value) {
+			prefixes.forEach(prefix => {
+				style[prefix + rule] = value;
+			});
+		}
+	});
+	return style;
+};
+
+export const kebabCase = function(str) {
+	const hyphenateRE = /([^-])([A-Z])/g;
+	return str
+		.replace(hyphenateRE, '$1-$2')
+		.replace(hyphenateRE, '$1-$2')
+		.toLowerCase();
+};
+
+export const capitalize = function(str) {
+	if (!isString(str)) return str;
+	return str.charAt(0).toUpperCase() + str.slice(1);
+};
+
+export const looseEqual = function(a, b) {
+	const isObjectA = isObject(a);
+	const isObjectB = isObject(b);
+	if (isObjectA && isObjectB) {
+		return JSON.stringify(a) === JSON.stringify(b);
+	} else if (!isObjectA && !isObjectB) {
+		return String(a) === String(b);
+	} else {
+		return false;
+	}
+};
+
+export const arrayEquals = function(arrayA, arrayB) {
+	arrayA = arrayA || [];
+	arrayB = arrayB || [];
+
+	if (arrayA.length !== arrayB.length) {
+		return false;
+	}
+
+	for (let i = 0; i < arrayA.length; i++) {
+		if (!looseEqual(arrayA[i], arrayB[i])) {
+			return false;
+		}
+	}
+
+	return true;
+};
+
+export const isEqual = function(value1, value2) {
+	if (Array.isArray(value1) && Array.isArray(value2)) {
+		return arrayEquals(value1, value2);
+	}
+	return looseEqual(value1, value2);
+};
+
+export const isEmpty = function(val) {
+	// null or undefined
+	if (val == null) return true;
+
+	if (typeof val === 'boolean') return false;
+
+	if (typeof val === 'number') return !val;
+
+	if (val instanceof Error) return val.message === '';
+
+	switch (Object.prototype.toString.call(val)) {
+		// String or Array
+		case '[object String]':
+		case '[object Array]':
+			return !val.length;
+
+			// Map or Set or File
+		case '[object File]':
+		case '[object Map]':
+		case '[object Set]': {
+			return !val.size;
+		}
+		// Plain Object
+		case '[object Object]': {
+			return !Object.keys(val).length;
+		}
+	}
+
+	return false;
+};
+
+export function rafThrottle(fn) {
+	let locked = false;
+	return function(...args) {
+		if (locked) return;
+		locked = true;
+		window.requestAnimationFrame(_ => {
+			fn.apply(this, args);
+			locked = false;
+		});
+	};
+}
+
+export function objToArray(obj) {
+	if (Array.isArray(obj)) {
+		return obj;
+	}
+	return isEmpty(obj) ? [] : [obj];
+}
+
+export const isMac = function() {
+	return !Vue.prototype.$isServer && /macintosh|mac os x/i.test(navigator.userAgent);
+};

package/src/utils/vdom.js

@@ -0,0 +1,5 @@
+import { hasOwn } from 'element-ui/src/utils/util';
+
+export function isVNode(node) {
+	return node !== null && typeof node === 'object' && hasOwn(node, 'componentOptions');
+};

package/src/utils/vue-popper.js

@@ -0,0 +1,198 @@
+import Vue from 'vue';
+import {
+	PopupManager
+} from 'element-ui/src/utils/popup';
+
+const PopperJS = Vue.prototype.$isServer ? function() {} : require('./popper');
+const stop = e => e.stopPropagation();
+
+/**
+ * @param {HTMLElement} [reference=$refs.reference] - The reference element used to position the popper.
+ * @param {HTMLElement} [popper=$refs.popper] - The HTML element used as popper, or a configuration used to generate the popper.
+ * @param {String} [placement=button] - Placement of the popper accepted values: top(-start, -end), right(-start, -end), bottom(-start, -end), left(-start, -end)
+ * @param {Number} [offset=0] - Amount of pixels the popper will be shifted (can be negative).
+ * @param {Boolean} [visible=false] Visibility of the popup element.
+ * @param {Boolean} [visible-arrow=false] Visibility of the arrow, no style.
+ */
+export default {
+	props: {
+		transformOrigin: {
+			type: [Boolean, String],
+			default: true
+		},
+		placement: {
+			type: String,
+			default: 'bottom'
+		},
+		boundariesPadding: {
+			type: Number,
+			default: 5
+		},
+		reference: {},
+		popper: {},
+		offset: {
+			default: 0
+		},
+		value: Boolean,
+		visibleArrow: Boolean,
+		arrowOffset: {
+			type: Number,
+			default: 35
+		},
+		appendToBody: {
+			type: Boolean,
+			default: true
+		},
+		popperOptions: {
+			type: Object,
+			default() {
+				return {
+					gpuAcceleration: false
+				};
+			}
+		}
+	},
+
+	data() {
+		return {
+			showPopper: false,
+			currentPlacement: ''
+		};
+	},
+
+	watch: {
+		value: {
+			immediate: true,
+			handler(val) {
+				this.showPopper = val;
+				this.$emit('input', val);
+			}
+		},
+
+		showPopper(val) {
+			if (this.disabled) return;
+			val ? this.updatePopper() : this.destroyPopper();
+			this.$emit('input', val);
+		}
+	},
+
+	methods: {
+		createPopper() {
+			if (this.$isServer) return;
+			this.currentPlacement = this.currentPlacement || this.placement;
+			if (!/^(top|bottom|left|right)(-start|-end)?$/g.test(this.currentPlacement)) {
+				return;
+			}
+
+			const options = this.popperOptions;
+			const popper = this.popperElm = this.popperElm || this.popper || this.$refs.popper;
+			let reference = this.referenceElm = this.referenceElm || this.reference || this.$refs.reference;
+
+			if (!reference &&
+        this.$slots.reference &&
+        this.$slots.reference[0]) {
+				reference = this.referenceElm = this.$slots.reference[0].elm;
+			}
+
+			if (!popper || !reference) return;
+			if (this.visibleArrow) this.appendArrow(popper);
+			if (this.appendToBody) document.body.appendChild(this.popperElm);
+			if (this.popperJS && this.popperJS.destroy) {
+				this.popperJS.destroy();
+			}
+
+			options.placement = this.currentPlacement;
+			options.offset = this.offset;
+			options.arrowOffset = this.arrowOffset;
+			this.popperJS = new PopperJS(reference, popper, options);
+			this.popperJS.onCreate(_ => {
+				this.$emit('created', this);
+				this.resetTransformOrigin();
+				this.$nextTick(this.updatePopper);
+			});
+			if (typeof options.onUpdate === 'function') {
+				this.popperJS.onUpdate(options.onUpdate);
+			}
+			this.popperJS._popper.style.zIndex = PopupManager.nextZIndex();
+			this.popperElm.addEventListener('click', stop);
+		},
+
+		updatePopper() {
+			const popperJS = this.popperJS;
+			if (popperJS) {
+				popperJS.update();
+				if (popperJS._popper) {
+					popperJS._popper.style.zIndex = PopupManager.nextZIndex();
+				}
+			} else {
+				this.createPopper();
+			}
+		},
+
+		doDestroy(forceDestroy) {
+			/* istanbul ignore if */
+			if (!this.popperJS || (this.showPopper && !forceDestroy)) return;
+			this.popperJS.destroy();
+			this.popperJS = null;
+		},
+
+		destroyPopper() {
+			if (this.popperJS) {
+				this.resetTransformOrigin();
+			}
+		},
+
+		resetTransformOrigin() {
+			if (!this.transformOrigin) return;
+			let placementMap = {
+				top: 'bottom',
+				bottom: 'top',
+				left: 'right',
+				right: 'left'
+			};
+			let placement = this.popperJS._popper.getAttribute('x-placement').split('-')[0];
+			let origin = placementMap[placement];
+			this.popperJS._popper.style.transformOrigin = typeof this.transformOrigin === 'string'
+				? this.transformOrigin
+				: ['top', 'bottom'].indexOf(placement) > -1 ? `center ${ origin }` : `${ origin } center`;
+		},
+
+		appendArrow(element) {
+			let hash;
+			if (this.appended) {
+				return;
+			}
+
+			this.appended = true;
+
+			for (let item in element.attributes) {
+				if (/^_v-/.test(element.attributes[item].name)) {
+					hash = element.attributes[item].name;
+					break;
+				}
+			}
+
+			const arrow = document.createElement('div');
+
+			if (hash) {
+				arrow.setAttribute(hash, '');
+			}
+			arrow.setAttribute('x-arrow', '');
+			arrow.className = 'popper__arrow';
+			element.appendChild(arrow);
+		}
+	},
+
+	beforeDestroy() {
+		this.doDestroy(true);
+		if (this.popperElm && this.popperElm.parentNode === document.body) {
+			this.popperElm.removeEventListener('click', stop);
+			document.body.removeChild(this.popperElm);
+		}
+	},
+
+	// call destroy in keep-alive mode
+	deactivated() {
+		this.$options.beforeDestroy[0].call(this);
+	}
+};

package/types/alert.d.ts

@@ -0,0 +1,31 @@
+import { ElementUIComponent } from './component'
+
+export type AlertType = 'success' | 'warning' | 'info' | 'error'
+export type AlertEffect = 'dark' | 'light'
+
+/** Alert Component */
+export declare class ElAlert extends ElementUIComponent {
+  /** Title */
+  title: string
+
+  /** Component type */
+  type: AlertType
+
+  /** Descriptive text. Can also be passed with the default slot */
+  description: string
+
+  /** If closable or not */
+  closable: boolean
+
+  /** whether to center the text */
+  center: boolean
+
+  /** Customized close button text */
+  closeText: string
+
+  /** If a type icon is displayed */
+  showIcon: boolean
+
+  /** Choose effect */
+  effect: AlertEffect
+}

package/types/aside.d.ts

@@ -0,0 +1,7 @@
+import { ElementUIComponent } from './component'
+
+/** Aside Component */
+export declare class ElAside extends ElementUIComponent {
+  /** Width of the side section */
+  width: string
+}

package/types/autocomplete.d.ts

@@ -0,0 +1,78 @@
+import { ElementUIComponent } from './component'
+
+export type SuggestionPlacement = 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end'
+
+export interface FetchSuggestionsCallback {
+  /**
+   * Callback function used in fetch-suggestions function
+   *
+   * @param data Suggestions to use
+   */
+  (data: any[]): void
+}
+
+export interface FetchSuggestions {
+  /**
+   * The function passed into the fetch-suggestions property
+   *
+   * @param queryString Current value of the text input
+   * @param callback Callback function used to indicate that suggestions have completely fetched
+   */
+  (queryString: string, callback: FetchSuggestionsCallback): void
+}
+
+/** Autocomplete Component */
+export declare class ElAutocomplete extends ElementUIComponent {
+  /** The placeholder of Autocomplete */
+  placeholder: string
+
+  /** Whether to show clear button */
+  clearable: boolean
+
+  /** Whether Autocomplete is disabled */
+  disabled: boolean
+
+  /** Binding value */
+  value: string
+
+  /** Debounce delay when typing */
+  debounce: number
+
+  /** Placement of the popup menu */
+  placement: SuggestionPlacement
+
+  /** Name for the inner native input */
+  name: string
+
+  /** Key name of the input suggestion object for display */
+  valueKey: string
+
+  /** Whether to emit select event on enter when there is no autocomplete match */
+  selectWhenUnmatched: boolean
+
+  /** A method to fetch input suggestions. When suggestions are ready, invoke callback(data:[]) to return them to Autocomplete */
+  fetchSuggestions: FetchSuggestions
+
+  /** Custom class name for autocomplete's dropdown */
+  popperClass: string
+
+  /** Whether show suggestions when input focus */
+  triggerOnFocus: boolean
+
+  /** Prefix icon class */
+  prefixIcon: string
+
+  /** Suffix icon class */
+  suffixIcon: string
+
+  /** Whether to hide the loading icon in remote search */
+  hideLoading: boolean
+
+  /** Whether to append the dropdown to body */
+  popperAppendToBody: boolean
+
+  /**
+   * Focus the Input component
+   */
+  focus (): void
+}

package/types/avatar.d.ts

@@ -0,0 +1,20 @@
+import { ElementUIComponent } from './component'
+
+/** Avatar Component */
+export declare class ElAvatar extends ElementUIComponent {
+  icon: string;
+
+  size: string | number;
+
+  shape: string;
+
+  src: string;
+
+  error: () => false;
+
+  srcSet: string;
+
+  alt: string;
+
+  fit: string;
+}

package/types/backtop.d.ts

@@ -0,0 +1,16 @@
+import { ElementUIComponent } from './component'
+
+/** Backtop Component */
+export declare class ElBacktop extends ElementUIComponent {
+  /** Backtop target */
+  target: string
+  
+  /** Backtop visibility height */
+  visibilityHeight: string | number
+
+  /** Backtop right position */
+  right: string | number
+
+  /** Backtop bottom position */
+  bottom: string | number
+}

package/types/badge.d.ts

@@ -0,0 +1,16 @@
+import { ElementUIComponent } from './component'
+
+/** Badge Component */
+export declare class ElBadge extends ElementUIComponent {
+  /** Display value */
+  value: string | number
+
+  /** Maximum value, shows '{max}+' when exceeded. Only works if `value` is a number */
+  max: number
+
+  /** If a little dot is displayed */
+  isDot: boolean
+
+  /** Hidden badge */
+  hidden: boolean
+}

package/types/breadcrumb-item.d.ts

@@ -0,0 +1,10 @@
+import { ElementUIComponent } from './component'
+
+/** Breadcrumb Item Component */
+export declare class ElBreadcrumbItem extends ElementUIComponent {
+  /** Target route of the link, same as to of vue-router */
+  to: string | object
+
+  /** If true, the navigation will not leave a history record */
+  replace: boolean
+}

package/types/breadcrumb.d.ts

@@ -0,0 +1,10 @@
+import { ElementUIComponent } from './component'
+
+/** Displays the location of the current page, making it easier to browser back */
+export declare class ElBreadcrumb extends ElementUIComponent {
+  /** Separator character */
+  separator: string
+
+  /** Class name of the icon separator */
+  separatorClass: string
+}

package/types/button-group.d.ts

@@ -0,0 +1,4 @@
+import { ElementUIComponent } from './component'
+
+/** Button Group Component */
+export declare class ElButtonGroup extends ElementUIComponent {}

package/types/button.d.ts

@@ -0,0 +1,37 @@
+import { ElementUIComponent, ElementUIComponentSize } from './component'
+
+/** Button type */
+export type ButtonType = 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'text'
+
+/** Same as native button's type */
+export type ButtonNativeType = 'button' | 'submit' | 'reset' | 'menu'
+
+/** Button Component */
+export declare class ElButton extends ElementUIComponent {
+  /** Button size */
+  size: ElementUIComponentSize
+
+  /** Button type */
+  type: ButtonType
+
+  /** Determine whether it's a plain button */
+  plain: boolean
+
+  /** Determine whether it's a round button */
+  round: boolean
+
+  /** Determine whether it's loading */
+  loading: boolean
+
+  /** Disable the button */
+  disabled: boolean
+
+  /** Button icon, accepts an icon name of Element icon component */
+  icon: string
+
+  /** Same as native button's autofocus */
+  autofocus: boolean
+
+  /** Same as native button's type */
+  nativeType: ButtonNativeType
+}

package/types/calendar.d.ts

@@ -0,0 +1,15 @@
+import { ElementUIComponent } from './component'
+
+export type DateType = Date | String | Number
+
+/** Calendar Component */
+export declare class ElCalendar extends ElementUIComponent {
+  /** Binding value */
+  value: DateType
+
+  /** Specify the display range of the calendar */
+  range: DateType[]
+
+  /** First day of week */
+  firstDayOfWeek: number
+}