easy-component-ui 2.1.0 → 3.0.0

package/dist/components/ea-breadcrumb.js

@@ -0,0 +1,148 @@
+var C = 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";
+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 {
+  constructor() {
+    super();
+    /** @type {HTMLElement} */
+    a(this, c);
+    /** @type {HTMLSlotElement} */
+    a(this, d);
+    /** @type {AbortController} */
+    a(this, u, new AbortController());
+    f(this, "state", this.properties({
+      separator: {
+        type: String,
+        default: "/",
+        observer: () => {
+        }
+      }
+    }));
+    /**
+     * 获取分隔符
+     * @param {string} defaultSeparator
+     * @returns {HTMLElement}
+     */
+    a(this, b, (e = this.separator) => {
+      let o = this.shadowRoot.querySelector("#separatorSlot").assignedElements()[0];
+      return o || (o = document.createElement("span"), o.setAttribute("slot", "separator"), o.innerText = e), o;
+    });
+    /**
+     * 渲染分隔符
+     */
+    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));
+      });
+    });
+    this.stylesheet = v, this.$render();
+  }
+  static get observedAttributes() {
+    return [...super.observedAttributes, "separator"];
+  }
+  /**
+   * 获取 classlist 列表
+   * @return {string} 属性值
+   */
+  updateContainerClasslist() {
+    const e = this.computedClasslist("ea-breadcrumb", {
+      // ['--' + this.type]: this.type,
+    });
+    return r(this, c).className = e, e;
+  }
+  $render() {
+    this.shadowRoot.innerHTML = `
+        <nav class='ea-breadcrumb' part='container'>
+            <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"));
+  }
+  connectedCallback() {
+    super.connectedCallback(), r(this, d).addEventListener("slotchange", r(this, p), {
+      signal: r(this, u).signal
+    });
+  }
+  $beforeUnmounted() {
+    var e;
+    (e = r(this, u)) == 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 {
+  constructor() {
+    super();
+    /** @type {HTMLElement} */
+    a(this, m);
+    /** @type {HTMLElement} */
+    a(this, i);
+    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.stylesheet = R, this.$render();
+  }
+  static get observedAttributes() {
+    return [...super.observedAttributes, "href"];
+  }
+  /**
+   * 获取 classlist 列表
+   * @return {string} 属性值
+   */
+  updateContainerClasslist() {
+    const e = this.computedClasslist("ea-breadcrumb-item", {
+      // ['--' + this.type]: this.type,
+    });
+    return r(this, m).className = e, e;
+  }
+  $render() {
+    const e = _.EaElement.h(
+      this.href ? "a" : "span",
+      "ea-breadcrumb-item__content",
+      {
+        part: "content",
+        [this.href ? "href" : ""]: this.href,
+        class: ["ea-breadcrumb-item__content", this.href ? "is-link" : ""]
+      },
+      "<slot></slot>"
+    );
+    this.shadowRoot.innerHTML = `
+      <div class='ea-breadcrumb-item' part='container'>
+        ${e}
+        <span class="ea-breadcrumb-item__separator" part='separator'>
+            <slot name="separator"></slot>
+        </span>
+      </div>
+    `, l(this, m, this.shadowRoot.querySelector(".ea-breadcrumb-item")), l(this, i, this.shadowRoot.querySelector(
+      ".ea-breadcrumb-item__content"
+    ));
+  }
+  connectedCallback() {
+    super.connectedCallback();
+  }
+}
+m = new WeakMap(), i = new WeakMap();
+window.customElements.get("ea-breadcrumb-item") || window.customElements.define("ea-breadcrumb-item", A);
+export {
+  q as EaBreadcrumb,
+  A as EaBreadcrumbItem
+};

package/dist/components/ea-button.js

@@ -0,0 +1,261 @@
+var m = Object.defineProperty;
+var c = (t) => {
+  throw TypeError(t);
+};
+var f = (t, i, e) => i in t ? m(t, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[i] = e;
+var d = (t, i, e) => f(t, typeof i != "symbol" ? i + "" : i, e), p = (t, i, e) => i.has(t) || c("Cannot " + e);
+var s = (t, i, e) => (p(t, i, "read from private field"), e ? e.call(t) : i.get(t)), l = (t, i, e) => i.has(t) ? c("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(t) : i.set(t, e), h = (t, i, e, r) => (p(t, i, "write to private field"), r ? r.call(t, e) : i.set(t, e), e);
+import { F as y } from "../core/FormBase.js";
+import { s as C } from "../css/ea-button.style.js";
+import { B as g } from "./Base.js";
+import { s as v } from "../css/ea-button-group.style.js";
+var a, n, u;
+class w extends y {
+  constructor() {
+    super();
+    /** @type {HTMLButtonElement | HTMLLinkElement} */
+    l(this, a);
+    /** @type {AbortController} */
+    l(this, n);
+    /**
+     * @typedef {Object} state
+     * @property {boolean} disabled
+     * @property {string} type
+     * @property {string} text
+     * @property {boolean} plain
+     * @property {boolean} round
+     * @property {boolean} circle
+     * @property {boolean} link
+     * @property {string} href
+     * @property {string} size
+     * @property {boolean} loading
+     * @property {string} icon
+     * @property {boolean} loading
+     */
+    /** @type {state} */
+    d(this, "state", this.properties({
+      disabled: {
+        type: Boolean,
+        default: !1,
+        observer: (e) => {
+          s(this, a).className = this.updateContainerClasslist();
+        }
+      },
+      type: {
+        type: ["normal", "primary", "success", "warning", "danger"],
+        default: "normal",
+        observer: (e) => {
+          s(this, a).className = this.updateContainerClasslist();
+        }
+      },
+      text: {
+        type: Boolean,
+        default: !1,
+        observer: (e) => {
+          s(this, a).className = this.updateContainerClasslist();
+        }
+      },
+      plain: {
+        type: Boolean,
+        default: !1,
+        observer: (e) => {
+          s(this, a).className = this.updateContainerClasslist();
+        }
+      },
+      round: {
+        type: Boolean,
+        default: !1,
+        observer: (e) => {
+          s(this, a).className = this.updateContainerClasslist();
+        }
+      },
+      circle: {
+        type: Boolean,
+        default: !1,
+        observer: (e) => {
+          s(this, a).className = this.updateContainerClasslist();
+        }
+      },
+      link: {
+        type: Boolean,
+        default: !1,
+        observer: (e) => {
+          s(this, a).className = this.updateContainerClasslist();
+        }
+      },
+      href: {
+        type: String,
+        default: "",
+        observer: (e) => {
+          s(this, a).className = this.updateContainerClasslist(), s(this, a).setAttribute("href", e);
+        }
+      },
+      size: {
+        type: ["small", "medium", "large"],
+        default: "medium",
+        observer: (e) => {
+          s(this, a).className = this.updateContainerClasslist();
+        }
+      },
+      loading: {
+        type: Boolean,
+        default: !1,
+        observer: (e) => {
+          var r;
+          if (e = e === "true" || e === !0, this.toggleAttribute("disabled", e), e) {
+            const o = document.createElement("ea-icon");
+            o.id = "ea-loading-icon", o.icon = "icon-spin6 animate-spin", o.size = this.size, o.part = "loading-icon", s(this, a).insertBefore(o, s(this, a).firstChild);
+          } else {
+            const o = (r = s(this, a)) == null ? void 0 : r.querySelectorAll("#ea-loading-icon");
+            (o == null ? void 0 : o.length) > 0 && (o == null || o.forEach((b) => b.remove()));
+          }
+          s(this, a).className = this.updateContainerClasslist();
+        }
+      },
+      icon: {
+        type: String,
+        default: "",
+        observer: (e) => {
+          if (e && !s(this, a).querySelector("ea-icon")) {
+            const r = document.createElement("ea-icon");
+            r.size = this.size, r.icon = e, r.part = "icon", s(this, a).insertBefore(r, s(this, a).firstChild);
+          }
+        }
+      },
+      "button-type": {
+        type: ["button", "submit", "reset"],
+        default: "button",
+        observer: (e) => {
+          s(this, a).type = e;
+        }
+      }
+    }));
+    /**
+     * @param {KeyboardEvent} e
+     */
+    l(this, u, (e) => {
+      e.key === "Enter" && this.click();
+    });
+    this.stylesheet = C, this.$render();
+  }
+  static get observedAttributes() {
+    return [
+      "disabled",
+      "type",
+      "button-type",
+      // 暂定为原生 type 属性
+      "text",
+      "plain",
+      "round",
+      "circle",
+      "link",
+      "href",
+      "size",
+      "loading",
+      "icon"
+    ];
+  }
+  /**
+   * 获取 classlist 列表
+   * @return {string} 属性值
+   */
+  updateContainerClasslist() {
+    return this.computedClasslist("ea-button", {
+      ["--" + this.type]: this.type,
+      "--disabled": this.disabled || this.loading,
+      "--text": this.text || this.link,
+      "--plain": this.plain,
+      "--round": this.round,
+      "--circle": this.circle,
+      ["--" + this.size]: this.size
+    });
+  }
+  $render() {
+    const e = this.getAttrBoolean("link") ? "a" : "button";
+    this.shadowRoot.innerHTML = `
+      <${e} class="ea-button" part="container" tabindex="-1">
+        <slot></slot>
+      </${e}>
+    `, h(this, a, this.shadowRoot.querySelector(".ea-button"));
+  }
+  connectedCallback() {
+    var e;
+    super.connectedCallback(), (e = s(this, n)) == null || e.abort(), h(this, n, new AbortController()), this.addEventListener("keypress", s(this, u), {
+      signal: s(this, n).signal
+    }), this.addEventListener("click", (r) => {
+      if (this["button-type"] === "submit") {
+        const o = this.getForm();
+        o && (r.preventDefault(), o.dispatchEvent(new Event("submit")));
+      } else if (this["button-type"] === "reset") {
+        const o = this.getForm();
+        o && (r.preventDefault(), o.reset());
+      }
+    }), this.emit("ea-button-ready");
+  }
+  $beforeUnmounted() {
+    var e;
+    (e = s(this, n)) == null || e.abort();
+  }
+}
+a = new WeakMap(), n = new WeakMap(), u = new WeakMap();
+window.customElements.get("ea-button") || window.customElements.define("ea-button", w);
+class E extends g {
+  constructor() {
+    super();
+    /**
+     * @typedef {object} Properties
+     * @property {boolean} disabled
+     * @property {string} size
+     * @property {string} type
+     */
+    /** @type {Properties}   */
+    d(this, "state", this.properties({
+      disabled: {
+        type: Boolean,
+        default: !1,
+        observer: (e) => {
+          this.querySelectorAll("ea-button").forEach((r) => {
+            r.setAttribute("disabled", e);
+          });
+        }
+      },
+      size: {
+        type: ["small", "normal", "large"],
+        default: "normal",
+        observer: (e) => {
+          this.querySelectorAll("ea-button").forEach((r) => {
+            r.setAttribute("size", e);
+          });
+        }
+      },
+      type: {
+        type: ["primary", "success", "warning", "danger", "normal"],
+        default: "normal",
+        observer: (e) => {
+          this.querySelectorAll("ea-button").forEach((r) => {
+            r.setAttribute("type", e);
+          });
+        }
+      }
+    }));
+    this.stylesheet = v, this.$render();
+  }
+  static get observedAttributes() {
+    return [...super.observedAttributes, "disabled", "size", "type"];
+  }
+  $render() {
+    this.shadowRoot.innerHTML = this.html(`
+      <div class="ea-button-group">
+        <slot></slot>
+      </div>
+    `);
+  }
+  async connectedCallback() {
+    super.connectedCallback();
+  }
+}
+window.customElements.get("ea-button-group") || window.customElements.define("ea-button-group", E);
+export {
+  w as EaButton,
+  E as EaButtonGroup
+};

package/dist/components/ea-calendar.js

@@ -0,0 +1,10 @@
+import { E } from "./ea-calendar2.js";
+import "./Base.js";
+import "../css/ea-calendar.style.js";
+import "./ea-button.js";
+import "./ea-select.js";
+import "../utils/I18nManager.js";
+import "../utils/Utils.js";
+export {
+  E as EaCalendar
+};