easy-component-ui 3.0.12 → 3.0.14

package/dist/components/ea-steps.js

@@ -1,346 +0,0 @@
-var $ = Object.defineProperty;
-var q = (s) => {
-  throw TypeError(s);
-};
-var B = (s, i, t) => i in s ? $(s, i, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[i] = t;
-var x = (s, i, t) => B(s, typeof i != "symbol" ? i + "" : i, t), E = (s, i, t) => i.has(s) || q("Cannot " + t);
-var e = (s, i, t) => (E(s, i, "read from private field"), t ? t.call(s) : i.get(s)), a = (s, i, t) => i.has(s) ? q("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(s) : i.set(s, t), n = (s, i, t, r) => (E(s, i, "write to private field"), r ? r.call(s, t) : i.set(s, t), t);
-import { B as R } from "./Base.js";
-import { s as N } from "../css/ea-step.style.js";
-import { s as k } from "../css/ea-steps.style.js";
-var l, p, u, C, c, b, m, S, A;
-class I extends R {
-  constructor() {
-    super();
-    a(this, l);
-    /** @type {HTMLElement} */
-    a(this, u);
-    /** @type {HTMLElement} */
-    a(this, C);
-    /** @type {HTMLElement} */
-    a(this, c);
-    /** @type {HTMLElement} */
-    a(this, b);
-    /** @type {HTMLElement} */
-    a(this, m);
-    /** @type {AbortController} */
-    a(this, S, new AbortController());
-    x(this, "state", this.properties({
-      title: {
-        type: String,
-        default: "",
-        observer: (t) => {
-          e(this, b).textContent = t;
-        }
-      },
-      description: {
-        type: String,
-        default: "",
-        observer: (t) => {
-          e(this, m).textContent = t;
-        }
-      },
-      icon: {
-        type: String,
-        default: "",
-        observer: (t) => {
-          e(this, c).setAttribute("icon", t);
-        }
-      },
-      status: {
-        type: ["", "wait", "process", "finish", "error", "success"],
-        default: "",
-        observer: (t) => {
-          this.updateContainerClasslist(), !this.icon && e(this, A).call(this, t);
-        }
-      },
-      index: {
-        type: Number,
-        default: () => {
-          var r;
-          const t = (r = e(this, l, p)) == null ? void 0 : r.querySelectorAll("ea-step");
-          return t ? Array.from(t).indexOf(this) : 0;
-        },
-        observer: () => {
-        }
-      },
-      simple: {
-        type: Boolean,
-        default: () => {
-          var t;
-          return !!((t = e(this, l, p)) != null && t.hasAttribute("simple"));
-        },
-        observer: () => {
-        }
-      },
-      "align-center": {
-        type: Boolean,
-        default: () => {
-          var t;
-          return !!((t = e(this, l, p)) != null && t.hasAttribute("align-center"));
-        },
-        observer: () => {
-          this.updateContainerClasslist();
-        }
-      },
-      direction: {
-        type: ["vertical", "horizontal"],
-        default: () => {
-          var t;
-          return ((t = e(this, l, p)) == null ? void 0 : t.getAttribute("direction")) || "horizontal";
-        },
-        observer: () => {
-          this.updateContainerClasslist();
-        }
-      }
-    }));
-    /**
-     * 更新步骤状态
-     * @param {string} status 活动步骤状态
-     */
-    a(this, A, (t = this.status) => {
-      var r;
-      t === ((r = e(this, l, p)) == null ? void 0 : r.getAttribute("finish-status")) ? (e(this, c).setAttribute("icon", "icon-ok"), e(this, c).textContent = "") : (e(this, c).setAttribute("icon", ""), e(this, c).textContent = this.index + 1);
-    });
-    this.stylesheet = N, this.$render();
-  }
-  static get observedAttributes() {
-    return [
-      ...super.observedAttributes,
-      "title",
-      "description",
-      "icon",
-      "status",
-      "index",
-      "active"
-    ];
-  }
-  /**
-   * 获取 classlist 列表
-   * @return {string} 属性值
-   */
-  updateContainerClasslist() {
-    const t = this.computedClasslist(
-      "ea-step",
-      {
-        ["--" + this.direction]: this.direction
-      },
-      {
-        [this.status]: this.status,
-        "align-center": this["align-center"],
-        icon: this.icon,
-        simple: this.simple,
-        last: (() => {
-          var o;
-          const r = (o = e(this, l, p)) == null ? void 0 : o.querySelectorAll("ea-step");
-          return r ? r.length - 1 === this.index : !1;
-        })(),
-        first: this.index === 0
-      }
-    );
-    return e(this, u) && (e(this, u).className = t), t;
-  }
-  $render() {
-    this.shadowRoot.innerHTML = `
-      <div class='ea-step' part='container'>
-        <section class="ea-step__head" part="head">
-          <div class="ea-step__icon-wrapper" part="icon-wrapper">
-            <slot name="icon">
-              <ea-icon class="ea-step__icon" part="icon"></ea-icon>
-            </slot>
-          </div>
-          <div class="ea-step__tail" part="tail"></div>
-        </section>
-        <section class="ea-step__main" part="main">
-          <div class="ea-step__title" part="title">
-            <slot name="title"></slot>
-          </div>
-          <div class="ea-step__description" part="description">
-            <slot name="description"></slot>
-          </div>
-        </section>
-        <span class="ea-step__simple-arrow" part="simple-arrow">
-          <slot name="simple-arrow"></slot>
-        </span>
-      </div>
-    `, n(this, u, this.shadowRoot.querySelector(".ea-step")), n(this, C, this.shadowRoot.querySelector('slot[name="icon"]')), n(this, c, this.shadowRoot.querySelector(".ea-step__icon")), n(this, b, this.shadowRoot.querySelector('slot[name="title"]')), n(this, m, this.shadowRoot.querySelector(
-      'slot[name="description"]'
-    )), this.updateContainerClasslist();
-  }
-  connectedCallback() {
-    super.connectedCallback();
-  }
-  $beforeUnmounted() {
-    e(this, S).abort();
-  }
-}
-l = new WeakSet(), p = function() {
-  try {
-    return this.closest("ea-steps");
-  } catch {
-    return null;
-  }
-}, u = new WeakMap(), C = new WeakMap(), c = new WeakMap(), b = new WeakMap(), m = new WeakMap(), S = new WeakMap(), A = new WeakMap();
-window.customElements.get("ea-step") || window.customElements.define("ea-step", I);
-var f, y, h, v, w, _;
-class L extends R {
-  constructor() {
-    super();
-    /** @type {HTMLElement} */
-    a(this, f);
-    /** @type {HTMLSlotElement} */
-    a(this, y);
-    /** @type {AbortController} */
-    a(this, h, new AbortController());
-    x(this, "state", this.properties({
-      space: {
-        type: String,
-        default: "50%",
-        observer: (t) => {
-          this.style.setProperty("--ea-step-tail-spacing", t);
-        }
-      },
-      //   TODO: 没写😋
-      // direction: {
-      //   type: ["vertical", "horizontal"],
-      //   default: "horizontal",
-      //   observer: (newVal) => {
-      //     this.updateContainerClasslist();
-      //   },
-      // },
-      active: {
-        type: Number,
-        default: 0,
-        observer: (t) => {
-          e(this, v).call(this, t);
-        }
-      },
-      "process-status": {
-        type: ["wait", "process", "finish", "error", "success"],
-        default: "process",
-        observer: () => {
-        }
-      },
-      "finish-status": {
-        type: ["wait", "process", "finish", "error", "success"],
-        default: "finish",
-        observer: () => {
-        }
-      },
-      "align-center": {
-        type: Boolean,
-        default: !1,
-        observer: () => {
-        }
-      },
-      simple: {
-        type: Boolean,
-        default: !1,
-        observer: (t) => {
-          e(this, w).call(this, t), this.updateContainerClasslist();
-        }
-      }
-    }));
-    /**
-     * 更新步骤状态
-     * @param {number} active
-     */
-    a(this, v, (t) => {
-      [...this.querySelectorAll("ea-step")].forEach((o) => {
-        o.index < t ? o.setAttribute("status", this["finish-status"]) : o.index > t ? o.setAttribute("status", "wait") : o.setAttribute("status", this["process-status"]);
-      });
-    });
-    /**
-     * 更新简单步骤状态
-     * @param {boolean} isSimple
-     */
-    a(this, w, (t = this.simple) => {
-      const r = [...this.querySelectorAll("ea-step")];
-      t ? r.forEach((o) => {
-        var d;
-        try {
-          (d = o.querySelector('[slot="simple-arrow"]')) == null || d.remove();
-        } catch {
-        }
-        try {
-          const g = document.createElement("ea-icon");
-          g.setAttribute("slot", "simple-arrow"), g.setAttribute("icon", "icon-angle-right"), g.part = "simple-arrow", o.appendChild(g);
-        } catch {
-        }
-      }) : r.forEach((o) => {
-        var d;
-        try {
-          (d = o.querySelector('[slot="simple-arrow"]')) == null || d.remove();
-        } catch {
-        }
-      });
-    });
-    /**
-     * 处理 slot 变化
-     * 更新所有子 ea-step 组件的 index、first、last 状态和 status
-     */
-    a(this, _, () => {
-      const t = [...this.querySelectorAll("ea-step")];
-      t.forEach((r, o) => {
-        r.index = o, r.toggleAttribute("first", o === 0), r.toggleAttribute("last", o === t.length - 1);
-      }), e(this, v).call(this, this.active), e(this, w).call(this);
-    });
-    this.stylesheet = k, this.$render();
-  }
-  static get observedAttributes() {
-    return [
-      ...super.observedAttributes,
-      "space",
-      "direction",
-      "active",
-      "process-status",
-      "finish-status",
-      "align-center",
-      "simple"
-    ];
-  }
-  /**
-   * 获取 classlist 列表
-   * @return {string} 属性值
-   */
-  updateContainerClasslist() {
-    const t = this.computedClasslist(
-      "ea-steps",
-      {
-        // ["--" + this.direction]: this.direction,
-      },
-      {
-        simple: this.simple,
-        "align-center": this["align-center"]
-      }
-    );
-    return e(this, f).className = t, t;
-  }
-  $render() {
-    this.shadowRoot.innerHTML = `
-      <div class='ea-steps' part='container'>
-        <slot></slot>
-      </div>
-    `, n(this, f, this.shadowRoot.querySelector(".ea-steps")), n(this, y, this.shadowRoot.querySelector("slot"));
-  }
-  connectedCallback() {
-    var t;
-    super.connectedCallback(), (t = e(this, h)) == null || t.abort(), n(this, h, new AbortController()), e(this, y).addEventListener(
-      "slotchange",
-      () => {
-        e(this, _).call(this);
-      },
-      { signal: e(this, h).signal }
-    );
-  }
-  $beforeUnmounted() {
-    var t;
-    (t = e(this, h)) == null || t.abort();
-  }
-}
-f = new WeakMap(), y = new WeakMap(), h = new WeakMap(), v = new WeakMap(), w = new WeakMap(), _ = new WeakMap();
-window.customElements.get("ea-steps") || window.customElements.define("ea-steps", L);
-export {
-  I as EaStep,
-  L as EaSteps
-};

package/dist/components/ea-switch.js

@@ -1,271 +0,0 @@
-var y = Object.defineProperty;
-var m = (i) => {
-  throw TypeError(i);
-};
-var w = (i, a, t) => a in i ? y(i, a, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[a] = t;
-var p = (i, a, t) => w(i, typeof a != "symbol" ? a + "" : a, t), f = (i, a, t) => a.has(i) || m("Cannot " + t);
-var e = (i, a, t) => (f(i, a, "read from private field"), t ? t.call(i) : a.get(i)), l = (i, a, t) => a.has(i) ? m("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(i) : a.set(i, t), h = (i, a, t, s) => (f(i, a, "write to private field"), s ? s.call(i, t) : a.set(i, t), t);
-import { F as S } from "../core/FormBase.js";
-import { s as C } from "../css/ea-switch.style.js";
-import { E as _ } from "../utils/Variables.js";
-var n, r, d, c, v, b, o, u, g;
-class N extends S {
-  constructor() {
-    super();
-    /** @type {HTMLElement} */
-    l(this, n);
-    /** @type {HTMLInputElement} */
-    l(this, r);
-    /** @type {HTMLElement} */
-    l(this, d);
-    /** @type {HTMLElement} */
-    l(this, c);
-    /** @type {HTMLElement} */
-    l(this, v);
-    /** @type {HTMLElement} */
-    l(this, b);
-    /** @type {AbortController} */
-    l(this, o);
-    /** @type {AbortController} */
-    l(this, u);
-    p(this, "state", this.properties({
-      label: {
-        type: String,
-        default: "",
-        observer: async (t) => {
-          e(this, b).textContent = t;
-        }
-      },
-      name: {
-        type: String,
-        default: "",
-        observer: (t) => {
-          e(this, n).setAttribute("for", t), e(this, r).setAttribute("name", t), e(this, r).setAttribute("id", t);
-        }
-      },
-      value: {
-        type: {
-          Number: () => this.hasAttribute("active-value") && (this.getAttrNumber("active-value") || this.getAttrNumber("active-value") === 0 || this.getAttrNumber("inactive-value") || this.getAttrNumber("inactive-value") === 0),
-          String: () => this.hasAttribute("active-value") && (this.getAttrString("active-value") || this.getAttrString("active-value") === "" || this.getAttrString("inactive-value") || this.getAttrString("inactive-value") === ""),
-          Boolean: () => this.hasAttribute("active-value") || !this.hasAttribute("active-value") || this.hasAttribute("inactive-value") || !this.hasAttribute("inactive-value")
-        },
-        default: () => !1,
-        observer: (t) => {
-          const s = t === this["active-value"] ? this["active-value"] : this["inactive-value"];
-          e(this, r).value = s, e(this, r).toggleAttribute("checked", s), this.setValue(s), this.updateContainerClasslist();
-        }
-      },
-      "active-value": {
-        type: {
-          Number: () => this.hasAttribute("active-value") && (this.getAttrNumber("active-value") || this.getAttrNumber("active-value") === 0),
-          String: () => this.hasAttribute("active-value") && (this.getAttrString("active-value") || this.getAttrString("active-value") === ""),
-          Boolean: () => this.hasAttribute("active-value") || !this.hasAttribute("active-value")
-        },
-        default: !0,
-        observer: () => {
-        }
-      },
-      "inactive-value": {
-        type: {
-          Number: () => this.hasAttribute("inactive-value") && (this.getAttrNumber("inactive-value") || this.getAttrNumber("inactive-value") === 0),
-          String: () => this.hasAttribute("inactive-value") && (this.getAttrString("inactive-value") || this.getAttrString("inactive-value") === ""),
-          Boolean: () => this.hasAttribute("inactive-value") || !this.hasAttribute("inactive-value")
-        },
-        default: () => !1,
-        observer: () => {
-        }
-      },
-      size: {
-        type: _,
-        default: "default",
-        observer: () => {
-          this.updateContainerClasslist();
-        }
-      },
-      "inactive-text": {
-        type: String,
-        default: "",
-        observer: (t) => {
-          e(this, v).innerText = t;
-        }
-      },
-      "inactive-color": {
-        type: String,
-        default: "",
-        observer: (t) => {
-          this.style.setProperty("--ea-switch-inactive-bg-color", t);
-        }
-      },
-      "active-text": {
-        type: String,
-        default: "",
-        observer: (t) => {
-          e(this, c).innerText = t;
-        }
-      },
-      "active-color": {
-        type: String,
-        default: "",
-        observer: (t) => {
-          this.style.setProperty("--ea-switch-active-bg-color", t);
-        }
-      },
-      disabled: {
-        type: Boolean,
-        default: !1,
-        observer: (t) => {
-          e(this, r).toggleAttribute("disabled", t), this.updateContainerClasslist();
-        }
-      },
-      required: {
-        type: Boolean,
-        default: !1,
-        observer: (t) => {
-          e(this, r).toggleAttribute("required", t);
-        }
-      }
-    }));
-    p(this, "funcState", this.properties({
-      beforeChange: {
-        props: !0,
-        type: Function,
-        default: null,
-        /**
-         * @param {() => Promise} cb
-         */
-        observer: (t) => {
-          var s;
-          (s = e(this, u)) == null || s.abort(), h(this, u, new AbortController()), e(this, r).addEventListener(
-            "click",
-            async (A) => {
-              A.preventDefault(), A.stopImmediatePropagation(), t && t().then(() => {
-                e(this, r).checked = !this.value, e(this, r).dispatchEvent(new CustomEvent("change"));
-              }).catch(() => {
-              });
-            },
-            { signal: e(this, u).signal }
-          );
-        }
-      }
-    }));
-    /**
-     * 改变事件
-     * @param {Event} e
-     */
-    l(this, g, (t) => {
-      t.preventDefault(), t.stopPropagation();
-      const s = t.target.checked ? this["active-value"] : this["inactive-value"];
-      this.setAttribute("value", s), this.emit("change", {
-        detail: { value: s },
-        bubbles: !0
-      });
-    });
-    this.stylesheet = C, this.$render();
-  }
-  static get observedAttributes() {
-    return [
-      ...super.observedAttributes,
-      "name",
-      "value",
-      "active-value",
-      "inactive-value",
-      "label",
-      "size",
-      "inactive-text",
-      "inactive-color",
-      "active-text",
-      "active-color",
-      "disabled",
-      "required"
-    ];
-  }
-  /**
-   * 获取 classlist 列表
-   * @return {string} 属性值
-   */
-  updateContainerClasslist() {
-    const t = this.computedClasslist(
-      "ea-switch",
-      {
-        [`--${this.size}`]: this.size
-      },
-      {
-        checked: this.value === this["active-value"],
-        disabled: this.disabled || this.loading,
-        loading: this.loading
-      }
-    );
-    return e(this, n).className = t, t;
-  }
-  $render() {
-    this.shadowRoot.innerHTML = `
-      <label class="ea-switch-wrapper" part="wrapper">
-        <span class="ea-switch__form-label" part="label form-label"></span>
-        <section class="ea-switch" part="container">
-          <input class="ea-switch__original" type="checkbox" part="original" />
-          <span class="ea-switch__label label-left" part="label-left">
-            <slot name="inactive"></slot>
-          </span>
-          <span class="ea-switch__inner" part="switch"></span>
-          <span class="ea-switch__label label-right" part="label-right">
-            <slot name="active"></slot>
-          </span>
-        </section>
-      </label>
-    `, h(this, b, this.shadowRoot.querySelector(".ea-switch__form-label")), h(this, n, this.shadowRoot.querySelector(".ea-switch")), h(this, r, this.shadowRoot.querySelector(".ea-switch__original")), h(this, d, this.shadowRoot.querySelector(".ea-switch__inner")), h(this, v, this.shadowRoot.querySelector(
-      ".ea-switch__label.label-left > slot[name='inactive']"
-    )), h(this, c, this.shadowRoot.querySelector(
-      ".ea-switch__label.label-right slot[name='active']"
-    )), this.updateContainerClasslist();
-  }
-  connectedCallback() {
-    var t;
-    super.connectedCallback(), (t = e(this, o)) == null || t.abort(), h(this, o, new AbortController()), this.name || this.setAttribute("name", Math.random().toString(36).substring(2, 15)), this.setValue(
-      e(this, r).checked ? this["active-value"] : this["inactive-value"]
-    ), e(this, r).addEventListener("change", e(this, g), {
-      signal: e(this, o).signal
-    });
-  }
-  $unmounted() {
-    var t, s;
-    (t = e(this, o)) == null || t.abort(), (s = e(this, u)) == null || s.abort();
-  }
-  /**
-   * 获取验证目标元素
-   * @returns {HTMLElement}
-   */
-  get validationTarget() {
-    return e(this, n);
-  }
-  /**
-   * 更新表单验证状态
-   * switch 的验证逻辑：当 required 为 true 时，必须处于选中状态（value 等于 active-value）
-   */
-  updateValidity() {
-    const t = this.value === this["active-value"];
-    this.required && !t ? this.internals.setValidity(
-      { valueMissing: !0 },
-      "请开启此选项",
-      e(this, n)
-    ) : this.internals.setValidity({}, "", e(this, n));
-  }
-  /**
-   * 检查表单字段的有效性
-   * @returns {boolean}
-   */
-  checkValidity() {
-    return this.updateValidity(), this.internals.validity.valid;
-  }
-  /**
-   * 报告表单字段的有效性（显示验证提示）
-   * @returns {boolean}
-   */
-  reportValidity() {
-    return this.internals.reportValidity();
-  }
-}
-n = new WeakMap(), r = new WeakMap(), d = new WeakMap(), c = new WeakMap(), v = new WeakMap(), b = new WeakMap(), o = new WeakMap(), u = new WeakMap(), g = new WeakMap();
-window.customElements.get("ea-switch") || window.customElements.define("ea-switch", N);
-export {
-  N as EaSwitch
-};