easy-component-ui 3.0.13 → 3.0.14

package/dist/components/ea-collapse.js

@@ -1,313 +0,0 @@
-var k = Object.defineProperty;
-var x = (s) => {
-  throw TypeError(s);
-};
-var N = (s, i, t) => i in s ? k(s, i, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[i] = t;
-var p = (s, i, t) => N(s, typeof i != "symbol" ? i + "" : i, t), R = (s, i, t) => i.has(s) || x("Cannot " + t);
-var e = (s, i, t) => (R(s, i, "read from private field"), t ? t.call(s) : i.get(s)), o = (s, i, t) => i.has(s) ? x("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(s) : i.set(s, t), r = (s, i, t, a) => (R(s, i, "write to private field"), a ? a.call(s, t) : i.set(s, t), t);
-import { B as $ } from "./Base.js";
-import { s as B } from "../css/ea-collapse.style.js";
-import { s as L } from "../css/ea-collapse-item.style.js";
-var g, c, d, y, C, w;
-class P extends $ {
-  constructor() {
-    super();
-    /** @type {HTMLElement} */
-    o(this, g);
-    /** @type {AbortController} */
-    o(this, c);
-    p(this, "state", this.properties({
-      accordion: {
-        type: Boolean,
-        default: !1,
-        observer: () => {
-        }
-      },
-      active: {
-        props: !0,
-        type: {
-          String: () => this.accordion,
-          Array: () => !this.accordion
-        },
-        default: () => this.accordion ? "" : [],
-        observer: (t) => {
-          this.setActiveNames(t);
-        }
-      },
-      "expand-icon-position": {
-        type: ["left", "right"],
-        default: "right",
-        observer: (t) => {
-          this.querySelectorAll("ea-collapse-item").forEach((a) => {
-            a["expand-icon-position"] = t;
-          });
-        }
-      }
-    }));
-    p(this, "fnState", this.properties({
-      beforeCollapse: {
-        props: !0,
-        rawFunction: !0,
-        type: Function,
-        default: null,
-        observer: () => {
-        }
-      }
-    }));
-    /**
-     * 更新手风琴模式下的折叠状态
-     * @param {string} [activeName]
-     */
-    o(this, d, (t = this.active) => {
-      [...this.querySelectorAll("ea-collapse-item")].forEach(
-        (l) => l.toggleAttribute("active", l.getAttribute("name") === t)
-      );
-    });
-    /**
-     * 更新普通模式下的折叠状态
-     * @param {string[]} [activeNames]
-     */
-    o(this, y, (t = this.active) => {
-      [...this.querySelectorAll("ea-collapse-item")].forEach(
-        (l) => l.toggleAttribute(
-          "active",
-          t.includes(l.getAttribute("name"))
-        )
-      );
-    });
-    /**
-     * 折叠项点击事件处理
-     * @param {CustomEvent} e
-     */
-    o(this, C, async (t) => {
-      t.preventDefault(), t.stopImmediatePropagation(), t.stopPropagation();
-      const { name: a, el: l } = t.detail;
-      if (typeof this.beforeCollapse == "function")
-        try {
-          if (!await this.beforeCollapse({ name: a, el: l })) return;
-        } catch {
-          return;
-        }
-      if (this.accordion)
-        e(this, d).call(this, a), this.active = a;
-      else
-        try {
-          this.active.includes(a) ? (this.active = this.active.filter((q) => q !== a), l.toggleAttribute("active", !1)) : (this.active = [...this.active, a], l.toggleAttribute("active", this.active.includes(a)));
-        } catch {
-          console.error(
-            `${this.tagName}: When 'accordion' is false, 'active' should be an Array type.`,
-            this
-          );
-        }
-      this.emit("change", {
-        detail: {
-          name: a,
-          target: l,
-          active: this.active
-        },
-        bubbles: !0
-      });
-    });
-    /**
-     * 初始化折叠项的唯一标识及折叠状态
-     */
-    o(this, w, () => {
-      [...this.querySelectorAll("ea-collapse-item")].forEach((a, l) => {
-        a.getAttribute("name") || a.setAttribute("name", l);
-      });
-    });
-    /**
-     * 设置折叠项的展开状态
-     * @param {string | string[]} newVal
-     */
-    p(this, "setActiveNames", (t) => {
-      this.accordion ? e(this, d).call(this, t) : e(this, y).call(this, t);
-    });
-    this.stylesheet = B, this.$render();
-  }
-  static get observedAttributes() {
-    return [...super.observedAttributes, "accordion", "expand-icon-position"];
-  }
-  $render() {
-    this.shadowRoot.innerHTML = `
-      <div class='ea-collapse' part='container'>
-        <slot></slot>
-      </div>
-    `, r(this, g, this.shadowRoot.querySelector(".ea-collapse"));
-  }
-  connectedCallback() {
-    var t;
-    super.connectedCallback(), (t = e(this, c)) == null || t.abort(), r(this, c, new AbortController()), e(this, w).call(this), this.addEventListener("collapse-item-click", e(this, C), {
-      signal: e(this, c).signal
-    });
-  }
-  $beforeUnmounted() {
-    var t;
-    (t = e(this, c)) == null || t.abort();
-  }
-}
-g = new WeakMap(), c = new WeakMap(), d = new WeakMap(), y = new WeakMap(), C = new WeakMap(), w = new WeakMap();
-window.customElements.get("ea-collapse") || window.customElements.define("ea-collapse", P);
-var h, u, A, m, S, b, v, n, f, _, E;
-class H extends $ {
-  constructor() {
-    super();
-    /** @type {HTMLElement} */
-    o(this, h);
-    /** @type {HTMLElement} */
-    o(this, u);
-    /** @type {HTMLElement} */
-    o(this, A);
-    /** @type {HTMLSlotElement} */
-    o(this, m);
-    /** @type {HTMLElement} */
-    o(this, S);
-    /** @type {HTMLElement} */
-    o(this, b);
-    /** @type {HTMLSlotElement} */
-    o(this, v);
-    /** @type {AbortController} */
-    o(this, n);
-    p(this, "state", this.properties({
-      title: {
-        type: String,
-        default: "",
-        observer: (t) => {
-          e(this, m).textContent = t;
-        }
-      },
-      name: {
-        type: String,
-        default: "",
-        observer: () => {
-        }
-      },
-      "expand-icon-position": {
-        type: ["left", "right"],
-        default: "right",
-        observer: () => {
-          this.updateContainerClasslist();
-        }
-      },
-      disabled: {
-        type: Boolean,
-        default: !1,
-        observer: () => {
-          this.updateContainerClasslist();
-        }
-      },
-      active: {
-        type: Boolean,
-        default: !1,
-        observer: (t) => {
-          e(this, f).call(this, t);
-        }
-      }
-    }));
-    /**
-     * 更新折叠面板高度
-     * @param {boolean} isActive
-     */
-    o(this, f, (t = this.active) => {
-      queueMicrotask(() => {
-        e(this, h).style.setProperty(
-          "--ea-collapse-item-content-height",
-          t ? `${e(this, b).scrollHeight}px` : "0"
-        );
-      });
-    });
-    /**
-     * 折叠面板 展开/收起 事件处理
-     * @param {Event} e
-     */
-    o(this, _, (t) => {
-      t.preventDefault(), t.stopImmediatePropagation(), !this.disabled && this.emit("collapse-item-click", {
-        detail: {
-          name: this.name,
-          el: this
-        },
-        bubbles: !0,
-        cancelable: !0
-      });
-    });
-    /**
-     * 插槽变化事件处理
-     */
-    o(this, E, () => {
-      e(this, h).style.setProperty(
-        "--ea-collapse-item-content-height",
-        "auto"
-      ), e(this, f).call(this);
-    });
-    this.stylesheet = L, this.$render();
-  }
-  static get observedAttributes() {
-    return [
-      ...super.observedAttributes,
-      "title",
-      "name",
-      "disabled",
-      "expand-icon-position",
-      "active"
-    ];
-  }
-  /**
-   * 获取 classlist 列表
-   * @return {string} 属性值
-   */
-  updateContainerClasslist() {
-    const t = this.computedClasslist(
-      "ea-collapse-item",
-      {
-        ["--indicator-" + this["expand-icon-position"]]: this["expand-icon-position"]
-      },
-      {
-        disabled: this.disabled
-      }
-    );
-    return e(this, h).className = t, t;
-  }
-  $render() {
-    this.shadowRoot.innerHTML = `
-      <div class='ea-collapse-item' part='container'>
-        <div class="ea-collapse-item__title-wrap" part="title-wrap">
-          <span class="ea-collapse-item__title" part="title">
-            <slot name="title"></slot>
-          </span>
-          <span class="ea-collapse-item__indicator" part="indicator">
-            <slot name="icon">
-              <ea-icon class="default-expand-icon" name="angle-down" part="icon"></ea-icon>
-            </slot>
-          </span>
-        </div>
-        <div class="ea-collapse-item__content" part="content-wrap">
-          <slot></slot>
-        </div>
-      </div>
-    `, r(this, h, this.shadowRoot.querySelector(".ea-collapse-item")), r(this, u, this.shadowRoot.querySelector(
-      ".ea-collapse-item__title-wrap"
-    )), r(this, A, this.shadowRoot.querySelector(".ea-collapse-item__title")), r(this, m, this.shadowRoot.querySelector(
-      ".ea-collapse-item__title slot"
-    )), r(this, S, this.shadowRoot.querySelector(
-      ".ea-collapse-item__title-icon"
-    )), r(this, b, this.shadowRoot.querySelector(".ea-collapse-item__content")), r(this, v, this.shadowRoot.querySelector("slot:not([name])")), this.updateContainerClasslist();
-  }
-  connectedCallback() {
-    var t;
-    super.connectedCallback(), (t = e(this, n)) == null || t.abort(), r(this, n, new AbortController()), e(this, u).addEventListener("click", e(this, _), {
-      signal: e(this, n).signal
-    }), e(this, v).addEventListener("slotchange", e(this, E), {
-      signal: e(this, n).signal
-    });
-  }
-  $beforeUnmounted() {
-    var t;
-    (t = e(this, n)) == null || t.abort();
-  }
-}
-h = new WeakMap(), u = new WeakMap(), A = new WeakMap(), m = new WeakMap(), S = new WeakMap(), b = new WeakMap(), v = new WeakMap(), n = new WeakMap(), f = new WeakMap(), _ = new WeakMap(), E = new WeakMap();
-window.customElements.get("ea-collapse-item") || window.customElements.define("ea-collapse-item", H);
-export {
-  P as EaCollapse,
-  H as EaCollapseItem
-};