cy-element-ui 1.0.0

package/packages/theme-cy/README.md

@@ -0,0 +1,38 @@
+# element-theme-chalk
+
+> element component chalk theme.
+
+## Installation
+
+```shell
+npm i element-theme-chalk -S
+```
+
+## Usage
+
+Use Sass import
+
+```css
+@import 'element-theme-chalk';
+```
+
+Or Use webpack
+
+```javascript
+import 'element-theme-chalk';
+```
+
+Or
+
+```html
+<link rel="stylesheet" href="path/to/node_modules/element-theme-chalk/lib/index.css">
+```
+
+## Import on demand
+
+```javascript
+import 'element-theme-chalk/lib/input.css';
+import 'element-theme-chalk/lib/select.css';
+
+// ...
+```

package/packages/theme-cy/package.json

@@ -0,0 +1,35 @@
+{
+	"name": "element-theme-chalk",
+	"version": "2.15.14",
+	"description": "Element component chalk theme.",
+	"main": "lib/index.css",
+	"style": "lib/index.css",
+	"files": [
+		"lib",
+		"src"
+	],
+	"scripts": {
+		"build": "gulp build"
+	},
+	"repository": {
+		"type": "git",
+		"url": "git+https://github.com/ElementUI/theme-chalk.git"
+	},
+	"keywords": [
+		"element",
+		"theme"
+	],
+	"author": "yi.shyang@ele.me",
+	"license": "MIT",
+	"bugs": {
+		"url": "https://github.com/ElementUI/theme-chalk/issues"
+	},
+	"homepage": "https://github.com/ElementUI/theme-chalk#readme",
+	"devDependencies": {
+		"gulp": "^3.9.1",
+		"gulp-cssmin": "^0.1.7",
+		"gulp-sass": "^3.1.0",
+		"gulp-autoprefixer": "^4.0.0"
+	},
+	"dependencies": {}
+}

package/packages/theme-cy/src/index.scss

@@ -0,0 +1,2 @@
+/* Automatically generated by './build/bin/gen-cssfile.js' */
+@import "./treeselect.scss";

package/packages/theme-cy/src/treeselect.scss

@@ -0,0 +1,4 @@
+@import "./base.scss";
+
+.cy-treeselect {
+}

package/packages/time-picker/index.js

@@ -0,0 +1,8 @@
+import TimePicker from '../date-picker/src/picker/time-picker';
+
+/* istanbul ignore next */
+TimePicker.install = function(Vue) {
+	Vue.component(TimePicker.name, TimePicker);
+};
+
+export default TimePicker;

package/packages/time-select/index.js

@@ -0,0 +1,8 @@
+import TimeSelect from '../date-picker/src/picker/time-select';
+
+/* istanbul ignore next */
+TimeSelect.install = function(Vue) {
+	Vue.component(TimeSelect.name, TimeSelect);
+};
+
+export default TimeSelect;

package/packages/timeline/index.js

@@ -0,0 +1,8 @@
+import Timeline from './src/main';
+
+/* istanbul ignore next */
+Timeline.install = function(Vue) {
+	Vue.component(Timeline.name, Timeline);
+};
+
+export default Timeline;

package/packages/timeline/src/item.vue

@@ -0,0 +1,73 @@
+<template>
+	<li class="el-timeline-item">
+		<div class="el-timeline-item__tail"></div>
+
+		<div v-if="!$slots.dot"
+			class="el-timeline-item__node"
+			:class="[
+				`el-timeline-item__node--${size || ''}`,
+				`el-timeline-item__node--${type || ''}`
+			]"
+			:style="{
+				backgroundColor: color
+			}"
+		>
+			<i v-if="icon"
+				class="el-timeline-item__icon"
+				:class="icon"
+			></i>
+		</div>
+		<div v-if="$slots.dot" class="el-timeline-item__dot">
+			<slot name="dot"></slot>
+		</div>
+
+		<div class="el-timeline-item__wrapper">
+			<div v-if="!hideTimestamp && placement === 'top'"
+				class="el-timeline-item__timestamp is-top">
+				{{timestamp}}
+			</div>
+
+			<div class="el-timeline-item__content">
+				<slot></slot>
+			</div>
+
+			<div v-if="!hideTimestamp && placement === 'bottom'"
+				class="el-timeline-item__timestamp is-bottom">
+				{{timestamp}}
+			</div>
+		</div>
+	</li>
+</template>
+
+<script>
+	export default {
+		name: 'ElTimelineItem',
+
+		inject: ['timeline'],
+
+		props: {
+			timestamp: String,
+
+			hideTimestamp: {
+				type: Boolean,
+				default: false
+			},
+
+			placement: {
+				type: String,
+				default: 'bottom'
+			},
+
+			type: String,
+
+			color: String,
+
+			size: {
+				type: String,
+				default: 'normal'
+			},
+
+			icon: String
+		}
+	};
+</script>

package/packages/timeline/src/main.vue

@@ -0,0 +1,33 @@
+<script>
+	export default {
+		name: 'ElTimeline',
+
+		props: {
+			reverse: {
+				type: Boolean,
+				default: false
+			}
+		},
+
+		provide() {
+			return {
+				timeline: this
+			};
+		},
+
+		render() {
+			const reverse = this.reverse;
+			const classes = {
+				'el-timeline': true,
+				'is-reverse': reverse
+			};
+			let slots = this.$slots.default || [];
+			if (reverse) {
+				slots = slots.reverse();
+			}
+			return (<ul class={ classes }>
+				{ slots }
+			</ul>);
+		}
+	};
+</script>

package/packages/timeline-item/index.js

@@ -0,0 +1,8 @@
+import ElTimelineItem from '../timeline/src/item';
+
+/* istanbul ignore next */
+ElTimelineItem.install = function(Vue) {
+	Vue.component(ElTimelineItem.name, ElTimelineItem);
+};
+
+export default ElTimelineItem;

package/packages/tooltip/index.js

@@ -0,0 +1,8 @@
+import Tooltip from './src/main';
+
+/* istanbul ignore next */
+Tooltip.install = function(Vue) {
+	Vue.component(Tooltip.name, Tooltip);
+};
+
+export default Tooltip;

package/packages/tooltip/src/main.js

@@ -0,0 +1,242 @@
+import Popper from 'element-ui/src/utils/vue-popper';
+import debounce from 'throttle-debounce/debounce';
+import { addClass, removeClass, on, off } from 'element-ui/src/utils/dom';
+import { generateId } from 'element-ui/src/utils/util';
+import Vue from 'vue';
+
+export default {
+	name: 'ElTooltip',
+
+	mixins: [Popper],
+
+	props: {
+		openDelay: {
+			type: Number,
+			default: 0
+		},
+		disabled: Boolean,
+		manual: Boolean,
+		effect: {
+			type: String,
+			default: 'dark'
+		},
+		arrowOffset: {
+			type: Number,
+			default: 0
+		},
+		popperClass: String,
+		content: String,
+		visibleArrow: {
+			default: true
+		},
+		transition: {
+			type: String,
+			default: 'el-fade-in-linear'
+		},
+		popperOptions: {
+			default() {
+				return {
+					boundariesPadding: 10,
+					gpuAcceleration: false
+				};
+			}
+		},
+		enterable: {
+			type: Boolean,
+			default: true
+		},
+		hideAfter: {
+			type: Number,
+			default: 0
+		},
+		tabindex: {
+			type: Number,
+			default: 0
+		}
+	},
+
+	data() {
+		return {
+			tooltipId: `el-tooltip-${generateId()}`,
+			timeoutPending: null,
+			focusing: false
+		};
+	},
+	beforeCreate() {
+		if (this.$isServer) return;
+
+		this.popperVM = new Vue({
+			data: { node: '' },
+			render(h) {
+				return this.node;
+			}
+		}).$mount();
+
+		this.debounceClose = debounce(200, () => this.handleClosePopper());
+	},
+
+	render(h) {
+		if (this.popperVM) {
+			this.popperVM.node = (
+				<transition
+					name={ this.transition }
+					onAfterLeave={ this.doDestroy }>
+					<div
+						onMouseleave={ () => { this.setExpectedState(false); this.debounceClose(); } }
+						onMouseenter= { () => { this.setExpectedState(true); } }
+						ref="popper"
+						role="tooltip"
+						id={this.tooltipId}
+						aria-hidden={ (this.disabled || !this.showPopper) ? 'true' : 'false' }
+						v-show={!this.disabled && this.showPopper}
+						class={
+							['el-tooltip__popper', 'is-' + this.effect, this.popperClass]
+						}>
+						{ this.$slots.content || this.content }
+					</div>
+				</transition>);
+		}
+
+		const firstElement = this.getFirstElement();
+		if (!firstElement) return null;
+
+		const data = firstElement.data = firstElement.data || {};
+		data.staticClass = this.addTooltipClass(data.staticClass);
+
+		return firstElement;
+	},
+
+	mounted() {
+		this.referenceElm = this.$el;
+		if (this.$el.nodeType === 1) {
+			this.$el.setAttribute('aria-describedby', this.tooltipId);
+			this.$el.setAttribute('tabindex', this.tabindex);
+			on(this.referenceElm, 'mouseenter', this.show);
+			on(this.referenceElm, 'mouseleave', this.hide);
+			on(this.referenceElm, 'focus', () => {
+				if (!this.$slots.default || !this.$slots.default.length) {
+					this.handleFocus();
+					return;
+				}
+				const instance = this.$slots.default[0].componentInstance;
+				if (instance && instance.focus) {
+					instance.focus();
+				} else {
+					this.handleFocus();
+				}
+			});
+			on(this.referenceElm, 'blur', this.handleBlur);
+			on(this.referenceElm, 'click', this.removeFocusing);
+		}
+		// fix issue https://github.com/ElemeFE/element/issues/14424
+		if (this.value && this.popperVM) {
+			this.popperVM.$nextTick(() => {
+				if (this.value) {
+					this.updatePopper();
+				}
+			});
+		}
+	},
+	watch: {
+		focusing(val) {
+			if (val) {
+				addClass(this.referenceElm, 'focusing');
+			} else {
+				removeClass(this.referenceElm, 'focusing');
+			}
+		}
+	},
+	methods: {
+		show() {
+			this.setExpectedState(true);
+			this.handleShowPopper();
+		},
+
+		hide() {
+			this.setExpectedState(false);
+			this.debounceClose();
+		},
+		handleFocus() {
+			this.focusing = true;
+			this.show();
+		},
+		handleBlur() {
+			this.focusing = false;
+			this.hide();
+		},
+		removeFocusing() {
+			this.focusing = false;
+		},
+
+		addTooltipClass(prev) {
+			if (!prev) {
+				return 'el-tooltip';
+			} else {
+				return 'el-tooltip ' + prev.replace('el-tooltip', '');
+			}
+		},
+
+		handleShowPopper() {
+			if (!this.expectedState || this.manual) return;
+			clearTimeout(this.timeout);
+			this.timeout = setTimeout(() => {
+				this.showPopper = true;
+			}, this.openDelay);
+
+			if (this.hideAfter > 0) {
+				this.timeoutPending = setTimeout(() => {
+					this.showPopper = false;
+				}, this.hideAfter);
+			}
+		},
+
+		handleClosePopper() {
+			if (this.enterable && this.expectedState || this.manual) return;
+			clearTimeout(this.timeout);
+
+			if (this.timeoutPending) {
+				clearTimeout(this.timeoutPending);
+			}
+			this.showPopper = false;
+
+			if (this.disabled) {
+				this.doDestroy();
+			}
+		},
+
+		setExpectedState(expectedState) {
+			if (expectedState === false) {
+				clearTimeout(this.timeoutPending);
+			}
+			this.expectedState = expectedState;
+		},
+
+		getFirstElement() {
+			const slots = this.$slots.default;
+			if (!Array.isArray(slots)) return null;
+			let element = null;
+			for (let index = 0; index < slots.length; index++) {
+				if (slots[index] && slots[index].tag) {
+					element = slots[index];
+					break;
+				};
+			}
+			return element;
+		}
+	},
+
+	beforeDestroy() {
+		this.popperVM && this.popperVM.$destroy();
+	},
+
+	destroyed() {
+		const reference = this.referenceElm;
+		if (reference.nodeType === 1) {
+			off(reference, 'mouseenter', this.show);
+			off(reference, 'mouseleave', this.hide);
+			off(reference, 'focus', this.handleFocus);
+			off(reference, 'blur', this.handleBlur);
+			off(reference, 'click', this.removeFocusing);
+		}
+	}
+};

package/packages/transfer/index.js

@@ -0,0 +1,8 @@
+import Transfer from './src/main';
+
+/* istanbul ignore next */
+Transfer.install = function(Vue) {
+	Vue.component(Transfer.name, Transfer);
+};
+
+export default Transfer;