easy-component-ui 3.0.11 → 3.0.13

package/dist/components/ea-alert.js

@@ -3,56 +3,58 @@ var y = (t) => {
   throw TypeError(t);
 };
 var C = (t, s, e) => s in t ? w(t, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[s] = e;
-var m = (t, s, e) => C(t, typeof s != "symbol" ? s + "" : s, e), _ = (t, s, e) => s.has(t) || y("Cannot " + e);
-var o = (t, s, e) => (_(t, s, "read from private field"), e ? e.call(t) : s.get(t)), i = (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, c) => (_(t, s, "write to private field"), c ? c.call(t, e) : s.set(t, e), e);
+var _ = (t, s, e) => C(t, typeof s != "symbol" ? s + "" : s, e), v = (t, s, e) => s.has(t) || y("Cannot " + e);
+var a = (t, s, e) => (v(t, s, "read from private field"), e ? e.call(t) : s.get(t)), i = (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, c) => (v(t, s, "write to private field"), c ? c.call(t, e) : s.set(t, e), e);
 import { B as g } from "./Base.js";
-import { s as S } from "../css/ea-alert.style.js";
+import { s as x } from "../css/ea-alert.style.js";
 import { t as b } from "../utils/timeout.js";
-var a, h, f, p, d, l, n, u;
+var l, d, u, m, p, f, n, o, h;
 class L extends g {
   constructor() {
     super();
     /** @type {HTMLElement} */
-    i(this, a);
+    i(this, l);
     /** @type {HTMLElement} */
-    i(this, h);
+    i(this, d);
     /** @type {HTMLElement} */
-    i(this, f);
+    i(this, u);
+    /** @type {HTMLSlotElement} */
+    i(this, m);
     /** @type {HTMLElement} */
     i(this, p);
     /** @type {HTMLElement} */
-    i(this, d);
+    i(this, f);
     /** @type {HTMLElement} */
-    i(this, l);
-    /** @type {AbortController} */
     i(this, n);
-    m(this, "state", this.properties({
+    /** @type {AbortController} */
+    i(this, o);
+    _(this, "state", this.properties({
       title: {
         type: String,
         default: "",
         observer: (e) => {
-          o(this, p).innerHTML = e || '<slot name="title"></slot>';
+          a(this, p).innerHTML = e;
         }
       },
       description: {
         type: String,
         default: "",
         observer: (e) => {
-          o(this, d).innerHTML = e || "<slot></slot>";
+          a(this, f).innerHTML = e || "<slot></slot>";
         }
       },
       type: {
         type: ["primary", "info", "success", "warning", "error"],
         default: "info",
         observer: (e) => {
-          o(this, a).className = this.updateContainerClasslist();
+          this.updateContainerClasslist();
         }
       },
       effect: {
         type: ["light", "dark"],
         default: "light",
         observer: (e) => {
-          o(this, a).className = this.updateContainerClasslist();
+          this.updateContainerClasslist();
         }
       },
       "close-text": {
@@ -60,7 +62,7 @@ class L extends g {
         default: "",
         observer: (e) => {
           try {
-            o(this, l).textContent = e;
+            a(this, n).textContent = e;
           } catch {
           }
         }
@@ -69,36 +71,39 @@ class L extends g {
         type: Boolean,
         default: !0,
         observer: (e) => {
-          o(this, l).innerHTML = e ? this["close-text"] ? this["close-text"] : '<ea-icon class="ea-alert__close-icon" icon="icon-cancel" part="close-icon"></ea-icon>' : "";
+          var c;
+          (c = a(this, o)) == null || c.abort(), a(this, n).innerHTML = e ? this["close-text"] ? this["close-text"] : '<ea-icon class="ea-alert__close-icon" name="xmark" part="close-icon"></ea-icon>' : "", e && (r(this, o, new AbortController()), a(this, n).addEventListener("click", a(this, h), {
+            signal: a(this, o).signal
+          }));
         }
       },
       "show-icon": {
         type: Boolean,
         default: !1,
-        observer: (e) => {
-          const c = {
-            primary: "info",
-            success: "ok-circled",
-            info: "info",
-            warning: "attention-alt",
-            error: "cancel-circled"
-          }, v = this.querySelector("[slot=icon]");
-          o(this, h).innerHTML = e && !v ? `<ea-icon class="ea-alert__icon" icon="icon-${c[this.type]}" part="icon"></ea-icon>` : '<slot name="icon"></slot>';
+        observer: () => {
+          const e = {
+            primary: "circle-info",
+            success: "circle-check",
+            info: "circle-info",
+            warning: "triangle-exclamation",
+            error: "circle-xmark"
+          };
+          a(this, d).innerHTML = `<ea-icon class="ea-alert__icon" name="${e[this.type]}" part="icon"></ea-icon>`;
         }
       },
       center: {
         type: Boolean,
         default: !1,
         observer: () => {
-          o(this, a).className = this.updateContainerClasslist();
+          this.updateContainerClasslist();
         }
       },
       "show-after": {
         type: Number,
         default: 0,
         observer: (e) => {
-          e = Math.abs(e), o(this, a).classList.toggle("ea-alert--hide", e > 0), b(() => {
-            this.emit("open"), o(this, a).classList.remove("ea-alert--hide");
+          e = Math.abs(e), a(this, l).classList.toggle("ea-alert--hide", e > 0), b(() => {
+            this.emit("open"), a(this, l).classList.remove("ea-alert--hide");
           }, e);
         }
       },
@@ -112,26 +117,29 @@ class L extends g {
         type: Number,
         default: 0,
         observer: (e) => {
-          e && this.isMounted && b(() => o(this, u).call(this), this["auto-close"]);
+          e && this.isMounted && b(() => a(this, h).call(this), this["auto-close"]);
         }
       }
     }));
-    i(this, u, (e) => {
+    /**
+     * 关闭事件
+     */
+    i(this, h, () => {
       b(() => {
-        o(this, n).abort(), o(this, a).classList.add("ea-alert--before-close"), o(this, a).addEventListener(
-          "transitionend",
-          () => {
-            this.emit("close", {
-              detail: {
-                visible: !1
-              }
-            }), this.remove();
-          },
-          { once: !0 }
-        );
+        a(this, l).classList.add("ea-alert--before-close");
+        const e = () => {
+          this.emit("close", {
+            detail: {
+              visible: !1
+            }
+          }), this.remove();
+        };
+        a(this, l).addEventListener("transitionend", e, {
+          once: !0
+        });
       }, this["hide-after"]);
     });
-    this.$render(), this.stylesheet = S;
+    this.$render(), this.stylesheet = x;
   }
   static get observedAttributes() {
     return [
@@ -154,11 +162,12 @@ class L extends g {
    * @return {string} 属性值
    */
   updateContainerClasslist() {
-    return this.computedClasslist("ea-alert", {
+    const e = this.computedClasslist("ea-alert", {
       ["--" + this.type]: this.type,
       ["--" + this.effect]: this.effect,
       "--center": this.center
     });
+    return a(this, l).className = e, e;
   }
   $render() {
     this.shadowRoot.innerHTML = `
@@ -167,29 +176,37 @@ class L extends g {
           <slot name='icon'></slot>
         </span>
         <div class="ea-alert__content" part='content-wrap'>
-          <span class="ea-alert__title" part='title'></span>
+          <span class="ea-alert__title" part='title'>
+            <slot name="title"></slot>
+          </span>
           <p class="ea-alert__description" part='description'>
             <slot></slot>
           </p>
           <span class="ea-alert__close-btn" part="close-btn">
-            ${this.closable ? this["close-text"] ? this["close-text"] : '<ea-icon class="ea-alert__close-icon" icon="icon-cancel" part="close-icon"></ea-icon>' : ""}
+            ${this.closable ? this["close-text"] ? this["close-text"] : '<ea-icon class="ea-alert__close-icon" name="xmark" part="close-icon"></ea-icon>' : ""}
           </span>
         </div>
       </div>
-    `, r(this, a, this.shadowRoot.querySelector(".ea-alert")), r(this, h, this.shadowRoot.querySelector(".ea-alert__icon-wrap")), r(this, f, this.shadowRoot.querySelector(".ea-alert__content")), r(this, p, this.shadowRoot.querySelector(".ea-alert__title")), r(this, d, this.shadowRoot.querySelector(
-      ".ea-alert__description"
-    )), r(this, l, this.shadowRoot.querySelector(".ea-alert__close-btn"));
+    `, r(this, l, this.shadowRoot.querySelector(".ea-alert")), r(this, d, this.shadowRoot.querySelector(
+      ".ea-alert__icon-wrap slot[name=icon]"
+    )), r(this, u, this.shadowRoot.querySelector(".ea-alert__content")), r(this, p, this.shadowRoot.querySelector(
+      ".ea-alert__title slot[name=title]"
+    )), r(this, f, this.shadowRoot.querySelector(
+      ".ea-alert__description slot"
+    )), r(this, n, this.shadowRoot.querySelector(".ea-alert__close-btn"));
   }
   connectedCallback() {
-    super.connectedCallback(), r(this, n, new AbortController()), this.closable && o(this, l).addEventListener("click", o(this, u), {
-      signal: o(this, n).signal
-    });
+    var e;
+    super.connectedCallback(), (e = a(this, o)) == null || e.abort(), this.closable && (r(this, o, new AbortController()), a(this, n).addEventListener("click", a(this, h), {
+      signal: a(this, o).signal
+    }));
   }
   $beforeUnmounted() {
-    o(this, n).abort();
+    var e;
+    (e = a(this, o)) == null || e.abort();
   }
 }
-a = new WeakMap(), h = new WeakMap(), f = new WeakMap(), p = new WeakMap(), d = new WeakMap(), l = new WeakMap(), n = new WeakMap(), u = new WeakMap();
+l = new WeakMap(), d = new WeakMap(), u = new WeakMap(), m = new WeakMap(), p = new WeakMap(), f = new WeakMap(), n = new WeakMap(), o = new WeakMap(), h = new WeakMap();
 window.customElements.get("ea-alert") || window.customElements.define("ea-alert", L);
 export {
   L as EaAlert

package/dist/components/ea-avatar.js

@@ -1,14 +1,14 @@
-var u = Object.defineProperty;
+var m = Object.defineProperty;
 var v = (e) => {
   throw TypeError(e);
 };
-var g = (e, a, t) => a in e ? u(e, a, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[a] = t;
-var f = (e, a, t) => g(e, typeof a != "symbol" ? a + "" : a, t), p = (e, a, t) => a.has(e) || v("Cannot " + t);
-var r = (e, a, t) => (p(e, a, "read from private field"), t ? t.call(e) : a.get(e)), n = (e, a, t) => a.has(e) ? v("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(e) : a.set(e, t), h = (e, a, t, s) => (p(e, a, "write to private field"), s ? s.call(e, t) : a.set(e, t), t);
-import { B as m } from "./Base.js";
-import { E as w } from "../utils/Utils.js";
-import { s as y } from "../css/ea-avatar.style.js";
-const b = `
+var g = (e, s, t) => s in e ? m(e, s, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[s] = t;
+var f = (e, s, t) => g(e, typeof s != "symbol" ? s + "" : s, t), p = (e, s, t) => s.has(e) || v("Cannot " + t);
+var r = (e, s, t) => (p(e, s, "read from private field"), t ? t.call(e) : s.get(e)), n = (e, s, t) => s.has(e) ? v("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(e) : s.set(e, t), h = (e, s, t, a) => (p(e, s, "write to private field"), a ? a.call(e, t) : s.set(e, t), t);
+import { B as y } from "./Base.js";
+import { E as b } from "../utils/Utils.js";
+import { s as w } from "../css/ea-avatar.style.js";
+const u = `
     <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
         <defs>
             <clipPath id="a">
@@ -28,44 +28,44 @@ const b = `
         <path d="M55 45L40 70h5 30z" fill="#c0c4cc" />
     </svg>
 `;
-var i, l;
-class C extends m {
+var o, i;
+class C extends y {
   constructor() {
     super();
     /** @type {HTMLElement} */
-    n(this, i);
+    n(this, o);
     /** @type {AbortController} */
-    n(this, l);
+    n(this, i);
     f(this, "state", this.properties({
       icon: {
         type: String,
         default: "",
         observer: (t) => {
-          r(this, i).innerHTML = `<ea-icon class="ea-avatar__icon" icon="${t}" part="icon-avatar"></ea-icon>`;
+          t ? r(this, o).innerHTML = `<ea-icon class="ea-avatar__icon" name="${t}" part="icon-avatar"></ea-icon>` : r(this, o).innerHTML = `<slot>${u}</slot>`;
         }
       },
       shape: {
         type: ["circle", "square"],
         default: "circle",
         observer: () => {
-          r(this, i).className = this.updateContainerClasslist();
+          this.updateContainerClasslist();
         }
       },
       size: {
         type: String,
         default: "default",
         observer: (t) => {
-          const s = w.Enum.hasEnum(
+          const a = b.Enum.hasEnum(
             ["default", "small", "large"],
             t
           ), c = CSS.supports("width", t);
-          if (!s && !c)
+          if (!a && !c)
             return this.size = "default", console.warn(
               "[ea-avatar] Please set size to one of [default, small, large] or a valid CSS width value"
             );
           this.style.setProperty(
             "--ea-avatar-size",
-            s ? `var(--ea-avatar-size-${t})` : t
+            a ? `var(--ea-avatar-size-${t})` : t
           );
         }
       },
@@ -74,23 +74,23 @@ class C extends m {
         default: "",
         observer: (t) => {
           var c;
-          (c = r(this, l)) == null || c.abort(), h(this, l, new AbortController());
-          const s = new Image();
-          s.src = t, s.addEventListener(
+          (c = r(this, i)) == null || c.abort(), h(this, i, new AbortController());
+          const a = new Image();
+          a.src = t, a.addEventListener(
             "load",
             () => {
-              var o;
-              r(this, i).innerHTML = `<img class="ea-avatar__img" src="${t}" alt="${this.alt}" srcset="${this["src-set"]}" part="img-avatar" />`, (o = r(this, l)) == null || o.abort();
+              var l;
+              r(this, o).innerHTML = `<img class="ea-avatar__img" src="${t}" alt="${this.alt}" srcset="${this["src-set"]}" part="img-avatar" />`, (l = r(this, i)) == null || l.abort();
             },
-            { signal: r(this, l).signal }
-          ), s.addEventListener(
+            { signal: r(this, i).signal }
+          ), a.addEventListener(
             "error",
             () => {
               var d;
-              const o = r(this, i).querySelector("slot");
-              o && (o.innerHTML = S), this.emit("error"), (d = r(this, l)) == null || d.abort();
+              const l = r(this, o).querySelector("slot");
+              l && (l.innerHTML = S), this.emit("error"), (d = r(this, i)) == null || d.abort();
             },
-            { signal: r(this, l).signal }
+            { signal: r(this, i).signal }
           );
         }
       },
@@ -98,16 +98,16 @@ class C extends m {
         type: String,
         default: "",
         observer: (t) => {
-          const s = this.shadowRoot.querySelector(".ea-avatar__img");
-          s && (s.srcset = t);
+          const a = this.shadowRoot.querySelector(".ea-avatar__img");
+          a && (a.srcset = t);
         }
       },
       alt: {
         type: String,
         default: "",
         observer: (t) => {
-          const s = this.shadowRoot.querySelector(".ea-avatar__img");
-          s && (s.alt = t);
+          const a = this.shadowRoot.querySelector(".ea-avatar__img");
+          a && (a.alt = t);
         }
       },
       fit: {
@@ -118,7 +118,7 @@ class C extends m {
         }
       }
     }));
-    this.stylesheet = y, this.$render();
+    this.stylesheet = w, this.$render();
   }
   static get observedAttributes() {
     return [
@@ -137,22 +137,27 @@ class C extends m {
    * @return {string} 属性值
    */
   updateContainerClasslist() {
-    return this.computedClasslist("ea-avatar", {
+    const t = this.computedClasslist("ea-avatar", {
       ["--" + this.shape]: this.shape
     });
+    return r(this, o).className = t, t;
   }
   $render() {
     this.shadowRoot.innerHTML = `
       <div class="ea-avatar" part='container'>
-        <slot>${b}</slot>
+        <slot>${u}</slot>
       </div>
-    `, h(this, i, this.shadowRoot.querySelector(".ea-avatar"));
+    `, h(this, o, this.shadowRoot.querySelector(".ea-avatar")), this.updateContainerClasslist();
   }
   connectedCallback() {
-    super.connectedCallback(), r(this, i).className = this.updateContainerClasslist();
+    super.connectedCallback();
+  }
+  $beforeUnmounted() {
+    var t;
+    (t = r(this, i)) == null || t.abort();
   }
 }
-i = new WeakMap(), l = new WeakMap();
+o = new WeakMap(), i = new WeakMap();
 window.customElements.get("ea-avatar") || window.customElements.define("ea-avatar", C);
 export {
   C as EaAvatar

package/dist/components/ea-breadcrumb.js

@@ -1,24 +1,24 @@
-var C = Object.defineProperty;
+var E = Object.defineProperty;
 var S = (t) => {
   throw TypeError(t);
 };
-var y = (t, s, e) => s in t ? C(t, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[s] = e;
-var f = (t, s, e) => y(t, typeof s != "symbol" ? s + "" : s, e), w = (t, s, e) => s.has(t) || S("Cannot " + e);
-var r = (t, s, e) => (w(t, s, "read from private field"), e ? e.call(t) : s.get(t)), a = (t, s, e) => s.has(t) ? S("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(t) : s.set(t, e), l = (t, s, e, n) => (w(t, s, "write to private field"), n ? n.call(t, e) : s.set(t, e), e);
-import { B as E } from "./Base.js";
+var y = (t, r, e) => r in t ? E(t, r, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[r] = e;
+var f = (t, r, e) => y(t, typeof r != "symbol" ? r + "" : r, e), w = (t, r, e) => r.has(t) || S("Cannot " + e);
+var s = (t, r, e) => (w(t, r, "read from private field"), e ? e.call(t) : r.get(t)), a = (t, r, e) => r.has(t) ? S("Cannot add the same private member more than once") : r instanceof WeakSet ? r.add(t) : r.set(t, e), i = (t, r, e, n) => (w(t, r, "write to private field"), n ? n.call(t, e) : r.set(t, e), e);
+import { B as C } from "./Base.js";
 import { s as v } from "../css/ea-breadcrumb.style.js";
 import { s as R } from "../css/ea-breadcrumb-item.style.js";
 import { E as _ } from "../utils/Utils.js";
-var c, d, u, b, p;
-class q extends E {
+var l, c, d, b, p;
+class $ extends C {
   constructor() {
     super();
     /** @type {HTMLElement} */
-    a(this, c);
+    a(this, l);
     /** @type {HTMLSlotElement} */
-    a(this, d);
+    a(this, c);
     /** @type {AbortController} */
-    a(this, u, new AbortController());
+    a(this, d, new AbortController());
     f(this, "state", this.properties({
       separator: {
         type: String,
@@ -41,10 +41,10 @@ class q extends E {
      */
     a(this, p, () => {
       const n = [...this.shadowRoot.querySelector("#defaultSlot").assignedElements()].filter(
-        (h) => h.tagName.toLowerCase() === "ea-breadcrumb-item"
-      ), o = r(this, b).call(this, this.separator);
-      n.forEach((h, g) => {
-        g < n.length - 1 && !h.querySelector("[slot='separator']") && h.appendChild(o.cloneNode(!0));
+        (m) => m.tagName.toLowerCase() === "ea-breadcrumb-item"
+      ), o = s(this, b).call(this, this.separator);
+      n.forEach((m, g) => {
+        g < n.length - 1 && !m.querySelector("[slot='separator']") && m.appendChild(o.cloneNode(!0));
       });
     });
     this.stylesheet = v, this.$render();
@@ -60,7 +60,7 @@ class q extends E {
     const e = this.computedClasslist("ea-breadcrumb", {
       // ['--' + this.type]: this.type,
     });
-    return r(this, c).className = e, e;
+    return s(this, l).className = e, e;
   }
   $render() {
     this.shadowRoot.innerHTML = `
@@ -68,34 +68,34 @@ class q extends E {
             <slot id="defaultSlot"></slot>
         </nav>
         <slot id="separatorSlot" name="separator"></slot>
-    `, l(this, c, this.shadowRoot.querySelector(".ea-breadcrumb")), l(this, d, this.shadowRoot.querySelector("#defaultSlot"));
+    `, i(this, l, this.shadowRoot.querySelector(".ea-breadcrumb")), i(this, c, this.shadowRoot.querySelector("#defaultSlot"));
   }
   connectedCallback() {
-    super.connectedCallback(), r(this, d).addEventListener("slotchange", r(this, p), {
-      signal: r(this, u).signal
+    super.connectedCallback(), s(this, c).addEventListener("slotchange", s(this, p), {
+      signal: s(this, d).signal
     });
   }
   $beforeUnmounted() {
     var e;
-    (e = r(this, u)) == null || e.abort();
+    (e = s(this, d)) == null || e.abort();
   }
 }
-c = new WeakMap(), d = new WeakMap(), u = new WeakMap(), b = new WeakMap(), p = new WeakMap();
-window.customElements.get("ea-breadcrumb") || window.customElements.define("ea-breadcrumb", q);
-var m, i;
-class A extends E {
+l = new WeakMap(), c = new WeakMap(), d = new WeakMap(), b = new WeakMap(), p = new WeakMap();
+window.customElements.get("ea-breadcrumb") || window.customElements.define("ea-breadcrumb", $);
+var u, h;
+class q extends C {
   constructor() {
     super();
     /** @type {HTMLElement} */
-    a(this, m);
+    a(this, u);
     /** @type {HTMLElement} */
-    a(this, i);
+    a(this, h);
     f(this, "state", this.properties({
       href: {
         type: String,
         default: "",
         observer: (e) => {
-          r(this, i).setAttribute("href", e), r(this, i).classList.add("is-link");
+          this.$render(), s(this, h).href = this.getAttribute("href");
         }
       }
     }));
@@ -112,7 +112,7 @@ class A extends E {
     const e = this.computedClasslist("ea-breadcrumb-item", {
       // ['--' + this.type]: this.type,
     });
-    return r(this, m).className = e, e;
+    return s(this, u).className = e, e;
   }
   $render() {
     const e = _.EaElement.h(
@@ -132,17 +132,17 @@ class A extends E {
             <slot name="separator"></slot>
         </span>
       </div>
-    `, l(this, m, this.shadowRoot.querySelector(".ea-breadcrumb-item")), l(this, i, this.shadowRoot.querySelector(
+    `, i(this, u, this.shadowRoot.querySelector(".ea-breadcrumb-item")), i(this, h, this.shadowRoot.querySelector(
       ".ea-breadcrumb-item__content"
-    ));
+    )), this.updateContainerClasslist();
   }
   connectedCallback() {
     super.connectedCallback();
   }
 }
-m = new WeakMap(), i = new WeakMap();
-window.customElements.get("ea-breadcrumb-item") || window.customElements.define("ea-breadcrumb-item", A);
+u = new WeakMap(), h = new WeakMap();
+window.customElements.get("ea-breadcrumb-item") || window.customElements.define("ea-breadcrumb-item", q);
 export {
-  q as EaBreadcrumb,
-  A as EaBreadcrumbItem
+  $ as EaBreadcrumb,
+  q as EaBreadcrumbItem
 };