easy-component-ui 3.0.11 → 3.0.12

package/dist/components/ea-progress.js

@@ -1,21 +1,21 @@
-var _ = Object.defineProperty;
-var x = (t) => {
+var S = Object.defineProperty;
+var k = (t) => {
   throw TypeError(t);
 };
-var k = (t, s, e) => s in t ? _(t, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[s] = e;
-var f = (t, s, e) => k(t, typeof s != "symbol" ? s + "" : s, e), m = (t, s, e) => s.has(t) || x("Cannot " + e);
-var r = (t, s, e) => (m(t, s, "read from private field"), e ? e.call(t) : s.get(t)), c = (t, s, e) => s.has(t) ? x("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(t) : s.set(t, e), h = (t, s, e, i) => (m(t, s, "write to private field"), i ? i.call(t, e) : s.set(t, e), e);
-import { B as v } from "./Base.js";
-import { s as w } from "../css/ea-progress.style.js";
-const P = `
+var P = (t, s, e) => s in t ? S(t, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[s] = e;
+var C = (t, s, e) => P(t, typeof s != "symbol" ? s + "" : s, e), m = (t, s, e) => s.has(t) || k("Cannot " + e);
+var r = (t, s, e) => (m(t, s, "read from private field"), e ? e.call(t) : s.get(t)), p = (t, s, e) => s.has(t) ? k("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(t) : s.set(t, e), h = (t, s, e, i) => (m(t, s, "write to private field"), i ? i.call(t, e) : s.set(t, e), e), d = (t, s, e) => (m(t, s, "access private method"), e);
+import { B } from "./Base.js";
+import { s as A } from "../css/ea-progress.style.js";
+const $ = `
 <svg viewBox="0 0 100 100">
     <circle class="ea-progress__track" part="track" cx="50" cy="50" fill="none" stroke-dasharray="302px" stroke-dashoffset="0" />
     <circle class="ea-progress__path" part="path" cx="50" cy="50" fill="none" stroke-dasharray="302px" stroke-dashoffset="0" />
 </svg>
-<section class="ea-progress__percentage" part="percentage">
-    <slot></slot>
+<section class="ea-progress__percentage-wrapper" part="percentage">
+    <slot class="ea-progress__percentage"></slot>
 </section>
-`, S = `
+`, q = `
 <svg viewBox="0 0 100 100">
     <mask id="myMask">
         <rect class="mask" width="100%" height="20%" fill="white" />
@@ -26,23 +26,26 @@ const P = `
     <circle class="ea-progress__track" part="track" cx="50" cy="50" fill="none" clip-path="url(#myClip)" />
     <circle class="ea-progress__path" part="path" cx="50" cy="50" fill="none" clip-path="url(#myClip)" />
 </svg>
-<section class="ea-progress__percentage" part="percentage">
-    <slot></slot>
+<section class="ea-progress__percentage-wrapper" part="percentage">
+    <slot class="ea-progress__percentage"></slot>
 </section>
 `;
-var a, d, o, p, u;
-class B extends v {
+var a, g, o, u, n, y, c, w, b;
+class R extends B {
   constructor() {
     super();
+    p(this, c);
     /** @type {HTMLElement} */
-    c(this, a);
+    p(this, a);
     /** @type {HTMLElement} */
-    c(this, d);
+    p(this, g);
     /** @type {HTMLElement} */
-    c(this, o);
+    p(this, o);
     /** @type {HTMLElement} */
-    c(this, p);
-    f(this, "propState", this.properties({
+    p(this, u);
+    /** @type {HTMLElement} */
+    p(this, n);
+    C(this, "propState", this.properties({
       color: {
         props: !0,
         type: {
@@ -61,51 +64,30 @@ class B extends v {
         },
         default: () => this.getAttribute("color") || "",
         observer: (e) => {
-          r(this, u).call(this, e, e);
+          r(this, y).call(this, e, e);
         }
       }
     }));
-    f(this, "state", this.properties({
+    C(this, "state", this.properties({
       percentage: {
         type: Number,
         default: 0,
         observer: (e) => {
-          if (e < 0) return this.percentage = 0;
-          if (e > 100) return this.percentage = 100;
-          const i = this.querySelector("[data-percentage]"), n = {
-            success: "icon-ok-circled",
-            warning: "icon-attention-circled",
-            exception: "icon-cancel-circled"
-          }, l = {
-            line: () => e + "%",
-            circle: () => 302 * ((100 - e) / 100) + "px",
-            dashboard: () => {
-              const C = 49 - Number(this["stroke-width"].replace("px", "")) / 2, y = 2 * Math.PI * C, b = (100 - e) / 100;
-              return r(this, o).style.strokeDasharray = y * (270 / 360) + "px", r(this, d).style.strokeDasharray = y * (270 / 360) + "px", y * (270 / 360) * b + "px";
-            }
-          };
-          r(this, a).style.setProperty(
-            "--ea-progress-percentage",
-            l[this.type]()
-          ), ["success", "exception", "warning"].includes(this.status) && !this["text-inside"] ? r(this, p).innerHTML = `<ea-icon class="ea-progress__status" icon="${n[this.status]}" part="status-icon"></ea-icon>` : r(this, p).textContent = e + "%", i && (i.textContent = this.percentage), r(this, u).call(this, this.color, e), this.emit("change", {
-            detail: {
-              percentage: e
-            }
-          });
+          d(this, c, b).call(this, e);
         }
       },
       type: {
         type: ["line", "circle", "dashboard"],
         default: "line",
         observer: () => {
-          this.$render(), this.updateContainerClasslist();
+          this.$render(), this.updateContainerClasslist(), d(this, c, b).call(this);
         }
       },
       status: {
         type: ["success", "exception", "warning"],
         default: "",
         observer: () => {
-          this.updateContainerClasslist();
+          this.updateContainerClasslist(), d(this, c, w).call(this);
         }
       },
       "stroke-width": {
@@ -124,7 +106,7 @@ class B extends v {
         default: !1,
         observer: (e) => {
           try {
-            e && r(this, o).appendChild(r(this, p));
+            e ? r(this, o).appendChild(r(this, n)) : r(this, u).appendChild(r(this, n));
           } catch {
           }
           this.updateContainerClasslist();
@@ -181,24 +163,24 @@ class B extends v {
      * @param {string | string[] | function} color 颜色值或函数
      * @param {number} [percentage] 百分比
      */
-    c(this, u, (e, i = this.percentage) => {
+    p(this, y, (e, i = this.percentage) => {
       if (!(!e || typeof e > "u"))
         if (Array.isArray(e)) {
-          let n = e[0];
-          for (let l = 0; l < e.length; l++) {
-            const g = e[l];
-            if (i <= g.percentage) {
-              n = g;
+          let l = e[0];
+          for (let f = 0; f < e.length; f++) {
+            const _ = e[f];
+            if (i <= _.percentage) {
+              l = _;
               break;
             }
           }
-          r(this, o).style.setProperty("--ea-progress-path-color", n == null ? void 0 : n.color);
+          r(this, o).style.setProperty("--ea-progress-path-color", l == null ? void 0 : l.color);
         } else typeof e == "string" ? r(this, o).style.setProperty("--ea-progress-path-color", e) : typeof e == "function" && r(this, o).style.setProperty(
           "--ea-progress-path-color",
           e(i)
         );
     });
-    this.stylesheet = w, this.$render();
+    this.stylesheet = A, this.$render();
   }
   static get observedAttributes() {
     return [
@@ -230,7 +212,7 @@ class B extends v {
       },
       {
         [this.type]: this.type,
-        indeterminate: this.indeterminate && this.type === "line" && !this["striped-flow"],
+        indeterminate: this.indeterminate && this.type === "line",
         "striped-flow": this["striped-flow"],
         "show-text": this["show-text"]
       }
@@ -242,28 +224,63 @@ class B extends v {
       line: `
         <div class='ea-progress' part='container'>
           <section class="ea-progress__track" part="track">
-              <section class="ea-progress__path" part="path"></section>
+            <section class="ea-progress__path" part="path"></section>
           </section>
-          <section class="ea-progress__percentage" part="percentage">
+          <section class="ea-progress__percentage-wrapper" part="percentage">
             <slot class="ea-progress__percentage"></slot>
           </section>
         </div>
       `,
-      circle: P,
-      dashboard: S
+      circle: $,
+      dashboard: q
     };
     this.shadowRoot.innerHTML = `
       <div class='ea-progress' part='container'>
         ${e[this.type]}
       </div>
-    `, h(this, a, this.shadowRoot.querySelector(".ea-progress")), h(this, d, this.shadowRoot.querySelector(".ea-progress__track")), h(this, o, this.shadowRoot.querySelector(".ea-progress__path")), h(this, p, this.shadowRoot.querySelector(".ea-progress__percentage slot")), this.updateContainerClasslist();
+    `, h(this, a, this.shadowRoot.querySelector(".ea-progress")), h(this, g, this.shadowRoot.querySelector(".ea-progress__track")), h(this, o, this.shadowRoot.querySelector(".ea-progress__path")), h(this, u, this.shadowRoot.querySelector(
+      ".ea-progress__percentage-wrapper"
+    )), h(this, n, this.shadowRoot.querySelector(".ea-progress__percentage")), this.updateContainerClasslist();
   }
   connectedCallback() {
     super.connectedCallback();
   }
 }
-a = new WeakMap(), d = new WeakMap(), o = new WeakMap(), p = new WeakMap(), u = new WeakMap();
-window.customElements.get("ea-progress") || window.customElements.define("ea-progress", B);
+a = new WeakMap(), g = new WeakMap(), o = new WeakMap(), u = new WeakMap(), n = new WeakMap(), y = new WeakMap(), c = new WeakSet(), /**
+ * 更新状态文本/图标
+ */
+w = function() {
+  const e = {
+    success: "icon-ok-circled",
+    warning: "icon-attention-circled",
+    exception: "icon-cancel-circled"
+  };
+  ["success", "exception", "warning"].includes(this.status) && !this["text-inside"] ? r(this, n).innerHTML = `<ea-icon class="ea-progress__status" icon="${e[this.status]}" part="status-icon"></ea-icon>` : r(this, n).textContent = this.percentage + "%";
+}, /**
+ * 更新进度条百分比
+ * @param {number} [newVal] 新的百分比值
+ */
+b = function(e = this.percentage) {
+  if (e < 0) return this.percentage = 0;
+  if (e > 100) return this.percentage = 100;
+  const i = this.querySelector("[data-percentage]"), l = {
+    line: () => e + "%",
+    circle: () => 302 * ((100 - e) / 100) + "px",
+    dashboard: () => {
+      const _ = 49 - Number(this["stroke-width"].replace("px", "")) / 2, x = 2 * Math.PI * _, v = (100 - e) / 100;
+      return r(this, o).style.strokeDasharray = x * (270 / 360) + "px", r(this, g).style.strokeDasharray = x * (270 / 360) + "px", x * (270 / 360) * v + "px";
+    }
+  };
+  r(this, a).style.setProperty(
+    "--ea-progress-percentage",
+    l[this.type]()
+  ), d(this, c, w).call(this), i && (i.textContent = this.percentage), r(this, y).call(this, this.color, e), this.emit("change", {
+    detail: {
+      percentage: e
+    }
+  });
+};
+window.customElements.get("ea-progress") || window.customElements.define("ea-progress", R);
 export {
-  B as EaProgress
+  R as EaProgress
 };

package/dist/components/ea-result.js

@@ -1,33 +1,33 @@
-var b = Object.defineProperty;
+var m = Object.defineProperty;
 var h = (e) => {
   throw TypeError(e);
 };
-var m = (e, s, t) => s in e ? b(e, s, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[s] = t;
-var p = (e, s, t) => m(e, typeof s != "symbol" ? s + "" : s, t), _ = (e, s, t) => s.has(e) || h("Cannot " + t);
-var i = (e, s, t) => (_(e, s, "read from private field"), t ? t.call(e) : s.get(e)), r = (e, s, t) => s.has(e) ? h("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(e) : s.set(e, t), o = (e, s, t, d) => (_(e, s, "write to private field"), d ? d.call(e, t) : s.set(e, t), t);
-import { B as y } from "./Base.js";
-import { s as v } from "../css/ea-result.style.js";
-import { t as w } from "../utils/Variables.js";
-var l, a, n, u, c;
-class f extends y {
+var y = (e, s, t) => s in e ? m(e, s, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[s] = t;
+var p = (e, s, t) => y(e, typeof s != "symbol" ? s + "" : s, t), _ = (e, s, t) => s.has(e) || h("Cannot " + t);
+var i = (e, s, t) => (_(e, s, "read from private field"), t ? t.call(e) : s.get(e)), o = (e, s, t) => s.has(e) ? h("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(e) : s.set(e, t), a = (e, s, t, d) => (_(e, s, "write to private field"), d ? d.call(e, t) : s.set(e, t), t);
+import { B as v } from "./Base.js";
+import { s as f } from "../css/ea-result.style.js";
+import { t as b } from "../utils/Variables.js";
+var l, r, n, u, c;
+class w extends v {
   constructor() {
     super();
     /** @type {HTMLElement} */
-    r(this, l);
+    o(this, l);
     /** @type {HTMLElement} */
-    r(this, a);
+    o(this, r);
     /** @type {HTMLElement} */
-    r(this, n);
+    o(this, n);
     /** @type {HTMLElement} */
-    r(this, u);
+    o(this, u);
     /** @type {HTMLElement} */
-    r(this, c);
+    o(this, c);
     p(this, "state", this.properties({
       type: {
         type: ["primary", "success", "warning", "info", "error"],
         default: "",
         observer: (t) => {
-          i(this, a).setAttribute("icon", `icon-${w[t]}`), this.updateContainerClasslist();
+          i(this, r).setAttribute("icon", `icon-${b[t]}`), this.updateContainerClasslist();
         }
       },
       title: {
@@ -48,11 +48,11 @@ class f extends y {
         type: String,
         default: "",
         observer: (t) => {
-          i(this, a).setAttribute("icon", t);
+          t ? i(this, r).setAttribute("icon", t) : i(this, r).setAttribute("icon", `icon-${b[this.type]}`);
         }
       }
     }));
-    this.stylesheet = v, this.$render();
+    this.stylesheet = f, this.$render();
   }
   static get observedAttributes() {
     return [...super.observedAttributes, "type", "title", "sub-title", "icon"];
@@ -85,16 +85,16 @@ class f extends y {
           <slot name="extra"></slot>
         </div>
       </div>
-    `, o(this, l, this.shadowRoot.querySelector(".ea-result")), o(this, a, this.shadowRoot.querySelector(".ea-result__default-icon")), o(this, n, this.shadowRoot.querySelector(".ea-result__title slot")), o(this, u, this.shadowRoot.querySelector(
+    `, a(this, l, this.shadowRoot.querySelector(".ea-result")), a(this, r, this.shadowRoot.querySelector(".ea-result__default-icon")), a(this, n, this.shadowRoot.querySelector(".ea-result__title slot")), a(this, u, this.shadowRoot.querySelector(
       ".ea-result__sub-title slot"
-    )), o(this, c, this.shadowRoot.querySelector(".ea-result__extra slot"));
+    )), a(this, c, this.shadowRoot.querySelector(".ea-result__extra slot"));
   }
   connectedCallback() {
     super.connectedCallback();
   }
 }
-l = new WeakMap(), a = new WeakMap(), n = new WeakMap(), u = new WeakMap(), c = new WeakMap();
-window.customElements.get("ea-result") || window.customElements.define("ea-result", f);
+l = new WeakMap(), r = new WeakMap(), n = new WeakMap(), u = new WeakMap(), c = new WeakMap();
+window.customElements.get("ea-result") || window.customElements.define("ea-result", w);
 export {
-  f as EaResult
+  w as EaResult
 };