easy-component-ui 3.0.10 → 3.0.12

package/dist/components/ea-drawer.js

@@ -1,72 +1,79 @@
-var _ = Object.defineProperty;
-var y = (t) => {
-  throw TypeError(t);
+var E = Object.defineProperty;
+var v = (s) => {
+  throw TypeError(s);
 };
-var C = (t, s, e) => s in t ? _(t, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[s] = e;
-var b = (t, s, e) => C(t, typeof s != "symbol" ? s + "" : s, e), v = (t, s, e) => s.has(t) || y("Cannot " + e);
-var o = (t, s, e) => (v(t, s, "read from private field"), e ? e.call(t) : s.get(t)), a = (t, s, e) => s.has(t) ? y("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(t) : s.set(t, e), r = (t, s, e, p) => (v(t, s, "write to private field"), p ? p.call(t, e) : s.set(t, e), e);
-import { EaOverlay as g } from "./ea-overlay.js";
-import { s as S } from "../css/ea-drawer.style.js";
-import { E } from "../utils/Utils.js";
-import { t as k } from "../utils/timeout.js";
-var i, u, l, h, c, n, f, w, m, d;
-class q extends g {
+var g = (s, o, e) => o in s ? E(s, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[o] = e;
+var C = (s, o, e) => g(s, typeof o != "symbol" ? o + "" : o, e), _ = (s, o, e) => o.has(s) || v("Cannot " + e);
+var t = (s, o, e) => (_(s, o, "read from private field"), e ? e.call(s) : o.get(s)), r = (s, o, e) => o.has(s) ? v("Cannot add the same private member more than once") : o instanceof WeakSet ? o.add(s) : o.set(s, e), a = (s, o, e, l) => (_(s, o, "write to private field"), l ? l.call(s, e) : o.set(s, e), e);
+import { EaOverlay as S } from "./ea-overlay.js";
+import { s as k } from "../css/ea-drawer.style.js";
+import { E as q } from "../utils/Utils.js";
+import { t as A } from "../utils/timeout.js";
+var f, h, p, u, d, w, b, n, i, m, c, y;
+class R extends S {
   constructor() {
     super();
-    /** @type {AbortController} */
-    a(this, i);
     /** @type {HTMLElement} */
-    a(this, u);
+    r(this, f);
     /** @type {HTMLElement} */
-    a(this, l);
+    r(this, h);
     /** @type {HTMLElement} */
-    a(this, h);
+    r(this, p);
     /** @type {HTMLElement} */
-    a(this, c);
+    r(this, u);
     /** @type {HTMLElement} */
-    a(this, n);
+    r(this, d);
     /** @type {HTMLElement} */
-    a(this, f);
+    r(this, w);
     /** @type {HTMLElement} */
-    a(this, w);
-    b(this, "state", this.properties({
+    r(this, b);
+    /** @type {AbortController} */
+    r(this, n);
+    r(this, i, {
+      /** @type {AbortController | null} */
+      showClose: null,
+      /** @type {AbortController | null} */
+      closeOnPressEscape: null
+    });
+    C(this, "state", this.properties({
       direction: {
         type: ["rtl", "ltr", "ttb", "btt"],
-        default: "rtl",
-        observer: (e) => {
-        }
+        default: "rtl"
       },
       visible: {
         type: Boolean,
         default: !1,
         repeatable: !0,
         observer: (e) => {
-          if (!e && this["before-close"] && this.status !== this.visible)
-            return o(this, d).call(this);
-          e && k(() => {
-            this.focus();
-          }, 0), this.status = e;
+          if (!e && this.beforeClose && this.status !== this.visible) {
+            this.visible = !e, t(this, c).call(this);
+            return;
+          }
+          e && A(() => this.focus(), 0), (e || !this.beforeClose) && (this.status = e);
         }
       },
       "with-header": {
         type: Boolean,
         default: !0,
         observer: (e) => {
-          o(this, h).style.display = e ? "flex" : "none";
+          t(this, p).style.display = e ? "flex" : "none";
         }
       },
       title: {
         type: String,
         default: "",
         observer: (e) => {
-          this["with-header"] && (o(this, c).textContent = e);
+          this["with-header"] && (t(this, u).textContent = e);
         }
       },
       showClose: {
         type: Boolean,
         default: !0,
         observer: (e) => {
-          this["with-header"] && (o(this, n).style.display = e ? "block" : "none");
+          var l;
+          (l = t(this, i).showClose) == null || l.abort(), t(this, i).showClose = null, this["with-header"] && (t(this, d).style.display = e ? "block" : "none"), e && (t(this, i).showClose = new AbortController(), t(this, d).addEventListener("click", t(this, c), {
+            signal: t(this, i).showClose.signal
+          }));
         }
       },
       size: {
@@ -78,19 +85,33 @@ class q extends g {
       },
       "append-to-body": {
         type: Boolean,
-        default: !1,
-        observer: (e) => {
-        }
+        default: !1
       },
       "close-on-press-escape": {
         type: Boolean,
         default: !0,
         observer: (e) => {
+          var l;
+          (l = t(this, i).closeOnPressEscape) == null || l.abort(), t(this, i).closeOnPressEscape = null, e && (t(this, i).closeOnPressEscape = new AbortController(), document.addEventListener("keydown", t(this, y), {
+            signal: t(this, i).closeOnPressEscape.signal
+          }));
         }
       }
     }));
-    a(this, m, (e, p) => {
-      p.innerHTML = `
+    C(this, "funcStates", this.properties({
+      beforeClose: {
+        rawFunction: !0,
+        props: !0,
+        type: Function,
+        default: null
+      }
+    }));
+    /**
+     * 初始化抽屉 DOM 结构
+     * @param {HTMLElement} container - 抽屉内容容器
+     */
+    r(this, m, (e) => {
+      e.innerHTML = `
       <div class="ea-drawer-main" part="container">
         <header class="ea-drawer-main__header" part="header">
           <span class="ea-drawer-main__title" part="title">
@@ -105,44 +126,47 @@ class q extends g {
           <slot name="footer"></slot>
         </footer>
       </div>
-    `, r(this, u, this.shadowRoot.querySelector(".ea-overlay")), r(this, l, this.shadowRoot.querySelector(".ea-drawer-main")), r(this, h, this.shadowRoot.querySelector(".ea-drawer-main__header")), r(this, c, this.shadowRoot.querySelector(".ea-drawer-main__title")), r(this, n, this.shadowRoot.querySelector(
+    `, a(this, f, this.shadowRoot.querySelector(".ea-overlay")), a(this, h, this.shadowRoot.querySelector(".ea-drawer-main")), a(this, p, this.shadowRoot.querySelector(".ea-drawer-main__header")), a(this, u, this.shadowRoot.querySelector(".ea-drawer-main__title")), a(this, d, this.shadowRoot.querySelector(
         ".ea-drawer-main__close-icon"
-      )), r(this, f, this.shadowRoot.querySelector(".ea-drawer-main__content")), r(this, w, this.shadowRoot.querySelector(".ea-drawer-main__footer"));
+      )), a(this, w, this.shadowRoot.querySelector(".ea-drawer-main__content")), a(this, b, this.shadowRoot.querySelector(".ea-drawer-main__footer"));
     });
-    a(this, d, () => {
-      this["before-close"] ? this.emit("before-close", {
-        detail: {
-          done: () => this.status = !1
-        }
-      }) : this.status = !1;
+    /**
+     * 处理抽屉关闭前的回调
+     */
+    r(this, c, () => {
+      this.beforeClose ? this.beforeClose(() => {
+        this.status = !1, this.visible = !1;
+      }) : (this.status = !1, this.visible = !1);
     });
+    /**
+     * 处理键盘事件
+     * @param {KeyboardEvent} e - 键盘事件对象
+     */
+    r(this, y, (e) => {
+      e.key === "Escape" && this.visible && t(this, c).call(this);
+    });
+    this["append-to-body"] && document.body.appendChild(this);
     const e = this.shadowRoot.querySelector(
       ".ea-overlay__content"
     );
-    o(this, m).call(this, this.direction, e), this["append-to-body"] && document.body.appendChild(this);
+    t(this, m).call(this, e);
   }
   static get observedAttributes() {
-    return E.Array.toLowerCamelCase([
+    return q.Array.toLowerCamelCase([
       ...super.observedAttributes,
       "direction",
       "visible",
       "append-to-body",
       "append-to",
-      // "lock-scroll",
-      "before-close",
       "close-on-click-modal",
       "close-on-press-escape",
-      // "open-delay",
-      // "close-delay",
-      // "destroy-on-close",
       "modal",
-      // "resizable",
       "show-close",
       "size",
       "title",
       "with-header",
       "z-index",
-      "header-aria-level "
+      "header-aria-level"
     ]);
   }
   /**
@@ -161,7 +185,8 @@ class q extends g {
     )}`;
   }
   connectedCallback() {
-    r(this, i, new AbortController()), o(this, l).ariaModal = !0, o(this, l).role = "dialog", this["close-on-click-modal"] = this.getAttrBoolean(
+    var e;
+    (e = t(this, n)) == null || e.abort(), a(this, n, new AbortController()), t(this, h).ariaModal = !0, t(this, h).role = "dialog", this["close-on-click-modal"] = this.getAttrBoolean(
       "close-on-click-modal",
       !0
     ), this.addEventListener(
@@ -170,25 +195,17 @@ class q extends g {
         this.visible = !1;
       },
       {
-        signal: o(this, i).signal
+        signal: t(this, n).signal
       }
-    ), this["show-close"] && o(this, n).addEventListener("click", o(this, d), {
-      signal: o(this, i).signal
-    }), this["close-on-press-escape"] && this.addEventListener(
-      "keydown",
-      (e) => {
-        e.key === "Escape" && o(this, d).call(this);
-      },
-      { signal: o(this, i).signal }
-    ), super.connectedCallback(), this.assignedStyle(S);
+    ), super.connectedCallback(), this.assignedStyle(k);
   }
   $beforeUnmounted() {
     var e;
-    (e = o(this, i)) == null || e.abort();
+    (e = t(this, n)) == null || e.abort();
   }
 }
-i = new WeakMap(), u = new WeakMap(), l = new WeakMap(), h = new WeakMap(), c = new WeakMap(), n = new WeakMap(), f = new WeakMap(), w = new WeakMap(), m = new WeakMap(), d = new WeakMap();
-window.customElements.get("ea-drawer") || window.customElements.define("ea-drawer", q);
+f = new WeakMap(), h = new WeakMap(), p = new WeakMap(), u = new WeakMap(), d = new WeakMap(), w = new WeakMap(), b = new WeakMap(), n = new WeakMap(), i = new WeakMap(), m = new WeakMap(), c = new WeakMap(), y = new WeakMap();
+window.customElements.get("ea-drawer") || window.customElements.define("ea-drawer", R);
 export {
-  q as EaDrawer
+  R as EaDrawer
 };

package/dist/components/ea-empty.js

@@ -1,36 +1,40 @@
-var y = Object.defineProperty;
-var m = (t) => {
+var u = Object.defineProperty;
+var d = (t) => {
   throw TypeError(t);
 };
-var u = (t, s, e) => s in t ? y(t, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[s] = e;
-var c = (t, s, e) => u(t, typeof s != "symbol" ? s + "" : s, e), h = (t, s, e) => s.has(t) || m("Cannot " + e);
-var n = (t, s, e) => (h(t, s, "read from private field"), e ? e.call(t) : s.get(t)), o = (t, s, e) => s.has(t) ? m("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(t) : s.set(t, e), a = (t, s, e, d) => (h(t, s, "write to private field"), d ? d.call(t, e) : s.set(t, e), e);
-import { B as g } from "./Base.js";
-import { s as v } from "../css/ea-empty.style.js";
-const _ = `
+var g = (t, s, e) => s in t ? u(t, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[s] = e;
+var c = (t, s, e) => g(t, typeof s != "symbol" ? s + "" : s, e), h = (t, s, e) => s.has(t) || d("Cannot " + e);
+var a = (t, s, e) => (h(t, s, "read from private field"), e ? e.call(t) : s.get(t)), r = (t, s, e) => s.has(t) ? d("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(t) : s.set(t, e), p = (t, s, e, m) => (h(t, s, "write to private field"), m ? m.call(t, e) : s.set(t, e), e);
+import { B as v } from "./Base.js";
+import { s as _ } from "../css/ea-empty.style.js";
+const y = `
 <svg viewBox="25 30 50 50" xmlns="http://www.w3.org/2000/svg">
     <path d="M30 50v21.5a2 2 0 0 0 1 1h39a2 2 0 0 0 1-1V50H61a10 10 0 0 1-20 0h-6.5z" class="front" part="default-image-front" />
     <path d="M30.5 50.5L34 39h32.5l4 11.5" fill="none" class="border" part="default-image-border" />
 </svg>
 `;
-var p, i, r, l;
-class b extends g {
+var l, i, o, n;
+class f extends v {
   constructor() {
     super();
     /** @type {HTMLElement} */
-    o(this, p);
+    r(this, l);
     /** @type {HTMLElement} */
-    o(this, i);
+    r(this, i);
     /** @type {HTMLElement} */
-    o(this, r);
+    r(this, o);
     /** @type {HTMLElement} */
-    o(this, l);
+    r(this, n);
     c(this, "state", this.properties({
       image: {
         type: String,
         default: "",
         observer: (e) => {
-          n(this, i).innerHTML = `<img class="ea-empty__image" src="${e}" alt="empty image" part="image" />`;
+          e ? a(this, i).innerHTML = this.html(`
+            <img class="ea-empty__image" src="${e}" alt="empty image" part="image" />
+          `) : a(this, i).innerHTML = this.html(`
+            <section class="ea-empty__default">${y}</section>
+          `);
         }
       },
       "image-size": {
@@ -48,21 +52,21 @@ class b extends g {
         type: String,
         default: "",
         observer: (e) => {
-          n(this, r).textContent = e;
+          e ? a(this, o).textContent = e : a(this, o).innerText = "No Data";
         }
       }
     }));
-    this.stylesheet = v, this.$render();
+    this.stylesheet = _, this.$render();
   }
   static get observedAttributes() {
     return [...super.observedAttributes, "image", "image-size", "description"];
   }
   $render() {
-    this.shadowRoot.innerHTML = `
+    this.shadowRoot.innerHTML = this.html(`
       <div class='ea-empty' part='container'>
         <div class="ea-empty__placeholder" part="placeholder">
             <slot name="image">
-                <section class="ea-empty__default">${_}</section>
+              <section class="ea-empty__default">${y}</section>
             </slot>
         </div>
         <div class="ea-empty__description" part="description">
@@ -72,14 +76,18 @@ class b extends g {
             <slot></slot>
         </div>
       </div>
-    `, a(this, p, this.shadowRoot.querySelector(".ea-empty")), a(this, i, this.shadowRoot.querySelector(".ea-empty__placeholder")), a(this, r, this.shadowRoot.querySelector(".ea-empty__description")), a(this, l, this.shadowRoot.querySelector(".ea-empty__bottom"));
+    `), p(this, l, this.shadowRoot.querySelector(".ea-empty")), p(this, i, this.shadowRoot.querySelector(
+      ".ea-empty__placeholder slot[name='image']"
+    )), p(this, o, this.shadowRoot.querySelector(
+      ".ea-empty__description slot[name='description']"
+    )), p(this, n, this.shadowRoot.querySelector(".ea-empty__bottom"));
   }
   connectedCallback() {
     super.connectedCallback();
   }
 }
-p = new WeakMap(), i = new WeakMap(), r = new WeakMap(), l = new WeakMap();
-window.customElements.get("ea-empty") || window.customElements.define("ea-empty", b);
+l = new WeakMap(), i = new WeakMap(), o = new WeakMap(), n = new WeakMap();
+window.customElements.get("ea-empty") || window.customElements.define("ea-empty", f);
 export {
-  b as EaEmpty
+  f as EaEmpty
 };

package/dist/components/ea-menu.js

@@ -1,17 +1,17 @@
-var B = Object.defineProperty;
-var q = (s) => {
+var I = Object.defineProperty;
+var R = (s) => {
   throw TypeError(s);
 };
-var I = (s, i, e) => i in s ? B(s, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[i] = e;
-var p = (s, i, e) => I(s, typeof i != "symbol" ? i + "" : i, e), R = (s, i, e) => i.has(s) || q("Cannot " + e);
-var t = (s, i, e) => (R(s, i, "read from private field"), e ? e.call(s) : i.get(s)), r = (s, i, e) => i.has(s) ? q("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(s) : i.set(s, e), a = (s, i, e, o) => (R(s, i, "write to private field"), o ? o.call(s, e) : i.set(s, e), e);
-import { B as _ } from "./Base.js";
-import { s as N } from "../css/ea-menu.style.js";
-import { s as P } from "../css/ea-menu-item.style.js";
-import { s as T } from "../css/ea-menu-item-group.style.js";
-import { s as U } from "../css/ea-sub-menu.style.js";
-var u, c, A, v, E;
-class z extends _ {
+var N = (s, i, e) => i in s ? I(s, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[i] = e;
+var p = (s, i, e) => N(s, typeof i != "symbol" ? i + "" : i, e), H = (s, i, e) => i.has(s) || R("Cannot " + e);
+var t = (s, i, e) => (H(s, i, "read from private field"), e ? e.call(s) : i.get(s)), r = (s, i, e) => i.has(s) ? R("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(s) : i.set(s, e), a = (s, i, e, o) => (H(s, i, "write to private field"), o ? o.call(s, e) : i.set(s, e), e);
+import { B as q } from "./Base.js";
+import { s as P } from "../css/ea-menu.style.js";
+import { s as T } from "../css/ea-menu-item.style.js";
+import { s as U } from "../css/ea-menu-item-group.style.js";
+import { s as z } from "../css/ea-sub-menu.style.js";
+var u, c, E, v, x;
+class D extends q {
   constructor() {
     super();
     /** @type {HTMLElement} */
@@ -23,7 +23,7 @@ class z extends _ {
         type: ["horizontal", "vertical"],
         default: "vertical",
         observer: (e) => {
-          t(this, A).call(this, e), this.updateContainerClasslist();
+          t(this, E).call(this, e), this.updateContainerClasslist();
         }
       },
       "background-color": {
@@ -69,7 +69,7 @@ class z extends _ {
      * 更新子菜单模式
      * @param {string} mode
      */
-    r(this, A, (e) => {
+    r(this, E, (e) => {
       this.querySelectorAll("ea-sub-menu").forEach((o) => {
         o.setAttribute("mode", e);
       });
@@ -81,7 +81,7 @@ class z extends _ {
     r(this, v, (e) => {
       const o = [...this.querySelectorAll("ea-menu-item")], l = [...this.querySelectorAll("ea-sub-menu")], b = e.target.closest("ea-menu-item");
       if (e.target.closest("ea-sub-menu") || b) {
-        const L = (H) => H.removeAttribute("active");
+        const L = (B) => B.removeAttribute("active");
         o.forEach(L), l.forEach(L);
       }
       b && (b.toggleAttribute("active", !0), this.emit("select", {
@@ -94,13 +94,13 @@ class z extends _ {
     /**
      * 初始化默认激活项
      */
-    r(this, E, () => {
+    r(this, x, () => {
       const e = this.querySelector(
         `ea-menu-item[index="${this["default-active"]}"]`
       );
       e && e.click();
     });
-    this.stylesheet = N, this.$render();
+    this.stylesheet = P, this.$render();
   }
   static get observedAttributes() {
     return [
@@ -140,16 +140,16 @@ class z extends _ {
       signal: t(this, c).signal
     }), this.addEventListener("ea-sub-menu-click", t(this, v), {
       signal: t(this, c).signal
-    }), t(this, E).call(this);
+    }), t(this, x).call(this);
   }
   $beforeUnmounted() {
     t(this, c).abort();
   }
 }
-u = new WeakMap(), c = new WeakMap(), A = new WeakMap(), v = new WeakMap(), E = new WeakMap();
-window.customElements.get("ea-menu") || window.customElements.define("ea-menu", z);
+u = new WeakMap(), c = new WeakMap(), E = new WeakMap(), v = new WeakMap(), x = new WeakMap();
+window.customElements.get("ea-menu") || window.customElements.define("ea-menu", D);
 var f;
-class D extends _ {
+class G extends q {
   constructor() {
     super();
     /** @type {HTMLElement} */
@@ -176,7 +176,7 @@ class D extends _ {
         }
       }
     }));
-    this.stylesheet = P, this.$render();
+    this.stylesheet = T, this.$render();
   }
   static get observedAttributes() {
     return [...super.observedAttributes, "index", "disabled", "active"];
@@ -208,17 +208,17 @@ class D extends _ {
   }
 }
 f = new WeakMap();
-window.customElements.get("ea-menu-item") || window.customElements.define("ea-menu-item", D);
-var x, C, S;
-class G extends _ {
+window.customElements.get("ea-menu-item") || window.customElements.define("ea-menu-item", G);
+var S, C, $;
+class V extends q {
   constructor() {
     super();
     /** @type {HTMLElement} */
-    r(this, x);
+    r(this, S);
     /** @type {HTMLSlotElement} */
     r(this, C);
     /** @type {AbortController} */
-    r(this, S, new AbortController());
+    r(this, $, new AbortController());
     p(this, "state", this.properties({
       title: {
         type: String,
@@ -228,7 +228,7 @@ class G extends _ {
         }
       }
     }));
-    this.stylesheet = T, this.$render();
+    this.stylesheet = U, this.$render();
   }
   static get observedAttributes() {
     return [...super.observedAttributes, "title"];
@@ -243,25 +243,27 @@ class G extends _ {
           <slot></slot>
         </div>
       </div>
-    `, a(this, x, this.shadowRoot.querySelector(".ea-menu-item-group")), a(this, C, this.shadowRoot.querySelector("slot[name='title']"));
+    `, a(this, S, this.shadowRoot.querySelector(".ea-menu-item-group")), a(this, C, this.shadowRoot.querySelector("slot[name='title']"));
   }
   connectedCallback() {
     super.connectedCallback();
   }
   $beforeUnmounted() {
-    t(this, S).abort();
+    t(this, $).abort();
   }
 }
-x = new WeakMap(), C = new WeakMap(), S = new WeakMap();
-window.customElements.get("ea-menu-item-group") || window.customElements.define("ea-menu-item-group", G);
-var g, y, n, m, h, d, $, k, M, w;
-class V extends _ {
+S = new WeakMap(), C = new WeakMap(), $ = new WeakMap();
+window.customElements.get("ea-menu-item-group") || window.customElements.define("ea-menu-item-group", V);
+var g, y, w, n, m, h, d, k, M, _, A;
+class j extends q {
   constructor() {
     super();
     /** @type {HTMLElement} */
     r(this, g);
     /** @type {HTMLElement} */
     r(this, y);
+    /** @type {HTMLSlotElement} */
+    r(this, w);
     /** @type {HTMLElement} */
     r(this, n);
     /** @type {AbortController} */
@@ -303,7 +305,14 @@ class V extends _ {
         type: ["horizontal", "vertical"],
         default: "vertical",
         observer: (e) => {
-          t(this, w).call(this, e), this.updateContainerClasslist();
+          t(this, A).call(this, e), this.updateContainerClasslist();
+        }
+      },
+      label: {
+        type: String,
+        default: "",
+        observer: (e) => {
+          t(this, w).textContent = e;
         }
       }
     }));
@@ -311,7 +320,7 @@ class V extends _ {
      * 菜单项点击事件
      * @param {MouseEvent} e
      */
-    r(this, $, (e) => {
+    r(this, k, (e) => {
       e.stopImmediatePropagation(), e.preventDefault();
       const o = e.target.closest("ea-menu-item"), l = this.closest("ea-sub-menu") === this ? this.parentElement.closest("ea-sub-menu") : this.closest("ea-sub-menu");
       o && (this.emit("ea-sub-menu-click", {
@@ -323,7 +332,7 @@ class V extends _ {
      * 鼠标悬停事件
      * @param {MouseEvent} e
      */
-    r(this, k, () => {
+    r(this, M, () => {
       var o;
       (o = t(this, h)) == null || o.abort(), a(this, h, new AbortController()), this.open = !0;
       const e = () => {
@@ -337,7 +346,7 @@ class V extends _ {
     /**
      * 垂直菜单折叠事件
      */
-    r(this, M, () => {
+    r(this, _, () => {
       this.open = !this.open, this.open || (t(this, n).style.setProperty("--ea-sub-menu-transition", "none"), t(this, n).offsetHeight, t(this, n).style.height = `${t(this, n).scrollHeight}px`, t(this, n).offsetHeight, t(this, n).style.removeProperty("--ea-sub-menu-transition")), t(this, n).style.height = `${this.open ? t(this, n).scrollHeight : 0}px`, t(this, n).addEventListener(
         "transitionend",
         () => {
@@ -350,18 +359,25 @@ class V extends _ {
      * 菜单模式切换
      * @param {string} [mode]
      */
-    r(this, w, (e = this.mode) => {
+    r(this, A, (e = this.mode) => {
       var o;
-      (o = t(this, d)) == null || o.abort(), a(this, d, new AbortController()), e === "vertical" ? t(this, y).addEventListener("click", t(this, M), {
+      (o = t(this, d)) == null || o.abort(), a(this, d, new AbortController()), e === "vertical" ? t(this, y).addEventListener("click", t(this, _), {
         signal: t(this, d).signal
-      }) : this.addEventListener("mouseenter", t(this, k), {
+      }) : this.addEventListener("mouseenter", t(this, M), {
         signal: t(this, d).signal
       });
     });
-    this.stylesheet = U, this.$render();
+    this.stylesheet = z, this.$render();
   }
   static get observedAttributes() {
-    return [...super.observedAttributes, "active", "index", "disabled", "mode"];
+    return [
+      ...super.observedAttributes,
+      "active",
+      "index",
+      "disabled",
+      "mode",
+      "label"
+    ];
   }
   /**
    * 获取 classlist 列表
@@ -394,24 +410,24 @@ class V extends _ {
           <slot></slot>
         </ul>
       </div>
-    `, a(this, g, this.shadowRoot.querySelector(".ea-sub-menu")), a(this, y, this.shadowRoot.querySelector(".ea-sub-menu__title")), a(this, n, this.shadowRoot.querySelector(".ea-sub-menu__content")), this.updateContainerClasslist();
+    `, a(this, g, this.shadowRoot.querySelector(".ea-sub-menu")), a(this, y, this.shadowRoot.querySelector(".ea-sub-menu__title")), a(this, w, this.shadowRoot.querySelector("slot[name='title']")), a(this, n, this.shadowRoot.querySelector(".ea-sub-menu__content")), this.updateContainerClasslist();
   }
   connectedCallback() {
     var e;
-    super.connectedCallback(), (e = t(this, m)) == null || e.abort(), a(this, m, new AbortController()), this.addEventListener("click", t(this, $), {
+    super.connectedCallback(), (e = t(this, m)) == null || e.abort(), a(this, m, new AbortController()), this.addEventListener("click", t(this, k), {
       signal: t(this, m).signal
-    }), t(this, w).call(this), this.updateContainerClasslist();
+    }), t(this, A).call(this), this.updateContainerClasslist();
   }
   $beforeUnmounted() {
     var e, o, l;
     (e = t(this, m)) == null || e.abort(), (o = t(this, h)) == null || o.abort(), (l = t(this, d)) == null || l.abort();
   }
 }
-g = new WeakMap(), y = new WeakMap(), n = new WeakMap(), m = new WeakMap(), h = new WeakMap(), d = new WeakMap(), $ = new WeakMap(), k = new WeakMap(), M = new WeakMap(), w = new WeakMap();
-window.customElements.get("ea-sub-menu") || window.customElements.define("ea-sub-menu", V);
+g = new WeakMap(), y = new WeakMap(), w = new WeakMap(), n = new WeakMap(), m = new WeakMap(), h = new WeakMap(), d = new WeakMap(), k = new WeakMap(), M = new WeakMap(), _ = new WeakMap(), A = new WeakMap();
+window.customElements.get("ea-sub-menu") || window.customElements.define("ea-sub-menu", j);
 export {
-  z as EaMenu,
-  D as EaMenuItem,
-  G as EaMenuItemGroup,
-  V as EaSubMenu
+  D as EaMenu,
+  G as EaMenuItem,
+  V as EaMenuItemGroup,
+  j as EaSubMenu
 };