easy-component-ui 3.0.11 → 3.0.13

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 列表
@@ -388,30 +404,30 @@ class V extends _ {
       <div class='ea-sub-menu' part='container'>
         <header class='ea-sub-menu__title' part='title'>
           <slot name='title'></slot>
-          <ea-icon icon="${e ? "icon-angle-right" : "icon-angle-down"}" class='ea-sub-menu__arrow' part='arrow'></ea-icon>
+          <ea-icon name="${e ? "angle-right" : "angle-down"}" class='ea-sub-menu__arrow' part='arrow'></ea-icon>
         </header>
         <ul class='ea-sub-menu__content' part='content'>
           <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
 };