eoss 0.1.0-alpha.20 → 0.1.0-alpha.21

package/lib/dropdown-menu.js

@@ -82,41 +82,283 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 192);
+/******/ 	return __webpack_require__(__webpack_require__.s = 196);
 /******/ })
 /************************************************************************/
 /******/ ({
 
-/***/ 101:
-/***/ (function(module, exports) {
+/***/ 12:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
 
-module.exports = require("eoss/lib/dropdown-item");
+"use strict";
+/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(4);
+/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(vue__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var eoss_src_utils_popup__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(23);
 
-/***/ }),
 
-/***/ 18:
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
 
-"use strict";
-/* harmony default export */ __webpack_exports__["a"] = (function (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;
+var PopperJS = vue__WEBPACK_IMPORTED_MODULE_0___default.a.prototype.$isServer ? function () {} : __webpack_require__(41);
+var stopPropagation = function stopPropagation(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 */ __webpack_exports__["a"] = ({
+  props: {
+    transformOrigin: {
+      type: [Boolean, String],
+      default: true
+    },
+    placement: {
+      type: String,
+      default: 'bottom'
+    },
+    boundariesPadding: {
+      type: Number,
+      default: 5
+    },
+    reference: { type: Object },
+    popper: { type: Object },
+    offset: {
+      type: Number,
+      default: 0
+    },
+    value: { type: Boolean },
+    visibleArrow: { type: Boolean },
+    arrowOffset: {
+      type: Number,
+      default: 35
+    },
+    appendToBody: {
+      type: Boolean,
+      default: true
+    },
+    popperOptions: {
+      type: Object,
+      default: function _default() {
+        return {
+          gpuAcceleration: false
+        };
+      }
+    },
+    queryParent: { type: Boolean }
+  },
+
+  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: {
+    getBoundingClientRect: function getBoundingClientRect(element) {
+      var rect = element.getBoundingClientRect();
+
+      // whether the IE version is lower than 11
+      var isIE = /MSIE|Trident/.test(navigator.userAgent);
+
+      // 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
+      };
+    },
+    createPopper: function createPopper() {
+      var _this = this;
+
+      if (this.$isServer) return;
+      this.currentPlacement = this.currentPlacement || this.placement;
+
+      // Validate placement format
+      if (!/^(top|bottom|left|right)(-start|-end)?$/g.test(this.currentPlacement)) {
+        return;
+      }
+
+      var options = this.popperOptions;
+      var popper = this.popperElm = this.popperElm || this.popper || this.$refs.popper;
+      var reference = this.referenceElm = this.referenceElm || this.reference || this.$refs.reference;
+
+      // Find reference element in different ways
+      if (!reference && this.$slots.reference && this.$slots.reference[0]) {
+        reference = this.referenceElm = this.$slots.reference[0].elm;
+      }
+      if (!reference && this.queryParent) {
+        reference = this.referenceElm = this.$parent.$el;
+      }
+
+      // Ensure both elements exist
+      if (!popper || !reference) return;
+
+      // Append arrow if needed
+      if (this.visibleArrow) this.appendArrow(popper);
+
+      // Append to body if required
+      if (this.appendToBody) {
+        document.body.appendChild(this.popperElm);
+
+        // Handle height limitation
+        if (this.popperElm.offsetHeight > document.body.offsetHeight) {
+          var _getBoundingClientRec = this.getBoundingClientRect(reference),
+              top = _getBoundingClientRec.top;
+
+          this.popperElm.style.height = document.body.offsetHeight - top + 'px';
+        }
+      }
+
+      // Clean up previous instance if exists
+      if (this.popperJS && typeof this.popperJS.destroy === 'function') {
+        this.popperJS.destroy();
+      }
+
+      // Configure and create new popper instance
+      options.placement = this.currentPlacement;
+      options.offset = this.offset;
+      options.arrowOffset = this.arrowOffset;
+
+      this.popperJS = new PopperJS(reference, popper, options);
+
+      // Set up callbacks
+      this.popperJS.onCreate(function () {
+        _this.$emit('created', _this);
+        _this.resetTransformOrigin();
+        _this.$nextTick(_this.updatePopper);
+      });
+
+      if (typeof options.onUpdate === 'function') {
+        this.popperJS.onUpdate(options.onUpdate);
+      }
+
+      // Set z-index and prevent click propagation
+      this.popperJS._popper.style.zIndex = eoss_src_utils_popup__WEBPACK_IMPORTED_MODULE_1__[/* PopupManager */ "a"].nextZIndex();
+      this.popperElm.addEventListener('click', stopPropagation);
+    },
+    updatePopper: function updatePopper() {
+      if (this.popperJS) {
+        this.popperJS.update();
+        if (this.popperJS._popper) {
+          this.popperJS._popper.style.zIndex = eoss_src_utils_popup__WEBPACK_IMPORTED_MODULE_1__[/* PopupManager */ "a"].nextZIndex();
+        }
+      } else {
+        this.createPopper();
+      }
+    },
+    doDestroy: function doDestroy() {
+      var forceDestroy = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+
+      /* 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 || !this.popperJS || !this.popperJS._popper) return;
+
+      var placementMap = {
+        top: 'bottom',
+        bottom: 'top',
+        left: 'right',
+        right: 'left'
+      };
+
+      var placementAttr = this.popperJS._popper.getAttribute('x-placement');
+      if (!placementAttr) return;
+
+      var placement = placementAttr.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) {
+      // Skip if already appended
+      if (this.appended) {
+        return;
+      }
+
+      this.appended = true;
+
+      // Find Vue hash attribute
+      var hash = void 0;
+      for (var i = 0; i < element.attributes.length; i++) {
+        var attr = element.attributes[i];
+        if (/^_v-/.test(attr.name)) {
+          hash = attr.name;
+          break;
         }
       }
+
+      // Create arrow element
+      var arrow = document.createElement('div');
+
+      // Copy Vue hash attribute if exists
+      if (hash) {
+        arrow.setAttribute(hash, '');
+      }
+
+      // Set arrow attributes
+      arrow.setAttribute('x-arrow', '');
+      arrow.className = 'popper__arrow';
+
+      // Append to element
+      element.appendChild(arrow);
+    }
+  },
+
+  beforeDestroy: function beforeDestroy() {
+    this.doDestroy(true);
+
+    // Clean up DOM elements and event listeners
+    if (this.popperElm && this.popperElm.parentNode === document.body) {
+      this.popperElm.removeEventListener('click', stopPropagation);
+      document.body.removeChild(this.popperElm);
     }
-  }
+  },
 
-  return target;
-});;
+
+  // call destroy in keep-alive mode
+  deactivated: function deactivated() {
+    this.$options.beforeDestroy[0].call(this);
+  }
+});
 
 /***/ }),
 
-/***/ 19:
+/***/ 15:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -124,7 +366,7 @@ module.exports = require("eoss/lib/dropdown-item");
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return scrollIntoView; });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return getScrollSize; });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "d", function() { return scrollMove; });
-/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
+/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(4);
 /* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(vue__WEBPACK_IMPORTED_MODULE_0__);
 
 
@@ -261,7 +503,29 @@ function scrollMove(wrap) {
 
 /***/ }),
 
-/***/ 192:
+/***/ 16:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony default export */ __webpack_exports__["a"] = (function (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;
+});;
+
+/***/ }),
+
+/***/ 196:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -332,10 +596,10 @@ render._withStripped = true
 // CONCATENATED MODULE: ./packages/dropdown/src/dropdown-menu.vue?vue&type=template&id=cdb28bee&
 
 // EXTERNAL MODULE: ./src/utils/vue-popper.js
-var vue_popper = __webpack_require__(20);
+var vue_popper = __webpack_require__(12);
 
 // EXTERNAL MODULE: external "eoss/lib/dropdown-item"
-var dropdown_item_ = __webpack_require__(101);
+var dropdown_item_ = __webpack_require__(95);
 var dropdown_item_default = /*#__PURE__*/__webpack_require__.n(dropdown_item_);
 
 // CONCATENATED MODULE: ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./packages/dropdown/src/dropdown-menu.vue?vue&type=script&lang=js&
@@ -466,446 +730,168 @@ function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in ob
       mt: 0,
       // 缓存处理后的item对象，避免重复渲染
       itemCache: new Map()
-    };
-  },
-  created: function created() {
-    var _this = this;
-
-    this.$on('updatePopper', function () {
-      if (_this.showPopper) _this.updatePopper();
-    });
-    this.$on('visible', function (val) {
-      _this.showPopper = val;
-      _this.$nextTick(function () {
-        _this.init();
-        _this.getStyle('margin-top');
-        // 确保Popper位置更新
-        if (val) {
-          _this.$nextTick(function () {
-            _this.updatePopper();
-          });
-        }
-      });
-    });
-  },
-  mounted: function mounted() {
-    this.init();
-    this.dropdown.popperElm = this.popperElm = this.$el;
-    this.referenceElm = this.dropdown.$el;
-    this.dropdown.initDomOperation();
-  },
-
-
-  watch: {
-    /**
-     * 监听 placement 变化
-     */
-    'dropdown.placement': {
-      immediate: true,
-      handler: function handler(val) {
-        this.currentPlacement = val;
-      }
-    },
-    /**
-     * 监听 showPopper 状态，当变为false时重置滚动条到顶部
-     */
-    showPopper: function showPopper(newVal) {
-      var _this2 = this;
-
-      if (!newVal && this.$refs.scrollbar) {
-        // 在下一个tick中执行，确保DOM已经更新
-        this.$nextTick(function () {
-          _this2.$refs.scrollbar.wrap.scrollTo({ top: 0 });
-        });
-      }
-    }
-  },
-  methods: {
-    /**
-     * 初始化菜单高度计算
-     */
-    init: function init() {
-      // 当maxHeight未定义或为0时，计算基于可视区域的最大高度
-      if (this.maxHeight === undefined || this.maxHeight === 0) {
-        var _$parent$$el$getBound = this.$parent.$el.getBoundingClientRect(),
-            top = _$parent$$el$getBound.top,
-            height = _$parent$$el$getBound.height;
-
-        var h = window.innerHeight; // 使用可视区域高度而不是文档高度
-        var mt = this.getStyle('margin-top') || 0;
-        var mb = this.getStyle('margin-bottom') || 0;
-        var pt = this.getStyle('padding-top') || 0;
-        var pb = this.getStyle('padding-bottom') || 0;
-        if (this.$parent.placement.indexOf('bottom') > -1) {
-          this.max = h - top - height - this.difference - 7 - parseInt(mt, 10) - parseInt(mb, 10) - parseInt(pt, 10) - parseInt(pb, 10);
-        } else {
-          this.max = top - this.difference - 7 - parseInt(mt, 10) - parseInt(mb, 10) - parseInt(pt, 10) - parseInt(pb, 10);
-        }
-      } else {
-        this.max = 'auto';
-      }
-    },
-
-    /**
-     * 处理item对象，移除event属性并缓存结果
-     * @param {Object} item - 按钮配置项
-     * @param {number} index - 索引值
-     * @returns {Object} - 处理后的item对象
-     */
-    getProps: function getProps(item, index) {
-      var key = item.key || item.id || index;
-      // 检查缓存中是否已有处理结果
-      if (this.itemCache.has(key)) {
-        return this.itemCache.get(key);
-      }
-
-      var event = item.event,
-          props = _objectWithoutProperties(item, ['event']);
-
-      if (this._labelKey && !props.text) {
-        props.text = item[this._labelKey];
-      }
-      // 缓存处理结果
-      this.itemCache.set(key, props);
-      return props;
-    },
-
-    /**
-     * 获取样式值
-     * @param {string} attr - 样式属性名
-     */
-    getStyle: function getStyle(attr) {
-      // 使用现代浏览器API获取计算样式，简化实现
-      return window.getComputedStyle(this.$el)[attr];
-    },
-
-    /**
-     * 菜单项创建时的处理
-     * @param {Element} res - 菜单项元素
-     * @param {boolean} flag - 是否为分隔项
-     */
-    menuItemCreate: function menuItemCreate(res, flag) {
-      this.height += parseInt(getComputedStyle(res).height, 10);
-      this.mt += parseInt(getComputedStyle(res).marginTop, 10) + (flag ? 1 : 0);
-    }
-  }
-});
-// CONCATENATED MODULE: ./packages/dropdown/src/dropdown-menu.vue?vue&type=script&lang=js&
- /* harmony default export */ var src_dropdown_menuvue_type_script_lang_js_ = (dropdown_menuvue_type_script_lang_js_); 
-// EXTERNAL MODULE: ./node_modules/vue-loader/lib/runtime/componentNormalizer.js
-var componentNormalizer = __webpack_require__(5);
-
-// CONCATENATED MODULE: ./packages/dropdown/src/dropdown-menu.vue
-
-
-
-
-
-/* normalize component */
-
-var component = Object(componentNormalizer["a" /* default */])(
-  src_dropdown_menuvue_type_script_lang_js_,
-  render,
-  staticRenderFns,
-  false,
-  null,
-  null,
-  null
-  
-)
-
-/* harmony default export */ var dropdown_menu = (component.exports);
-// CONCATENATED MODULE: ./packages/dropdown-menu/index.js
-
-
-/* istanbul ignore next */
-dropdown_menu.install = function (Vue) {
-  Vue.component(dropdown_menu.name, dropdown_menu);
-};
-
-/* harmony default export */ var packages_dropdown_menu = __webpack_exports__["default"] = (dropdown_menu);
-
-/***/ }),
-
-/***/ 2:
-/***/ (function(module, exports) {
-
-module.exports = require("vue");
-
-/***/ }),
-
-/***/ 20:
-/***/ (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 eoss_src_utils_popup__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(22);
-
-
-
-var PopperJS = vue__WEBPACK_IMPORTED_MODULE_0___default.a.prototype.$isServer ? function () {} : __webpack_require__(37);
-var stopPropagation = function stopPropagation(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 */ __webpack_exports__["a"] = ({
-  props: {
-    transformOrigin: {
-      type: [Boolean, String],
-      default: true
-    },
-    placement: {
-      type: String,
-      default: 'bottom'
-    },
-    boundariesPadding: {
-      type: Number,
-      default: 5
-    },
-    reference: { type: Object },
-    popper: { type: Object },
-    offset: {
-      type: Number,
-      default: 0
-    },
-    value: { type: Boolean },
-    visibleArrow: { type: Boolean },
-    arrowOffset: {
-      type: Number,
-      default: 35
-    },
-    appendToBody: {
-      type: Boolean,
-      default: true
-    },
-    popperOptions: {
-      type: Object,
-      default: function _default() {
-        return {
-          gpuAcceleration: false
-        };
-      }
-    },
-    queryParent: { type: Boolean }
+    };
   },
+  created: function created() {
+    var _this = this;
 
-  data: function data() {
-    return {
-      showPopper: false,
-      currentPlacement: ''
-    };
+    this.$on('updatePopper', function () {
+      if (_this.showPopper) _this.updatePopper();
+    });
+    this.$on('visible', function (val) {
+      _this.showPopper = val;
+      _this.$nextTick(function () {
+        _this.init();
+        _this.getStyle('margin-top');
+        // 确保Popper位置更新
+        if (val) {
+          _this.$nextTick(function () {
+            _this.updatePopper();
+          });
+        }
+      });
+    });
+  },
+  mounted: function mounted() {
+    this.init();
+    this.dropdown.popperElm = this.popperElm = this.$el;
+    this.referenceElm = this.dropdown.$el;
+    this.dropdown.initDomOperation();
   },
 
 
   watch: {
-    value: {
+    /**
+     * 监听 placement 变化
+     */
+    'dropdown.placement': {
       immediate: true,
       handler: function handler(val) {
-        this.showPopper = val;
-        this.$emit('input', val);
+        this.currentPlacement = val;
       }
     },
+    /**
+     * 监听 showPopper 状态，当变为false时重置滚动条到顶部
+     */
+    showPopper: function showPopper(newVal) {
+      var _this2 = this;
 
-    showPopper: function showPopper(val) {
-      if (this.disabled) return;
-      val ? this.updatePopper() : this.destroyPopper();
-      this.$emit('input', val);
+      if (!newVal && this.$refs.scrollbar) {
+        // 在下一个tick中执行，确保DOM已经更新
+        this.$nextTick(function () {
+          _this2.$refs.scrollbar.wrap.scrollTo({ top: 0 });
+        });
+      }
     }
   },
-
   methods: {
-    getBoundingClientRect: function getBoundingClientRect(element) {
-      var rect = element.getBoundingClientRect();
-
-      // whether the IE version is lower than 11
-      var isIE = /MSIE|Trident/.test(navigator.userAgent);
-
-      // 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
-      };
-    },
-    createPopper: function createPopper() {
-      var _this = this;
-
-      if (this.$isServer) return;
-      this.currentPlacement = this.currentPlacement || this.placement;
-
-      // Validate placement format
-      if (!/^(top|bottom|left|right)(-start|-end)?$/g.test(this.currentPlacement)) {
-        return;
-      }
-
-      var options = this.popperOptions;
-      var popper = this.popperElm = this.popperElm || this.popper || this.$refs.popper;
-      var reference = this.referenceElm = this.referenceElm || this.reference || this.$refs.reference;
-
-      // Find reference element in different ways
-      if (!reference && this.$slots.reference && this.$slots.reference[0]) {
-        reference = this.referenceElm = this.$slots.reference[0].elm;
-      }
-      if (!reference && this.queryParent) {
-        reference = this.referenceElm = this.$parent.$el;
-      }
-
-      // Ensure both elements exist
-      if (!popper || !reference) return;
-
-      // Append arrow if needed
-      if (this.visibleArrow) this.appendArrow(popper);
-
-      // Append to body if required
-      if (this.appendToBody) {
-        document.body.appendChild(this.popperElm);
-
-        // Handle height limitation
-        if (this.popperElm.offsetHeight > document.body.offsetHeight) {
-          var _getBoundingClientRec = this.getBoundingClientRect(reference),
-              top = _getBoundingClientRec.top;
-
-          this.popperElm.style.height = document.body.offsetHeight - top + 'px';
-        }
-      }
-
-      // Clean up previous instance if exists
-      if (this.popperJS && typeof this.popperJS.destroy === 'function') {
-        this.popperJS.destroy();
-      }
-
-      // Configure and create new popper instance
-      options.placement = this.currentPlacement;
-      options.offset = this.offset;
-      options.arrowOffset = this.arrowOffset;
-
-      this.popperJS = new PopperJS(reference, popper, options);
-
-      // Set up callbacks
-      this.popperJS.onCreate(function () {
-        _this.$emit('created', _this);
-        _this.resetTransformOrigin();
-        _this.$nextTick(_this.updatePopper);
-      });
-
-      if (typeof options.onUpdate === 'function') {
-        this.popperJS.onUpdate(options.onUpdate);
-      }
+    /**
+     * 初始化菜单高度计算
+     */
+    init: function init() {
+      // 当maxHeight未定义或为0时，计算基于可视区域的最大高度
+      if (this.maxHeight === undefined || this.maxHeight === 0) {
+        var _$parent$$el$getBound = this.$parent.$el.getBoundingClientRect(),
+            top = _$parent$$el$getBound.top,
+            height = _$parent$$el$getBound.height;
 
-      // Set z-index and prevent click propagation
-      this.popperJS._popper.style.zIndex = eoss_src_utils_popup__WEBPACK_IMPORTED_MODULE_1__[/* PopupManager */ "a"].nextZIndex();
-      this.popperElm.addEventListener('click', stopPropagation);
-    },
-    updatePopper: function updatePopper() {
-      if (this.popperJS) {
-        this.popperJS.update();
-        if (this.popperJS._popper) {
-          this.popperJS._popper.style.zIndex = eoss_src_utils_popup__WEBPACK_IMPORTED_MODULE_1__[/* PopupManager */ "a"].nextZIndex();
+        var h = window.innerHeight; // 使用可视区域高度而不是文档高度
+        var mt = this.getStyle('margin-top') || 0;
+        var mb = this.getStyle('margin-bottom') || 0;
+        var pt = this.getStyle('padding-top') || 0;
+        var pb = this.getStyle('padding-bottom') || 0;
+        if (this.$parent.placement.indexOf('bottom') > -1) {
+          this.max = h - top - height - this.difference - 7 - parseInt(mt, 10) - parseInt(mb, 10) - parseInt(pt, 10) - parseInt(pb, 10);
+        } else {
+          this.max = top - this.difference - 7 - parseInt(mt, 10) - parseInt(mb, 10) - parseInt(pt, 10) - parseInt(pb, 10);
         }
       } else {
-        this.createPopper();
+        this.max = 'auto';
       }
     },
-    doDestroy: function doDestroy() {
-      var forceDestroy = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
-
-      /* istanbul ignore if */
-      if (!this.popperJS || this.showPopper && !forceDestroy) return;
 
-      this.popperJS.destroy();
-      this.popperJS = null;
-    },
-    destroyPopper: function destroyPopper() {
-      if (this.popperJS) {
-        this.resetTransformOrigin();
+    /**
+     * 处理item对象，移除event属性并缓存结果
+     * @param {Object} item - 按钮配置项
+     * @param {number} index - 索引值
+     * @returns {Object} - 处理后的item对象
+     */
+    getProps: function getProps(item, index) {
+      var key = item.key || item.id || index;
+      // 检查缓存中是否已有处理结果
+      if (this.itemCache.has(key)) {
+        return this.itemCache.get(key);
       }
-    },
-    resetTransformOrigin: function resetTransformOrigin() {
-      if (!this.transformOrigin || !this.popperJS || !this.popperJS._popper) return;
-
-      var placementMap = {
-        top: 'bottom',
-        bottom: 'top',
-        left: 'right',
-        right: 'left'
-      };
 
-      var placementAttr = this.popperJS._popper.getAttribute('x-placement');
-      if (!placementAttr) return;
+      var event = item.event,
+          props = _objectWithoutProperties(item, ['event']);
 
-      var placement = placementAttr.split('-')[0];
-      var origin = placementMap[placement];
+      if (this._labelKey && !props.text) {
+        props.text = item[this._labelKey];
+      }
+      // 缓存处理结果
+      this.itemCache.set(key, props);
+      return props;
+    },
 
-      this.popperJS._popper.style.transformOrigin = typeof this.transformOrigin === 'string' ? this.transformOrigin : ['top', 'bottom'].indexOf(placement) > -1 ? 'center ' + origin : origin + ' center';
+    /**
+     * 获取样式值
+     * @param {string} attr - 样式属性名
+     */
+    getStyle: function getStyle(attr) {
+      // 使用现代浏览器API获取计算样式，简化实现
+      return window.getComputedStyle(this.$el)[attr];
     },
-    appendArrow: function appendArrow(element) {
-      // Skip if already appended
-      if (this.appended) {
-        return;
-      }
 
-      this.appended = true;
+    /**
+     * 菜单项创建时的处理
+     * @param {Element} res - 菜单项元素
+     * @param {boolean} flag - 是否为分隔项
+     */
+    menuItemCreate: function menuItemCreate(res, flag) {
+      this.height += parseInt(getComputedStyle(res).height, 10);
+      this.mt += parseInt(getComputedStyle(res).marginTop, 10) + (flag ? 1 : 0);
+    }
+  }
+});
+// CONCATENATED MODULE: ./packages/dropdown/src/dropdown-menu.vue?vue&type=script&lang=js&
+ /* harmony default export */ var src_dropdown_menuvue_type_script_lang_js_ = (dropdown_menuvue_type_script_lang_js_); 
+// EXTERNAL MODULE: ./node_modules/vue-loader/lib/runtime/componentNormalizer.js
+var componentNormalizer = __webpack_require__(3);
 
-      // Find Vue hash attribute
-      var hash = void 0;
-      for (var i = 0; i < element.attributes.length; i++) {
-        var attr = element.attributes[i];
-        if (/^_v-/.test(attr.name)) {
-          hash = attr.name;
-          break;
-        }
-      }
+// CONCATENATED MODULE: ./packages/dropdown/src/dropdown-menu.vue
 
-      // Create arrow element
-      var arrow = document.createElement('div');
 
-      // Copy Vue hash attribute if exists
-      if (hash) {
-        arrow.setAttribute(hash, '');
-      }
 
-      // Set arrow attributes
-      arrow.setAttribute('x-arrow', '');
-      arrow.className = 'popper__arrow';
 
-      // Append to element
-      element.appendChild(arrow);
-    }
-  },
 
-  beforeDestroy: function beforeDestroy() {
-    this.doDestroy(true);
+/* normalize component */
 
-    // Clean up DOM elements and event listeners
-    if (this.popperElm && this.popperElm.parentNode === document.body) {
-      this.popperElm.removeEventListener('click', stopPropagation);
-      document.body.removeChild(this.popperElm);
-    }
-  },
+var component = Object(componentNormalizer["a" /* default */])(
+  src_dropdown_menuvue_type_script_lang_js_,
+  render,
+  staticRenderFns,
+  false,
+  null,
+  null,
+  null
+  
+)
+
+/* harmony default export */ var dropdown_menu = (component.exports);
+// CONCATENATED MODULE: ./packages/dropdown-menu/index.js
 
 
-  // call destroy in keep-alive mode
-  deactivated: function deactivated() {
-    this.$options.beforeDestroy[0].call(this);
-  }
-});
+/* istanbul ignore next */
+dropdown_menu.install = function (Vue) {
+  Vue.component(dropdown_menu.name, dropdown_menu);
+};
+
+/* harmony default export */ var packages_dropdown_menu = __webpack_exports__["default"] = (dropdown_menu);
 
 /***/ }),
 
-/***/ 22:
+/***/ 23:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -914,14 +900,14 @@ var stopPropagation = function stopPropagation(e) {
 __webpack_require__.d(__webpack_exports__, "a", function() { return /* reexport */ popup_manager; });
 
 // EXTERNAL MODULE: external "vue"
-var external_vue_ = __webpack_require__(2);
+var external_vue_ = __webpack_require__(4);
 var external_vue_default = /*#__PURE__*/__webpack_require__.n(external_vue_);
 
 // EXTERNAL MODULE: ./src/utils/merge.js
-var merge = __webpack_require__(18);
+var merge = __webpack_require__(16);
 
 // EXTERNAL MODULE: ./src/utils/dom.js
-var utils_dom = __webpack_require__(4);
+var utils_dom = __webpack_require__(5);
 
 // CONCATENATED MODULE: ./src/utils/popup/popup-manager.js
 
@@ -1130,7 +1116,7 @@ if (!external_vue_default.a.prototype.$isServer) {
 
 /* harmony default export */ var popup_manager = (PopupManager);
 // EXTERNAL MODULE: ./src/utils/scrollbar.js
-var scrollbar = __webpack_require__(19);
+var scrollbar = __webpack_require__(15);
 
 // CONCATENATED MODULE: ./src/utils/popup/index.js
 
@@ -1176,6 +1162,10 @@ var scrollBarWidth = void 0;
     closeOnClickModal: {
       type: Boolean,
       default: false
+    },
+    lazy: {
+      type: Boolean,
+      default: true
     }
   },
 
@@ -1205,7 +1195,7 @@ var scrollBarWidth = void 0;
       bodyPaddingRight: null,
       computedBodyPaddingRight: 0,
       withoutHiddenClass: true,
-      rendered: false
+      rendered: !this.lazy
     };
   },
 
@@ -1356,7 +1346,119 @@ var scrollBarWidth = void 0;
 
 /***/ }),
 
-/***/ 37:
+/***/ 3:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return normalizeComponent; });
+/* globals __VUE_SSR_CONTEXT__ */
+
+// IMPORTANT: Do NOT use ES2015 features in this file (except for modules).
+// This module is a runtime utility for cleaner component module output and will
+// be included in the final webpack user bundle.
+
+function normalizeComponent(
+  scriptExports,
+  render,
+  staticRenderFns,
+  functionalTemplate,
+  injectStyles,
+  scopeId,
+  moduleIdentifier /* server only */,
+  shadowMode /* vue-cli only */
+) {
+  // Vue.extend constructor export interop
+  var options =
+    typeof scriptExports === 'function' ? scriptExports.options : scriptExports
+
+  // render functions
+  if (render) {
+    options.render = render
+    options.staticRenderFns = staticRenderFns
+    options._compiled = true
+  }
+
+  // functional template
+  if (functionalTemplate) {
+    options.functional = true
+  }
+
+  // scopedId
+  if (scopeId) {
+    options._scopeId = 'data-v-' + scopeId
+  }
+
+  var hook
+  if (moduleIdentifier) {
+    // server build
+    hook = function (context) {
+      // 2.3 injection
+      context =
+        context || // cached call
+        (this.$vnode && this.$vnode.ssrContext) || // stateful
+        (this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext) // functional
+      // 2.2 with runInNewContext: true
+      if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
+        context = __VUE_SSR_CONTEXT__
+      }
+      // inject component styles
+      if (injectStyles) {
+        injectStyles.call(this, context)
+      }
+      // register component module identifier for async chunk inferrence
+      if (context && context._registeredComponents) {
+        context._registeredComponents.add(moduleIdentifier)
+      }
+    }
+    // used by ssr in case component is cached and beforeCreate
+    // never gets called
+    options._ssrRegister = hook
+  } else if (injectStyles) {
+    hook = shadowMode
+      ? function () {
+          injectStyles.call(
+            this,
+            (options.functional ? this.parent : this).$root.$options.shadowRoot
+          )
+        }
+      : injectStyles
+  }
+
+  if (hook) {
+    if (options.functional) {
+      // for template-only hot-reload because in that case the render fn doesn't
+      // go through the normalizer
+      options._injectStyles = hook
+      // register for functional component in vue file
+      var originalRender = options.render
+      options.render = function renderWithStyleInjection(h, context) {
+        hook.call(context)
+        return originalRender(h, context)
+      }
+    } else {
+      // inject component registration as beforeCreate hook
+      var existing = options.beforeCreate
+      options.beforeCreate = existing ? [].concat(existing, hook) : [hook]
+    }
+  }
+
+  return {
+    exports: scriptExports,
+    options: options
+  }
+}
+
+
+/***/ }),
+
+/***/ 4:
+/***/ (function(module, exports) {
+
+module.exports = require("vue");
+
+/***/ }),
+
+/***/ 41:
 /***/ (function(module, exports, __webpack_require__) {
 
 var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_RESULT__;/**
@@ -2787,7 +2889,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_RESULT__;/**
 
 /***/ }),
 
-/***/ 4:
+/***/ 5:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -2803,7 +2905,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_RESULT__;/**
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return getScrollContainer; });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "e", function() { return isInContainer; });
 /* unused harmony export insertAfter */
-/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
+/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(4);
 /* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(vue__WEBPACK_IMPORTED_MODULE_0__);
 var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
 
@@ -3046,108 +3148,10 @@ function insertAfter(newEl, targetEl) {
 
 /***/ }),
 
-/***/ 5:
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return normalizeComponent; });
-/* globals __VUE_SSR_CONTEXT__ */
-
-// IMPORTANT: Do NOT use ES2015 features in this file (except for modules).
-// This module is a runtime utility for cleaner component module output and will
-// be included in the final webpack user bundle.
-
-function normalizeComponent(
-  scriptExports,
-  render,
-  staticRenderFns,
-  functionalTemplate,
-  injectStyles,
-  scopeId,
-  moduleIdentifier /* server only */,
-  shadowMode /* vue-cli only */
-) {
-  // Vue.extend constructor export interop
-  var options =
-    typeof scriptExports === 'function' ? scriptExports.options : scriptExports
-
-  // render functions
-  if (render) {
-    options.render = render
-    options.staticRenderFns = staticRenderFns
-    options._compiled = true
-  }
-
-  // functional template
-  if (functionalTemplate) {
-    options.functional = true
-  }
-
-  // scopedId
-  if (scopeId) {
-    options._scopeId = 'data-v-' + scopeId
-  }
-
-  var hook
-  if (moduleIdentifier) {
-    // server build
-    hook = function (context) {
-      // 2.3 injection
-      context =
-        context || // cached call
-        (this.$vnode && this.$vnode.ssrContext) || // stateful
-        (this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext) // functional
-      // 2.2 with runInNewContext: true
-      if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
-        context = __VUE_SSR_CONTEXT__
-      }
-      // inject component styles
-      if (injectStyles) {
-        injectStyles.call(this, context)
-      }
-      // register component module identifier for async chunk inferrence
-      if (context && context._registeredComponents) {
-        context._registeredComponents.add(moduleIdentifier)
-      }
-    }
-    // used by ssr in case component is cached and beforeCreate
-    // never gets called
-    options._ssrRegister = hook
-  } else if (injectStyles) {
-    hook = shadowMode
-      ? function () {
-          injectStyles.call(
-            this,
-            (options.functional ? this.parent : this).$root.$options.shadowRoot
-          )
-        }
-      : injectStyles
-  }
-
-  if (hook) {
-    if (options.functional) {
-      // for template-only hot-reload because in that case the render fn doesn't
-      // go through the normalizer
-      options._injectStyles = hook
-      // register for functional component in vue file
-      var originalRender = options.render
-      options.render = function renderWithStyleInjection(h, context) {
-        hook.call(context)
-        return originalRender(h, context)
-      }
-    } else {
-      // inject component registration as beforeCreate hook
-      var existing = options.beforeCreate
-      options.beforeCreate = existing ? [].concat(existing, hook) : [hook]
-    }
-  }
-
-  return {
-    exports: scriptExports,
-    options: options
-  }
-}
+/***/ 95:
+/***/ (function(module, exports) {
 
+module.exports = require("eoss/lib/dropdown-item");
 
 /***/ })