easy-component-ui 3.0.12 → 3.0.13

package/dist/components/ea-image.js

@@ -1,50 +1,54 @@
-var y = Object.defineProperty;
-var g = (s) => {
+var C = Object.defineProperty;
+var S = (s) => {
   throw TypeError(s);
 };
-var b = (s, i, e) => i in s ? y(s, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[i] = e;
-var c = (s, i, e) => b(s, typeof i != "symbol" ? i + "" : i, e), f = (s, i, e) => i.has(s) || g("Cannot " + e);
-var t = (s, i, e) => (f(s, i, "read from private field"), e ? e.call(s) : i.get(s)), o = (s, i, e) => i.has(s) ? g("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(s) : i.set(s, e), l = (s, i, e, n) => (f(s, i, "write to private field"), n ? n.call(s, e) : i.set(s, e), e);
-import { B as S } from "./Base.js";
-import { s as E } from "../css/ea-image.style.js";
-var m, a, u, d, r, h, p;
-class C extends S {
+var N = (s, i, e) => i in s ? C(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), E = (s, i, e) => i.has(s) || S("Cannot " + e);
+var t = (s, i, e) => (E(s, i, "read from private field"), e ? e.call(s) : i.get(s)), a = (s, i, e) => i.has(s) ? S("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(s) : i.set(s, e), n = (s, i, e, o) => (E(s, i, "write to private field"), o ? o.call(s, e) : i.set(s, e), e);
+import { B as A } from "./Base.js";
+import { s as D } from "../css/ea-image.style.js";
+var m, l, w, v, r, u, d, h, c, g;
+class _ extends A {
   constructor() {
     super();
     /** @type {HTMLElement} */
-    o(this, m);
+    a(this, m);
     /** @type {HTMLImageElement} */
-    o(this, a);
+    a(this, l);
     /** @type {HTMLElement} */
-    o(this, u);
+    a(this, w);
     /** @type {HTMLElement} */
-    o(this, d);
+    a(this, v);
     /** @type {EaImagePreview} */
-    o(this, r);
+    a(this, r);
+    /** @type {HTMLSlotElement} */
+    a(this, u);
+    /** @type {HTMLSlotElement} */
+    a(this, d);
     /** @type {AbortController} */
-    o(this, h);
-    o(this, p, {
+    a(this, h);
+    a(this, c, {
       /** @type {"loading" | "error" | "success"} */
       imageStatus: "loading",
       previewQueue: []
     });
-    c(this, "state", this.properties({
+    p(this, "state", this.properties({
       src: {
         type: String,
         default: "",
         observer: async (e) => {
-          const n = new Image();
+          const o = new Image();
           if (this.updateContainerClasslist(), this.lazy) {
-            const w = new IntersectionObserver((v) => {
-              v[0].intersectionRatio <= 0 || (w.disconnect(), n.src = this.src);
+            const f = new IntersectionObserver((b) => {
+              b[0].intersectionRatio <= 0 || (f.disconnect(), o.src = this.src);
             });
-            w.observe(this);
+            f.observe(this);
           } else
-            n.src = e;
-          n.onload = () => {
-            t(this, a).setAttribute("src", e), t(this, p).imageStatus = "success", this.updateContainerClasslist(), this.emit("load");
-          }, n.onerror = () => {
-            t(this, p).imageStatus = "error", this.updateContainerClasslist(), this.emit("error");
+            o.src = e;
+          o.onload = () => {
+            t(this, l).setAttribute("src", e), t(this, c).imageStatus = "success", this.updateContainerClasslist(), this.emit("load");
+          }, o.onerror = () => {
+            t(this, c).imageStatus = "error", this.updateContainerClasslist(), this.emit("error");
           };
         }
       },
@@ -85,28 +89,28 @@ class C extends S {
         type: String,
         default: "",
         observer: (e) => {
-          t(this, a).alt = e;
+          t(this, l).alt = e;
         }
       },
       loading: {
         type: ["lazy", "eager"],
         default: "eager",
         observer: (e) => {
-          t(this, a).setAttribute("loading", e);
+          t(this, l).setAttribute("loading", e);
         }
       },
       referrerpolicy: {
         type: String,
         default: "",
         observer: (e) => {
-          t(this, a).setAttribute("referrerpolicy", e);
+          t(this, l).setAttribute("referrerpolicy", e);
         }
       },
       crossorigin: {
         type: String,
         default: "",
         observer: (e) => {
-          t(this, a).setAttribute("sizes", e);
+          t(this, l).setAttribute("sizes", e);
         }
       },
       lazy: {
@@ -193,7 +197,7 @@ class C extends S {
         }
       }
     }));
-    c(this, "propState", this.properties({
+    p(this, "propState", this.properties({
       previewSrcList: {
         props: !0,
         type: Array,
@@ -206,26 +210,36 @@ class C extends S {
         }
       }
     }));
+    /**
+     * 处理 slotchange 事件，动态设置 slot 属性以传递给 ea-image-preview
+     * @param {HTMLSlotElement} slotElement
+     * @param {string} slotName
+     */
+    a(this, g, (e, o) => {
+      e.assignedNodes({ flatten: !0 }).some(
+        (y) => y.nodeType === Node.ELEMENT_NODE || y.nodeType === Node.TEXT_NODE && y.textContent.trim()
+      ) ? e.setAttribute("slot", o) : e.removeAttribute("slot");
+    });
     /**
      * 设置当前项
      * @param {Number} index
      */
-    c(this, "setActiveItem", (e) => {
+    p(this, "setActiveItem", (e) => {
       this.preview && t(this, r).setActiveItem(e);
     });
     /**
      * 重置预览器的所有状态
      */
-    c(this, "reset", () => {
+    p(this, "reset", () => {
       this.preview && t(this, r).reset();
     });
     /**
      * 显示预览（ea-image-preview）
      */
-    c(this, "showPreview", () => {
+    p(this, "showPreview", () => {
       t(this, r).visible = !0;
     });
-    this.stylesheet = E, this.$render();
+    this.stylesheet = D, this.$render();
   }
   static get observedAttributes() {
     return [
@@ -258,7 +272,7 @@ class C extends S {
    */
   updateContainerClasslist() {
     const e = this.computedClasslist("ea-image", {
-      [`--${t(this, p).imageStatus}`]: t(this, p).imageStatus
+      [`--${t(this, c).imageStatus}`]: t(this, c).imageStatus
     });
     return t(this, m).className = e, e;
   }
@@ -274,15 +288,26 @@ class C extends S {
         </section>
       </div>
       <ea-image-preview class="ea-image-preview" part='preview'>
-        <slot name='progress' slot="progress"></slot>
-        <slot name='toolbar' slot="toolbar"></slot>
-        <slot name='progress' slot="progress"></slot>
+        <slot name='progress'></slot>
+        <slot name='toolbar'></slot>
       </ea-image-preview>
-    `, l(this, m, this.shadowRoot.querySelector(".ea-image")), l(this, a, this.shadowRoot.querySelector(".ea-image__image")), l(this, u, this.shadowRoot.querySelector(".ea-image__error")), l(this, d, this.shadowRoot.querySelector(".ea-image__placeholder")), l(this, r, this.shadowRoot.querySelector(".ea-image-preview"));
+    `, n(this, m, this.shadowRoot.querySelector(".ea-image")), n(this, l, this.shadowRoot.querySelector(".ea-image__image")), n(this, w, this.shadowRoot.querySelector(".ea-image__error")), n(this, v, this.shadowRoot.querySelector(".ea-image__placeholder")), n(this, r, this.shadowRoot.querySelector(".ea-image-preview")), n(this, u, this.shadowRoot.querySelector('slot[name="progress"]')), n(this, d, this.shadowRoot.querySelector('slot[name="toolbar"]'));
   }
   async connectedCallback() {
     var e;
-    super.connectedCallback(), (e = t(this, h)) == null || e.abort(), l(this, h, new AbortController()), this.getAttribute("src") || this.setAttribute("src", ""), this.preview && (await customElements.whenDefined("ea-image-preview"), t(this, m).addEventListener(
+    super.connectedCallback(), (e = t(this, h)) == null || e.abort(), n(this, h, new AbortController()), this.getAttribute("src") || this.setAttribute("src", ""), t(this, u).addEventListener(
+      "slotchange",
+      () => t(this, g).call(this, t(this, u), "progress"),
+      {
+        signal: t(this, h).signal
+      }
+    ), t(this, d).addEventListener(
+      "slotchange",
+      () => t(this, g).call(this, t(this, d), "toolbar"),
+      {
+        signal: t(this, h).signal
+      }
+    ), this.preview && (await customElements.whenDefined("ea-image-preview"), t(this, m).addEventListener(
       "click",
       () => {
         this.showPreview();
@@ -295,8 +320,8 @@ class C extends S {
     (e = t(this, h)) == null || e.abort();
   }
 }
-m = new WeakMap(), a = new WeakMap(), u = new WeakMap(), d = new WeakMap(), r = new WeakMap(), h = new WeakMap(), p = new WeakMap();
-window.customElements.get("ea-image") || window.customElements.define("ea-image", C);
+m = new WeakMap(), l = new WeakMap(), w = new WeakMap(), v = new WeakMap(), r = new WeakMap(), u = new WeakMap(), d = new WeakMap(), h = new WeakMap(), c = new WeakMap(), g = new WeakMap();
+window.customElements.get("ea-image") || window.customElements.define("ea-image", _);
 export {
-  C as EaImage
+  _ as EaImage
 };

package/dist/components/ea-input-number.js

@@ -12,16 +12,16 @@ class S extends Event {
     super("ea-change", { bubbles: !0, cancelable: !0, composed: !0 }), this.detail = i;
   }
 }
-var c, r, d, b, m, o, u, f, v, y;
+var d, r, c, b, m, o, u, f, v, y;
 class M extends A {
   constructor() {
     super();
     /** @type {HTMLElement} */
-    n(this, c);
+    n(this, d);
     /** @type {HTMLInputElement} */
     n(this, r);
     /** @type {HTMLElement} */
-    n(this, d);
+    n(this, c);
     /** @type {HTMLElement} */
     n(this, b);
     /** @type {HTMLLabelElement} */
@@ -307,14 +307,14 @@ class M extends A {
         "no-controls": !this.controls
       }
     );
-    return t(this, c).className = e, e;
+    return t(this, d).className = e, e;
   }
   $render() {
     this.shadowRoot.innerHTML = `
       <label class="ea-input-number" part="container">
         <span class="ea-input-number__form-label" part="label"></span>
         <section class="ea-input-number__region" part="region">
-          <ea-icon class="ea-input-number__operator decrease" part="decrease" icon="icon-minus"></ea-icon>
+          <ea-icon class="ea-input-number__operator decrease" part="decrease" name="minus"></ea-icon>
           <span class="ea-input-number__prefix" part="prefix">
             <slot name="prefix"></slot>
           </span>
@@ -322,10 +322,10 @@ class M extends A {
           <span class="ea-input-number__suffix" part="suffix">
             <slot name="suffix"></slot>
           </span>
-          <ea-icon class="ea-input-number__operator increase" part="increase" icon="icon-plus"></ea-icon>
+          <ea-icon class="ea-input-number__operator increase" part="increase" name="plus"></ea-icon>
         </section>
       </label>
-    `, l(this, c, this.shadowRoot.querySelector(".ea-input-number")), l(this, m, this.shadowRoot.querySelector(".ea-input-number__form-label")), l(this, r, this.shadowRoot.querySelector(".ea-input-number__inner")), l(this, d, this.shadowRoot.querySelector(
+    `, l(this, d, this.shadowRoot.querySelector(".ea-input-number")), l(this, m, this.shadowRoot.querySelector(".ea-input-number__form-label")), l(this, r, this.shadowRoot.querySelector(".ea-input-number__inner")), l(this, c, this.shadowRoot.querySelector(
       ".ea-input-number__operator.decrease"
     )), l(this, b, this.shadowRoot.querySelector(
       ".ea-input-number__operator.increase"
@@ -339,7 +339,7 @@ class M extends A {
     }, a = () => {
       this.disabled || !this.controls || t(this, v).call(this);
     };
-    t(this, d).addEventListener("click", e, {
+    t(this, c).addEventListener("click", e, {
       signal: t(this, o).signal
     }), t(this, b).addEventListener("click", a, {
       signal: t(this, o).signal
@@ -360,7 +360,7 @@ class M extends A {
     (e = t(this, o)) == null || e.abort();
   }
 }
-c = new WeakMap(), r = new WeakMap(), d = new WeakMap(), b = new WeakMap(), m = new WeakMap(), o = new WeakMap(), u = new WeakMap(), f = new WeakMap(), v = new WeakMap(), y = new WeakMap();
+d = new WeakMap(), r = new WeakMap(), c = new WeakMap(), b = new WeakMap(), m = new WeakMap(), o = new WeakMap(), u = new WeakMap(), f = new WeakMap(), v = new WeakMap(), y = new WeakMap();
 window.customElements.get("ea-input-number") || window.customElements.define("ea-input-number", M);
 export {
   M as EaInputNumber

package/dist/components/ea-input.js

@@ -1,11 +1,11 @@
-var F = Object.defineProperty;
+var B = Object.defineProperty;
 var $ = (n) => {
   throw TypeError(n);
 };
-var I = (n, o, t) => o in n ? F(n, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[o] = t;
-var T = (n, o, t) => I(n, typeof o != "symbol" ? o + "" : o, t), B = (n, o, t) => o.has(n) || $("Cannot " + t);
-var e = (n, o, t) => (B(n, o, "read from private field"), t ? t.call(n) : o.get(n)), a = (n, o, t) => o.has(n) ? $("Cannot add the same private member more than once") : o instanceof WeakSet ? o.add(n) : o.set(n, t), h = (n, o, t, s) => (B(n, o, "write to private field"), s ? s.call(n, t) : o.set(n, t), t);
-import { F as k } from "../core/FormBase.js";
+var F = (n, o, t) => o in n ? B(n, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[o] = t;
+var T = (n, o, t) => F(n, typeof o != "symbol" ? o + "" : o, t), k = (n, o, t) => o.has(n) || $("Cannot " + t);
+var e = (n, o, t) => (k(n, o, "read from private field"), t ? t.call(n) : o.get(n)), a = (n, o, t) => o.has(n) ? $("Cannot add the same private member more than once") : o instanceof WeakSet ? o.add(n) : o.set(n, t), h = (n, o, t, s) => (k(n, o, "write to private field"), s ? s.call(n, t) : o.set(n, t), t);
+import { F as I } from "../core/FormBase.js";
 import { E as M } from "../utils/Utils.js";
 import { s as V } from "../css/ea-input.style.js";
 class U extends Event {
@@ -14,7 +14,7 @@ class U extends Event {
   }
 }
 var g, C, _, w, y, i, R, b, m, p, x, S, v, u, l, d, r, P, O, E, A, q, z, L, H, f;
-class G extends k {
+class G extends I {
   constructor() {
     super();
     /** @type {HTMLElement} */
@@ -165,9 +165,9 @@ class G extends k {
       },
       "clear-icon": {
         type: String,
-        default: "icon-cancel",
+        default: "xmark",
         observer: (t) => {
-          this.clearable && e(this, m).setAttribute("icon", t);
+          this.clearable && e(this, m).setAttribute("name", t);
         }
       },
       disabled: {
@@ -182,7 +182,7 @@ class G extends k {
         default: !1,
         observer: (t) => {
           var s;
-          this.type !== "textarea" && ((s = e(this, l).showPasswordController) == null || s.abort(), this.type === "text" ? e(this, p).icon = "icon-eye" : this.type === "password" && (e(this, p).icon = "icon-eye-off"), t && (this.type === "password" || this.type === "text") && (e(this, l).showPasswordController = new AbortController(), e(this, p).addEventListener(
+          this.type !== "textarea" && ((s = e(this, l).showPasswordController) == null || s.abort(), this.type === "text" ? e(this, p).name = "eye" : this.type === "password" && (e(this, p).name = "eye-slash"), t && (this.type === "password" || this.type === "text") && (e(this, l).showPasswordController = new AbortController(), e(this, p).addEventListener(
             "click",
             e(this, L),
             {
@@ -195,14 +195,14 @@ class G extends k {
         type: String,
         default: "",
         observer: (t) => {
-          t && (e(this, w).innerHTML = `<ea-icon class="ea-input__prefix-icon" part="prefix-icon" icon="${t}"></ea-icon>`);
+          t && (e(this, w).innerHTML = `<ea-icon class="ea-input__prefix-icon" part="prefix-icon" name="${t}"></ea-icon>`);
         }
       },
       "suffix-icon": {
         type: String,
         default: "",
         observer: (t) => {
-          t && (e(this, b).innerHTML = `<ea-icon class="ea-input__suffix-icon" part="suffix-icon" icon="${t}"></ea-icon>`);
+          t && (e(this, b).innerHTML = `<ea-icon class="ea-input__suffix-icon" part="suffix-icon" name="${t}"></ea-icon>`);
         }
       },
       "show-word-limit": {
@@ -349,7 +349,7 @@ class G extends k {
      */
     a(this, P, (t) => {
       const s = this.id || Math.random().toString(36).substring(2, 7), c = t === "textarea" ? `<textarea id="${s}" class="ea-input__original" part="original"></textarea>` : `<input id="${s}" class="ea-input__original" type="${t}" part="original" />`;
-      e(this, y).innerHTML = c, h(this, i, e(this, y).querySelector(".ea-input__original")), e(this, d).isOriginalRendered = !0;
+      e(this, y).innerHTML = c, h(this, i, e(this, y).querySelector(".ea-input__original")), e(this, i).value = this.value, e(this, d).isOriginalRendered = !0;
     });
     /**
      * 输入框内容发生改变时触发
@@ -396,7 +396,7 @@ class G extends k {
      * 显示密码按钮点击时触发
      */
     a(this, L, () => {
-      this.type === "password" ? (this.type = "text", e(this, p).icon = "icon-eye") : this.type === "text" && (this.type = "password", e(this, p).icon = "icon-eye-off"), this.focus();
+      this.type === "password" ? (this.type = "text", e(this, p).name = "eye") : this.type === "text" && (this.type = "password", e(this, p).name = "eye-slash"), this.focus();
     });
     /**
      * 自动调整高度
@@ -495,8 +495,8 @@ class G extends k {
             <span class="ea-input__original-wrapper" part="original-wrapper">
             </span>
             <span class="ea-input__suffix" part="suffix">
-              <ea-icon class="ea-input__clear-icon" icon="icon-cancel" part="clear-icon"></ea-icon>
-              <ea-icon class="ea-input__show-password-icon" icon="icon-eye-off" part="show-password-icon"></ea-icon>
+              <ea-icon class="ea-input__clear-icon" name="xmark" part="clear-icon"></ea-icon>
+              <ea-icon class="ea-input__show-password-icon" name="eye-slash" part="show-password-icon"></ea-icon>
               <span class="ea-input__suffix-icon" part="suffix-icon">
                 <slot name="suffix"></slot>
               </span>

package/dist/components/ea-layout.js

@@ -7,7 +7,7 @@ import { s as i } from "../css/ea-row.style.js";
 class p extends o {
   constructor() {
     super();
-    /** 
+    /**
      * @typedef {Object} State
      * @property {Number} span 列数
      * @property {Number} offset 列偏移
@@ -71,7 +71,7 @@ window.customElements.get("ea-col") || window.customElements.define("ea-col", p)
 class u extends o {
   constructor() {
     super();
-    /** 
+    /**
      * @typedef {Object} State
      * @property {string} gutter - 列类型
      * @property {string} justify - 列对齐方式
@@ -87,7 +87,14 @@ class u extends o {
         }
       },
       justify: {
-        type: ["start", "end", "center", "space-around", "space-between", "space-evenly"],
+        type: [
+          "start",
+          "end",
+          "center",
+          "space-around",
+          "space-between",
+          "space-evenly"
+        ],
         default: "start",
         observer: (e) => {
           this.style.setProperty("--ea-row-justify", e);

package/dist/components/ea-link.js

@@ -57,7 +57,7 @@ class y extends m {
         type: String,
         default: "",
         observer: (e) => {
-          a(this, n).setAttribute("icon", e), a(this, i).className = this.updateContainerClasslist();
+          a(this, n).setAttribute("name", e), a(this, i).className = this.updateContainerClasslist();
         }
       }
     }));

package/dist/components/ea-menu.js

@@ -404,7 +404,7 @@ class j extends q {
       <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>