@mdsfe/mds-ui 0.2.0 → 0.2.9-rc.1

package/dist/timepicker.js

@@ -1,13 +1,13 @@
 (function webpackUniversalModuleDefinition(root, factory) {
 	if(typeof exports === 'object' && typeof module === 'object')
-		module.exports = factory(require("./_util/proptype"), require("./icon"), require("vue"), require("./_mixin/emitter"), require("./transition"), require("./_mixin/popper"));
+		module.exports = factory(require("vue"), require("./_util/proptype"), require("./icon"), require("./transition"), require("./_mixin/emitter"), require("./button"));
 	else if(typeof define === 'function' && define.amd)
-		define(["./_util/proptype", "./icon", "vue", "./_mixin/emitter", "./transition", "./_mixin/popper"], factory);
+		define(["vue", "./_util/proptype", "./icon", "./transition", "./_mixin/emitter", "./button"], factory);
 	else {
-		var a = typeof exports === 'object' ? factory(require("./_util/proptype"), require("./icon"), require("vue"), require("./_mixin/emitter"), require("./transition"), require("./_mixin/popper")) : factory(root["./_util/proptype"], root["./icon"], root["Vue"], root["./_mixin/emitter"], root["./transition"], root["./_mixin/popper"]);
+		var a = typeof exports === 'object' ? factory(require("vue"), require("./_util/proptype"), require("./icon"), require("./transition"), require("./_mixin/emitter"), require("./button")) : factory(root["Vue"], root["./_util/proptype"], root["./icon"], root["./transition"], root["./_mixin/emitter"], root["./button"]);
 		for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
 	}
-})(window, function(__WEBPACK_EXTERNAL_MODULE__3__, __WEBPACK_EXTERNAL_MODULE__4__, __WEBPACK_EXTERNAL_MODULE__5__, __WEBPACK_EXTERNAL_MODULE__6__, __WEBPACK_EXTERNAL_MODULE__13__, __WEBPACK_EXTERNAL_MODULE__44__) {
+})(window, function(__WEBPACK_EXTERNAL_MODULE__2__, __WEBPACK_EXTERNAL_MODULE__7__, __WEBPACK_EXTERNAL_MODULE__8__, __WEBPACK_EXTERNAL_MODULE__11__, __WEBPACK_EXTERNAL_MODULE__12__, __WEBPACK_EXTERNAL_MODULE__13__) {
 return /******/ (function(modules) { // webpackBootstrap
 /******/ 	// The module cache
 /******/ 	var installedModules = {};
@@ -91,7 +91,7 @@ return /******/ (function(modules) { // webpackBootstrap
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 87);
+/******/ 	return __webpack_require__(__webpack_require__.s = 94);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -204,76 +204,2657 @@ function normalizeComponent (
 /***/ }),
 
 /***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "g", function() { return on; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "f", function() { return off; });
+/* unused harmony export once */
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "d", function() { return hasClass; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return addClass; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "h", function() { return removeClass; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return getStyle; });
+/* unused harmony export setStyle */
+/* unused harmony export isScroll */
+/* unused harmony export getScrollContainer */
+/* unused harmony export isInContainer */
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "e", function() { return merge; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return getScrollBarWidth; });
+/* harmony import */ var babel_runtime_helpers_typeof__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9);
+/* harmony import */ var babel_runtime_helpers_typeof__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babel_runtime_helpers_typeof__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(2);
+/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(vue__WEBPACK_IMPORTED_MODULE_1__);
+
+
+
+/* eslint-disable */
+var isServer = vue__WEBPACK_IMPORTED_MODULE_1___default.a.prototype.$isServer;
+var SPECIAL_CHARS_REGEXP = /([\:\-\_]+(.))/g;
+var MOZ_HACK_REGEXP = /^moz([A-Z])/;
+var ieVersion = isServer ? 0 : Number(document.documentMode);
+
+/* istanbul ignore next */
+var trim = function trim(string) {
+  return (string || '').replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, '');
+};
+/* istanbul ignore next */
+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');
+};
+
+/* istanbul ignore next */
+var on = function () {
+  if (!isServer && document.addEventListener) {
+    return function (element, event, handler) {
+      if (element && event && handler) {
+        element.addEventListener(event, handler, false);
+      }
+    };
+  } else {
+    return function (element, event, handler) {
+      if (element && event && handler) {
+        element.attachEvent('on' + event, handler);
+      }
+    };
+  }
+}();
+
+/* istanbul ignore next */
+var off = function () {
+  if (!isServer && document.removeEventListener) {
+    return function (element, event, handler) {
+      if (element && event) {
+        element.removeEventListener(event, handler, false);
+      }
+    };
+  } else {
+    return function (element, event, handler) {
+      if (element && event) {
+        element.detachEvent('on' + event, handler);
+      }
+    };
+  }
+}();
+
+/* istanbul ignore next */
+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);
+};
+
+/* istanbul ignore next */
+function hasClass(el, cls) {
+  if (!el || !cls) return false;
+  if (cls.indexOf(' ') !== -1) {
+    throw new Error('className should not contain space.');
+  }
+  if (el.classList) {
+    return el.classList.contains(cls);
+  } else {
+    return (' ' + el.className + ' ').indexOf(' ' + cls + ' ') > -1;
+  }
+}
+
+/* istanbul ignore next */
+function addClass(el, cls) {
+  if (!el) return;
+  var curClass = el.className;
+  var classes = (cls || '').split(' ');
+
+  for (var i = 0, j = classes.length; i < j; i++) {
+    var clsName = classes[i];
+    if (!clsName) continue;
+
+    if (el.classList) {
+      el.classList.add(clsName);
+    } else if (!hasClass(el, clsName)) {
+      curClass += ' ' + clsName;
+    }
+  }
+  if (!el.classList) {
+    el.setAttribute('class', curClass);
+  }
+}
+
+/* istanbul ignore next */
+function removeClass(el, cls) {
+  if (!el || !cls) return;
+  var classes = cls.split(' ');
+  var curClass = ' ' + el.className + ' ';
+
+  for (var i = 0, j = classes.length; i < j; i++) {
+    var clsName = classes[i];
+    if (!clsName) continue;
+
+    if (el.classList) {
+      el.classList.remove(clsName);
+    } else if (hasClass(el, clsName)) {
+      curClass = curClass.replace(' ' + clsName + ' ', ' ');
+    }
+  }
+  if (!el.classList) {
+    el.setAttribute('class', trim(curClass));
+  }
+}
+
+/* istanbul ignore next */
+var getStyle = ieVersion < 9 ? function (element, styleName) {
+  if (isServer) return;
+  if (!element || !styleName) return null;
+  styleName = camelCase(styleName);
+  if (styleName === 'float') {
+    styleName = 'styleFloat';
+  }
+  try {
+    switch (styleName) {
+      case 'opacity':
+        try {
+          return element.filters.item('alpha').opacity / 100;
+        } catch (e) {
+          return 1.0;
+        }
+      default:
+        return element.style[styleName] || element.currentStyle ? element.currentStyle[styleName] : null;
+    }
+  } catch (e) {
+    return element.style[styleName];
+  }
+} : function (element, styleName) {
+  if (isServer) return;
+  if (!element || !styleName) return null;
+  styleName = camelCase(styleName);
+  if (styleName === 'float') {
+    styleName = 'cssFloat';
+  }
+  try {
+    var computed = document.defaultView.getComputedStyle(element, '');
+    return element.style[styleName] || computed ? computed[styleName] : null;
+  } catch (e) {
+    return element.style[styleName];
+  }
+};
+
+/* istanbul ignore next */
+function setStyle(element, styleName, value) {
+  if (!element || !styleName) return;
+
+  if ((typeof styleName === 'undefined' ? 'undefined' : babel_runtime_helpers_typeof__WEBPACK_IMPORTED_MODULE_0___default()(styleName)) === 'object') {
+    for (var prop in styleName) {
+      if (styleName.hasOwnProperty(prop)) {
+        setStyle(element, prop, styleName[prop]);
+      }
+    }
+  } else {
+    styleName = camelCase(styleName);
+    if (styleName === 'opacity' && ieVersion < 9) {
+      element.style.filter = isNaN(value) ? '' : 'alpha(opacity=' + value * 100 + ')';
+    } else {
+      element.style[styleName] = value;
+    }
+  }
+}
+
+var isScroll = function isScroll(el, vertical) {
+  if (isServer) return;
+
+  var determinedDirection = vertical !== null && vertical !== undefined;
+  var overflow = determinedDirection ? vertical ? getStyle(el, 'overflow-y') : getStyle(el, 'overflow-x') : getStyle(el, 'overflow');
+
+  return overflow.match(/(scroll|auto|overlay)/);
+};
+
+var getScrollContainer = function getScrollContainer(el, vertical) {
+  if (isServer) return;
+
+  var parent = el;
+  while (parent) {
+    if ([window, document, document.documentElement].includes(parent)) {
+      return window;
+    }
+    if (isScroll(parent, vertical)) {
+      return parent;
+    }
+    parent = parent.parentNode;
+  }
+
+  return parent;
+};
+
+var isInContainer = function isInContainer(el, container) {
+  if (isServer || !el || !container) return false;
+
+  var elRect = el.getBoundingClientRect();
+  var containerRect = void 0;
+
+  if ([window, document, document.documentElement, null, undefined].includes(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;
+};
+
+function merge(target) {
+  for (var i = 1, j = arguments.length; i < j; i++) {
+    var source = arguments[i] || {};
+    for (var prop in source) {
+      if (source.hasOwnProperty(prop)) {
+        var value = source[prop];
+        if (value !== undefined) {
+          target[prop] = value;
+        }
+      }
+    }
+  }
+
+  return target;
+}
+
+var scrollBarWidth = void 0;
+function getScrollBarWidth() {
+  if (vue__WEBPACK_IMPORTED_MODULE_1___default.a.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;
+}
+
+/***/ }),
+
+/***/ 10:
+/***/ (function(module, exports) {
+
+module.exports = require("babel-runtime/core-js/object/keys");
+
+/***/ }),
+
+/***/ 11:
+/***/ (function(module, exports) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__11__;
+
+/***/ }),
+
+/***/ 12:
+/***/ (function(module, exports) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__12__;
+
+/***/ }),
+
+/***/ 13:
+/***/ (function(module, exports) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__13__;
+
+/***/ }),
+
+/***/ 139:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ }),
+
+/***/ 14:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
+/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(vue__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _dom_helper__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(1);
+/* harmony import */ var _popup_manager__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(5);
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "a", function() { return _popup_manager__WEBPACK_IMPORTED_MODULE_2__["a"]; });
+
+
+
+
+
+var idSeed = 1;
+
+var scrollBarWidth = void 0;
+
+/* harmony default export */ __webpack_exports__["b"] = ({
+  props: {
+    visibility: {
+      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++;
+    _popup_manager__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"].register(this._popupId, this);
+  },
+  beforeDestroy: function beforeDestroy() {
+    _popup_manager__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"].deregister(this._popupId);
+    _popup_manager__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"].closeModal(this._popupId);
+
+    this.restoreBodyStyle();
+  },
+  data: function data() {
+    return {
+      opened: false,
+      bodyPaddingRight: null,
+      computedBodyPaddingRight: 0,
+      withoutHiddenClass: true,
+      rendered: false
+    };
+  },
+
+
+  watch: {
+    visibility: function visibility(val) {
+      var _this = this;
+
+      if (val) {
+        if (this._opening) return;
+        if (!this.rendered) {
+          this.rendered = true;
+          vue__WEBPACK_IMPORTED_MODULE_0___default.a.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 = Object(_dom_helper__WEBPACK_IMPORTED_MODULE_1__[/* merge */ "e"])({}, 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) {
+        _popup_manager__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"].zIndex = zIndex;
+      }
+
+      if (modal) {
+        if (this._closing) {
+          _popup_manager__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"].closeModal(this._popupId);
+          this._closing = false;
+        }
+        _popup_manager__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"].openModal(this._popupId, _popup_manager__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"].nextZIndex(), this.modalAppendToBody ? undefined : dom, props.modalClass, props.modalFade);
+        if (props.lockScroll) {
+          this.withoutHiddenClass = !Object(_dom_helper__WEBPACK_IMPORTED_MODULE_1__[/* hasClass */ "d"])(document.body, 'mds-popup-parent--hidden');
+          if (this.withoutHiddenClass) {
+            this.bodyPaddingRight = document.body.style.paddingRight;
+            this.computedBodyPaddingRight = parseInt(Object(_dom_helper__WEBPACK_IMPORTED_MODULE_1__[/* getStyle */ "c"])(document.body, 'paddingRight'), 10);
+          }
+          scrollBarWidth = Object(_dom_helper__WEBPACK_IMPORTED_MODULE_1__[/* getScrollBarWidth */ "b"])();
+          var bodyHasOverflow = document.documentElement.clientHeight < document.body.scrollHeight;
+          var bodyOverflowY = Object(_dom_helper__WEBPACK_IMPORTED_MODULE_1__[/* getStyle */ "c"])(document.body, 'overflowY');
+          if (scrollBarWidth > 0 && (bodyHasOverflow || bodyOverflowY === 'scroll') && this.withoutHiddenClass) {
+            document.body.style.paddingRight = this.computedBodyPaddingRight + scrollBarWidth + 'px';
+          }
+          Object(_dom_helper__WEBPACK_IMPORTED_MODULE_1__[/* addClass */ "a"])(document.body, 'mds-popup-parent--hidden');
+        }
+      }
+
+      if (getComputedStyle(dom).position === 'static') {
+        dom.style.position = 'absolute';
+      }
+
+      dom.style.zIndex = _popup_manager__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"].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() {
+      _popup_manager__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"].closeModal(this._popupId);
+      this._closing = false;
+    },
+    restoreBodyStyle: function restoreBodyStyle() {
+      if (this.modal && this.withoutHiddenClass) {
+        document.body.style.paddingRight = this.bodyPaddingRight;
+        Object(_dom_helper__WEBPACK_IMPORTED_MODULE_1__[/* removeClass */ "h"])(document.body, 'mds-popup-parent--hidden');
+      }
+      this.withoutHiddenClass = true;
+    }
+  }
+});
+
+
+
+/***/ }),
+
+/***/ 17:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+
+// EXTERNAL MODULE: ./components/_util/_popper/popup/popup-main.js
+var popup_main = __webpack_require__(14);
+
+// EXTERNAL MODULE: external "babel-runtime/core-js/object/get-own-property-descriptor"
+var get_own_property_descriptor_ = __webpack_require__(18);
+var get_own_property_descriptor_default = /*#__PURE__*/__webpack_require__.n(get_own_property_descriptor_);
+
+// EXTERNAL MODULE: external "babel-runtime/core-js/object/keys"
+var keys_ = __webpack_require__(10);
+var keys_default = /*#__PURE__*/__webpack_require__.n(keys_);
+
+// EXTERNAL MODULE: external "babel-runtime/core-js/object/assign"
+var assign_ = __webpack_require__(6);
+var assign_default = /*#__PURE__*/__webpack_require__.n(assign_);
+
+// CONCATENATED MODULE: ./components/_util/_popper/popper.js
+
+
+
+/**
+ * @fileOverview Kickass library to create and place poppers near their reference elements.
+ * @version {{version}}
+ * @license
+ * Copyright (c) 2016 Federico Zivolo and contributors
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+/* eslint-disable */
+// Cross module loader
+// Supported: Node, AMD, Browser globals
+//
+function popper_createPopper() {
+  'use strict';
+
+  var root = window;
+
+  // default options
+  var DEFAULTS = {
+    // placement of the popper
+    placement: 'bottom',
+
+    gpuAcceleration: false,
+
+    // shift popper from its origin by the given amount of pixels (can be negative)
+    offset: 0,
+
+    // the element which will act as boundary of the popper
+    boundariesElement: 'viewport',
+
+    // amount of pixel used to define a minimum distance between the boundaries and the popper
+    boundariesPadding: 5,
+
+    // popper will try to prevent overflow following this order,
+    // by default, then, it could overflow on the left and on top of the boundariesElement
+    preventOverflowOrder: ['left', 'right', 'top', 'bottom'],
+
+    // the behavior used by flip to change the placement of the popper
+    flipBehavior: 'flip',
+
+    arrowElement: '[x-arrow]',
+
+    arrowOffset: 0,
+
+    // list of functions used to modify the offsets before they are applied to the popper
+    modifiers: ['shift', 'offset', 'preventOverflow', 'keepTogether', 'arrow', 'flip', 'applyStyle'],
+
+    modifiersIgnored: [],
+
+    forceAbsolute: false
+
+    /**
+     * Create a new Popper.js instance
+     * @constructor Popper
+     * @param {HTMLElement} reference - The reference element used to position the popper
+     * @param {HTMLElement|Object} popper
+     *      The HTML element used as popper, or a configuration used to generate the popper.
+     * @param {String} [popper.tagName='div'] The tag name of the generated popper.
+     * @param {Array} [popper.classNames=['popper']] Array of classes to apply to the generated popper.
+     * @param {Array} [popper.attributes] Array of attributes to apply, specify `attr:value` to assign a value to it.
+     * @param {HTMLElement|String} [popper.parent=window.document.body] The parent element, given as HTMLElement or as query string.
+     * @param {String} [popper.content=''] The content of the popper, it can be text, html, or node; if it is not text, set `contentType` to `html` or `node`.
+     * @param {String} [popper.contentType='text'] If `html`, the `content` will be parsed as HTML. If `node`, it will be appended as-is.
+     * @param {String} [popper.arrowTagName='div'] Same as `popper.tagName` but for the arrow element.
+     * @param {Array} [popper.arrowClassNames='popper__arrow'] Same as `popper.classNames` but for the arrow element.
+     * @param {String} [popper.arrowAttributes=['x-arrow']] Same as `popper.attributes` but for the arrow element.
+     * @param {Object} options
+     * @param {String} [options.placement=bottom]
+     *      Placement of the popper accepted values: `top(-start, -end), right(-start, -end), bottom(-start, -right),
+     *      left(-start, -end)`
+     *
+     * @param {HTMLElement|String} [options.arrowElement='[x-arrow]']
+     *      The DOM Node used as arrow for the popper, or a CSS selector used to get the DOM node. It must be child of
+     *      its parent Popper. Popper.js will apply to the given element the style required to align the arrow with its
+     *      reference element.
+     *      By default, it will look for a child node of the popper with the `x-arrow` attribute.
+     *
+     * @param {Boolean} [options.gpuAcceleration=true]
+     *      When this property is set to true, the popper position will be applied using CSS3 translate3d, allowing the
+     *      browser to use the GPU to accelerate the rendering.
+     *      If set to false, the popper will be placed using `top` and `left` properties, not using the GPU.
+     *
+     * @param {Number} [options.offset=0]
+     *      Amount of pixels the popper will be shifted (can be negative).
+     *
+     * @param {String|Element} [options.boundariesElement='viewport']
+     *      The element which will define the boundaries of the popper position, the popper will never be placed outside
+     *      of the defined boundaries (except if `keepTogether` is enabled)
+     *
+     * @param {Number} [options.boundariesPadding=5]
+     *      Additional padding for the boundaries
+     *
+     * @param {Array} [options.preventOverflowOrder=['left', 'right', 'top', 'bottom']]
+     *      Order used when Popper.js tries to avoid overflows from the boundaries, they will be checked in order,
+     *      this means that the last ones will never overflow
+     *
+     * @param {String|Array} [options.flipBehavior='flip']
+     *      The behavior used by the `flip` modifier to change the placement of the popper when the latter is trying to
+     *      overlap its reference element. Defining `flip` as value, the placement will be flipped on
+     *      its axis (`right - left`, `top - bottom`).
+     *      You can even pass an array of placements (eg: `['right', 'left', 'top']` ) to manually specify
+     *      how alter the placement when a flip is needed. (eg. in the above example, it would first flip from right to left,
+     *      then, if even in its new placement, the popper is overlapping its reference element, it will be moved to top)
+     *
+     * @param {Array} [options.modifiers=[ 'shift', 'offset', 'preventOverflow', 'keepTogether', 'arrow', 'flip', 'applyStyle']]
+     *      List of functions used to modify the data before they are applied to the popper, add your custom functions
+     *      to this array to edit the offsets and placement.
+     *      The function should reflect the @params and @returns of preventOverflow
+     *
+     * @param {Array} [options.modifiersIgnored=[]]
+     *      Put here any built-in modifier name you want to exclude from the modifiers list
+     *      The function should reflect the @params and @returns of preventOverflow
+     *
+     * @param {Boolean} [options.removeOnDestroy=false]
+     *      Set to true if you want to automatically remove the popper when you call the `destroy` method.
+     */
+  };function Popper(reference, popper, options) {
+    this._reference = reference.jquery ? reference[0] : reference;
+    this.state = {};
+
+    // if the popper variable is a configuration object, parse it to generate an HTMLElement
+    // generate a default popper if is not defined
+    var isNotDefined = typeof popper === 'undefined' || popper === null;
+    var isConfig = popper && Object.prototype.toString.call(popper) === '[object Object]';
+    if (isNotDefined || isConfig) {
+      this._popper = this.parse(isConfig ? popper : {});
+    }
+    // otherwise, use the given HTMLElement as popper
+    else {
+        this._popper = popper.jquery ? popper[0] : popper;
+      }
+
+    // with {} we create a new object with the options inside it
+    this._options = assign_default()({}, DEFAULTS, options);
+
+    // refactoring modifiers' list
+    this._options.modifiers = this._options.modifiers.map(function (modifier) {
+      // remove ignored modifiers
+      if (this._options.modifiersIgnored.indexOf(modifier) !== -1) return;
+
+      // set the x-placement attribute before everything else because it could be used to add margins to the popper
+      // margins needs to be calculated to get the correct popper offsets
+      if (modifier === 'applyStyle') {
+        this._popper.setAttribute('x-placement', this._options.placement);
+      }
+
+      // return predefined modifier identified by string or keep the custom one
+      return this.modifiers[modifier] || modifier;
+    }.bind(this));
+
+    // make sure to apply the popper position before any computation
+    this.state.position = this._getPosition(this._popper, this._reference);
+    setStyle(this._popper, { position: this.state.position, top: 0 });
+
+    // fire the first update to position the popper in the right place
+    this.update();
+
+    // setup event listeners, they will take care of update the position in specific situations
+    this._setupEventListeners();
+    return this;
+  }
+
+  //
+  // Methods
+  //
+  /**
+   * Destroy the popper
+   * @method
+   * @memberof Popper
+   */
+  Popper.prototype.destroy = function () {
+    this._popper.removeAttribute('x-placement');
+    this._popper.style.left = '';
+    this._popper.style.position = '';
+    this._popper.style.top = '';
+    this._popper.style[getSupportedPropertyName('transform')] = '';
+    this._removeEventListeners();
+
+    // remove the popper if user explicity asked for the deletion on destroy
+    if (this._options.removeOnDestroy) {
+      this._popper.remove();
+    }
+    return this;
+  };
+
+  /**
+   * Updates the position of the popper, computing the new offsets and applying the new style
+   * @method
+   * @memberof Popper
+   */
+  Popper.prototype.update = function () {
+    var data = { instance: this, styles: {}
+
+      // store placement inside the data object, modifiers will be able to edit `placement` if needed
+      // and refer to _originalPlacement to know the original value
+    };data.placement = this._options.placement;
+    data._originalPlacement = this._options.placement;
+
+    // compute the popper and reference offsets and put them inside data.offsets
+    data.offsets = this._getOffsets(this._popper, this._reference, data.placement);
+
+    // get boundaries
+    data.boundaries = this._getBoundaries(data, this._options.boundariesPadding, this._options.boundariesElement);
+
+    data = this.runModifiers(data, this._options.modifiers);
+
+    if (typeof this.state.updateCallback === 'function') {
+      this.state.updateCallback(data);
+    }
+  };
+
+  /**
+   * If a function is passed, it will be executed after the initialization of popper with as first argument the Popper instance.
+   * @method
+   * @memberof Popper
+   * @param {Function} callback
+   */
+  Popper.prototype.onCreate = function (callback) {
+    // the createCallbacks return as first argument the popper instance
+    callback(this);
+    return this;
+  };
+
+  /**
+   * If a function is passed, it will be executed after each update of popper with as first argument the set of coordinates and informations
+   * used to style popper and its arrow.
+   * NOTE: it doesn't get fired on the first call of the `Popper.update()` method inside the `Popper` constructor!
+   * @method
+   * @memberof Popper
+   * @param {Function} callback
+   */
+  Popper.prototype.onUpdate = function (callback) {
+    this.state.updateCallback = callback;
+    return this;
+  };
+
+  /**
+   * Helper used to generate poppers from a configuration file
+   * @method
+   * @memberof Popper
+   * @param config {Object} configuration
+   * @returns {HTMLElement} popper
+   */
+  Popper.prototype.parse = function (config) {
+    var defaultConfig = {
+      tagName: 'div',
+      classNames: ['popper'],
+      attributes: [],
+      parent: root.document.body,
+      content: '',
+      contentType: 'text',
+      arrowTagName: 'div',
+      arrowClassNames: ['popper__arrow'],
+      arrowAttributes: ['x-arrow']
+    };
+    config = assign_default()({}, defaultConfig, config);
+
+    var d = root.document;
+
+    var popper = d.createElement(config.tagName);
+    addClassNames(popper, config.classNames);
+    addAttributes(popper, config.attributes);
+    if (config.contentType === 'node') {
+      popper.appendChild(config.content.jquery ? config.content[0] : config.content);
+    } else if (config.contentType === 'html') {
+      popper.innerHTML = config.content;
+    } else {
+      popper.textContent = config.content;
+    }
+
+    if (config.arrowTagName) {
+      var arrow = d.createElement(config.arrowTagName);
+      addClassNames(arrow, config.arrowClassNames);
+      addAttributes(arrow, config.arrowAttributes);
+      popper.appendChild(arrow);
+    }
+
+    var parent = config.parent.jquery ? config.parent[0] : config.parent;
+
+    // if the given parent is a string, use it to match an element
+    // if more than one element is matched, the first one will be used as parent
+    // if no elements are matched, the script will throw an error
+    if (typeof parent === 'string') {
+      parent = d.querySelectorAll(config.parent);
+      if (parent.length > 1) {
+        console.warn('WARNING: the given `parent` query(' + config.parent + ') matched more than one element, the first one will be used');
+      }
+      if (parent.length === 0) {
+        throw "ERROR: the given `parent` doesn't exists!";
+      }
+      parent = parent[0];
+    }
+    // if the given parent is a DOM nodes list or an array of nodes with more than one element,
+    // the first one will be used as parent
+    if (parent.length > 1 && parent instanceof Element === false) {
+      console.warn('WARNING: you have passed as parent a list of elements, the first one will be used');
+      parent = parent[0];
+    }
+
+    // append the generated popper to its parent
+    parent.appendChild(popper);
+
+    return popper;
+
+    /**
+     * Adds class names to the given element
+     * @function
+     * @ignore
+     * @param {HTMLElement} target
+     * @param {Array} classes
+     */
+    function addClassNames(element, classNames) {
+      classNames.forEach(function (className) {
+        element.classList.add(className);
+      });
+    }
+
+    /**
+     * Adds attributes to the given element
+     * @function
+     * @ignore
+     * @param {HTMLElement} target
+     * @param {Array} attributes
+     * @example
+     * addAttributes(element, [ 'data-info:foobar' ]);
+     */
+    function addAttributes(element, attributes) {
+      attributes.forEach(function (attribute) {
+        element.setAttribute(attribute.split(':')[0], attribute.split(':')[1] || '');
+      });
+    }
+  };
+
+  /**
+   * Helper used to get the position which will be applied to the popper
+   * @method
+   * @memberof Popper
+   * @param config {HTMLElement} popper element
+   * @param reference {HTMLElement} reference element
+   * @returns {String} position
+   */
+  Popper.prototype._getPosition = function (popper, reference) {
+    var container = getOffsetParent(reference);
+
+    if (this._options.forceAbsolute) {
+      return 'absolute';
+    }
+
+    // Decide if the popper will be fixed
+    // If the reference element is inside a fixed context, the popper will be fixed as well to allow them to scroll together
+    var isParentFixed = isFixed(reference, container);
+    return isParentFixed ? 'fixed' : 'absolute';
+  };
+
+  /**
+   * Get offsets to the popper
+   * @method
+   * @memberof Popper
+   * @access private
+   * @param {Element} popper - the popper element
+   * @param {Element} reference - the reference element (the popper will be relative to this)
+   * @returns {Object} An object containing the offsets which will be applied to the popper
+   */
+  Popper.prototype._getOffsets = function (popper, reference, placement) {
+    placement = placement.split('-')[0];
+    var popperOffsets = {};
+
+    popperOffsets.position = this.state.position;
+    var isParentFixed = popperOffsets.position === 'fixed';
+
+    //
+    // Get reference element position
+    //
+    var referenceOffsets = getOffsetRectRelativeToCustomParent(reference, getOffsetParent(popper), isParentFixed);
+
+    //
+    // Get popper sizes
+    //
+    var popperRect = getOuterSizes(popper);
+
+    //
+    // Compute offsets of popper
+    //
+
+    // depending by the popper placement we have to compute its offsets slightly differently
+    if (['right', 'left'].indexOf(placement) !== -1) {
+      popperOffsets.top = referenceOffsets.top + referenceOffsets.height / 2 - popperRect.height / 2;
+      if (placement === 'left') {
+        popperOffsets.left = referenceOffsets.left - popperRect.width;
+      } else {
+        popperOffsets.left = referenceOffsets.right;
+      }
+    } else {
+      popperOffsets.left = referenceOffsets.left + referenceOffsets.width / 2 - popperRect.width / 2;
+      if (placement === 'top') {
+        popperOffsets.top = referenceOffsets.top - popperRect.height;
+      } else {
+        popperOffsets.top = referenceOffsets.bottom;
+      }
+    }
+
+    // Add width and height to our offsets object
+    popperOffsets.width = popperRect.width;
+    popperOffsets.height = popperRect.height;
+
+    return {
+      popper: popperOffsets,
+      reference: referenceOffsets
+    };
+  };
+
+  /**
+   * Setup needed event listeners used to update the popper position
+   * @method
+   * @memberof Popper
+   * @access private
+   */
+  Popper.prototype._setupEventListeners = function () {
+    // NOTE: 1 DOM access here
+    this.state.updateBound = this.update.bind(this);
+    root.addEventListener('resize', this.state.updateBound);
+    // if the boundariesElement is window we don't need to listen for the scroll event
+    if (this._options.boundariesElement !== 'window') {
+      var target = getScrollParent(this._reference);
+      // here it could be both `body` or `documentElement` thanks to Firefox, we then check both
+      if (target === root.document.body || target === root.document.documentElement) {
+        target = root;
+      }
+      target.addEventListener('scroll', this.state.updateBound);
+      this.state.scrollTarget = target;
+    }
+  };
+
+  /**
+   * Remove event listeners used to update the popper position
+   * @method
+   * @memberof Popper
+   * @access private
+   */
+  Popper.prototype._removeEventListeners = function () {
+    // NOTE: 1 DOM access here
+    root.removeEventListener('resize', this.state.updateBound);
+    if (this._options.boundariesElement !== 'window' && this.state.scrollTarget) {
+      this.state.scrollTarget.removeEventListener('scroll', this.state.updateBound);
+      this.state.scrollTarget = null;
+    }
+    this.state.updateBound = null;
+  };
+
+  /**
+   * Computed the boundaries limits and return them
+   * @method
+   * @memberof Popper
+   * @access private
+   * @param {Object} data - Object containing the property "offsets" generated by `_getOffsets`
+   * @param {Number} padding - Boundaries padding
+   * @param {Element} boundariesElement - Element used to define the boundaries
+   * @returns {Object} Coordinates of the boundaries
+   */
+  Popper.prototype._getBoundaries = function (data, padding, boundariesElement) {
+    // NOTE: 1 DOM access here
+    var boundaries = {};
+    var width, height;
+    if (boundariesElement === 'window') {
+      var body = root.document.body,
+          html = root.document.documentElement;
+
+      height = Math.max(body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight);
+      width = Math.max(body.scrollWidth, body.offsetWidth, html.clientWidth, html.scrollWidth, html.offsetWidth);
+
+      boundaries = {
+        top: 0,
+        right: width,
+        bottom: height,
+        left: 0
+      };
+    } else if (boundariesElement === 'viewport') {
+      var offsetParent = getOffsetParent(this._popper);
+      var scrollParent = getScrollParent(this._popper);
+      var offsetParentRect = getOffsetRect(offsetParent);
+
+      // Thanks the fucking native API, `document.body.scrollTop` & `document.documentElement.scrollTop`
+      var getScrollTopValue = function getScrollTopValue(element) {
+        return element == document.body ? Math.max(document.documentElement.scrollTop, document.body.scrollTop) : element.scrollTop;
+      };
+      var getScrollLeftValue = function getScrollLeftValue(element) {
+        return element == document.body ? Math.max(document.documentElement.scrollLeft, document.body.scrollLeft) : element.scrollLeft;
+      };
+
+      // if the popper is fixed we don't have to substract scrolling from the boundaries
+      var scrollTop = data.offsets.popper.position === 'fixed' ? 0 : getScrollTopValue(scrollParent);
+      var scrollLeft = data.offsets.popper.position === 'fixed' ? 0 : getScrollLeftValue(scrollParent);
+
+      boundaries = {
+        top: 0 - (offsetParentRect.top - scrollTop),
+        right: root.document.documentElement.clientWidth - (offsetParentRect.left - scrollLeft),
+        bottom: root.document.documentElement.clientHeight - (offsetParentRect.top - scrollTop),
+        left: 0 - (offsetParentRect.left - scrollLeft)
+      };
+    } else {
+      if (getOffsetParent(this._popper) === boundariesElement) {
+        boundaries = {
+          top: 0,
+          left: 0,
+          right: boundariesElement.clientWidth,
+          bottom: boundariesElement.clientHeight
+        };
+      } else {
+        boundaries = getOffsetRect(boundariesElement);
+      }
+    }
+    boundaries.left += padding;
+    boundaries.right -= padding;
+    boundaries.top = boundaries.top + padding;
+    boundaries.bottom = boundaries.bottom - padding;
+    return boundaries;
+  };
+
+  /**
+   * Loop trough the list of modifiers and run them in order, each of them will then edit the data object
+   * @method
+   * @memberof Popper
+   * @access public
+   * @param {Object} data
+   * @param {Array} modifiers
+   * @param {Function} ends
+   */
+  Popper.prototype.runModifiers = function (data, modifiers, ends) {
+    var modifiersToRun = modifiers.slice();
+    if (ends !== undefined) {
+      modifiersToRun = this._options.modifiers.slice(0, getArrayKeyIndex(this._options.modifiers, ends));
+    }
+
+    modifiersToRun.forEach(function (modifier) {
+      if (isFunction(modifier)) {
+        data = modifier.call(this, data);
+      }
+    }.bind(this));
+
+    return data;
+  };
+
+  /**
+   * Helper used to know if the given modifier depends from another one.
+   * @method
+   * @memberof Popper
+   * @param {String} requesting - name of requesting modifier
+   * @param {String} requested - name of requested modifier
+   * @returns {Boolean}
+   */
+  Popper.prototype.isModifierRequired = function (requesting, requested) {
+    var index = getArrayKeyIndex(this._options.modifiers, requesting);
+    return !!this._options.modifiers.slice(0, index).filter(function (modifier) {
+      return modifier === requested;
+    }).length;
+  };
+
+  //
+  // Modifiers
+  //
+
+  /**
+   * Modifiers list
+   * @namespace Popper.modifiers
+   * @memberof Popper
+   * @type {Object}
+   */
+  Popper.prototype.modifiers = {};
+
+  /**
+   * Apply the computed styles to the popper element
+   * @method
+   * @memberof Popper.modifiers
+   * @argument {Object} data - The data object generated by `update` method
+   * @returns {Object} The same data object
+   */
+  Popper.prototype.modifiers.applyStyle = function (data) {
+    // apply the final offsets to the popper
+    // NOTE: 1 DOM access here
+    var styles = {
+      position: data.offsets.popper.position
+
+      // round top and left to avoid blurry text
+    };var left = Math.round(data.offsets.popper.left);
+    var top = Math.round(data.offsets.popper.top);
+
+    // if gpuAcceleration is set to true and transform is supported, we use `translate3d` to apply the position to the popper
+    // we automatically use the supported prefixed version if needed
+    var prefixedProperty;
+    if (this._options.gpuAcceleration && (prefixedProperty = getSupportedPropertyName('transform'))) {
+      styles[prefixedProperty] = 'translate3d(' + left + 'px, ' + top + 'px, 0)';
+      styles.top = 0;
+      styles.left = 0;
+    }
+    // othwerise, we use the standard `left` and `top` properties
+    else {
+        styles.left = left;
+        styles.top = top;
+      }
+
+    // any property present in `data.styles` will be applied to the popper,
+    // in this way we can make the 3rd party modifiers add custom styles to it
+    // Be aware, modifiers could override the properties defined in the previous
+    // lines of this modifier!
+    assign_default()(styles, data.styles);
+
+    setStyle(this._popper, styles);
+
+    // set an attribute which will be useful to style the tooltip (use it to properly position its arrow)
+    // NOTE: 1 DOM access here
+    if (!this._popper._prevClass.includes('mds-date-picker')) {
+      this._popper.setAttribute('x-placement', data.placement);
+      var popper = this._popper;
+      var instanceType = popper.classList[0];
+      popper.classList.replace(popper.classList[1], instanceType + '-placement-' + data.placement);
+    }
+
+    // console.log(data.placement)
+
+    // if the arrow modifier is required and the arrow style has been computed, apply the arrow style
+    if (this.isModifierRequired(this.modifiers.applyStyle, this.modifiers.arrow) && data.offsets.arrow) {
+      setStyle(data.arrowElement, data.offsets.arrow);
+    }
+
+    return data;
+  };
+
+  /**
+   * Modifier used to shift the popper on the start or end of its reference element side
+   * @method
+   * @memberof Popper.modifiers
+   * @argument {Object} data - The data object generated by `update` method
+   * @returns {Object} The data object, properly modified
+   */
+  Popper.prototype.modifiers.shift = function (data) {
+    var placement = data.placement;
+    var basePlacement = placement.split('-')[0];
+    var shiftVariation = placement.split('-')[1];
+
+    // if shift shiftVariation is specified, run the modifier
+    if (shiftVariation) {
+      var reference = data.offsets.reference;
+      var popper = getPopperClientRect(data.offsets.popper);
+
+      var shiftOffsets = {
+        y: {
+          start: { top: reference.top },
+          end: { top: reference.top + reference.height - popper.height }
+        },
+        x: {
+          start: { left: reference.left },
+          end: { left: reference.left + reference.width - popper.width }
+        }
+      };
+
+      var axis = ['bottom', 'top'].indexOf(basePlacement) !== -1 ? 'x' : 'y';
+
+      data.offsets.popper = assign_default()(popper, shiftOffsets[axis][shiftVariation]);
+    }
+    return data;
+  };
+
+  /**
+   * Modifier used to make sure the popper does not overflows from it's boundaries
+   * @method
+   * @memberof Popper.modifiers
+   * @argument {Object} data - The data object generated by `update` method
+   * @returns {Object} The data object, properly modified
+   */
+  Popper.prototype.modifiers.preventOverflow = function (data) {
+    var order = this._options.preventOverflowOrder;
+    var popper = getPopperClientRect(data.offsets.popper);
+
+    var check = {
+      left: function left() {
+        var left = popper.left;
+        if (popper.left < data.boundaries.left) {
+          left = Math.max(popper.left, data.boundaries.left);
+        }
+        return { left: left };
+      },
+      right: function right() {
+        var left = popper.left;
+        if (popper.right > data.boundaries.right) {
+          left = Math.min(popper.left, data.boundaries.right - popper.width);
+        }
+        return { left: left };
+      },
+      top: function top() {
+        var top = popper.top;
+        if (popper.top < data.boundaries.top) {
+          top = Math.max(popper.top, data.boundaries.top);
+        }
+        return { top: top };
+      },
+      bottom: function bottom() {
+        var top = popper.top;
+        if (popper.bottom > data.boundaries.bottom) {
+          top = Math.min(popper.top, data.boundaries.bottom - popper.height);
+        }
+        return { top: top };
+      }
+    };
+
+    order.forEach(function (direction) {
+      data.offsets.popper = assign_default()(popper, check[direction]());
+    });
+
+    return data;
+  };
+
+  /**
+   * Modifier used to make sure the popper is always near its reference
+   * @method
+   * @memberof Popper.modifiers
+   * @argument {Object} data - The data object generated by _update method
+   * @returns {Object} The data object, properly modified
+   */
+  Popper.prototype.modifiers.keepTogether = function (data) {
+    var popper = getPopperClientRect(data.offsets.popper);
+    var reference = data.offsets.reference;
+    var f = Math.floor;
+
+    if (popper.right < f(reference.left)) {
+      data.offsets.popper.left = f(reference.left) - popper.width;
+    }
+    if (popper.left > f(reference.right)) {
+      data.offsets.popper.left = f(reference.right);
+    }
+    if (popper.bottom < f(reference.top)) {
+      data.offsets.popper.top = f(reference.top) - popper.height;
+    }
+    if (popper.top > f(reference.bottom)) {
+      data.offsets.popper.top = f(reference.bottom);
+    }
+
+    return data;
+  };
+
+  /**
+   * Modifier used to flip the placement of the popper when the latter is starting overlapping its reference element.
+   * Requires the `preventOverflow` modifier before it in order to work.
+   * **NOTE:** This modifier will run all its previous modifiers everytime it tries to flip the popper!
+   * @method
+   * @memberof Popper.modifiers
+   * @argument {Object} data - The data object generated by _update method
+   * @returns {Object} The data object, properly modified
+   */
+  Popper.prototype.modifiers.flip = function (data) {
+    // check if preventOverflow is in the list of modifiers before the flip modifier.
+    // otherwise flip would not work as expected.
+    if (!this.isModifierRequired(this.modifiers.flip, this.modifiers.preventOverflow)) {
+      console.warn('WARNING: preventOverflow modifier is required by flip modifier in order to work, be sure to include it before flip!');
+      return data;
+    }
+
+    if (data.flipped && data.placement === data._originalPlacement) {
+      // seems like flip is trying to loop, probably there's not enough space on any of the flippable sides
+      return data;
+    }
+
+    var placement = data.placement.split('-')[0];
+    var placementOpposite = getOppositePlacement(placement);
+    var variation = data.placement.split('-')[1] || '';
+    var flipOrder = [];
+    if (this._options.flipBehavior === 'flip') {
+      flipOrder = [placement, placementOpposite];
+    } else {
+      flipOrder = this._options.flipBehavior;
+    }
+
+    flipOrder.forEach(function (step, index) {
+      if (placement !== step || flipOrder.length === index + 1) {
+        return;
+      }
+
+      placement = data.placement.split('-')[0];
+      placementOpposite = getOppositePlacement(placement);
+
+      var popperOffsets = getPopperClientRect(data.offsets.popper);
+
+      // this boolean is used to distinguish right and bottom from top and left
+      // they need different computations to get flipped
+      var a = ['right', 'bottom'].indexOf(placement) !== -1;
+
+      // using Math.floor because the reference offsets may contain decimals we are not going to consider here
+      if (a && Math.floor(data.offsets.reference[placement]) > Math.floor(popperOffsets[placementOpposite]) || !a && Math.floor(data.offsets.reference[placement]) < Math.floor(popperOffsets[placementOpposite])) {
+        // we'll use this boolean to detect any flip loop
+        data.flipped = true;
+        data.placement = flipOrder[index + 1];
+        if (variation) {
+          data.placement += '-' + variation;
+        }
+        data.offsets.popper = this._getOffsets(this._popper, this._reference, data.placement).popper;
+        data = this.runModifiers(data, this._options.modifiers, this._flip);
+      }
+    }.bind(this));
+    return data;
+  };
+
+  /**
+   * Modifier used to add an offset to the popper, useful if you more granularity positioning your popper.
+   * The offsets will shift the popper on the side of its reference element.
+   * @method
+   * @memberof Popper.modifiers
+   * @argument {Object} data - The data object generated by _update method
+   * @returns {Object} The data object, properly modified
+   */
+  Popper.prototype.modifiers.offset = function (data) {
+    var offset = this._options.offset;
+    var popper = data.offsets.popper;
+
+    if (data.placement.indexOf('left') !== -1) {
+      popper.top -= offset;
+    } else if (data.placement.indexOf('right') !== -1) {
+      popper.top += offset;
+    } else if (data.placement.indexOf('top') !== -1) {
+      popper.left -= offset;
+    } else if (data.placement.indexOf('bottom') !== -1) {
+      popper.left += offset;
+    }
+    return data;
+  };
+
+  /**
+   * Modifier used to move the arrows on the edge of the popper to make sure them are always between the popper and the reference element
+   * It will use the CSS outer size of the arrow element to know how many pixels of conjuction are needed
+   * @method
+   * @memberof Popper.modifiers
+   * @argument {Object} data - The data object generated by _update method
+   * @returns {Object} The data object, properly modified
+   */
+  Popper.prototype.modifiers.arrow = function (data) {
+    var arrow = this._options.arrowElement;
+    var arrowOffset = this._options.arrowOffset;
+
+    // if the arrowElement is a string, suppose it's a CSS selector
+    if (typeof arrow === 'string') {
+      arrow = this._popper.querySelector(arrow);
+    }
+
+    // if arrow element is not found, don't run the modifier
+    if (!arrow) {
+      return data;
+    }
+
+    // the arrow element must be child of its popper
+    if (!this._popper.contains(arrow)) {
+      console.warn('WARNING: `arrowElement` must be child of its popper element!');
+      return data;
+    }
+
+    // arrow depends on keepTogether in order to work
+    if (!this.isModifierRequired(this.modifiers.arrow, this.modifiers.keepTogether)) {
+      console.warn('WARNING: keepTogether modifier is required by arrow modifier in order to work, be sure to include it before arrow!');
+      return data;
+    }
+
+    var arrowStyle = {};
+    var placement = data.placement.split('-')[0];
+    var popper = getPopperClientRect(data.offsets.popper);
+    var reference = data.offsets.reference;
+    var isVertical = ['left', 'right'].indexOf(placement) !== -1;
+
+    var len = isVertical ? 'height' : 'width';
+    var side = isVertical ? 'top' : 'left';
+    var translate = isVertical ? 'translateY' : 'translateX';
+    var altSide = isVertical ? 'left' : 'top';
+    var opSide = isVertical ? 'bottom' : 'right';
+    var arrowSize = getOuterSizes(arrow)[len];
+
+    //
+    // extends keepTogether behavior making sure the popper and its reference have enough pixels in conjuction
+    //
+
+    // top/left side
+    if (reference[opSide] - arrowSize < popper[side]) {
+      data.offsets.popper[side] -= popper[side] - (reference[opSide] - arrowSize);
+    }
+    // bottom/right side
+    if (reference[side] + arrowSize > popper[opSide]) {
+      data.offsets.popper[side] += reference[side] + arrowSize - popper[opSide];
+    }
+
+    // compute center of the popper
+    var center = reference[side] + (arrowOffset || reference[len] / 2 - arrowSize / 2);
+
+    var sideValue = center - popper[side];
+
+    // prevent arrow from being placed not contiguously to its popper
+    sideValue = Math.max(Math.min(popper[len] - arrowSize - 8, sideValue), 8);
+    arrowStyle[side] = sideValue;
+    arrowStyle[altSide] = ''; // make sure to remove any old style from the arrow
+
+    data.offsets.arrow = arrowStyle;
+    data.arrowElement = arrow;
+
+    return data;
+  };
+
+  //
+  // Helpers
+  //
+
+  /**
+   * Get the outer sizes of the given element (offset size + margins)
+   * @function
+   * @ignore
+   * @argument {Element} element
+   * @returns {Object} object containing width and height properties
+   */
+  function getOuterSizes(element) {
+    // NOTE: 1 DOM access here
+    var _display = element.style.display,
+        _visibility = element.style.visibility;
+    element.style.display = 'block';
+    element.style.visibility = 'hidden';
+    var calcWidthToForceRepaint = element.offsetWidth;
+
+    // original method
+    var styles = root.getComputedStyle(element);
+    var x = parseFloat(styles.marginTop) + parseFloat(styles.marginBottom);
+    var y = parseFloat(styles.marginLeft) + parseFloat(styles.marginRight);
+    var result = {
+      width: element.offsetWidth + y,
+      height: element.offsetHeight + x
+
+      // reset element styles
+    };element.style.display = _display;
+    element.style.visibility = _visibility;
+    return result;
+  }
+
+  /**
+   * Get the opposite placement of the given one/
+   * @function
+   * @ignore
+   * @argument {String} placement
+   * @returns {String} flipped placement
+   */
+  function getOppositePlacement(placement) {
+    var hash = { left: 'right', right: 'left', bottom: 'top', top: 'bottom' };
+    return placement.replace(/left|right|bottom|top/g, function (matched) {
+      return hash[matched];
+    });
+  }
+
+  /**
+   * Given the popper offsets, generate an output similar to getBoundingClientRect
+   * @function
+   * @ignore
+   * @argument {Object} popperOffsets
+   * @returns {Object} ClientRect like output
+   */
+  function getPopperClientRect(popperOffsets) {
+    var offsets = assign_default()({}, popperOffsets);
+    offsets.right = offsets.left + offsets.width;
+    offsets.bottom = offsets.top + offsets.height;
+    return offsets;
+  }
+
+  /**
+   * Given an array and the key to find, returns its index
+   * @function
+   * @ignore
+   * @argument {Array} arr
+   * @argument keyToFind
+   * @returns index or null
+   */
+  function getArrayKeyIndex(arr, keyToFind) {
+    var i = 0,
+        key;
+    for (key in arr) {
+      if (arr[key] === keyToFind) {
+        return i;
+      }
+      i++;
+    }
+    return null;
+  }
+
+  /**
+   * Get CSS computed property of the given element
+   * @function
+   * @ignore
+   * @argument {Eement} element
+   * @argument {String} property
+   */
+  function getStyleComputedProperty(element, property) {
+    // NOTE: 1 DOM access here
+    var css = root.getComputedStyle(element, null);
+    return css[property];
+  }
+
+  /**
+   * Returns the offset parent of the given element
+   * @function
+   * @ignore
+   * @argument {Element} element
+   * @returns {Element} offset parent
+   */
+  function getOffsetParent(element) {
+    // NOTE: 1 DOM access here
+    var offsetParent = element.offsetParent;
+    return offsetParent === root.document.body || !offsetParent ? root.document.documentElement : offsetParent;
+  }
+
+  /**
+   * Returns the scrolling parent of the given element
+   * @function
+   * @ignore
+   * @argument {Element} element
+   * @returns {Element} offset parent
+   */
+  function getScrollParent(element) {
+    var parent = element.parentNode;
+
+    if (!parent) {
+      return element;
+    }
+
+    if (parent === root.document) {
+      // Firefox puts the scrollTOp value on `documentElement` instead of `body`, we then check which of them is
+      // greater than 0 and return the proper element
+      if (root.document.body.scrollTop || root.document.body.scrollLeft) {
+        return root.document.body;
+      } else {
+        return root.document.documentElement;
+      }
+    }
+
+    // Firefox want us to check `-x` and `-y` variations as well
+    if (['scroll', 'auto'].indexOf(getStyleComputedProperty(parent, 'overflow')) !== -1 || ['scroll', 'auto'].indexOf(getStyleComputedProperty(parent, 'overflow-x')) !== -1 || ['scroll', 'auto'].indexOf(getStyleComputedProperty(parent, 'overflow-y')) !== -1) {
+      // If the detected scrollParent is body, we perform an additional check on its parentNode
+      // in this way we'll get body if the browser is Chrome-ish, or documentElement otherwise
+      // fixes issue #65
+      return parent;
+    }
+    return getScrollParent(element.parentNode);
+  }
+
+  /**
+   * Check if the given element is fixed or is inside a fixed parent
+   * @function
+   * @ignore
+   * @argument {Element} element
+   * @argument {Element} customContainer
+   * @returns {Boolean} answer to "isFixed?"
+   */
+  function isFixed(element) {
+    if (element === root.document.body) {
+      return false;
+    }
+    if (getStyleComputedProperty(element, 'position') === 'fixed') {
+      return true;
+    }
+    return element.parentNode ? isFixed(element.parentNode) : element;
+  }
+
+  /**
+   * Set the style to the given popper
+   * @function
+   * @ignore
+   * @argument {Element} element - Element to apply the style to
+   * @argument {Object} styles - Object with a list of properties and values which will be applied to the element
+   */
+  function setStyle(element, styles) {
+    function is_numeric(n) {
+      return n !== '' && !isNaN(parseFloat(n)) && isFinite(n);
+    }
+    keys_default()(styles).forEach(function (prop) {
+      var unit = '';
+      // add unit if the value is numeric and is one of the following
+      if (['width', 'height', 'top', 'right', 'bottom', 'left'].indexOf(prop) !== -1 && is_numeric(styles[prop])) {
+        unit = 'px';
+      }
+      element.style[prop] = styles[prop] + unit;
+    });
+  }
+
+  /**
+   * Check if the given variable is a function
+   * @function
+   * @ignore
+   * @argument {*} functionToCheck - variable to check
+   * @returns {Boolean} answer to: is a function?
+   */
+  function isFunction(functionToCheck) {
+    var getType = {};
+    return functionToCheck && getType.toString.call(functionToCheck) === '[object Function]';
+  }
+
+  /**
+   * Get the position of the given element, relative to its offset parent
+   * @function
+   * @ignore
+   * @param {Element} element
+   * @return {Object} position - Coordinates of the element and its `scrollTop`
+   */
+  function getOffsetRect(element) {
+    var elementRect = {
+      width: element.offsetWidth,
+      height: element.offsetHeight,
+      left: element.offsetLeft,
+      top: element.offsetTop
+    };
+
+    elementRect.right = elementRect.left + elementRect.width;
+    elementRect.bottom = elementRect.top + elementRect.height;
+
+    // position
+    return elementRect;
+  }
+
+  /**
+   * Get bounding client rect of given element
+   * @function
+   * @ignore
+   * @param {HTMLElement} element
+   * @return {Object} client rect
+   */
+  function getBoundingClientRect(element) {
+    var rect = element.getBoundingClientRect();
+
+    // whether the IE version is lower than 11
+    var isIE = navigator.userAgent.indexOf('MSIE') != -1;
+
+    // fix ie document bounding top always 0 bug
+    var rectTop = isIE && element.tagName === 'HTML' ? -element.scrollTop : rect.top;
+
+    return {
+      left: rect.left,
+      top: rectTop,
+      right: rect.right,
+      bottom: rect.bottom,
+      width: rect.right - rect.left,
+      height: rect.bottom - rectTop
+    };
+  }
+
+  /**
+   * Given an element and one of its parents, return the offset
+   * @function
+   * @ignore
+   * @param {HTMLElement} element
+   * @param {HTMLElement} parent
+   * @return {Object} rect
+   */
+  function getOffsetRectRelativeToCustomParent(element, parent, fixed) {
+    var elementRect = getBoundingClientRect(element);
+    var parentRect = getBoundingClientRect(parent);
+
+    if (fixed) {
+      var scrollParent = getScrollParent(parent);
+      parentRect.top += scrollParent.scrollTop;
+      parentRect.bottom += scrollParent.scrollTop;
+      parentRect.left += scrollParent.scrollLeft;
+      parentRect.right += scrollParent.scrollLeft;
+    }
+
+    var rect = {
+      top: elementRect.top - parentRect.top,
+      left: elementRect.left - parentRect.left,
+      bottom: elementRect.top - parentRect.top + elementRect.height,
+      right: elementRect.left - parentRect.left + elementRect.width,
+      width: elementRect.width,
+      height: elementRect.height
+    };
+    return rect;
+  }
+
+  /**
+   * Get the prefixed supported property name
+   * @function
+   * @ignore
+   * @argument {String} property (camelCase)
+   * @returns {String} prefixed property (camelCase)
+   */
+  function getSupportedPropertyName(property) {
+    var prefixes = ['', 'ms', 'webkit', 'moz', 'o'];
+
+    for (var i = 0; i < prefixes.length; i++) {
+      var toCheck = prefixes[i] ? prefixes[i] + property.charAt(0).toUpperCase() + property.slice(1) : property;
+      if (typeof root.document.body.style[toCheck] !== 'undefined') {
+        return toCheck;
+      }
+    }
+    return null;
+  }
+
+  /**
+   * The Object.assign() method is used to copy the values of all enumerable own properties from one or more source
+   * objects to a target object. It will return the target object.
+   * This polyfill doesn't support symbol properties, since ES5 doesn't have symbols anyway
+   * Source: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign
+   * @function
+   * @ignore
+   */
+  if (!assign_default.a) {
+    Object.defineProperty(Object, 'assign', {
+      enumerable: false,
+      configurable: true,
+      writable: true,
+      value: function value(target) {
+        if (target === undefined || target === null) {
+          throw new TypeError('Cannot convert first argument to object');
+        }
+
+        var to = Object(target);
+        for (var i = 1; i < arguments.length; i++) {
+          var nextSource = arguments[i];
+          if (nextSource === undefined || nextSource === null) {
+            continue;
+          }
+          nextSource = Object(nextSource);
+
+          var keysArray = keys_default()(nextSource);
+          for (var nextIndex = 0, len = keysArray.length; nextIndex < len; nextIndex++) {
+            var nextKey = keysArray[nextIndex];
+            var desc = get_own_property_descriptor_default()(nextSource, nextKey);
+            if (desc !== undefined && desc.enumerable) {
+              to[nextKey] = nextSource[nextKey];
+            }
+          }
+        }
+        return to;
+      }
+    });
+  }
+
+  return Popper;
+}
+/* harmony default export */ var _popper_popper = (popper_createPopper());
+// CONCATENATED MODULE: ./components/_util/_popper/vue-popper.js
+
+
+
+var stop = function stop(e) {
+  return 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.
+ */
+/* harmony default export */ var vue_popper = __webpack_exports__["a"] = ({
+  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: function _default() {
+        return {
+          gpuAcceleration: false
+        };
+      }
+    }
+  },
+
+  data: function data() {
+    return {
+      showPopper: false,
+      currentPlacement: ''
+    };
+  },
+
+
+  watch: {
+    value: {
+      immediate: true,
+      handler: function handler(val) {
+        this.showPopper = val;
+        this.$emit('input', val);
+      }
+    },
+
+    showPopper: function showPopper(val) {
+      if (this.disabled) return;
+      val ? this.updatePopper() : this.destroyPopper();
+      this.$emit('input', val);
+    }
+  },
+
+  methods: {
+    createPopper: function createPopper() {
+      var _this = this;
+
+      var options = this.popperOptions;
+      var popper = this.popperElm = this.popperElm || this.popper || this.$refs.popper;
+      var realPlacement = void 0;
+      if (popper.__vue__ && popper.__vue__.$parent && popper.__vue__.$parent.$options.name === 'MdsCascader') {
+        realPlacement = 'bottom-start';
+      } else {
+        realPlacement = this.realPlacement || this.placement;
+      }
+      this.currentPlacement = this.currentPlacement || realPlacement;
+      if (!/^(top|bottom|left|right)(-start|-end)?$/g.test(this.currentPlacement)) {
+        return;
+      }
+
+      var 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 _popper_popper(reference, popper, options);
+      this.popperJS.onCreate(function (_) {
+        _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 = popup_main["a" /* PopupMain */].nextZIndex();
+      this.popperElm.addEventListener('click', stop);
+    },
+    updatePopper: function updatePopper(zIndexFlag) {
+      var popperJS = this.popperJS;
+      if (popperJS) {
+        popperJS.update();
+        if (popperJS._popper) {
+          if (!zIndexFlag) {
+            popperJS._popper.style.zIndex = popup_main["a" /* PopupMain */].nextZIndex();
+          }
+        }
+      } else {
+        this.createPopper();
+      }
+    },
+    doDestroy: function doDestroy(forceDestroy) {
+      /* istanbul ignore if */
+      if (!this.popperJS || this.showPopper && !forceDestroy) return;
+      this.popperJS.destroy();
+      this.popperJS = null;
+    },
+    destroyPopper: function destroyPopper() {
+      if (this.popperJS) {
+        this.resetTransformOrigin();
+      }
+    },
+    resetTransformOrigin: function resetTransformOrigin() {
+      if (!this.transformOrigin) return;
+      var placementMap = {
+        top: 'bottom',
+        bottom: 'top',
+        left: 'right',
+        right: 'left'
+      };
+      var placement = this.popperJS._popper.getAttribute('x-placement').split('-')[0];
+      var origin = placementMap[placement];
+      this.popperJS._popper.style.transformOrigin = typeof this.transformOrigin === 'string' ? this.transformOrigin : ['top', 'bottom'].indexOf(placement) > -1 ? 'center ' + origin : origin + ' center';
+    },
+    appendArrow: function appendArrow(element) {
+      var hash = void 0;
+      if (this.appended) {
+        return;
+      }
+
+      this.appended = true;
+
+      for (var item in element.attributes) {
+        if (/^_v-/.test(element.attributes[item].name)) {
+          hash = element.attributes[item].name;
+          break;
+        }
+      }
+
+      var arrow = document.createElement('div');
+
+      if (hash) {
+        arrow.setAttribute(hash, '');
+      }
+      arrow.setAttribute('x-arrow', '');
+      arrow.className = 'popper__arrow';
+      element.appendChild(arrow);
+    }
+  },
+
+  beforeDestroy: function beforeDestroy() {
+    this.doDestroy(true);
+    if (this.popperElm && this.popperElm.parentNode === document.body) {
+      this.popperElm.removeEventListener('click', stop);
+      document.body.removeChild(this.popperElm);
+    }
+  },
+  deactivated: function deactivated() {
+    this.$options.beforeDestroy[0].call(this);
+  }
+});
+
+/***/ }),
+
+/***/ 18:
+/***/ (function(module, exports) {
+
+module.exports = require("babel-runtime/core-js/object/get-own-property-descriptor");
+
+/***/ }),
+
+/***/ 2:
+/***/ (function(module, exports) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__2__;
+
+/***/ }),
+
+/***/ 21:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "d", function() { return on; });
+/* unused harmony export off */
+/* unused harmony export once */
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return hasClass; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return addClass; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "e", function() { return removeClass; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return getStyle; });
+/* unused harmony export setStyle */
+/* unused harmony export isScroll */
+/* unused harmony export getScrollContainer */
+/* unused harmony export isInContainer */
+/* harmony import */ var babel_runtime_helpers_typeof__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9);
+/* harmony import */ var babel_runtime_helpers_typeof__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babel_runtime_helpers_typeof__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(2);
+/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(vue__WEBPACK_IMPORTED_MODULE_1__);
+
+/* istanbul ignore next */
+
+
+
+var isServer = vue__WEBPACK_IMPORTED_MODULE_1___default.a.prototype.$isServer;
+
+/* eslint no-useless-escape: 0 */
+var SPECIAL_CHARS_REGEXP = /([\:\-\_]+(.))/g;
+var MOZ_HACK_REGEXP = /^moz([A-Z])/;
+var ieVersion = isServer ? 0 : Number(document.documentMode);
+
+/* istanbul ignore next */
+var trim = function trim(string) {
+  return (string || '').replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, '');
+};
+/* istanbul ignore next */
+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');
+};
+
+/* istanbul ignore next */
+var on = function () {
+  if (!isServer && document.addEventListener) {
+    return function (element, event, handler) {
+      if (element && event && handler) {
+        element.addEventListener(event, handler, false);
+      }
+    };
+  } else {
+    return function (element, event, handler) {
+      if (element && event && handler) {
+        element.attachEvent('on' + event, handler);
+      }
+    };
+  }
+}();
+
+/* istanbul ignore next */
+var off = function () {
+  if (!isServer && document.removeEventListener) {
+    return function (element, event, handler) {
+      if (element && event) {
+        element.removeEventListener(event, handler, false);
+      }
+    };
+  } else {
+    return function (element, event, handler) {
+      if (element && event) {
+        element.detachEvent('on' + event, handler);
+      }
+    };
+  }
+}();
+
+/* istanbul ignore next */
+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);
+};
+
+/* istanbul ignore next */
+function hasClass(el, cls) {
+  if (!el || !cls) return false;
+  if (cls.indexOf(' ') !== -1) throw new Error('className should not contain space.');
+  if (el.classList) {
+    return el.classList.contains(cls);
+  } else {
+    return (' ' + el.className + ' ').indexOf(' ' + cls + ' ') > -1;
+  }
+}
+
+/* istanbul ignore next */
+function addClass(el, cls) {
+  if (!el) return;
+  var curClass = el.className;
+  var classes = (cls || '').split(' ');
+
+  for (var i = 0, j = classes.length; i < j; i++) {
+    var clsName = classes[i];
+    if (!clsName) continue;
+
+    if (el.classList) {
+      el.classList.add(clsName);
+    } else if (!hasClass(el, clsName)) {
+      curClass += ' ' + clsName;
+    }
+  }
+  if (!el.classList) {
+    el.className = curClass;
+  }
+}
+
+/* istanbul ignore next */
+function removeClass(el, cls) {
+  if (!el || !cls) return;
+  var classes = cls.split(' ');
+  var curClass = ' ' + el.className + ' ';
+
+  for (var i = 0, j = classes.length; i < j; i++) {
+    var clsName = classes[i];
+    if (!clsName) continue;
+
+    if (el.classList) {
+      el.classList.remove(clsName);
+    } else if (hasClass(el, clsName)) {
+      curClass = curClass.replace(' ' + clsName + ' ', ' ');
+    }
+  }
+  if (!el.classList) {
+    el.className = trim(curClass);
+  }
+}
+
+/* istanbul ignore next */
+var getStyle = ieVersion < 9 ? function (element, styleName) {
+  if (isServer) return;
+  if (!element || !styleName) return null;
+  styleName = camelCase(styleName);
+  if (styleName === 'float') {
+    styleName = 'styleFloat';
+  }
+  try {
+    switch (styleName) {
+      case 'opacity':
+        try {
+          return element.filters.item('alpha').opacity / 100;
+        } catch (e) {
+          return 1.0;
+        }
+      default:
+        return element.style[styleName] || element.currentStyle ? element.currentStyle[styleName] : null;
+    }
+  } catch (e) {
+    return element.style[styleName];
+  }
+} : function (element, styleName) {
+  if (isServer) return;
+  if (!element || !styleName) return null;
+  styleName = camelCase(styleName);
+  if (styleName === 'float') {
+    styleName = 'cssFloat';
+  }
+  try {
+    var computed = document.defaultView.getComputedStyle(element, '');
+    return element.style[styleName] || computed ? computed[styleName] : null;
+  } catch (e) {
+    return element.style[styleName];
+  }
+};
+
+/* istanbul ignore next */
+function setStyle(element, styleName, value) {
+  if (!element || !styleName) return;
+
+  if ((typeof styleName === 'undefined' ? 'undefined' : babel_runtime_helpers_typeof__WEBPACK_IMPORTED_MODULE_0___default()(styleName)) === 'object') {
+    for (var prop in styleName) {
+      if (styleName.hasOwnProperty(prop)) {
+        setStyle(element, prop, styleName[prop]);
+      }
+    }
+  } else {
+    styleName = camelCase(styleName);
+    if (styleName === 'opacity' && ieVersion < 9) {
+      element.style.filter = isNaN(value) ? '' : 'alpha(opacity=' + value * 100 + ')';
+    } else {
+      element.style[styleName] = value;
+    }
+  }
+}
+
+var isScroll = function isScroll(el, vertical) {
+  if (isServer) return;
+
+  var determinedDirection = vertical !== null || vertical !== undefined;
+  var overflow = determinedDirection ? vertical ? getStyle(el, 'overflow-y') : getStyle(el, 'overflow-x') : getStyle(el, 'overflow');
+
+  return overflow.match(/(scroll|auto)/);
+};
+
+var getScrollContainer = function getScrollContainer(el, vertical) {
+  if (isServer) return;
+
+  var parent = el;
+  while (parent) {
+    if ([window, document, document.documentElement].includes(parent)) {
+      return window;
+    }
+    if (isScroll(parent, vertical)) {
+      return parent;
+    }
+    parent = parent.parentNode;
+  }
+
+  return parent;
+};
+
+var isInContainer = function isInContainer(el, container) {
+  if (isServer || !el || !container) return false;
+
+  var elRect = el.getBoundingClientRect();
+  var containerRect = void 0;
+
+  if ([window, document, document.documentElement, null, undefined].includes(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;
+};
+
+/***/ }),
+
+/***/ 22:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var mds_ui_transition__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(11);
+/* harmony import */ var mds_ui_transition__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(mds_ui_transition__WEBPACK_IMPORTED_MODULE_0__);
+
+
+var placementMap = {
+  top: 'top',
+  left: 'left',
+  right: 'right',
+  bottom: 'bottom',
+  topLeft: 'top-start',
+  topRight: 'top-end',
+  bottomLeft: 'bottom-start',
+  bottomRight: 'bottom-end',
+  leftTop: 'left-start',
+  leftBottom: 'left-end',
+  rightTop: 'right-start',
+  rightBottom: 'right-end'
+};
+
+/* harmony default export */ __webpack_exports__["a"] = ({
+  components: {
+    mdsTransition: mds_ui_transition__WEBPACK_IMPORTED_MODULE_0___default.a
+  },
+  computed: {
+    realPlacement: function realPlacement() {
+      return placementMap[this.placement];
+    }
+  }
+});
+
+/***/ }),
+
+/***/ 232:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ }),
+
+/***/ 29:
+/***/ (function(module, exports) {
+
+module.exports = require("moment");
+
+/***/ }),
+
+/***/ 3:
 /***/ (function(module, exports) {
 
 module.exports = require("babel-runtime/helpers/defineProperty");
 
 /***/ }),
 
-/***/ 13:
-/***/ (function(module, exports) {
+/***/ 38:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
+/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(vue__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _dom_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(21);
+
+
+
+var nodeList = [];
+var ctx = '@@clickoutsideContext';
+
+var startClick = void 0;
+var seed = 0;
+
+!vue__WEBPACK_IMPORTED_MODULE_0___default.a.prototype.$isServer && Object(_dom_js__WEBPACK_IMPORTED_MODULE_1__[/* on */ "d"])(document, 'mousedown', function (e) {
+  return startClick = e;
+});
+
+!vue__WEBPACK_IMPORTED_MODULE_0___default.a.prototype.$isServer && Object(_dom_js__WEBPACK_IMPORTED_MODULE_1__[/* on */ "d"])(document, 'mouseup', function (e) {
+  nodeList.forEach(function (node) {
+    return node[ctx].documentHandler(e, startClick);
+  });
+});
+
+function createDocumentHandler(el, binding, vnode) {
+  return function () {
+    var mouseup = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    var mousedown = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+
+    if (!vnode || !vnode.context || !mouseup.target || !mousedown.target || el.contains(mouseup.target) || el.contains(mousedown.target) || el === mouseup.target || vnode.context.popperElm && (vnode.context.popperElm.contains(mouseup.target) || vnode.context.popperElm.contains(mousedown.target))) return;
+
+    if (binding.expression && el[ctx].methodName && vnode.context[el[ctx].methodName]) {
+      vnode.context[el[ctx].methodName]();
+    } else {
+      el[ctx].bindingFn && el[ctx].bindingFn();
+    }
+  };
+}
+
+/**
+ * v-clickoutside
+ * @desc 点击元素外面才会触发的事件
+ * @example
+ * ```vue
+ * <div v-element-clickoutside="handleClose">
+ * ```
+ */
+/* harmony default export */ __webpack_exports__["a"] = ({
+  bind: function bind(el, binding, vnode) {
+    nodeList.push(el);
+    var id = seed++;
+    el[ctx] = {
+      id: id,
+      documentHandler: createDocumentHandler(el, binding, vnode),
+      methodName: binding.expression,
+      bindingFn: binding.value
+    };
+  },
+  update: function update(el, binding, vnode) {
+    el[ctx].documentHandler = createDocumentHandler(el, binding, vnode);
+    el[ctx].methodName = binding.expression;
+    el[ctx].bindingFn = binding.value;
+  },
+  unbind: function unbind(el) {
+    var len = nodeList.length;
+
+    for (var i = 0; i < len; i++) {
+      if (nodeList[i][ctx].id === el[ctx].id) {
+        nodeList.splice(i, 1);
+        break;
+      }
+    }
+    delete el[ctx];
+  }
+});
+
+/***/ }),
+
+/***/ 5:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
 
-module.exports = __WEBPACK_EXTERNAL_MODULE__13__;
+"use strict";
+/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
+/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(vue__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _dom_helper__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(1);
+
+
+
+var hasModal = false;
+var hasInitZIndex = false;
+var zIndex = void 0;
+
+var getModal = function getModal() {
+  if (vue__WEBPACK_IMPORTED_MODULE_0___default.a.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;
+};
 
-/***/ 131:
-/***/ (function(module, exports) {
+var instances = {};
 
-// removed by extract-text-webpack-plugin
+var PopupManager = {
+  modalFade: true,
 
-/***/ }),
+  getInstance: function getInstance(id) {
+    return instances[id];
+  },
 
-/***/ 223:
-/***/ (function(module, exports) {
+  register: function register(id, instance) {
+    if (id && instance) {
+      instances[id] = instance;
+    }
+  },
 
-// removed by extract-text-webpack-plugin
+  deregister: function deregister(id) {
+    if (id) {
+      instances[id] = null;
+      delete instances[id];
+    }
+  },
 
-/***/ }),
+  nextZIndex: function nextZIndex() {
+    return PopupManager.zIndex++;
+  },
 
-/***/ 29:
-/***/ (function(module, exports) {
+  modalStack: [],
 
-module.exports = require("moment");
+  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();
+    }
+  },
 
-/***/ 3:
-/***/ (function(module, exports) {
+  openModal: function openModal(id, zIndex, dom, modalClass, modalFade) {
+    if (vue__WEBPACK_IMPORTED_MODULE_0___default.a.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();
+
+    Object(_dom_helper__WEBPACK_IMPORTED_MODULE_1__[/* addClass */ "a"])(modalDom, 'v-modal');
+    if (this.modalFade && !hasModal) {
+      Object(_dom_helper__WEBPACK_IMPORTED_MODULE_1__[/* addClass */ "a"])(modalDom, 'v-modal-enter');
+    }
+    if (modalClass) {
+      var classArr = modalClass.trim().split(/\s+/);
+      classArr.forEach(function (item) {
+        return Object(_dom_helper__WEBPACK_IMPORTED_MODULE_1__[/* addClass */ "a"])(modalDom, item);
+      });
+    }
+    setTimeout(function () {
+      Object(_dom_helper__WEBPACK_IMPORTED_MODULE_1__[/* removeClass */ "h"])(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 Object(_dom_helper__WEBPACK_IMPORTED_MODULE_1__[/* removeClass */ "h"])(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) {
+        Object(_dom_helper__WEBPACK_IMPORTED_MODULE_1__[/* addClass */ "a"])(modalDom, 'v-modal-leave');
+      }
+      setTimeout(function () {
+        if (modalStack.length === 0) {
+          if (modalDom.parentNode) modalDom.parentNode.removeChild(modalDom);
+          modalDom.style.display = 'none';
+          PopupManager.modalDom = undefined;
+        }
+        Object(_dom_helper__WEBPACK_IMPORTED_MODULE_1__[/* removeClass */ "h"])(modalDom, 'v-modal-leave');
+      }, 200);
+    }
+  }
+};
 
-module.exports = __WEBPACK_EXTERNAL_MODULE__3__;
+Object.defineProperty(PopupManager, 'zIndex', {
+  configurable: true,
+  get: function get() {
+    if (!hasInitZIndex) {
+      zIndex = zIndex || (vue__WEBPACK_IMPORTED_MODULE_0___default.a.prototype.$ELEMENT || {}).zIndex || 2000;
+      hasInitZIndex = true;
+    }
+    return zIndex;
+  },
+  set: function set(value) {
+    zIndex = value;
+  }
+});
+
+var getTopPopup = function getTopPopup() {
+  if (vue__WEBPACK_IMPORTED_MODULE_0___default.a.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 (!vue__WEBPACK_IMPORTED_MODULE_0___default.a.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();
+      }
+    }
+  });
+}
+
+/* harmony default export */ __webpack_exports__["a"] = (PopupManager);
 
 /***/ }),
 
-/***/ 4:
+/***/ 6:
 /***/ (function(module, exports) {
 
-module.exports = __WEBPACK_EXTERNAL_MODULE__4__;
+module.exports = require("babel-runtime/core-js/object/assign");
 
 /***/ }),
 
-/***/ 44:
+/***/ 7:
 /***/ (function(module, exports) {
 
-module.exports = __WEBPACK_EXTERNAL_MODULE__44__;
+module.exports = __WEBPACK_EXTERNAL_MODULE__7__;
 
 /***/ }),
 
-/***/ 5:
+/***/ 8:
 /***/ (function(module, exports) {
 
-module.exports = __WEBPACK_EXTERNAL_MODULE__5__;
+module.exports = __WEBPACK_EXTERNAL_MODULE__8__;
 
 /***/ }),
 
-/***/ 6:
+/***/ 9:
 /***/ (function(module, exports) {
 
-module.exports = __WEBPACK_EXTERNAL_MODULE__6__;
+module.exports = require("babel-runtime/helpers/typeof");
 
 /***/ }),
 
-/***/ 87:
+/***/ 94:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -281,10 +2862,10 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__6__;
 __webpack_require__.r(__webpack_exports__);
 
 // EXTERNAL MODULE: ./components/style/index.less
-var style = __webpack_require__(131);
+var style = __webpack_require__(139);
 
 // EXTERNAL MODULE: ./components/timepicker/style/index.less
-var timepicker_style = __webpack_require__(223);
+var timepicker_style = __webpack_require__(232);
 
 // CONCATENATED MODULE: ./components/timepicker/style/index.js
 
@@ -293,21 +2874,59 @@ var timepicker_style = __webpack_require__(223);
 // style dependencies
 // import '../../input/style'
 // EXTERNAL MODULE: external "babel-runtime/helpers/defineProperty"
-var defineProperty_ = __webpack_require__(1);
+var defineProperty_ = __webpack_require__(3);
 var defineProperty_default = /*#__PURE__*/__webpack_require__.n(defineProperty_);
 
-// EXTERNAL MODULE: external {"root":"Vue","commonjs":"vue","commonjs2":"vue","amd":"vue"}
-var external_root_Vue_commonjs_vue_commonjs2_vue_amd_vue_ = __webpack_require__(5);
-var external_root_Vue_commonjs_vue_commonjs2_vue_amd_vue_default = /*#__PURE__*/__webpack_require__.n(external_root_Vue_commonjs_vue_commonjs2_vue_amd_vue_);
-
 // EXTERNAL MODULE: external "moment"
 var external_moment_ = __webpack_require__(29);
 var external_moment_default = /*#__PURE__*/__webpack_require__.n(external_moment_);
 
-// EXTERNAL MODULE: external "./_mixin/popper"
-var popper_ = __webpack_require__(44);
-var popper_default = /*#__PURE__*/__webpack_require__.n(popper_);
+// EXTERNAL MODULE: ./components/_util/_popper/popper-mixin.js
+var popper_mixin = __webpack_require__(22);
+
+// EXTERNAL MODULE: ./components/_util/_popper/vue-popper.js + 1 modules
+var vue_popper = __webpack_require__(17);
+
+// CONCATENATED MODULE: ./components/timepicker/lazyMode.js
+/* harmony default export */ var lazyMode = ({
+  data: function data() {
+    return {
+      lazyMomentValue: null, // lazyMode模式下用于展示时间值，确定后回显
+      lazyTempValue: null // lazyMode模式下用于暂存时间值
+    };
+  },
 
+  methods: {
+    lazyCancel: function lazyCancel(e) {
+      var _this = this;
+
+      e.stopPropagation();
+      this.closePopper();
+      setTimeout(function () {
+        _this.momentValue = _this.lazyTempValue;
+      }, 300);
+    },
+    lazyConfirm: function lazyConfirm(e) {
+      e.stopPropagation();
+      this.lazyTempValue = this.momentValue;
+      this.emitChange(this.momentValue);
+      this.closePopper();
+    },
+    emitChange: function emitChange(value) {
+      if (this.isRange) {
+        var formatValue = [];
+        formatValue[0] = this.valueFormat ? value[0] ? value[0].format(this.valueFormat) : '' : value[0];
+        formatValue[1] = this.valueFormat ? value[1] ? value[1].format(this.valueFormat) : '' : value[1];
+        this.$emit('change', formatValue);
+        this.dispatch('MdsFormItem', 'formItemChange', formatValue);
+      } else {
+        var _formatValue = this.valueFormat ? value.format(this.valueFormat) : value;
+        this.$emit('change', _formatValue);
+        this.dispatch('MdsFormItem', 'formItemChange', _formatValue);
+      }
+    }
+  }
+});
 // CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./components/timepicker/header.vue?vue&type=template&id=94a41d54&
 var headervue_type_template_id_94a41d54_render = function () {
   var _vm = this
@@ -392,7 +3011,7 @@ headervue_type_template_id_94a41d54_render._withStripped = true
 // CONCATENATED MODULE: ./components/timepicker/header.vue?vue&type=template&id=94a41d54&
 
 // EXTERNAL MODULE: external "./icon"
-var external_icon_ = __webpack_require__(4);
+var external_icon_ = __webpack_require__(8);
 var external_icon_default = /*#__PURE__*/__webpack_require__.n(external_icon_);
 
 // CONCATENATED MODULE: ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./components/timepicker/header.vue?vue&type=script&lang=js&
@@ -641,6 +3260,9 @@ var scrollTo = function scrollTo(element, to, duration) {
       }
       var index = this.selectedIndex < 0 ? 0 : this.selectedIndex;
       var topOption = list.children[index];
+      if (!topOption) {
+        return;
+      }
       var to = topOption.offsetTop;
       scrollTo(select, to, duration);
     }
@@ -907,6 +3529,7 @@ combobox_component.options.__file = "components/timepicker/combobox.vue"
 
 
 
+
 var generateOptions = function generateOptions(length, disabledOptions, hideDisabledOptions) {
   var step = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1;
 
@@ -929,6 +3552,8 @@ var isAM = function isAM(value) {
     disabledHours: Function,
     disabledMinutes: Function,
     disabledSeconds: Function,
+    mintime: Object,
+    maxtime: Object,
     isRange: Boolean,
     isShow: Boolean,
     format: String,
@@ -943,12 +3568,23 @@ var isAM = function isAM(value) {
     showSecond: Boolean,
     use12Hours: Boolean,
     allowEmpty: Boolean,
-    value: null
+    value: null,
+    step: Number
   },
   components: {
     MdsPickerHeader: header,
     MdsPickerCombobox: combobox
   },
+  data: function data() {
+    return {
+      handleTimeMap: {
+        H: this.handleDisabledHoursOptions,
+        m: this.handleDisabledMinutesOptions,
+        s: this.handleDisabledSecondsOptions
+      }
+    };
+  },
+
   methods: {
     handleChange: function handleChange(value, index) {
       if (typeof index === 'number' && this.isRange) {
@@ -963,6 +3599,129 @@ var isAM = function isAM(value) {
     },
     handleHeaderClick: function handleHeaderClick(e) {
       this.$emit('clear', e);
+    },
+    handleMinOrMaxTime: function handleMinOrMaxTime(type) {
+      var result = [];
+      if (this.mintime && !external_moment_default.a.isMoment(this.mintime)) {
+        return result;
+      }
+      if (this.maxtime && !external_moment_default.a.isMoment(this.maxtime)) {
+        return result;
+      }
+
+      // 如果设置的初始时间不在限定时间范围内，做重新修正(会引起后续bug，暂不实现)
+      this.fixCurrentTime();
+      if (Array.isArray(this.value)) {
+        return result;
+      }
+
+      result = this.handleTimeMap[type]();
+      return result;
+    },
+    fixCurrentTime: function fixCurrentTime() {
+      if (!this.value || Array.isArray(this.value)) {
+        return;
+      }
+      var now = this.value._d.getTime();
+      if (this.mintime) {
+        var min = this.mintime._d.getTime();
+        if (now < min) {
+          this.$emit('change', this.mintime);
+          return;
+        }
+      }
+      if (this.maxtime) {
+        var max = this.maxtime._d.getTime();
+        if (now > max) {
+          this.$emit('change', this.maxtime);
+        }
+      }
+    },
+    handleDisabledHoursOptions: function handleDisabledHoursOptions() {
+      var result = [];
+      var step = 24;
+      var min = 0;
+      var max = 24;
+      if (this.mintime) {
+        min = parseInt(this.mintime.format('H'));
+      }
+      if (this.maxtime) {
+        max = parseInt(this.maxtime.format('H'));
+      }
+      for (var i = 0; i < min; i++) {
+        result.push(i);
+      }
+      for (var _i = max + 1; _i < step; _i++) {
+        result.push(_i);
+      }
+      return result;
+    },
+    handleDisabledMinutesOptions: function handleDisabledMinutesOptions() {
+      var result = [];
+      if (!this.value) {
+        return result;
+      }
+      var currentHour = parseInt(this.value.format('H'));
+      var minHour = void 0;
+      var maxHour = void 0;
+      var minMinute = 0;
+      var maxMinute = 60;
+      var step = 60;
+      if (this.mintime) {
+        minMinute = parseInt(this.mintime.format('m'));
+        minHour = parseInt(this.mintime.format('H'));
+      }
+      if (this.maxtime) {
+        maxMinute = parseInt(this.maxtime.format('m'));
+        maxHour = parseInt(this.maxtime.format('H'));
+      }
+      if (currentHour === minHour) {
+        for (var i = 0; i < minMinute; i++) {
+          result.push(i);
+        }
+      }
+      if (currentHour === maxHour) {
+        for (var _i2 = maxMinute + 1; _i2 < step; _i2++) {
+          result.push(_i2);
+        }
+      }
+      return result;
+    },
+    handleDisabledSecondsOptions: function handleDisabledSecondsOptions() {
+      var result = [];
+      if (!this.value) {
+        return result;
+      }
+      var currentHour = parseInt(this.value.format('H'));
+      var currentMinute = parseInt(this.value.format('m'));
+      var minHour = void 0;
+      var maxHour = void 0;
+      var minMinute = void 0;
+      var maxMinute = void 0;
+      var minSecond = 0;
+      var maxSecond = 60;
+      var step = 60;
+      if (this.mintime) {
+        minSecond = parseInt(this.mintime.format('s'));
+        minMinute = parseInt(this.mintime.format('m'));
+        minHour = parseInt(this.mintime.format('H'));
+      }
+      if (this.maxtime) {
+        maxSecond = parseInt(this.maxtime.format('s'));
+        maxMinute = parseInt(this.maxtime.format('m'));
+        maxHour = parseInt(this.maxtime.format('H'));
+      }
+      if (currentHour === minHour && currentMinute === minMinute) {
+        for (var i = 0; i < minSecond; i++) {
+          result.push(i);
+        }
+      }
+      if (currentHour === maxHour && currentMinute === maxMinute) {
+        for (var _i3 = maxSecond + 1; _i3 < step; _i3++) {
+          result.push(_i3);
+        }
+      }
+      return result;
     }
   },
   render: function render(h) {
@@ -984,9 +3743,10 @@ var isAM = function isAM(value) {
       var otherValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
       var index = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
 
-      var disabledHourOptions = disabledHours(value);
-      var disabledMinuteOptions = _this.disabledMinutes(value ? value.hour() : null);
-      var disabledSecondOptions = _this.disabledSeconds(value ? value.hour() : null, value ? value.minute() : null);
+      var disabledHourOptions = disabledHours(value).concat(_this.handleMinOrMaxTime('H'));
+      var disabledMinuteOptions = _this.disabledMinutes(value ? value.hour() : null).concat(_this.handleMinOrMaxTime('m'));
+
+      var disabledSecondOptions = _this.disabledSeconds(value ? value.hour() : null, value ? value.minute() : null).concat(_this.handleMinOrMaxTime('s'));
       if (index === 0 && otherValue) {
         var totalHour = void 0;
         _this.use12Hours ? totalHour = 12 : totalHour = 24;
@@ -994,33 +3754,41 @@ var isAM = function isAM(value) {
           if (disabledHourOptions.indexOf(i) < 0) disabledHourOptions.push(i);
         }
         if (value && value.hour() >= otherValue.hour()) {
-          for (var _i = otherValue.minute(); _i <= 60; _i++) {
-            if (disabledMinuteOptions.indexOf(_i) < 0) disabledMinuteOptions.push(_i);
+          for (var _i4 = otherValue.minute(); _i4 <= 60; _i4++) {
+            if (disabledMinuteOptions.indexOf(_i4) < 0) {
+              disabledMinuteOptions.push(_i4);
+            }
           }
         }
         if (value && value.hour() >= otherValue.hour() && value.minute() >= otherValue.minute()) {
-          for (var _i2 = otherValue.second() + 1; _i2 <= 60; _i2++) {
-            if (disabledSecondOptions.indexOf(_i2) < 0) disabledSecondOptions.push(_i2);
+          for (var _i5 = otherValue.second() + 1; _i5 <= 60; _i5++) {
+            if (disabledSecondOptions.indexOf(_i5) < 0) {
+              disabledSecondOptions.push(_i5);
+            }
           }
         }
       } else if (index === 1 && otherValue) {
-        for (var _i3 = 0; _i3 < otherValue.hour(); _i3++) {
-          if (disabledHourOptions.indexOf(_i3) < 0) disabledHourOptions.push(_i3);
+        for (var _i6 = 0; _i6 < otherValue.hour(); _i6++) {
+          if (disabledHourOptions.indexOf(_i6) < 0) disabledHourOptions.push(_i6);
         }
         if (value && value.hour() <= otherValue.hour()) {
-          for (var _i4 = 0; _i4 < otherValue.minute(); _i4++) {
-            if (disabledMinuteOptions.indexOf(_i4) < 0) disabledMinuteOptions.push(_i4);
+          for (var _i7 = 0; _i7 < otherValue.minute(); _i7++) {
+            if (disabledMinuteOptions.indexOf(_i7) < 0) {
+              disabledMinuteOptions.push(_i7);
+            }
           }
         }
         if (value && value.hour() <= otherValue.hour() && value.minute() <= otherValue.minute()) {
-          for (var _i5 = 0; _i5 < otherValue.second(); _i5++) {
-            if (disabledSecondOptions.indexOf(_i5) < 0) disabledSecondOptions.push(_i5);
+          for (var _i8 = 0; _i8 < otherValue.second(); _i8++) {
+            if (disabledSecondOptions.indexOf(_i8) < 0) {
+              disabledSecondOptions.push(_i8);
+            }
           }
         }
       }
 
       var hourOptions = generateOptions(24, disabledHourOptions, _this.hideDisabledOptions);
-      var minuteOptions = generateOptions(60, disabledMinuteOptions, _this.hideDisabledOptions);
+      var minuteOptions = generateOptions(60, disabledMinuteOptions, _this.hideDisabledOptions, _this.step);
       var secondOptions = generateOptions(60, disabledSecondOptions, _this.hideDisabledOptions);
       return h(combobox, {
         attrs: {
@@ -1042,7 +3810,8 @@ var isAM = function isAM(value) {
 
           use12Hours: _this.use12Hours,
           index: index,
-          value: value },
+          value: value
+        },
         on: {
           'change': _this.handleChange
         }
@@ -1063,7 +3832,9 @@ var isAM = function isAM(value) {
       if (_this.isRange) {
         return h(
           'div',
-          { 'class': _this.prefixCls + '-picker-box ' + _this.prefixCls + '-picker-half' },
+          {
+            'class': _this.prefixCls + '-picker-box ' + _this.prefixCls + '-picker-half'
+          },
           [h(
             'div',
             { 'class': _this.prefixCls + '-picker-box-halfbox' },
@@ -1090,21 +3861,7 @@ var isAM = function isAM(value) {
     return h(
       'div',
       { 'class': this.prefixCls + '-inner' },
-      [h(header, {
-        attrs: {
-          size: this.size,
-          prefixCls: this.prefixCls,
-          allowEmpty: this.allowEmpty,
-          isRange: this.isRange,
-          clearText: this.clearText,
-          format: this.format,
-
-          placeholder: this.placeholder,
-          value: this.value },
-        on: {
-          'clear': this.handleHeaderClick
-        }
-      }), getPickerBox()]
+      [getPickerBox()]
     );
   }
 });
@@ -1133,15 +3890,22 @@ var panel_component = Object(componentNormalizer["a" /* default */])(
 if (false) { var panel_api; }
 panel_component.options.__file = "components/timepicker/panel.vue"
 /* harmony default export */ var panel = (panel_component.exports);
+// EXTERNAL MODULE: ./components/_util/clickoutside.js
+var clickoutside = __webpack_require__(38);
+
 // EXTERNAL MODULE: external "./_util/proptype"
-var proptype_ = __webpack_require__(3);
+var proptype_ = __webpack_require__(7);
 
 // EXTERNAL MODULE: external "./transition"
-var external_transition_ = __webpack_require__(13);
+var external_transition_ = __webpack_require__(11);
 var external_transition_default = /*#__PURE__*/__webpack_require__.n(external_transition_);
 
+// EXTERNAL MODULE: external "./button"
+var external_button_ = __webpack_require__(13);
+var external_button_default = /*#__PURE__*/__webpack_require__.n(external_button_);
+
 // EXTERNAL MODULE: external "./_mixin/emitter"
-var emitter_ = __webpack_require__(6);
+var emitter_ = __webpack_require__(12);
 var emitter_default = /*#__PURE__*/__webpack_require__.n(emitter_);
 
 // CONCATENATED MODULE: ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./components/timepicker/time-picker.vue?vue&type=script&lang=js&
@@ -1156,6 +3920,10 @@ var emitter_default = /*#__PURE__*/__webpack_require__.n(emitter_);
 
 
 
+
+
+
+
 function generateShowHourMinuteSecond(format) {
   // Ref: http://momentjs.com/docs/#/parsing/string-format/
   return {
@@ -1167,7 +3935,8 @@ function generateShowHourMinuteSecond(format) {
 
 /* harmony default export */ var time_pickervue_type_script_lang_js_ = ({
   name: 'MdsTimePicker',
-  mixins: [popper_default.a, emitter_default.a],
+  mixins: [vue_popper["a" /* default */], popper_mixin["a" /* default */], emitter_default.a, lazyMode],
+  directives: { Clickoutside: clickoutside["a" /* default */] },
   model: {
     event: 'change'
   },
@@ -1186,7 +3955,8 @@ function generateShowHourMinuteSecond(format) {
         }
       },
       visible: false,
-      momentValue: null
+      momentValue: null,
+      inputHover: false
     };
   },
 
@@ -1195,10 +3965,7 @@ function generateShowHourMinuteSecond(format) {
       type: String,
       default: 'mds-time-picker'
     },
-    width: {
-      type: Number,
-      default: 240
-    },
+    width: Number,
     allowEmpty: {
       type: Boolean,
       default: true
@@ -1214,7 +3981,7 @@ function generateShowHourMinuteSecond(format) {
       },
 
       default: function _default() {
-        return external_moment_default()();
+        return external_moment_default()('00:00:00', 'HH:mm:ss');
       }
     },
     disabled: {
@@ -1239,6 +4006,8 @@ function generateShowHourMinuteSecond(format) {
         return [];
       }
     },
+    mintime: Object,
+    maxtime: Object,
     format: {
       type: String,
       default: ''
@@ -1257,7 +4026,7 @@ function generateShowHourMinuteSecond(format) {
     },
     placement: {
       type: String,
-      default: 'topLeft'
+      default: 'bottomLeft'
     },
     placeholder: {
       type: String,
@@ -1300,12 +4069,19 @@ function generateShowHourMinuteSecond(format) {
       },
 
       required: true
-    }
+    },
+    step: {
+      type: Number,
+      default: 1
+    },
+    // 不得不说这也是一次可耻的业务封装，用来在面板下面加个确定取消，延迟回显
+    lazyMode: Boolean
   },
   components: {
     MdsPanel: panel,
     MdsTransition: external_transition_default.a,
-    MdsIcon: external_icon_default.a
+    MdsIcon: external_icon_default.a,
+    MdsButton: external_button_default.a
   },
   computed: {
     classes: function classes() {
@@ -1316,34 +4092,66 @@ function generateShowHourMinuteSecond(format) {
     },
     defaultFormat: function defaultFormat() {
       return this.format ? this.format : this.use12Hours ? 'h:mm:ss a' : 'HH:mm:ss';
+    },
+    realMomentValue: function realMomentValue() {
+      return this.lazyMode ? this.lazyMomentValue : this.momentValue;
+    },
+    displayClear: function displayClear() {
+      return this.inputHover && this.realMomentValue;
     }
   },
   created: function created() {
     this.initMomentValue();
   },
   mounted: function mounted() {
-    this.popper = this.popperVM.$el;
-    this.popper.style.width = this.$el.offsetWidth + 'px';
-    this.reference = this.$refs.picker;
     this.visible = this.open;
-    document.addEventListener('click', this.closePopper);
-  },
-  destroyed: function destroyed() {
-    document.removeEventListener('click', this.closePopper);
+    this.updatePopper();
   },
 
+
   watch: {
     open: function open(v) {
       this.visible = v;
     },
     visible: function visible(v) {
+      var _this = this;
+
       this.$emit('open-change', v);
+      if (v) {
+        if (this.lazyMode) {
+          this.lazyTempValue = this.value;
+        }
+        this.$nextTick(function () {
+          _this.updatePopper();
+          var panel = _this.$refs.popper.querySelector('.mds-time-picker-panel');
+          panel.style.minWidth = getComputedStyle(_this.$refs.reference).width;
+        });
+      } else {
+        if (this.lazyMode) {
+          setTimeout(function () {
+            _this.momentValue = _this.lazyTempValue;
+          }, 300);
+        }
+      }
     },
     value: function value(v) {
       this.initMomentValue();
     }
   },
   methods: {
+    clearValue: function clearValue(e) {
+      e.stopPropagation();
+      if (this.lazyMode) {
+        this.momentValue = '';
+        this.lazyTempValue = '';
+        this.emitChange(this.momentValue);
+      } else {
+        this.handleChange('');
+      }
+    },
+    initWidth: function initWidth() {
+      this.popper.style.width = this.$el.offsetWidth + 'px';
+    },
     initMomentValue: function initMomentValue() {
       if (this.isRange) {
         this.momentValue = [null, null];
@@ -1358,6 +4166,10 @@ function generateShowHourMinuteSecond(format) {
           this.momentValue = external_moment_default()(this.value, this.defaultFormat);
         } else this.momentValue = null;
       }
+
+      if (this.lazyMode) {
+        this.lazyMomentValue = this.momentValue;
+      }
     },
     handleClick: function handleClick() {
       if (this.disabled) {
@@ -1377,13 +4189,17 @@ function generateShowHourMinuteSecond(format) {
         formatValue[0] = this.valueFormat ? value[0] ? value[0].format(this.valueFormat) : '' : value[0];
         formatValue[1] = this.valueFormat ? value[1] ? value[1].format(this.valueFormat) : '' : value[1];
         this.momentValue = value;
-        this.$emit('change', formatValue);
-        this.dispatch('MdsFormItem', 'formItemChange', formatValue);
+        if (!this.lazyMode) {
+          this.$emit('change', formatValue);
+          this.dispatch('MdsFormItem', 'formItemChange', formatValue);
+        }
       } else {
         var _formatValue = this.valueFormat ? value.format(this.valueFormat) : value;
-        this.$emit('change', _formatValue);
         this.momentValue = value;
-        this.dispatch('MdsFormItem', 'formItemChange', _formatValue);
+        if (!this.lazyMode) {
+          this.$emit('change', _formatValue);
+          this.dispatch('MdsFormItem', 'formItemChange', _formatValue);
+        }
       }
     },
     handleClear: function handleClear(e) {
@@ -1400,12 +4216,11 @@ function generateShowHourMinuteSecond(format) {
       this.$emit('clear', e);
     },
     closePopper: function closePopper(e) {
-      if (!this.visible || !this.$el || !this.reference || !this.popper || this.$el.contains(e.target) || this.reference.contains(e.target) || this.popper.contains(e.target)) return;
       this.visible = false;
     }
   },
   render: function render(h) {
-    var _this = this;
+    var _this2 = this;
 
     if (this.isRange && !Array.isArray(this.value)) {
       throw new Error('传入的值必须为数组');
@@ -1413,118 +4228,194 @@ function generateShowHourMinuteSecond(format) {
       throw new Error('传入的值不能为数组');
     }
 
-    var _generateShowHourMinu = generateShowHourMinuteSecond(this.defaultFormat),
-        showHour = _generateShowHourMinu.showHour,
-        showMinute = _generateShowHourMinu.showMinute,
-        showSecond = _generateShowHourMinu.showSecond;
+    var footer = function footer() {
+      var slotFooter = _this2.$slots.default;
+
+      if (!_this2.lazyMode && !slotFooter) {
+        return null;
+      }
+
+      if (slotFooter) {
+        return slotFooter;
+      }
 
-    var vm = this;
-    this.popperVM = new external_root_Vue_commonjs_vue_commonjs2_vue_amd_vue_default.a({
-      render: function render(h) {
+      if (_this2.lazyMode) {
         return h(
-          external_transition_default.a,
-          {
-            attrs: { type: 'slide', motion: 'up' }
-          },
+          'div',
+          { 'class': 'lazy-footer' },
           [h(
-            'div',
+            'mds-button',
             {
-              'class': [vm.prefixCls + '-panel', vm.popupClassName, defineProperty_default()({}, vm.prefixCls + '-panel-narrow', (!showHour || !showMinute || !showSecond) && !vm.use12Hours)],
-              directives: [{
-                name: 'show',
-                value: vm.visible
-              }],
-
-              ref: 'popper' },
-            [h(
-              panel,
-              {
-                attrs: {
-                  size: vm.size,
-                  allowEmpty: vm.allowEmpty,
-                  clearText: vm.clearText,
-                  defaultOpenValue: vm.defaultOpenValue,
-                  isRange: vm.isRange,
-                  disabledHours: vm.disabledHours,
-                  disabledMinutes: vm.disabledMinutes,
-                  disabledSeconds: vm.disabledSeconds,
-                  format: vm.defaultFormat,
-                  hideDisabledOptions: vm.hideDisabledOptions,
-                  prefixCls: vm.prefixCls + '-panel',
-                  placeholder: vm.placeholder,
-                  showHour: showHour,
-                  showMinute: showMinute,
-                  showSecond: showSecond,
-                  use12Hours: vm.use12Hours,
-                  isShow: vm.visible,
-
-                  value: vm.momentValue },
-                on: {
-                  'change': vm.handleChange,
-                  'clear': vm.handleClear
+              attrs: {
+                type: 'normal',
+                size: 'large-small'
+              },
+              on: {
+                'click': function click(e) {
+                  _this2.lazyCancel(e);
                 }
+              }
+            },
+            ['\u53D6\u6D88']
+          ), h(
+            'mds-button',
+            {
+              attrs: {
+                type: 'normal',
+                size: 'large-small'
               },
-              [vm.$slots.default]
-            )]
+              style: 'margin-left: 0',
+              on: {
+                'click': function click(e) {
+                  _this2.lazyConfirm(e);
+                }
+              }
+            },
+            ['\u786E\u5B9A']
           )]
         );
       }
-    }).$mount();
+    };
+
+    var _generateShowHourMinu = generateShowHourMinuteSecond(this.defaultFormat),
+        showHour = _generateShowHourMinu.showHour,
+        showMinute = _generateShowHourMinu.showMinute,
+        showSecond = _generateShowHourMinu.showSecond;
+
+    var popperVM = h(
+      external_transition_default.a,
+      {
+        attrs: { type: 'slide', motion: 'up' }
+      },
+      [h(
+        'div',
+        {
+          'class': [this.prefixCls + '-panel', defineProperty_default()({}, this.prefixCls + '-panel-narrow', (!showHour || !showMinute || !showSecond) && !this.use12Hours)],
+          directives: [{
+            name: 'show',
+            value: this.visible
+          }]
+        },
+        [h(
+          panel,
+          {
+            attrs: {
+              step: this.step,
+              size: this.size,
+              allowEmpty: this.allowEmpty,
+              clearText: this.clearText,
+              defaultOpenValue: this.defaultOpenValue,
+              isRange: this.isRange,
+              disabledHours: this.disabledHours,
+              disabledMinutes: this.disabledMinutes,
+              disabledSeconds: this.disabledSeconds,
+              mintime: this.mintime,
+              maxtime: this.maxtime,
+              format: this.defaultFormat,
+              hideDisabledOptions: this.hideDisabledOptions,
+              prefixCls: this.prefixCls + '-panel',
+              placeholder: this.placeholder,
+              showHour: showHour,
+              showMinute: showMinute,
+              showSecond: showSecond,
+              use12Hours: this.use12Hours,
+              isShow: this.visible,
+
+              value: this.momentValue
+            },
+            on: {
+              'change': this.handleChange,
+              'clear': this.handleClear
+            }
+          },
+          [footer()]
+        )]
+      )]
+    );
+
     var getInput = function getInput() {
-      if (_this.isRange) {
+      if (_this2.isRange) {
         return h(
           'div',
-          { 'class': _this.prefixCls + '-box' },
+          { 'class': _this2.prefixCls + '-box' },
           [h('input', {
             ref: 'inputF',
-            'class': _this.prefixCls + '-input ' + _this.prefixCls + '-box-half',
-            attrs: { disabled: _this.disabled,
-              placeholder: _this.startPlaceholder
+            'class': _this2.prefixCls + '-input ' + _this2.prefixCls + '-box-half',
+            attrs: { disabled: _this2.disabled,
+              placeholder: _this2.startPlaceholder
             },
             domProps: {
-              'value': _this.momentValue[0] && _this.momentValue[0].format(_this.defaultFormat) || ''
+              'value': _this2.realMomentValue[0] && _this2.realMomentValue[0].format(_this2.defaultFormat) || ''
             }
           }), h(
             'span',
-            { 'class': _this.prefixCls + '-box-span' },
+            { 'class': _this2.prefixCls + '-box-span' },
             ['-']
           ), h('input', {
             ref: 'inputS',
-            'class': _this.prefixCls + '-input ' + _this.prefixCls + '-box-half',
-            attrs: { disabled: _this.disabled,
-              placeholder: _this.endPlaceholder
+            'class': _this2.prefixCls + '-input ' + _this2.prefixCls + '-box-half',
+            attrs: { disabled: _this2.disabled,
+              placeholder: _this2.endPlaceholder
             },
             domProps: {
-              'value': _this.momentValue[1] && _this.momentValue[1].format(_this.defaultFormat) || ''
+              'value': _this2.realMomentValue[1] && _this2.realMomentValue[1].format(_this2.defaultFormat) || ''
             }
           })]
         );
       } else {
         return h('input', {
           ref: 'input',
-          'class': _this.prefixCls + '-input',
-          attrs: { disabled: _this.disabled,
-            placeholder: _this.placeholder
+          'class': _this2.prefixCls + '-input',
+          attrs: { disabled: _this2.disabled,
+            placeholder: _this2.placeholder
           },
           domProps: {
-            'value': _this.momentValue && _this.momentValue.format(_this.defaultFormat) || ''
+            'value': _this2.realMomentValue && _this2.realMomentValue.format(_this2.defaultFormat) || ''
           }
         });
       }
     };
-    return h(
-      'span',
+
+    return h('span', [h(
+      'div',
       {
-        ref: 'picker',
-        style: 'width: ' + this.width + 'px',
+        ref: 'reference',
+        directives: [{
+          name: 'clickoutside',
+          value: this.closePopper
+        }],
+
+        style: this.width ? 'width: ' + this.width + 'px' : '',
         'class': this.classes,
         on: {
-          'click': this.handleClick
+          'click': this.handleClick,
+          'mouseenter': function mouseenter() {
+            _this2.inputHover = true;
+          },
+          'mouseleave': function mouseleave() {
+            _this2.inputHover = false;
+          }
         }
       },
-      [getInput(), h(external_icon_default.a, { 'class': this.prefixCls + '-icon', attrs: { type: 'line-clock-circle-o' }
+      [getInput(), this.displayClear ? h(external_icon_default.a, {
+        'class': this.prefixCls + '-icon',
+        attrs: { type: 'line-close'
+        },
+        nativeOn: {
+          'click': function click(e) {
+            _this2.clearValue(e);
+          }
+        }
+      }) : h(external_icon_default.a, {
+        'class': this.prefixCls + '-icon',
+        attrs: { type: 'line-clock-circle-o'
+        }
       })]
-    );
+    ), h(
+      'div',
+      { 'class': [this.prefixCls + '-panel-content', this.prefixCls + '-panel-content-placement', this.popupClassName], ref: 'popper' },
+      [popperVM]
+    )]);
   }
 });
 // CONCATENATED MODULE: ./components/timepicker/time-picker.vue?vue&type=script&lang=js&