@element-plus/nightly 0.0.20231213 → 0.0.20231216

package/dist/index.full.js

@@ -1,4 +1,4 @@
-/*! Element Plus v0.0.20231213 */
+/*! Element Plus v0.0.20231216 */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
@@ -11197,7 +11197,7 @@
 
   const ElConfigProvider = withInstall(ConfigProvider);
 
-  const version$1 = "0.0.20231213";
+  const version$1 = "0.0.20231216";
 
   const makeInstaller = (components = []) => {
     const install = (app, options) => {
@@ -24193,20 +24193,26 @@
             el.dataset = {};
           el.dataset.oldPaddingTop = el.style.paddingTop;
           el.dataset.oldPaddingBottom = el.style.paddingBottom;
+          if (el.style.height)
+            el.dataset.elExistsHeight = el.style.height;
           el.style.maxHeight = 0;
           el.style.paddingTop = 0;
           el.style.paddingBottom = 0;
         },
         enter(el) {
-          el.dataset.oldOverflow = el.style.overflow;
-          if (el.scrollHeight !== 0) {
-            el.style.maxHeight = `${el.scrollHeight}px`;
-          } else {
-            el.style.maxHeight = 0;
-          }
-          el.style.paddingTop = el.dataset.oldPaddingTop;
-          el.style.paddingBottom = el.dataset.oldPaddingBottom;
-          el.style.overflow = "hidden";
+          requestAnimationFrame(() => {
+            el.dataset.oldOverflow = el.style.overflow;
+            if (el.dataset.elExistsHeight) {
+              el.style.maxHeight = el.dataset.elExistsHeight;
+            } else if (el.scrollHeight !== 0) {
+              el.style.maxHeight = `${el.scrollHeight}px`;
+            } else {
+              el.style.maxHeight = 0;
+            }
+            el.style.paddingTop = el.dataset.oldPaddingTop;
+            el.style.paddingBottom = el.dataset.oldPaddingBottom;
+            el.style.overflow = "hidden";
+          });
         },
         afterEnter(el) {
           el.style.maxHeight = "";
@@ -26628,7 +26634,7 @@
         if (!props.rangeState.selecting)
           return;
         let target = event.target;
-        if (target.tagName === "A") {
+        if (target.tagName === "SPAN") {
           target = (_a = target.parentNode) == null ? void 0 : _a.parentNode;
         }
         if (target.tagName === "DIV") {
@@ -32508,6 +32514,7 @@
           return;
         }
         if (rootMenu.props.menuTrigger === "click" && rootMenu.props.mode === "horizontal" || !rootMenu.props.collapse && rootMenu.props.mode === "vertical" || props.disabled) {
+          subMenu.mouseInChild.value = true;
           return;
         }
         subMenu.mouseInChild.value = true;
@@ -32522,6 +32529,7 @@
       const handleMouseleave = (deepDispatch = false) => {
         var _a, _b;
         if (rootMenu.props.menuTrigger === "click" && rootMenu.props.mode === "horizontal" || !rootMenu.props.collapse && rootMenu.props.mode === "vertical") {
+          subMenu.mouseInChild.value = false;
           return;
         }
         timeout == null ? void 0 : timeout();
@@ -32674,6 +32682,7 @@
     backgroundColor: String,
     textColor: String,
     activeTextColor: String,
+    closeOnClickOutside: Boolean,
     collapseTransition: {
       type: Boolean,
       default: true
@@ -32808,6 +32817,7 @@
         });
         return sliceIndex2 === items2.length ? -1 : sliceIndex2;
       };
+      const getIndexPath = (index) => subMenus.value[index].indexPath;
       const debounce = (fn, wait = 33.34) => {
         let timmer;
         return () => {
@@ -32846,6 +32856,7 @@
         else
           resizeStopper == null ? void 0 : resizeStopper();
       });
+      const mouseInChild = vue.ref(false);
       {
         const addSubMenu = (item) => {
           subMenus.value[item.index] = item;
@@ -32878,7 +32889,7 @@
         vue.provide(`subMenu:${instance.uid}`, {
           addSubMenu,
           removeSubMenu,
-          mouseInChild: vue.ref(false),
+          mouseInChild,
           level: 0
         });
       }
@@ -32923,7 +32934,20 @@
           }
         }
         const ulStyle = useMenuCssVar(props, 0);
-        const vMenu = vue.h("ul", {
+        const directives = props.closeOnClickOutside ? [
+          [
+            ClickOutside,
+            () => {
+              if (!openedMenus.value.length)
+                return;
+              if (!mouseInChild.value) {
+                openedMenus.value.forEach((openedMenu) => emit("close", openedMenu, getIndexPath(openedMenu)));
+                openedMenus.value = [];
+              }
+            }
+          ]
+        ] : [];
+        const vMenu = vue.withDirectives(vue.h("ul", {
           key: String(props.collapse),
           role: "menubar",
           ref: menu,
@@ -32933,7 +32957,7 @@
             [nsMenu.m(props.mode)]: true,
             [nsMenu.m("collapse")]: props.collapse
           }
-        }, [...slot, ...vShowMore]);
+        }, [...slot, ...vShowMore]), directives);
         if (props.collapseTransition && props.mode === "vertical") {
           return vue.h(ElMenuCollapseTransition, () => vMenu);
         }
@@ -51477,8 +51501,11 @@
         }
         if (!value)
           return;
-        if (node.visible && !node.isLeaf && !lazy)
-          node.expand();
+        if (node.visible && !node.isLeaf) {
+          if (!lazy || node.loaded) {
+            node.expand();
+          }
+        }
       };
       traverse(this);
     }
@@ -51827,6 +51854,8 @@
       }
       if (dropPrev || dropInner || dropNext) {
         dragState.value.dropNode = dropNode;
+      } else {
+        dragState.value.dropNode = null;
       }
       if (dropNode.node.nextSibling === draggingNode.node) {
         dropNext = false;