@xwadex/fesd 0.0.14 → 0.0.15

package/dist/image-preview-bundle.js

@@ -0,0 +1,3538 @@
+var fs = (n, i, t) => {
+  if (!i.has(n))
+    throw TypeError("Cannot " + t);
+};
+var h = (n, i, t) => {
+  if (i.has(n))
+    throw TypeError("Cannot add the same private member more than once");
+  i instanceof WeakSet ? i.add(n) : i.set(n, t);
+};
+var d = (n, i, t) => (fs(n, i, "access private method"), t);
+import { OverlayScrollbars as Me } from "overlayscrollbars";
+import v from "jquery";
+import "./vendor-bundle.js";
+import "validator";
+import "flatpickr";
+import Fe from "vanilla-lazyload";
+import { lock as vs, unlock as bs } from "tua-body-scroll-lock";
+const Y = {
+  SETTINGS: {
+    videoId: null,
+    videoType: null,
+    videoAutoplay: "off",
+    videoMode: "onBox",
+    videoButton: ".playButton",
+    videoCover: "on",
+    videoLayoutNo: 0,
+    videoTarget: "video-template",
+    videoTargetRoute: "https://cdn.wdd.idv.tw/fesd/video4_lightbox.html",
+    videoVimeoHash: null,
+    videoHighQuality: "off",
+    videoStartTime: 0
+  },
+  ATTRS: {
+    id: "video-id",
+    type: "video-type",
+    autoplay: "video-autoplay",
+    hash: "vimeo-hash",
+    start: "video-starttime",
+    highquality: "video-highquality"
+  },
+  EVENTS: {
+    init: null,
+    afterInit: null,
+    beforeDestroy: null,
+    afterUpdate: null
+  },
+  // video4 target 內放置結構 index 對應 videoLayoutNo
+  LAYOUT: ['<div class="playButton"></div><div class="overlay"></div>'],
+  // videoPlayer customElements 內結構
+  TEMPLATE() {
+    return '<div class="player-container"><div class="player-wrapper"></div></div>';
+  }
+}, ys = {
+  SETTINGS: {
+    success: null,
+    text: null,
+    className: null,
+    duration: 1500
+  }
+}, I = {
+  SETTINGS: {
+    target: null,
+    route: null,
+    action: "toggle",
+    container: "body"
+  },
+  ATTRS: {
+    id: "data-modal-id",
+    close: "data-modal-close",
+    destroy: "data-modal-destroy"
+  },
+  EVENTS: {
+    init: null,
+    success: null,
+    error: null,
+    complete: null,
+    open: null,
+    close: null,
+    destroy: null,
+    update: null
+  },
+  TEMPLATE(n) {
+    return `
+        <div class="modal-scroller">
+          <div class="modal-wrapper" ${n === "destroy" ? "data-modal-destroy" : "data-modal-close"}>
+            <div class="modal-content" stop-propagation>
+          </div>
+        </div>
+        `;
+  }
+}, $ = {
+  SETTINGS: {
+    direction: "left",
+    // 方向 - top || right || bottom || left
+    behavior: "normal",
+    // 模式 - normal || alternate || endStop
+    duration: 5e4,
+    // 持續時間(毫秒) - Number
+    durationBreakpoints: {},
+    // 持續時間斷點 - Object
+    autoplay: 300,
+    // 自動撥放延遲時間(毫秒) - Number || false
+    pauseOnMouseenter: !1,
+    // 滑鼠移入暫停 - Boolean
+    continual: !0,
+    // 連續不間斷 - Boolean
+    gap: 30
+    // 跑馬燈內容之間的距離 - Number
+  }
+}, qe = {
+  SETTINGS: {
+    scrollbar: {
+      "scrollbar-track-color": "transparent",
+      "scrollbar-thumb-color": "rgba(0,0,0,.4)",
+      "scrollbar-thumb-hover-color": "rgba(0,0,0,.55)",
+      "scrollbar-radius": "10px"
+    }
+  },
+  TEMPLATE(n, i, t, e) {
+    const o = `
+    <i class="${e || "dropdown-icon"}"></i>
+    `, a = `
+    <div class="filter-bar">
+    <input class="filter-input" type="text" placeholder="${i}" disabled>
+    </div>
+    `, r = `<div class="select-wrapper">
+        <div class="select-display"></div>
+        ${o}
+        <div class="dropdown">
+          ${n ? a : ""}
+          <div class="dropdown-scroller">
+            <ul class="dropdown-list"></ul>
+          </div>
+        </div>
+      </div>`;
+    return t || r;
+  }
+}, ws = {
+  SETTINGS: {
+    basic_rwd: 900
+  }
+}, Ye = {
+  SETTINGS: {
+    scroller: window,
+    class: "aost-show",
+    delay: 0,
+    start: 80,
+    end: 0,
+    mirror: !1,
+    repeat: !1,
+    // false | true | 'up' | 'down'
+    direction: "vertical",
+    // 'vertical' | 'horizontal'
+    breakpoints: {
+      1160: "data-aost-offset-1160",
+      1024: "data-aost-offset-1024",
+      600: "data-aost-offset-600"
+    }
+  },
+  EVENTS: {
+    init: null,
+    enter: null,
+    leave: null
+  }
+}, lt = {
+  SETTINGS: {
+    target: null,
+    container: null,
+    spacer: null,
+    gap: 0,
+    speed: 800,
+    delay: 0,
+    direction: "vertical",
+    easing: "easeInOutCirc"
+  },
+  EVENTS: {
+    afterInit: null,
+    beforeDestroy: null,
+    afterUpdate: null,
+    beforeScroll: null,
+    afterScroll: null
+  }
+}, C = {
+  SETTINGS: {
+    type: "drag",
+    drag: {
+      center: !0,
+      draggable: !0,
+      navigation: !0,
+      selected: !1
+    },
+    collapse: {
+      selected: !1,
+      placeholder: "類別"
+    },
+    dropdown: {
+      target: "dropdown-el",
+      placeholder: "",
+      value: ""
+    },
+    breakpoint: {}
+  },
+  TEMPLATE: {
+    drag() {
+      return `<div class="drag-container">
+            <ul class="wrapper">
+            </ul>
+          </div>`;
+    },
+    collapse(n) {
+      return `<div class="drag-container">
+            <ul class="wrapper">
+            </ul>
+            <div class="collapse-placeholder">${n.placeholder}</div>
+          </div>
+          <div class="collapse-container">
+            <ul class="wrapper">
+            </ul>
+          </div>`;
+    },
+    dropdown(n) {
+      return `<dropdown-el${n.placeholder ? ` d4-placeholder="${n.placeholder}"` : ""}${n.value ? ` d4-value="${n.value}"` : ""}></dropdown-el>`;
+    }
+  }
+}, Ue = {
+  SETTINGS: {
+    // 樣式 normal / process
+    type: "normal",
+    // 進場方式 fade / slide
+    display: "fade",
+    // 預設頁面
+    defaultPage: "",
+    // 滑動扣除高度
+    anchorGap: 0,
+    tabGroup: "true",
+    // 動畫設定
+    transition: {
+      duration: 500,
+      timing: "ease",
+      delay: 0
+    },
+    // 步驟狀態綁定
+    stepOutput: ".step-show"
+  }
+}, Je = {
+  SETTINGS: {
+    collapseClass: "collapse",
+    block: "[collapse-block]",
+    target: "[collapse-target]",
+    single: !0,
+    defaultOpen: !1,
+    targetStopPropagation: !1,
+    defaultActiveMark: "collapse-active",
+    transition: {
+      property: "height",
+      duration: "400ms",
+      function: "ease",
+      delay: "0s"
+    },
+    // expand
+    breakpoints: {
+      320: {}
+    }
+  },
+  // ATTRS: {
+  //   wrapper: 'collapse-wrapper',
+  //   block: 'collapse-block',
+  //   target: 'collapse-target',
+  // },
+  EVENTS: {
+    init: null,
+    afterInit: null,
+    destroy: null,
+    beforeDestroy: null,
+    update: null,
+    afterUpdate: null
+  }
+}, Ze = {
+  SETTINGS: {
+    // 是否要加 hover 效果?
+    hover: !0,
+    // 使用 hover 時是否要啟用點擊 ripple 效果?
+    click: !1,
+    // ripple's 的顏色
+    color: "#fff",
+    // ripple's 透明度
+    opacity: "1",
+    // ripple 毫秒
+    duration: 600,
+    // hover 毫秒 ?
+    speed: 600
+  }
+}, mn = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  anchor4: lt,
+  aost4: Ye,
+  article4: ws,
+  collapse4: Je,
+  dropdown4: qe,
+  marquee4: $,
+  modal4: I,
+  multipurpose4: C,
+  ripple4: Ze,
+  share4: ys,
+  tab4: Ue,
+  video4: Y
+}, Symbol.toStringTag, { value: "Module" })), E = {
+  before: "beforebegin",
+  after: "afterend",
+  append: "beforeend",
+  prepend: "afterbegin"
+}, at = (n) => typeof n == "string" && n !== "", ye = (n) => n instanceof HTMLElement, rt = (n) => n instanceof NodeList, w = (n) => A(n) !== null, j = (n) => typeof n == "function", A = (n) => ye(n) ? n : document.querySelector(n), L = (n) => rt(n) ? n : document.querySelectorAll(n), Ts = () => Math.random().toString(36).substr(2, 9), Es = (n) => {
+  const i = document.createElement("div");
+  return i.innerHTML = n, i.childNodes;
+}, As = (n) => {
+  try {
+    JSON.parse(n);
+  } catch {
+    return n;
+  }
+  return JSON.parse(n);
+}, T = (n, i) => {
+  console.warn(`[${n} warn]: ${i}`);
+}, je = (n, i) => {
+  console.error(`[${n} error]: ${i}`);
+}, O = {
+  on(n, i) {
+    if (!j(i))
+      return this;
+    const { __events__: t } = this;
+    return n.split(" ").forEach((e) => {
+      t[e] || (t[e] = []), t[e].push(i);
+    }), this;
+  },
+  off(n, i) {
+    const { __events__: t } = this;
+    return n.split(" ").forEach((e) => {
+      typeof i > "u" ? t[e] = [] : t[e] && t[e].forEach((s, o) => {
+        s === i && t[e].splice(o, 1);
+      });
+    }), this;
+  },
+  once(n, i) {
+    if (!j(i))
+      return this;
+    const t = (...e) => {
+      this.off(n, t), i.apply(this, e);
+    };
+    return this.on(n, t);
+  },
+  emit(...n) {
+    const { __events__: i } = this, t = n[0], e = n.slice(1, n.length);
+    return i[t] ? (i[t].forEach((s) => {
+      j(s) && s.apply(this, e);
+    }), this) : this;
+  }
+}, Ls = {
+  easeInOutCirc(n, i, t, e) {
+    return (n /= e / 2) < 1 ? -t / 2 * (Math.sqrt(1 - n * n) - 1) + i : t / 2 * (Math.sqrt(1 - (n -= 2) * n) + 1) + i;
+  },
+  easeInQuart(n, i, t, e) {
+    return t * (n /= e) * n * n * n + i;
+  },
+  easeOutQuart(n, i, t, e) {
+    return -t * ((n = n / e - 1) * n * n * n - 1) + i;
+  }
+}, we = (n, i) => {
+  const { target: t, container: e, spacer: s, speed: o, gap: a, easing: r, direction: l } = n, c = l === "horizontal", u = c ? "scrollLeft" : "scrollTop", p = c ? "left" : "top", g = c ? "width" : "height", m = w(e) ? A(e) : document.scrollingElement, f = m[u], b = w(t) ? A(t).getBoundingClientRect()[p] : 0 - f, y = w(s) ? A(s).getBoundingClientRect()[g] : 0, H = b - a - y, G = 15;
+  let S = 0;
+  if (H === 0)
+    return;
+  const R = (X) => {
+    const Ne = A(t);
+    i && i.emit(X, Ne), !i && n.on && j(n.on[X]) && n.on[X](Ne);
+  };
+  R("beforeScroll");
+  const Pe = () => {
+    S += G;
+    const X = Ls[r](S, f, H, o);
+    m[u] = X, S < o && requestAnimationFrame(Pe), S >= o && R("afterScroll");
+  };
+  requestAnimationFrame(Pe);
+};
+var J, Ee, pt, Ve, mt, Ke;
+class Qe {
+  constructor(i, t = {}) {
+    h(this, J);
+    h(this, pt);
+    h(this, mt);
+    this.__storage__ = {
+      el: i,
+      options: t
+    }, this.active = "data-anchor-active", d(this, J, Ee).call(this);
+  }
+  destroy() {
+    const { elements: i } = this;
+    return this.emit("beforeDestroy"), i.forEach((t) => {
+      t.anchor && (t.removeEventListener("click", t.anchor.eventHandler), delete t.anchor);
+    }), this;
+  }
+  update() {
+    var i;
+    return d(i = this.destroy(), J, Ee).call(i), this.emit("afterUpdate"), this;
+  }
+  static run(i) {
+    const { SETTINGS: t } = lt, e = Object.assign({}, t, i);
+    setTimeout(() => {
+      we(e);
+    }, e.delay);
+  }
+  static url(i) {
+    const { SETTINGS: t } = lt, { hashName: e } = i, s = window.location.search || window.location.hash, { searchParams: o } = new URL(window.location), a = document.querySelector(`[data-anchor-id="${e ? o.get(e) : s.split("?").pop()}"]`);
+    if (!a)
+      return;
+    const r = Object.assign({}, t, i, { target: a });
+    setTimeout(() => {
+      we(r);
+    }, r.delay);
+  }
+}
+J = new WeakSet(), Ee = function() {
+  const { el: i, options: t } = this.__storage__;
+  if (!at(i) || !w(i))
+    return;
+  const { SETTINGS: e, EVENTS: s } = lt;
+  if (this.elements = t.state == "not active" ? L(i + `:not([${this.active}])`) : L(i), this.elements = L(i), this.options = Object.assign({}, e, t), this.__events__ = Object.assign({}, s), this.options.on)
+    for (const [o, a] of Object.entries(this.options.on))
+      this.__events__[o] = [a];
+  d(this, pt, Ve).call(this);
+}, pt = new WeakSet(), Ve = function() {
+  const { elements: i, options: t } = this;
+  i.forEach((e) => {
+    e.anchor = {}, e.anchor.instance = this, e.anchor.eventHandler = d(this, mt, Ke), e.anchor.defaultOptions = t, e.anchor.methods = {}, e.anchor.methods.destroy = this.destroy, e.anchor.methods.update = this.update, e.addEventListener("click", e.anchor.eventHandler), e.setAttribute(this.active, "");
+  }), this.emit("afterInit");
+}, mt = new WeakSet(), Ke = function() {
+  const { defaultOptions: i, eventHandler: t, instance: e } = this.anchor, s = {
+    target: this.getAttribute("data-anchor-target") || i.target,
+    container: this.getAttribute("data-anchor-container") || i.container,
+    spacer: this.getAttribute("data-anchor-spacer") || i.spacer,
+    gap: parseInt(this.getAttribute("data-anchor-gap") || i.gap),
+    speed: parseInt(this.getAttribute("data-anchor-speed")) || i.speed,
+    delay: parseInt(this.getAttribute("data-anchor-delay")) || i.delay,
+    easing: this.getAttribute("data-anchor-easing") || i.easing,
+    direction: this.getAttribute("data-anchor-direction") || i.direction
+  };
+  this.removeEventListener("click", t), setTimeout(() => {
+    this.addEventListener("click", t);
+  }, s.speed), setTimeout(() => {
+    we(s, e);
+  }, s.delay);
+};
+Object.assign(Qe.prototype, O);
+window.MODALS || (window.MODALS = {});
+const { MODALS: M } = window, Ss = (n) => {
+  const { TEMPLATE: i } = I, { childDom: t } = n, e = document.createElement("div");
+  e.innerHTML = i(n.getAttribute("data-modal-template-setting"));
+  const s = e.querySelector(".modal-content");
+  return [...t].forEach((o) => {
+    s.append(o);
+  }), e.children[0];
+};
+var gt, ei, ft, ii, vt, si, bt, ni, yt, oi;
+class ti extends HTMLElement {
+  constructor() {
+    super();
+    h(this, gt);
+    h(this, ft);
+    h(this, vt);
+    h(this, bt);
+    h(this, yt);
+    this.initialize = !1;
+  }
+  static get observedAttributes() {
+    return [":state"];
+  }
+  attributeChangedCallback(t, e, s) {
+    switch (t) {
+      case ":state":
+        d(this, yt, oi).call(this, s);
+        break;
+    }
+  }
+  connectedCallback() {
+    this.initialize || (this.initialize = !0, d(this, gt, ei).call(this));
+  }
+  open() {
+    return this.setAttribute(":state", "open"), this;
+  }
+  close() {
+    return this.setAttribute(":state", "close"), this;
+  }
+  destroy() {
+    return this.setAttribute(":state", "destroy"), this;
+  }
+}
+gt = new WeakSet(), ei = function() {
+  const { ATTRS: t } = I;
+  this.__events__ = {}, this.getAttribute(":state") || this.setAttribute(":state", "close");
+  const e = this.getAttribute(t.id) || Ts();
+  this.getAttribute(t.id) || (T(`modern-modal needs a ${t.id} attribute with a unique id.`), this.setAttribute(t.id, e)), M[e] && T(`the ${t.id} "${e}" is already be used.`), M[e] = this, d(this, ft, ii).call(this);
+}, ft = new WeakSet(), ii = function() {
+  this.childDom = this.childNodes, this.template = Ss(this), this.innerHTML = "", this.append(this.template), d(this, vt, si).call(this);
+}, vt = new WeakSet(), si = function() {
+  const t = this.querySelector(".modal-scroller");
+  this.__scroller__ = Me(t, {
+    overflowBehavior: {
+      x: "hidden"
+    },
+    autoUpdate: !0
+  }), window.modalScroll = this.__scroller__, d(this, bt, ni).call(this);
+}, bt = new WeakSet(), ni = function() {
+  var a, r, l;
+  const t = this, { ATTRS: e } = I, { close: s, destroy: o } = e;
+  (a = t.querySelectorAll(`[${s}]`)) == null || a.forEach((c) => {
+    c.addEventListener("click", function() {
+      const u = this.getAttribute(s);
+      (u && M[u] ? M[u] : t).close();
+    });
+  }), (r = t.querySelectorAll(`[${o}]`)) == null || r.forEach((c) => {
+    c.addEventListener("click", function() {
+      const u = this.getAttribute(o);
+      (u && M[u] ? M[u] : t).destroy();
+    });
+  }), (l = t.querySelector("[stop-propagation]")) == null || l.addEventListener("click", function(c) {
+    c.stopPropagation();
+  });
+}, yt = new WeakSet(), oi = function(t) {
+  const { __scroller__: e } = this;
+  if (t === "open") {
+    if (this.style.display = "block", e) {
+      const { viewport: s } = e.elements();
+      s.scrollTo({
+        top: 0
+      });
+    }
+    setTimeout(() => {
+      this.classList.add("show"), this.emit("open");
+    }, 100);
+  }
+  if (t === "close") {
+    if (!this.classList.contains("show"))
+      return;
+    this.classList.remove("show");
+    const s = () => {
+      this.style.removeProperty("display"), this.emit("close"), this.removeEventListener("transitionend", s);
+    };
+    this.addEventListener("transitionend", s);
+  }
+  if (t === "destroy") {
+    this.classList.remove("show");
+    const s = () => {
+      const { ATTRS: o } = I, a = this.getAttribute(o.id);
+      this.style.removeProperty("display"), this.emit("close"), this.remove(), this.emit("destroy"), M[a] && delete M[a];
+    };
+    this.addEventListener("transitionend", s);
+  }
+};
+Object.assign(ti.prototype, O);
+const { MODALS: Ie } = window, ai = (n, i, ...t) => {
+  if (!i)
+    return;
+  const e = n[i];
+  e && j(e) && e.apply(n, t);
+}, ri = (n, ...i) => {
+  n && j(n) && n.apply(U, i);
+}, ze = (n, i) => {
+  const { target: t } = n, e = Ie[t] || A(n.target);
+  e && li(n, i), e || Ds(n, i);
+}, li = (n, i) => {
+  const { target: t, action: e, on: s, e: o } = n, a = Ie[t] || A(n.target);
+  switch (["open", "close", "destroy"].forEach((l) => {
+    a.once(l, () => {
+      i && (i.emit(l, a, o), ai(i, s[l], a, o)), i || ri(s[l], a);
+    });
+  }), e) {
+    case "open":
+      a.open();
+      break;
+    case "close":
+      a.close();
+      break;
+    case "destroy":
+      a.destroy();
+      break;
+    default:
+      const l = a.getAttribute(":state");
+      l === "close" && a.open(), l === "open" && a.close();
+      break;
+  }
+}, Ds = async (n, i) => {
+  const { target: t, route: e, container: s, on: o, e: a } = n;
+  if (!e)
+    return T("modal4", "cannot find target or data-modal-route is not defined");
+  const r = (l, ...c) => {
+    i && (i.emit(l, ...c), ai(i, o[l], ...c)), i || ri(o[l], ...c);
+  };
+  fetch(e).then((l) => (r("success", a), l.text())).then((l) => {
+    const c = Es(l), u = A(s) || A(I.SETTINGS.container);
+    [...c].forEach((g) => {
+      u.append(g);
+    });
+    const p = Ie[t] || A(n.target);
+    r("complete", p), li(n, i);
+  }).catch((l) => {
+    r("error", l);
+  });
+};
+var Z, Ae, wt, ci, Tt, di;
+const P = class P {
+  constructor(i, t = {}) {
+    h(this, Z);
+    h(this, wt);
+    h(this, Tt);
+    this.__storage__ = {
+      el: i,
+      options: t
+    }, this.active = "data-modal-active", d(this, Z, Ae).call(this);
+  }
+  destroy() {
+    const { elements: i } = this;
+    return i.forEach((t) => {
+      t.modal && (t.removeEventListener("click", t.modal.eventHandler), delete t.modal);
+    }), this;
+  }
+  update() {
+    var i;
+    return d(i = this.destroy(), Z, Ae).call(i), this.emit("update"), this;
+  }
+  /** static method 'open' */
+  static open(i) {
+    const { SETTINGS: t } = I, e = Object.assign({}, t, { on: {} }, i);
+    ze(e);
+  }
+  /** static method 'defineMethods' */
+  static defineMethods(i) {
+    P.prototype.__methods__ || (P.prototype.__methods__ = {});
+    const t = P.prototype.__methods__;
+    for (const [e, s] of Object.entries(i))
+      j(s) && (t[e] = s);
+    Object.assign(P.prototype, P.prototype.__methods__);
+  }
+};
+Z = new WeakSet(), Ae = function() {
+  const { el: i, options: t } = this.__storage__;
+  if (!at(i) || !w(i))
+    return;
+  const { SETTINGS: e, EVENTS: s } = I;
+  if (this.elements = t.state == "not active" ? L(i + `:not([${this.active}])`) : L(i), this.options = Object.assign({}, e, t), this.__events__ = Object.assign({}, s), this.options.on)
+    for (const [o, a] of Object.entries(this.options.on))
+      this.__events__[o] = [a];
+  d(this, wt, ci).call(this);
+}, wt = new WeakSet(), ci = function() {
+  const { elements: i, options: t } = this;
+  i.forEach((e) => {
+    e.modal = {}, e.modal.instance = this, e.modal.eventHandler = d(this, Tt, di), e.modal.defaultOptions = t, e.modal.methods = {}, e.modal.methods.destroy = this.destroy, e.modal.methods.update = this.update, e.addEventListener("click", e.modal.eventHandler), e.setAttribute(this.active, "");
+  }), this.emit("init");
+}, Tt = new WeakSet(), di = function(i) {
+  const { defaultOptions: t, eventHandler: e, instance: s } = this.modal, o = As(this.getAttribute("data-modal-on"));
+  o && typeof o != "object" && T("modal4", "data-modal-on must be a json string.");
+  const a = {
+    target: this.getAttribute("data-modal-target") || t.target,
+    action: this.getAttribute("data-modal-action") || t.action,
+    route: this.getAttribute("data-modal-route") || t.route,
+    container: this.getAttribute("data-modal-container") || t.container,
+    on: o && typeof o == "object" ? o : {},
+    e: i
+  };
+  this.removeEventListener("click", e), setTimeout(() => {
+    this.addEventListener("click", e);
+  }, 200), ze(a, s);
+};
+let U = P;
+Object.assign(U.prototype, O);
+customElements.define("modern-modal", ti);
+const _s = (n, i) => {
+  const t = n === window ? n.innerHeight : n.getBoundingClientRect().height, e = n === window ? 0 : n.getBoundingClientRect().top;
+  i.forEach((s) => {
+    const { class: o, delay: a, start: r, end: l, repeat: c, instance: u } = s.aost, { top: p, bottom: g } = s.getBoundingClientRect(), m = t * (r / 100), f = t * (l / 100);
+    if (p - e <= m && g - e >= f && s.offsetParent)
+      setTimeout(() => {
+        s.classList.add(o);
+      }, a);
+    else {
+      const y = s.classList.contains(o) && c === "down" && p - e >= m || c === "up" && g - e <= f || c === !0;
+      setTimeout(() => {
+        y && s.classList.remove(o);
+      }, a);
+    }
+  });
+}, ks = (n, i) => n === "up" || n === "down" ? n : n !== null ? n === "true" ? !0 : n === "false" ? !1 : i.repeat : i.repeat;
+var Q, Le, Et, hi;
+class ui {
+  constructor(i, t = {}) {
+    h(this, Q);
+    h(this, Et);
+    this.__storage__ = {
+      el: i,
+      options: t
+    }, this.active = "data-aost-active", d(this, Q, Le).call(this);
+  }
+  destroy(i) {
+    const { elements: t, options: e } = this;
+    if (!t)
+      return this;
+    const { scroller: s } = e, o = s === window || !w(s) ? window : A(s);
+    return o.aost && (o.removeEventListener("scroll", o.aost.eventHandler), delete o.aost), t.forEach((a) => {
+      if (!a.aost)
+        return;
+      const { class: r } = a.aost;
+      i && a.classList.remove(r), delete a.aost;
+    }), this;
+  }
+  update(i) {
+    var t;
+    d(t = this.destroy(i), Q, Le).call(t);
+  }
+}
+Q = new WeakSet(), Le = function() {
+  const { el: i, options: t } = this.__storage__;
+  if (!at(i) || !w(i))
+    return;
+  const { SETTINGS: e, EVENTS: s } = Ye;
+  if (this.elements = t.state == "not active" ? L(i + `:not([${this.active}])`) : L(i), this.options = Object.assign({}, e, t), this.__events__ = Object.assign({}, s), this.options.on)
+    for (const [o, a] of Object.entries(this.options.on))
+      this.__events__[o] = [a];
+  d(this, Et, hi).call(this);
+}, Et = new WeakSet(), hi = function() {
+  const { elements: i, options: t } = this, { scroller: e } = t, s = e === window || !w(e) ? window : A(e);
+  this.eventHandler = () => {
+    _s(s, i);
+  }, i.forEach((a) => {
+    a.aost = {}, a.aost.class = a.getAttribute("data-aost-class") || t.class, a.aost.delay = parseInt(a.getAttribute("data-aost-delay")) || t.delay, a.aost.start = parseInt(a.getAttribute("data-aost-start")) || t.start, a.aost.end = parseInt(a.getAttribute("data-aost-end")) || t.end, a.aost.repeat = ks(a.getAttribute("data-aost-repeat"), t), a.aost.methods = {}, a.aost.methods.destroy = this.destroy, a.aost.methods.update = this.update, a.aost.instance = this, a.setAttribute(this.active, "");
+  });
+  const { eventHandler: o } = this;
+  o(), s.aost = {}, s.aost.eventHandler = o, s.addEventListener("scroll", s.aost.eventHandler, !1);
+};
+Object.assign(ui.prototype, O);
+const $s = (n) => {
+  const { TEMPLATE: i } = Y, { childDom: t } = n, e = document.createElement("div");
+  e.innerHTML = i();
+  const s = e.querySelector(".player-wrapper");
+  return [...t].forEach((o) => {
+    s.append(o);
+  }), e.children[0];
+};
+var At, pi, Lt, mi, St, gi, Dt, fi, _t, vi, kt, bi, $t, yi, xt, wi, Ct, Ti;
+class xs extends HTMLElement {
+  constructor() {
+    super();
+    h(this, At);
+    h(this, Lt);
+    h(this, St);
+    // youtube iframe
+    h(this, Dt);
+    // vimeo iframe
+    h(this, _t);
+    // youku iframe
+    h(this, kt);
+    h(this, $t);
+    // 2025.02.11 新增 ig 
+    h(this, xt);
+    // 2025.02.11 新增 tiktok 
+    h(this, Ct);
+    d(this, At, pi).call(this);
+  }
+  play() {
+    const { videoType: t } = this;
+    switch (t) {
+      case "youtubeAPI":
+        break;
+      case "youtube":
+        this.querySelector("iframe").contentWindow.postMessage(JSON.stringify({ event: "command", func: "playVideo" }), "*");
+        break;
+      case "youkuAPI":
+        break;
+      case "youku":
+        break;
+      case "vimeo":
+        this.querySelector("iframe").contentWindow.postMessage(JSON.stringify({ value: "true", method: "play" }), "*");
+        break;
+    }
+  }
+  pause() {
+    const { videoType: t } = this;
+    switch (t) {
+      case "youtubeAPI":
+        break;
+      case "youtube":
+        this.querySelector("iframe").contentWindow.postMessage(JSON.stringify({ event: "command", func: "pauseVideo" }), "*");
+        break;
+      case "youkuAPI":
+        break;
+      case "youku":
+        break;
+      case "vimeo":
+        this.querySelector("iframe").contentWindow.postMessage(JSON.stringify({ value: "true", method: "pause" }), "*");
+        break;
+    }
+  }
+}
+At = new WeakSet(), pi = function() {
+  if (!this.getAttribute("video-id")) {
+    T("videoPlayer", "video-render needs a ['video-id'] attribute to creat player.");
+    return;
+  }
+  this.videoId = this.getAttribute("video-id"), this.videoType = this.getAttribute("video-type"), this.autoplay = this.getAttribute("video-autoplay"), this.startTime = this.getAttribute("video-starttime"), d(this, Lt, mi).call(this);
+}, Lt = new WeakSet(), mi = function() {
+  this.childDom = this.childNodes, this.template = $s(this), this.innerHTML = "", this.append(this.template), d(this, St, gi).call(this);
+}, St = new WeakSet(), gi = function() {
+  const { videoType: t } = this;
+  let e = "";
+  switch (t) {
+    case "youtubeAPI":
+      break;
+    case "youtube":
+      e = d(this, Dt, fi).call(this);
+      break;
+    case "youkuAPI":
+      break;
+    case "youku":
+      e = d(this, kt, bi).call(this);
+      break;
+    case "vimeo":
+      e = d(this, _t, vi).call(this);
+      break;
+    case "bilibili":
+      e = d(this, $t, yi).call(this);
+      break;
+    case "instagram":
+      e = d(this, xt, wi).call(this);
+      break;
+    case "tiktok":
+      e = d(this, Ct, Ti).call(this);
+      break;
+  }
+  this.querySelector(".player-wrapper").insertAdjacentHTML(E.prepend, e);
+}, Dt = new WeakSet(), fi = function() {
+  const { videoId: t, autoplay: e, startTime: s } = this;
+  return `<iframe src="https://www.youtube.com/embed/${t}?rel=0&${e === "on" ? "autoplay=1" : ""}&start=${s}&mute=1&loop=1&enablejsapi=1" frameborder="0" allowfullscreen="0" volumn="0" allow="${e === "on" ? "autoplay;" : ""} encrypted-media; gyroscope; picture-in-picture;"></iframe>`;
+}, _t = new WeakSet(), vi = function() {
+  const { videoId: t, autoplay: e, hash: s } = this;
+  return `<iframe src="https://player.vimeo.com/video/${t}?h=${s}&${e === "on" ? "autoplay=1" : ""}&loop=1&color=ffffff&title=0&byline=0&portrait=0" frameborder="0" allow="${e === "on" ? "autoplay;" : ""} fullscreen; picture-in-picture" allowfullscreen></iframe><script src="https://player.vimeo.com/api/player.js"><\/script>`;
+}, kt = new WeakSet(), bi = function() {
+  const { videoId: t, autoplay: e } = this;
+  return `<iframe src="https://player.youku.com/embed/${t}?rel=0&${e === "on" ? "autoplay=1" : ""}" frameborder=0 "allowfullscreen"></iframe>`;
+}, $t = new WeakSet(), yi = function() {
+  const { videoId: t, autoplay: e } = this;
+  return `<iframe src="//player.bilibili.com/player.html?bvid=${t}&page=1&as_wide=1&high_quality=1&danmaku=0" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"></iframe>`;
+}, xt = new WeakSet(), wi = function() {
+  const { videoId: t, autoplay: e } = this;
+  return `<iframe class="instagram-media instagram-media-rendered" id="instagram-embed-0" src="https://www.instagram.com/p/${t}/embed/"  width="num-w" height=" num-h" scrolling="auto" frameborder="0" data-instgrm-payload-id="instagram-media-payload-0"></iframe>`;
+}, Ct = new WeakSet(), Ti = function() {
+  const { videoId: t, autoplay: e } = this;
+  return `<iframe name="__tt_embed__v79271677875424740" sandbox="allow-popups allow-popups-to-escape-sandbox allow-scripts allow-top-navigation allow-same-origin" src="https://www.tiktok.com/player/v1/${t}?&${e === "on" ? "autoplay=1" : ""}"></iframe>`;
+};
+const gn = (n) => new Promise((i) => {
+  let t = setTimeout(() => (clearTimeout(t), i()), n);
+});
+function Ei(n) {
+  const i = [];
+  n && n.forEach((t) => {
+    t instanceof HTMLElement ? i.push(t) : typeof t == "string" && i.push(...document.querySelectorAll(`${t}`));
+  }), v("html").addClass("scrollLock"), vs(i);
+}
+function Ai(n) {
+  const i = [];
+  n && n.forEach((t) => {
+    t instanceof HTMLElement ? i.push(t) : typeof t == "string" && i.push(...document.querySelectorAll(`${t}`));
+  }), v("html").removeClass("scrollLock"), bs(i);
+}
+async function fn(n = 0) {
+  if (v(".loading-wrapper").length)
+    return;
+  v("body").append(`
+  <div class="loading-wrapper">
+    <div class="icon-box">
+      <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid"><path d="M10 50A40 40 0 0 0 90 50A40 42 0 0 1 10 50" fill="#ffffff" stroke="none">
+        <animateTransform attributeName="transform" type="rotate" dur="1s" repeatCount="indefinite" keyTimes="0;1" values="0 50 51;360 50 51">
+        </animateTransform>
+      </path>
+      </svg>
+    </div>
+  </div>
+  `), v(".loading-wrapper").delay(n).fadeIn(300).promise().done(function() {
+    Ei();
+  });
+}
+function vn() {
+  v(".loading-wrapper").fadeOut(300).promise().done(function() {
+    v(".loading-wrapper").remove(), Ai();
+  });
+}
+function bn(n, i) {
+  new on(n, i);
+}
+function Cs() {
+  const n = new ui("[data-aost]"), i = new Fe({ callback_loaded: (s) => {
+  } }), t = new Qs(), e = new Qe("[data-anchor-target]");
+  n.update(), i.update(), t.reValidate(), e.update();
+}
+function yn(n, i = () => {
+}) {
+  v(`[data-tab-content=${n}]`).fadeIn(function() {
+    typeof i == "function" && i();
+  }).siblings("[data-tab-content]").hide(), Cs();
+}
+function wn() {
+  Me(
+    {
+      target: document.body,
+      cancel: {
+        nativeScrollbarsOverlaid: !0,
+        body: null
+      }
+    },
+    {
+      overflow: {
+        x: "hidden"
+      },
+      scrollbars: {
+        autoHide: "scroll",
+        autoHideSuspend: !0
+      }
+    },
+    {
+      initialized() {
+        console.log("body scrollbar initialized");
+      }
+    }
+  );
+}
+function Tn() {
+  window.onpageshow = function(n) {
+    n.persisted && window.location.reload();
+  };
+}
+function En() {
+  const n = navigator.userAgent;
+  return {
+    BigSurUP: /Mac OS X 10.15/.test(n) || /Mac OS X 10_15_7/.test(n) || /Mac OS X 10_15_8/.test(n) || /Mac OS X 10_15_9/.test(n) || /Mac OS X 11_/.test(n) || /Mac OS X 12_/.test(n)
+  };
+}
+function An(n, i) {
+  v(n).on("click", function() {
+    v(this).toggleClass(i);
+  });
+}
+function Ln(n, i) {
+  v(n).on("click", function() {
+    v(n).not(this).removeClass(i), v(this).addClass(i);
+  });
+}
+function Hs(n, i = 250) {
+  let t = null;
+  return function(...e) {
+    let s = this;
+    clearTimeout(t), t = setTimeout(() => {
+      n.apply(s, e);
+    }, i);
+  };
+}
+function Sn(n, i = 250) {
+  let t, e;
+  return function() {
+    const s = this, o = arguments, a = +/* @__PURE__ */ new Date();
+    t && a < t + i ? (clearTimeout(e), e = setTimeout(function() {
+      t = a, n.apply(s, o);
+    }, i)) : (t = a, n.apply(s, o));
+  };
+}
+function Dn() {
+  window._g.interval = [], v(".countdown").each((i, t) => {
+    const e = Number(v(t).attr("data-seconds")) + 1;
+    let s = Math.floor(e / 60) + ":" + e % 60;
+    window._g.interval[i] = setInterval(function() {
+      var o = s.split(":"), a = parseInt(o[0], 10), r = parseInt(o[1], 10);
+      --r, a = r < 0 ? --a : a, a = a < 10 ? a = "0" + a : a, a == 0 && r == 0 && clearInterval(window._g.interval[i]), r = r < 0 ? 59 : r, r = r < 10 ? "0" + r : r, v(t).html(a + ":" + r), s = a + ":" + r;
+    }, 1e3);
+  });
+}
+function _n(n = 500) {
+  return new Promise((i, t) => {
+    let e = setTimeout(() => {
+      clearTimeout(e), i();
+    }, n);
+  });
+}
+function kn() {
+  const n = function() {
+    let i = window.innerHeight * 0.01;
+    document.documentElement.style.setProperty("--vh", i + "px");
+  };
+  n(), window.addEventListener("resize", Hs(n));
+}
+function $n(n, i, t, e, s) {
+  const o = this, r = v(n).html().split("<br>");
+  let l = "", c = 0;
+  r.forEach((u, p) => {
+    p !== 0 && (l += "<br>"), u.split("").forEach((m, f) => {
+      i ? (f === 0 && (l += '<span class="letter-wrap" style="display: inline-block">'), m === " " ? l += '</span> <span class="letter-wrap" style="display: inline-block">' : (l += `<span class="letter"${s || t ? ` style="${s ? `transition: ${o.formatFloat(Math.random(), 2) * s}s;` : ""}${t ? t === "random" ? `transition-delay: ${o.formatFloat(Math.random(), 2)}s;` : `transition-delay: ${t + c * e}s;` : ""}"` : ""}>${m}</span>`, c++), f === u.length - 1 && (l += "</span>")) : m === " " ? l += " " : (l += `<span class="letter"${s || t ? ` style="${s ? `transition: ${o.formatFloat(Math.random(), 2) * s}s;` : ""}${t ? t === "random" ? `transition-delay: ${o.formatFloat(Math.random(), 2)}s;` : `transition-delay: ${t + c * e}s;` : ""}"` : ""}>${m}</span>`, c++);
+    });
+  }), v(n).html(l);
+}
+function xn(n, i) {
+  const t = Math.pow(10, i);
+  return Math.round(n * t) / t;
+}
+function Cn(n) {
+  let i = n.activeIndex, t = n.slides.length;
+  if (n.params.loop)
+    switch (n.activeIndex) {
+      case 0:
+        i = t - 3;
+        break;
+      case t - 1:
+        i = 0;
+        break;
+      default:
+        --i;
+    }
+  return i;
+}
+function Hn(n, i) {
+  const t = n.$el, e = n.params.grid.rows, s = i || n.params.slidesPerView * e;
+  (n.loopedSlides ? n.slides.length - n.loopedSlides * 2 : n.slides.length) <= s ? (t.addClass("swiper-no-swiping"), v(n.params.navigation.nextEl).hide(), v(n.params.navigation.prevEl).hide(), v(n.params.pagination.el).hide(), n.params.autoplay.enabled = !1, n.autoplay.stop()) : (t.removeClass("swiper-no-swiping"), v(n.params.navigation.nextEl).show(), v(n.params.navigation.prevEl).show(), v(n.params.pagination.el).show(), n.params.autoplay.enabled && n.autoplay.start());
+}
+function Mn(n) {
+  n.el.querySelectorAll("img.detect-shade").forEach((i) => {
+    i.addEventListener("load", function() {
+      detectShade(i);
+    });
+  });
+}
+function qn(n) {
+  const i = n.el, t = v(i).find(".swiper-slide-active"), e = v(t).find("video").get(0), s = v(i).find(".swiper-slide video");
+  n.autoplay.stop(), v(e).off("ended"), e ? (s.each((o, a) => {
+    a.currentTime = 0;
+  }), v(e).on("ended", function() {
+    n.slideNext();
+  }), e.play()) : n.params.autoplay.enabled && n.autoplay.start();
+}
+function In() {
+  v(".number-grow").each(function(n, i) {
+    const t = v(i), o = t.attr("data-num").replace(/(\d)(?=(?:\d{3})+$)/g, "$1,").split(""), a = () => {
+      let r = "";
+      for (var l = 0; l <= 9; l++)
+        r += String(l) + "<br>";
+      return r;
+    };
+    v(o).each(function(r, l) {
+      const c = () => l !== "," ? `<div class="num" data-final-num="${l}"><div><br>${a()}<br>${a()}</div></div>` : `<div class="comma">${l}</div>`;
+      t.append(c);
+    });
+  });
+}
+function On() {
+  v(".letter-grow").each(function(n, i) {
+    const t = v(i), s = t.attr("data-letter").split(""), o = () => {
+      let a = "";
+      for (let r = 65; r <= 90; r++)
+        a += String.fromCharCode(r) + "<br>";
+      return a;
+    };
+    v(s).each(function(a, r) {
+      const l = `<div class="letter" data-final-letter="${r}"><div><br>${o()}<br>${o()}</div></div>`;
+      t.append(l);
+    });
+  });
+}
+function Pn(n) {
+  const i = getComputedStyle(n).transform;
+  let t = i.match(/^matrix3d\((.+)\)$/);
+  return t ? parseFloat(t[1].split(", ")[12]) : (t = i.match(/^matrix\((.+)\)$/), t ? parseFloat(t[1].split(", ")[4]) : 0);
+}
+function Nn(n) {
+  const i = getComputedStyle(n).transform;
+  let t = i.match(/^matrix3d\((.+)\)$/);
+  return t ? parseFloat(t[1].split(", ")[13]) : (t = i.match(/^matrix\((.+)\)$/), t ? parseFloat(t[1].split(", ")[5]) : 0);
+}
+function jn(n) {
+  const i = document.createElement("div");
+  return i.innerHTML = n, i.childNodes[0];
+}
+const We = (n) => n.videoId !== "" || typeof n.videoId < "u", Ms = (n) => n.$selector.getAttribute("video4-active") === "on", Te = (n) => `<video-player video-id="${n.videoId}" video-type="${n.videoType}" video-startTime="${n.videoStartTime}" video-autoplay="${n.videoAutoplay}"></video-player>`;
+var V, Se, Ht, Li, Mt, Si, K, De, qt, Di;
+class qs {
+  constructor(i, t = {}) {
+    h(this, V);
+    h(this, Ht);
+    h(this, Mt);
+    h(this, K);
+    h(this, qt);
+    if (!at(i) && !ye(i) && !rt(i)) {
+      je("video4", `找不到該物件 -> ${i}`);
+      return;
+    }
+    this.__storage__ = {
+      el: i,
+      options: t
+    }, this.active = "data-video-active", d(this, V, Se).call(this);
+  }
+  update() {
+    d(this, V, Se).call(this);
+  }
+}
+V = new WeakSet(), Se = function() {
+  const { el: i, options: t } = this.__storage__, { SETTINGS: e, EVENTS: s } = Y;
+  if (this.elements = t.state == "not active" ? L(i + `:not([${this.active}])`) : L(i), this.options = Object.assign({}, e, t), this.__events__ = Object.assign({}, s), this.options.on)
+    for (const [o, a] of Object.entries(this.options.on))
+      this.__events__[o] = [a];
+  d(this, Ht, Li).call(this);
+}, Ht = new WeakSet(), Li = function() {
+  const { elements: i, options: t } = this;
+  i.forEach((e) => {
+    e.video = {}, e.video.instance = this, e.video.defaultOptions = t, e.video.params = d(this, qt, Di).call(this, e), e.video.methods = {}, e.video.methods.update = this.update, e.setAttribute(this.active, ""), We(e.video.params) && !Ms(e.video.params) && (e.setAttribute("video4-active", "on"), d(this, Mt, Si).call(this, e)), We(e.video.params) || je("video4", "無法取得影片 ID");
+  }), this.emit("init");
+}, Mt = new WeakSet(), Si = function(i) {
+  const { LAYOUT: t } = Y, e = i.video.params, { $selector: s, videoLayoutNo: o, videoId: a, videoType: r, videoMode: l, videoButton: c, videoCover: u, videoHighQualityPic: p } = e;
+  if (l === "onBox") {
+    let g = null;
+    if (u === "on") {
+      i.classList.add("video4-cover"), s.querySelector("img") || (s.insertAdjacentHTML(E.prepend, '<picture><source srcset="" type="image/webp"><source srcset="" type="image/jpeg"><img src="" alt></picture>'), T("video4", "若啟用 [videoCover] 且選擇 onBox 模式必須於 video-target 內放置 img 結構，若無結構則自動加入圖片結構"));
+      const m = s.querySelector("img");
+      m.insertAdjacentHTML(E.after, t[o]);
+      const f = (m == null ? void 0 : m.getAttribute("src")) || (m == null ? void 0 : m.getAttribute("data-src"));
+      !f && r == "youtube" ? p == "on" ? m.setAttribute("src", `http://img.youtube.com/vi/${a}/maxresdefault.jpg `) : m.setAttribute("src", `https://img.youtube.com/vi/${a}/0.jpg`) : !f && r == "vimeo" ? m.setAttribute("src", `https://vumbnail.com/${a}_large.jpg`) : !f && r == "tiktok" ? fetch(`https://www.tiktok.com/oembed?url=https://www.tiktok.com/@/video/${a}`, { method: "GET", redirect: "follow" }).then((b) => b.json()).then((b) => {
+        const y = b.thumbnail_url;
+        m.setAttribute("src", `${y}`);
+      }).catch(function(b) {
+        console.log("error");
+      }) : T("video4", "僅 youtube & vimeo 提供，無圖片時放置預設封面畫面，其他影片平台請自行上傳封面照片");
+    }
+    c == "off" ? g = s : (g = s.querySelector(c) ?? s, s.querySelector(c) || T("video4", `找不到 videoButton 設定的 element -> '${c}' , 點擊物件轉移至 '${this.__storage__.el}'`)), g.video || (g.video = {}, g.video.params = e), g.video.eventHandler = d(this, K, De), g.addEventListener("click", g.video.eventHandler);
+  } else if (l === "onPage") {
+    let g = null;
+    if (u == "on") {
+      i.classList.add("video4-cover"), s.querySelector("img") || (s.insertAdjacentHTML(E.prepend, '<picture><source srcset="" type="image/webp"><source srcset="" type="image/jpeg"><img src="" alt></picture>'), T("video", "若啟用 [videoCover] 且選擇 onBox 模式必須於 video-target 內放置 img 結構"));
+      const m = s.querySelector("img");
+      m.insertAdjacentHTML(E.after, t[o]);
+      const f = (m == null ? void 0 : m.getAttribute("src")) || (m == null ? void 0 : m.getAttribute("data-src"));
+      !f && r == "youtube" ? p == "on" ? m.setAttribute("src", `http://img.youtube.com/vi/${a}/maxresdefault.jpg `) : m.setAttribute("src", `https://img.youtube.com/vi/${a}/0.jpg`) : !f && r == "vimeo" ? m.setAttribute("src", `https://vumbnail.com/${a}_large.jpg`) : !f && r == "tiktok" ? fetch(`https://www.tiktok.com/oembed?url=https://www.tiktok.com/@/video/${a}`, { method: "GET", redirect: "follow" }).then((b) => b.json()).then((b) => {
+        const y = b.thumbnail_url;
+        m.setAttribute("src", `${y}`);
+      }).catch(function(b) {
+        console.log("error");
+      }) : f || T("video4", "僅 youtube & vimeo 提供，無圖片時放置預設封面畫面，其他影片平台請自行上傳封面照片"), c == "off" ? g = s : (g = s.querySelector(c) ?? s, s.querySelector(c) || T("video4", `找不到 videoButton 設定的 element -> '${c}', 點擊物件轉移至 '${this.__storage__.el}'`));
+    } else {
+      s.innerHTML = Te(e);
+      return;
+    }
+    g.video || (g.video = {}, g.video.params = e), g.video.eventHandler = d(this, K, De), g.addEventListener("click", g.video.eventHandler);
+  }
+}, K = new WeakSet(), De = function(i) {
+  const { video: t, emit: e } = this, { $selector: s, videoMode: o, videoTarget: a, videoTargetRoute: r, videoType: l, videoIgHtml: c } = t.params, u = new Fe({ callback_loaded: (p) => {
+  } });
+  if (o == "onBox") {
+    const p = {
+      target: a,
+      route: r,
+      on: {
+        complete(g) {
+          if (l == "instagram")
+            if (g.setAttribute("video-typeStyle", `${l}`), window.instgrm)
+              window.instgrm.Embeds.process();
+            else {
+              const m = document.createElement("script");
+              m.src = "https://www.instagram.com/embed.js", m.async = !0, document.body.appendChild(m);
+            }
+          else
+            g.querySelector(".modal-content").insertAdjacentHTML("beforeend", Te(t.params)), g.setAttribute("video-typeStyle", `${l}`);
+        },
+        open(g) {
+          const m = g.querySelectorAll("[data-overlayscrollbars-viewport]");
+          if (u.update(), Ei([...m]), l == "instagram") {
+            const f = document.querySelector("[video-template] .modal-content");
+            new ResizeObserver((y) => {
+              y[0].contentRect.height > 50 && f.classList.add("active");
+            }).observe(f);
+          }
+        },
+        close(g) {
+          const m = g.querySelectorAll("[data-overlayscrollbars-viewport]");
+          Ai([...m]);
+        },
+        destroy(g) {
+        }
+      }
+    };
+    U.open(p);
+  } else
+    o == "onPage" && (t.params.videoAutoplay = "on", s.innerHTML = Te(t.params));
+}, qt = new WeakSet(), Di = function(i) {
+  const { SETTINGS: t } = Y;
+  return {
+    $selector: i,
+    videoId: i.getAttribute("video-id"),
+    videoType: i.getAttribute("video-type"),
+    videoAutoplay: i.getAttribute("video-autoplay") || t.videoAutoplay,
+    videoMode: i.getAttribute("video-mode") || t.videoMode,
+    videoButton: i.getAttribute("video-button") || t.videoButton,
+    videoCover: i.getAttribute("video-cover") || t.videoCover,
+    videoLayoutNo: i.getAttribute("video-layout-no") || t.videoLayoutNo,
+    videoTarget: i.getAttribute("video-target") || t.videoTarget,
+    videoTargetRoute: i.getAttribute("video-target-route") || t.videoTargetRoute,
+    videoStartTime: i.getAttribute("video-starttime") || t.videoStartTime,
+    videoHighQualityPic: i.getAttribute("video-highquality") || t.videoHighQuality,
+    videoIgHtml: i.getAttribute("video-ig") || t.videoIgHtml
+  };
+};
+Object.assign(qs.prototype, O);
+customElements.define("video-player", xs);
+const Oe = {
+  "zh-tw": {
+    臺北市: [
+      ["中正區", "100"],
+      ["大同區", "103"],
+      ["中山區", "104"],
+      ["松山區", "105"],
+      ["大安區", "106"],
+      ["萬華區", "108"],
+      ["信義區", "110"],
+      ["士林區", "111"],
+      ["北投區", "112"],
+      ["內湖區", "114"],
+      ["南港區", "115"],
+      ["文山區", "116"]
+    ],
+    新北市: [
+      ["萬里區", "207"],
+      ["金山區", "208"],
+      ["板橋區", "220"],
+      ["汐止區", "221"],
+      ["深坑區", "222"],
+      ["石碇區", "223"],
+      ["瑞芳區", "224"],
+      ["平溪區", "226"],
+      ["雙溪區", "227"],
+      ["貢寮區", "228"],
+      ["新店區", "231"],
+      ["坪林區", "232"],
+      ["烏來區", "233"],
+      ["永和區", "234"],
+      ["中和區", "235"],
+      ["土城區", "236"],
+      ["三峽區", "237"],
+      ["樹林區", "238"],
+      ["鶯歌區", "239"],
+      ["三重區", "241"],
+      ["新莊區", "242"],
+      ["泰山區", "243"],
+      ["林口區", "244"],
+      ["蘆洲區", "247"],
+      ["五股區", "248"],
+      ["八里區", "249"],
+      ["淡水區", "251"],
+      ["三芝區", "252"],
+      ["石門區", "253"]
+    ],
+    基隆市: [
+      ["仁愛區", "200"],
+      ["信義區", "201"],
+      ["中正區", "202"],
+      ["中山區", "203"],
+      ["安樂區", "204"],
+      ["暖暖區", "205"],
+      ["七堵區", "206"]
+    ],
+    宜蘭縣: [
+      ["宜蘭市", "260"],
+      ["頭城鎮", "261"],
+      ["礁溪鄉", "262"],
+      ["壯圍鄉", "263"],
+      ["員山鄉", "264"],
+      ["羅東鎮", "265"],
+      ["三星鄉", "266"],
+      ["大同鄉", "267"],
+      ["五結鄉", "268"],
+      ["冬山鄉", "269"],
+      ["蘇澳鎮", "270"],
+      ["南澳鄉", "272"]
+    ],
+    桃園市: [
+      ["中壢區", "320"],
+      ["平鎮區", "324"],
+      ["龍潭區", "325"],
+      ["楊梅區", "326"],
+      ["新屋區", "327"],
+      ["觀音區", "328"],
+      ["桃園區", "330"],
+      ["龜山區", "333"],
+      ["八德區", "334"],
+      ["大溪區", "335"],
+      ["復興區", "336"],
+      ["大園區", "337"],
+      ["蘆竹區", "338"]
+    ],
+    新竹市: [
+      ["東區", "300"],
+      ["北區", "301"],
+      ["香山區", "309"]
+    ],
+    新竹縣: [
+      ["竹北市", "302"],
+      ["湖口鄉", "303"],
+      ["新豐鄉", "304"],
+      ["新埔鎮", "305"],
+      ["關西鎮", "306"],
+      ["芎林鄉", "307"],
+      ["寶山鄉", "308"],
+      ["竹東鎮", "310"],
+      ["五峰鄉", "311"],
+      ["橫山鄉", "312"],
+      ["尖石鄉", "313"],
+      ["北埔鄉", "314"],
+      ["峨嵋鄉", "315"]
+    ],
+    苗栗縣: [
+      ["竹南鎮", "350"],
+      ["頭份鎮", "351"],
+      ["三灣鄉", "352"],
+      ["南庄鄉", "353"],
+      ["獅潭鄉", "354"],
+      ["後龍鎮", "356"],
+      ["通霄鎮", "357"],
+      ["苑裡鎮", "358"],
+      ["苗栗市", "360"],
+      ["造橋鄉", "361"],
+      ["頭屋鄉", "362"],
+      ["公館鄉", "363"],
+      ["大湖鄉", "364"],
+      ["泰安鄉", "365"],
+      ["銅鑼鄉", "366"],
+      ["三義鄉", "367"],
+      ["西湖鄉", "368"],
+      ["卓蘭鎮", "369"]
+    ],
+    臺中市: [
+      ["中區", "400"],
+      ["東區", "401"],
+      ["南區", "402"],
+      ["西區", "403"],
+      ["北區", "404"],
+      ["北屯區", "406"],
+      ["西屯區", "407"],
+      ["南屯區", "408"],
+      ["太平區", "411"],
+      ["大里區", "412"],
+      ["霧峰區", "413"],
+      ["烏日區", "414"],
+      ["豐原區", "420"],
+      ["后里區", "421"],
+      ["石岡區", "422"],
+      ["東勢區", "423"],
+      ["和平區", "424"],
+      ["新社區", "426"],
+      ["潭子區", "427"],
+      ["大雅區", "428"],
+      ["神岡區", "429"],
+      ["大肚區", "432"],
+      ["沙鹿區", "433"],
+      ["龍井區", "434"],
+      ["梧棲區", "435"],
+      ["清水區", "436"],
+      ["大甲區", "437"],
+      ["外埔區", "438"],
+      ["大安區", "439"]
+    ],
+    彰化縣: [
+      ["彰化市", "500"],
+      ["芬園鄉", "502"],
+      ["花壇鄉", "503"],
+      ["秀水鄉", "504"],
+      ["鹿港鎮", "505"],
+      ["福興鄉", "506"],
+      ["線西鄉", "507"],
+      ["和美鎮", "508"],
+      ["伸港鄉", "509"],
+      ["員林鎮", "510"],
+      ["社頭鄉", "511"],
+      ["永靖鄉", "512"],
+      ["埔心鄉", "513"],
+      ["溪湖鎮", "514"],
+      ["大村鄉", "515"],
+      ["埔鹽鄉", "516"],
+      ["田中鎮", "520"],
+      ["北斗鎮", "521"],
+      ["田尾鄉", "522"],
+      ["埤頭鄉", "523"],
+      ["溪州鄉", "524"],
+      ["竹塘鄉", "525"],
+      ["二林鎮", "526"],
+      ["大城鄉", "527"],
+      ["芳苑鄉", "528"],
+      ["二水鄉", "530"]
+    ],
+    南投縣: [
+      ["南投市", "540"],
+      ["中寮鄉", "541"],
+      ["草屯鎮", "542"],
+      ["國姓鄉", "544"],
+      ["埔里鎮", "545"],
+      ["仁愛鄉", "546"],
+      ["名間鄉", "551"],
+      ["集集鎮", "552"],
+      ["水里鎮", "553"],
+      ["魚池鄉", "555"],
+      ["信義鄉", "556"],
+      ["竹山鎮", "557"],
+      ["鹿谷鄉", "558"]
+    ],
+    雲林縣: [
+      ["斗南鎮", "630"],
+      ["大埤鄉", "631"],
+      ["虎尾鎮", "632"],
+      ["土庫鎮", "633"],
+      ["褒忠鄉", "634"],
+      ["東勢鄉", "635"],
+      ["臺西鄉", "636"],
+      ["崙背鄉", "637"],
+      ["麥寮鄉", "638"],
+      ["斗六市", "640"],
+      ["林內鄉", "643"],
+      ["古坑鄉", "646"],
+      ["莿桐鄉", "647"],
+      ["西螺鎮", "648"],
+      ["二崙鄉", "649"],
+      ["北港鎮", "651"],
+      ["水林鄉", "652"],
+      ["口湖鄉", "653"],
+      ["四湖鄉", "654"],
+      ["元長鄉", "655"]
+    ],
+    嘉義市: [
+      ["西區", "600"],
+      ["東區", "601"]
+    ],
+    嘉義縣: [
+      ["番路鄉", "602"],
+      ["梅山鄉", "603"],
+      ["竹崎鄉", "604"],
+      ["阿里山鄉", "605"],
+      ["中埔鄉", "606"],
+      ["大埔鄉", "607"],
+      ["水上鄉", "608"],
+      ["鹿草鄉", "611"],
+      ["太保市", "612"],
+      ["朴子市", "613"],
+      ["東石鄉", "614"],
+      ["六腳鄉", "615"],
+      ["新港鄉", "616"],
+      ["民雄鄉", "621"],
+      ["大林鎮", "622"],
+      ["溪口鄉", "623"],
+      ["義竹鄉", "624"],
+      ["布袋鎮", "625"]
+    ],
+    臺南市: [
+      ["中西區", "700"],
+      ["東區", "701"],
+      ["南區", "702"],
+      ["北區", "704"],
+      ["安平區", "708"],
+      ["安南區", "709"],
+      ["永康區", "710"],
+      ["歸仁區", "711"],
+      ["新化區", "712"],
+      ["左鎮區", "713"],
+      ["玉井區", "714"],
+      ["楠西區", "715"],
+      ["南化區", "716"],
+      ["仁德區", "717"],
+      ["關廟區", "718"],
+      ["龍崎區", "719"],
+      ["官田區", "720"],
+      ["麻豆區", "721"],
+      ["佳里區", "722"],
+      ["西港區", "723"],
+      ["七股區", "724"],
+      ["將軍區", "725"],
+      ["學甲區", "726"],
+      ["北門區", "727"],
+      ["新營區", "730"],
+      ["後壁區", "731"],
+      ["白河區", "732"],
+      ["東山區", "733"],
+      ["六甲區", "734"],
+      ["下營區", "735"],
+      ["柳營區", "736"],
+      ["鹽水區", "737"],
+      ["善化區", "741"],
+      ["大內區", "742"],
+      ["山上區", "743"],
+      ["新市區", "744"],
+      ["安定區", "745"]
+    ],
+    高雄市: [
+      ["新興區", "800"],
+      ["前金區", "801"],
+      ["苓雅區", "802"],
+      ["鹽埕區", "803"],
+      ["鼓山區", "804"],
+      ["旗津區", "805"],
+      ["前鎮區", "806"],
+      ["三民區", "807"],
+      ["楠梓區", "811"],
+      ["小港區", "812"],
+      ["左營區", "813"],
+      ["仁武區", "814"],
+      ["大社區", "815"],
+      ["岡山區", "820"],
+      ["路竹區", "821"],
+      ["阿蓮區", "822"],
+      ["田寮區", "823"],
+      ["燕巢區", "824"],
+      ["橋頭區", "825"],
+      ["梓官區", "826"],
+      ["彌陀區", "827"],
+      ["永安區", "828"],
+      ["湖內區", "829"],
+      ["鳳山區", "830"],
+      ["大寮區", "831"],
+      ["林園區", "832"],
+      ["鳥松區", "833"],
+      ["大樹區", "840"],
+      ["旗山區", "842"],
+      ["美濃區", "843"],
+      ["六龜區", "844"],
+      ["內門區", "845"],
+      ["杉林區", "846"],
+      ["甲仙區", "847"],
+      ["桃源區", "848"],
+      ["那瑪夏區", "849"],
+      ["茂林區", "851"],
+      ["茄萣區", "852"]
+    ],
+    屏東縣: [
+      ["屏東市", "900"],
+      ["三地鄉", "901"],
+      ["霧臺鄉", "902"],
+      ["瑪家鄉", "903"],
+      ["九如鄉", "904"],
+      ["里港鄉", "905"],
+      ["高樹鄉", "906"],
+      ["鹽埔鄉", "907"],
+      ["長治鄉", "908"],
+      ["麟洛鄉", "909"],
+      ["竹田鄉", "911"],
+      ["內埔鄉", "912"],
+      ["萬丹鄉", "913"],
+      ["潮州鎮", "920"],
+      ["泰武鄉", "921"],
+      ["來義鄉", "922"],
+      ["萬巒鄉", "923"],
+      ["崁頂鄉", "924"],
+      ["新埤鄉", "925"],
+      ["南州鄉", "926"],
+      ["林邊鄉", "927"],
+      ["東港鎮", "928"],
+      ["琉球鄉", "929"],
+      ["佳冬鄉", "931"],
+      ["新園鄉", "932"],
+      ["枋寮鄉", "940"],
+      ["枋山鄉", "941"],
+      ["春日鄉", "942"],
+      ["獅子鄉", "943"],
+      ["車城鄉", "944"],
+      ["牡丹鄉", "945"],
+      ["恒春鎮", "946"],
+      ["滿州鄉", "947"]
+    ],
+    花蓮縣: [
+      ["花蓮市", "970"],
+      ["新城鄉", "971"],
+      ["秀林鄉", "972"],
+      ["吉安鄉", "973"],
+      ["壽豐鄉", "974"],
+      ["鳳林鎮", "975"],
+      ["光復鄉", "976"],
+      ["豐濱鄉", "977"],
+      ["瑞穗鄉", "978"],
+      ["萬榮鄉", "979"],
+      ["玉里鎮", "981"],
+      ["卓溪鄉", "982"],
+      ["富里鄉", "983"]
+    ],
+    臺東縣: [
+      ["臺東市", "950"],
+      ["綠島鄉", "951"],
+      ["蘭嶼鄉", "952"],
+      ["延平鄉", "953"],
+      ["卑南鄉", "954"],
+      ["鹿野鄉", "955"],
+      ["關山鎮", "956"],
+      ["海端鄉", "957"],
+      ["池上鄉", "958"],
+      ["東河鄉", "959"],
+      ["成功鄉", "961"],
+      ["長濱鄉", "962"],
+      ["太麻里鄉", "963"],
+      ["金峰鄉", "964"],
+      ["大武鄉", "965"],
+      ["達仁鄉", "966"]
+    ],
+    澎湖縣: [
+      ["馬公市", "880"],
+      ["西嶼鄉", "881"],
+      ["望安鄉", "882"],
+      ["七美鄉", "883"],
+      ["白沙鄉", "884"],
+      ["湖西鄉", "885"]
+    ],
+    金門縣: [
+      ["金沙鎮", "890"],
+      ["金湖鎮", "891"],
+      ["金寧鄉", "892"],
+      ["金城鎮", "893"],
+      ["烈嶼鄉", "894"],
+      ["烏坵鄉", "896"]
+    ],
+    連江縣: [
+      ["南竿鄉", "209"],
+      ["北竿鄉", "210"],
+      ["莒光鄉", "211"],
+      ["東引鄉", "212"]
+    ]
+  },
+  en: {
+    "Taipei City": [
+      ["Zhongzheng Dist", "100"],
+      ["Datong Dist", "103"],
+      ["Zhongshan Dist", "104"],
+      ["Songshan Dist", "105"],
+      ["Da'an Dist", "106"],
+      ["Wanhua Dist", "108"],
+      ["Xinyi Dist", "110"],
+      ["Shilin Dist", "111"],
+      ["Beitou Dist", "112"],
+      ["Neihu Dist", "114"],
+      ["Nangang Dist", "115"],
+      ["Wenshan Dist", "116"]
+    ],
+    "New Taipei City": [
+      ["Wanli Dist", "207"],
+      ["Jinshan Dist", "208"],
+      ["Banqiao Dist", "220"],
+      ["Xizhi Dist", "221"],
+      ["Shenkeng Dist", "222"],
+      ["Shiding Dist", "223"],
+      ["Ruifang Dist", "224"],
+      ["Pingxi Dist", "226"],
+      ["Shuangxi Dist", "227"],
+      ["Gongliao Dist", "228"],
+      ["Xindian Dist", "231"],
+      ["Pinglin Dist", "232"],
+      ["Wulai Dist", "233"],
+      ["Yonghe Dist", "234"],
+      ["Zhonghe Dist", "235"],
+      ["Tucheng Dist", "236"],
+      ["Sanxia Dist", "237"],
+      ["Shulin Dist", "238"],
+      ["Yingge Dist", "239"],
+      ["Sanchong Dist", "241"],
+      ["Xinzhuang Dist", "242"],
+      ["Taishan Dist", "243"],
+      ["Linkou Dist", "244"],
+      ["Luzhou Dist", "247"],
+      ["Wugu Dist", "248"],
+      ["Bali Dist", "249"],
+      ["Tamsui Dist", "251"],
+      ["Sanzhi Dist", "252"],
+      ["Shimen Dist", "253"]
+    ],
+    "Keelung City": [
+      ["Ren'ai Dist", "200"],
+      ["Xinyi Dist", "201"],
+      ["Zhongzheng Dist", "202"],
+      ["Zhongshan Dist", "203"],
+      ["Anle Dist", "204"],
+      ["Nuannuan Dist", "205"],
+      ["Qidu Dist", "206"]
+    ],
+    "Yilan County": [
+      ["Yilan City", "260"],
+      ["Toucheng Township", "261"],
+      ["Jiaoxi Township", "262"],
+      ["Zhuangwei Township", "263"],
+      ["Yuanshan Township", "264"],
+      ["Luodong Township", "265"],
+      ["Sanxing Township", "266"],
+      ["Datong Township", "267"],
+      ["Wujie Township", "268"],
+      ["Dongshan Township", "269"],
+      ["Su'ao Township", "270"],
+      ["Nan’ao Township", "272"]
+    ],
+    "Taoyuan City": [
+      ["Zhongli Dist", "320"],
+      ["Pingzhen Dist", "324"],
+      ["Longtan Dist", "325"],
+      ["Yangmei Dist", "326"],
+      ["Xinwu Dist", "327"],
+      ["Guanyin Dist", "328"],
+      ["Taoyuan Dist", "330"],
+      ["Guishan Dist", "333"],
+      ["Bade Dist", "334"],
+      ["Daxi Dist", "335"],
+      ["Fuxing Dist", "336"],
+      ["Dayuan Dist", "337"],
+      ["Luzhu Dist", "338"]
+    ],
+    "Hsinchu City": [
+      ["East Dist", "300"],
+      ["North Dist", "301"],
+      ["Xiangshan Dist", "309"]
+    ],
+    "Hsinchu County": [
+      ["Zhubei City", "302"],
+      ["Hukou Township", "303"],
+      ["Xinfeng Township", "304"],
+      ["Xinpu Township", "305"],
+      ["Guanxi Township", "306"],
+      ["Qionglin Township", "307"],
+      ["Baoshan Township", "308"],
+      ["Zhudong Township", "310"],
+      ["Wufeng Township", "311"],
+      ["Hengshan Township", "312"],
+      ["Jianshi Township", "313"],
+      ["Beipu Township", "314"],
+      ["Emei Township", "315"]
+    ],
+    "Miaoli County": [
+      ["Zhunan Township", "350"],
+      ["Toufen City", "351"],
+      ["Sanwan Township", "352"],
+      ["Nanzhuang Township", "353"],
+      ["Shitan Township", "354"],
+      ["Houlong Township", "356"],
+      ["Tongxiao Township", "357"],
+      ["Yuanli Township", "358"],
+      ["Miaoli City", "360"],
+      ["Zaoqiao Township", "361"],
+      ["Touwu Township", "362"],
+      ["Gongguan Township", "363"],
+      ["Dahu Township", "364"],
+      ["Tai'an Township", "365"],
+      ["Tongluo Township", "366"],
+      ["Sanyi Township", "367"],
+      ["Xihu Township", "368"],
+      ["Zhuolan Township", "369"]
+    ],
+    "Taichung City": [
+      ["Central Dist", "400"],
+      ["East Dist", "401"],
+      ["South Dist", "402"],
+      ["West Dist", "403"],
+      ["North Dist", "404"],
+      ["Beitun Dist", "406"],
+      ["Xitun Dist", "407"],
+      ["Nantun Dist", "408"],
+      ["Taiping Dist", "411"],
+      ["Dali Dist", "412"],
+      ["Wufeng Dist", "413"],
+      ["Wuri Dist", "414"],
+      ["Fengyuan Dist", "420"],
+      ["Houli Dist", "421"],
+      ["Shigang Dist", "422"],
+      ["Dongshi Dist", "423"],
+      ["Heping Dist", "424"],
+      ["Xinshe Dist", "426"],
+      ["Tanzi Dist", "427"],
+      ["Daya Dist", "428"],
+      ["Shengang Dist", "429"],
+      ["Dadu Dist", "432"],
+      ["Shalu Dist", "433"],
+      ["Longjing Dist", "434"],
+      ["Wuqi Dist", "435"],
+      ["Qingshui Dist", "436"],
+      ["Dajia Dist", "437"],
+      ["Waipu Dist", "438"],
+      ["Da'an Dist", "439"]
+    ],
+    "Changhua County": [
+      ["Changhua City", "500"],
+      ["Fenyuan Township", "502"],
+      ["Huatan Township", "503"],
+      ["Xiushui Township", "504"],
+      ["Lukang Township", "505"],
+      ["Fuxing Township", "506"],
+      ["Xianxi Township", "507"],
+      ["Hemei Township", "508"],
+      ["Shengang Township", "509"],
+      ["Yuanlin City", "510"],
+      ["Shetou Township", "511"],
+      ["Yongjing Township", "512"],
+      ["Puxin Township", "513"],
+      ["Xihu Township", "514"],
+      ["Dacun Township", "515"],
+      ["Puyan Township", "516"],
+      ["Tianzhong Township", "520"],
+      ["Beidou Township", "521"],
+      ["Tianwei Township", "522"],
+      ["Pitou Township", "523"],
+      ["Xizhou Township", "524"],
+      ["Zhutang Township", "525"],
+      ["Erlin Township", "526"],
+      ["Dacheng Township", "527"],
+      ["Fangyuan Township", "528"],
+      ["Ershui Township", "530"]
+    ],
+    "Nantou County": [
+      ["Nantou City", "540"],
+      ["Zhongliao Township", "541"],
+      ["Caotun Township", "542"],
+      ["Guoxing Township", "544"],
+      ["Puli Township", "545"],
+      ["Ren'ai Township", "546"],
+      ["Mingjian Township", "551"],
+      ["Jiji Township", "552"],
+      ["Shuili Township", "553"],
+      ["Yuchi Township", "555"],
+      ["Xinyi Township", "556"],
+      ["Zhushan Township", "557"],
+      ["Lugu Township", "558"]
+    ],
+    "Yunlin County": [
+      ["Dounan Township", "630"],
+      ["Dapi Township", "631"],
+      ["Huwei Township", "632"],
+      ["Tuku Township", "633"],
+      ["Baozhong Township", "634"],
+      ["Dongshi Township", "635"],
+      ["Taixi Township", "636"],
+      ["Lunbei Township", "637"],
+      ["Mailiao Township", "638"],
+      ["Douliu City", "640"],
+      ["Linnei Township", "643"],
+      ["Gukeng Township", "646"],
+      ["Citong Township", "647"],
+      ["Xiluo Township", "648"],
+      ["Erlun Township", "649"],
+      ["Beigang Township", "651"],
+      ["Shuilin Township", "652"],
+      ["Kouhu Township", "653"],
+      ["Sihu Township", "654"],
+      ["Yuanzhang Township", "655"]
+    ],
+    "Chiayi City": [
+      ["West Dist", "600"],
+      ["0", "601"]
+    ],
+    "Chiayi County": [
+      ["Fanlu Township", "602"],
+      ["Meishan Township", "603"],
+      ["Zhuqi Township", "604"],
+      ["Alishan Township", "605"],
+      ["Zhongpu Township", "606"],
+      ["Dapu Township", "607"],
+      ["Shuishang Township", "608"],
+      ["Lucao Township", "611"],
+      ["Taibao City", "612"],
+      ["Puzi City", "613"],
+      ["Dongshi Township", "614"],
+      ["Liujiao Township", "615"],
+      ["Xingang Township", "616"],
+      ["Minxiong Township", "621"],
+      ["Dalin Township", "622"],
+      ["Xikou Township", "623"],
+      ["Yizhu Township", "624"],
+      ["Budai Township", "625"]
+    ],
+    "Tainan City": [
+      ["West Central Dist", "700"],
+      ["East Dist", "701"],
+      ["South Dist", "702"],
+      ["North Dist", "704"],
+      ["Anping Dist", "708"],
+      ["Annan Dist", "709"],
+      ["Yongkang Dist", "710"],
+      ["Guiren Dist", "711"],
+      ["Xinhua Dist", "712"],
+      ["Zuozhen Dist", "713"],
+      ["Yujing Dist", "714"],
+      ["Nanxi Dist", "715"],
+      ["Nanhua Dist", "716"],
+      ["Rende Dist", "717"],
+      ["Guanmiao Dist", "718"],
+      ["Longqi Dist", "719"],
+      ["Guantian Dist", "720"],
+      ["Madou Dist", "721"],
+      ["Jiali Dist", "722"],
+      ["Xigang Dist", "723"],
+      ["Qigu Dist", "724"],
+      ["Jiangjun Dist", "725"],
+      ["Xuejia Dist", "726"],
+      ["Beimen Dist", "727"],
+      ["Xinying Dist", "730"],
+      ["Houbi Dist", "731"],
+      ["Baihe Dist", "732"],
+      ["Dongshan Dist", "733"],
+      ["Liujia Dist", "734"],
+      ["Xiaying Dist", "735"],
+      ["Liuying Dist", "736"],
+      ["Yanshui Dist", "737"],
+      ["Shanhua Dist", "741"],
+      ["Danei Dist", "742"],
+      ["Shanshang Dist", "743"],
+      ["Xinshi Dist", "744"],
+      ["Anding Dist", "745"]
+    ],
+    "Kaohsiung City": [
+      ["Xinxing Dist", "800"],
+      ["Qianjin Dist", "801"],
+      ["Lingya Dist", "802"],
+      ["Yancheng Dist", "803"],
+      ["Gushan Dist", "804"],
+      ["Qijin Dist", "805"],
+      ["Qianzhen Dist", "806"],
+      ["Sanmin Dist", "807"],
+      ["Nanzi Dist", "811"],
+      ["Xiaogang Dist", "812"],
+      ["Zuoying Dist", "813"],
+      ["Renwu Dist", "814"],
+      ["Dashe Dist", "815"],
+      ["Gangshan Dist", "820"],
+      ["Luzhu Dist", "821"],
+      ["Alian Dist", "822"],
+      ["Tianliao Dist", "823"],
+      ["Yanchao Dist", "824"],
+      ["Qiaotou Dist", "825"],
+      ["Ziguan Dist", "826"],
+      ["Mituo Dist", "827"],
+      ["Yong'an Dist", "828"],
+      ["Hunei Dist", "829"],
+      ["Fengshan Dist", "830"],
+      ["Daliao Dist", "831"],
+      ["Linyuan Dist", "832"],
+      ["Niaosong Dist", "833"],
+      ["Dashu Dist", "840"],
+      ["Qishan Dist", "842"],
+      ["Meinong Dist", "843"],
+      ["Liugui Dist", "844"],
+      ["Neimen Dist", "845"],
+      ["Shanlin Dist", "846"],
+      ["Jiaxian Dist", "847"],
+      ["Taoyuan Dist", "848"],
+      ["Namaxia Dist", "849"],
+      ["Maolin Dist", "851"],
+      ["Qieding Dist", "852"]
+    ],
+    "Pingtung County": [
+      ["Pingtung City", "900"],
+      ["Sandimen Township", "901"],
+      ["Wutai Township", "902"],
+      ["Majia Township", "903"],
+      ["Jiuru Township", "904"],
+      ["Ligang Township", "905"],
+      ["Gaoshu Township", "906"],
+      ["Yanpu Township", "907"],
+      ["Changzhi Township", "908"],
+      ["Linluo Township", "909"],
+      ["Zhutian Township", "911"],
+      ["Neipu Township", "912"],
+      ["Wandan Township", "913"],
+      ["Chaozhou Township", "920"],
+      ["Taiwu Township", "921"],
+      ["Laiyi Township", "922"],
+      ["Wanluan Township", "923"],
+      ["Kanding Township", "924"],
+      ["Xinpi Township", "925"],
+      ["Nanzhou Township", "926"],
+      ["Linbian Township", "927"],
+      ["Donggang Township", "928"],
+      ["Liuqiu Township", "929"],
+      ["Jiadong Township", "931"],
+      ["Xinyuan Township", "932"],
+      ["Fangliao Township", "940"],
+      ["Fangshan Township", "941"],
+      ["Chunri Township", "942"],
+      ["Shizi Township", "943"],
+      ["Checheng Township", "944"],
+      ["Mudan Township", "945"],
+      ["Hengchun Township", "946"],
+      ["Manzhou Township", "947"]
+    ],
+    "Hualien County": [
+      ["Hualien City", "970"],
+      ["Xincheng Township", "971"],
+      ["Xiulin Township", "972"],
+      ["Ji'an Township", "973"],
+      ["Shoufeng Township", "974"],
+      ["Fenglin Township", "975"],
+      ["Guangfu Township", "976"],
+      ["Fengbin Township", "977"],
+      ["Ruisui Township", "978"],
+      ["Wanrong Township", "979"],
+      ["Yuli Township", "981"],
+      ["Zhuoxi Township", "982"],
+      ["Fuli Township", "983"]
+    ],
+    "Taitung County": [
+      ["Taitung City", "950"],
+      ["Ludao Township", "951"],
+      ["Lanyu Township", "952"],
+      ["Yanping Township", "953"],
+      ["Beinan Township", "954"],
+      ["Luye Township", "955"],
+      ["Guanshan Township", "956"],
+      ["Haiduan Township", "957"],
+      ["Chishang Township", "958"],
+      ["Donghe Township", "959"],
+      ["Chenggong Township", "961"],
+      ["Changbin Township", "962"],
+      ["Taimali Township", "963"],
+      ["Jinfeng Township", "964"],
+      ["Dawu Township", "965"],
+      ["Daren Township", "966"]
+    ],
+    "Penghu County": [
+      ["Magong City", "880"],
+      ["Xiyu Township", "881"],
+      ["Wang'an Township", "882"],
+      ["Qimei Township", "883"],
+      ["Baisha Township", "884"],
+      ["Huxi Township", "885"]
+    ],
+    "Kinmen County": [
+      ["Jinsha Township", "890"],
+      ["Jinhu Township", "891"],
+      ["Jinning Township", "892"],
+      ["Jincheng Township", "893"],
+      ["Lieyu Township", "894"],
+      ["Wuqiu Township", "896"]
+    ],
+    "Lienchiang County": [
+      ["Nangan Township", "209"],
+      ["Beigan Township", "210"],
+      ["Juguang Township", "211"],
+      ["Dongyin Township", "212"]
+    ]
+  }
+}, Is = (n) => {
+  const { TEMPLATE: i } = qe, { childDom: t } = n.s, e = document.createElement("div"), s = n.classList.contains("filter"), o = n.getAttribute("filter-placeholder"), a = n.getAttribute("d4-icon"), r = n.getAttribute("custom-template");
+  e.innerHTML = i(
+    s,
+    o,
+    r,
+    a
+  );
+  const l = e.querySelector(".dropdown-list");
+  return [...t].forEach((c) => {
+    c.tagName === "LI" && (c.classList.contains("has-sublayer") ? [...c.querySelectorAll("li")].forEach((p) => {
+      (!p.hasAttribute("data-option") || p.getAttribute("data-option").trim() === "") && p.setAttribute("data-option", p.textContent.trim());
+    }) : (!c.hasAttribute("data-option") || c.getAttribute("data-option").trim() === "") && c.setAttribute("data-option", c.textContent.trim())), l.append(c);
+  }), e.children[0];
+}, Os = (n) => {
+  var t;
+  const i = (t = n.getAttribute("control-elements")) == null ? void 0 : t.split(",");
+  i && i.forEach((e) => {
+    const s = document.querySelector(e);
+    s || T("dropdown", `Can't not find control element(${e})`), s && s.classList.contains("disabled") && (s.classList.remove("disabled"), s.tagName === "DROPDOWN-EL" && s.s.activeLi && x(s, [...s.s.allLi].indexOf(s.s.activeLi)));
+  });
+}, x = (n, i) => {
+  const t = n.getAttribute("d4-placeholder"), e = n.querySelectorAll(".dropdown-list li");
+  if (i < 0 || i.length === 0) {
+    switch (e.forEach((s) => {
+      s.classList.remove("active");
+    }), n.s.activeLi = void 0, n.s.selectType) {
+      case "single":
+        n.s.value = {
+          index: -1,
+          id: void 0,
+          el: void 0
+        };
+        break;
+      case "multiple":
+        n.s.value = [];
+        break;
+    }
+    n.s.selectDisplayEl.textContent = t.trim(), n.setAttribute("d4-value", "");
+  } else {
+    if (n.classList.contains("disabled")) {
+      n.s.selectDisplayEl.textContent = t.trim();
+      return;
+    }
+    switch (n.s.selectType) {
+      case "single":
+        const s = e[i].textContent.trim();
+        n.s.allLi.forEach((r) => {
+          r.classList.remove("active");
+        }), e[i].classList.add("active"), n.s.selectDisplayEl.textContent = s, n.s.activeLi = e[i], n.s.value = {
+          index: i,
+          id: e[i].getAttribute("data-option"),
+          el: e[i]
+        };
+        break;
+      case "multiple":
+        Array.isArray(i) && n.s.allLi.forEach((r) => {
+          i.indexOf([...n.s.allLi].indexOf(r)) >= 0 ? r.classList.add("active") : r.classList.remove("active");
+        });
+        const o = n.querySelectorAll(".dropdown-list li.active");
+        o.length <= 0 ? n.s.selectDisplayEl.textContent = t.trim() : (n.s.selectDisplayEl.textContent = "", o.forEach((r) => {
+          const l = r.getAttribute("data-option"), c = r.textContent.trim(), u = `<div class="option-btn" data-option="${l}"><div class="text">${c}</div><div class="remove-icon"></div></div>`;
+          n.s.selectDisplayEl.insertAdjacentHTML(E.append, u);
+        })), n.s.activeLi = o, n.s.value = [...o].map((r) => ({
+          index: [...e].indexOf(r),
+          id: r.getAttribute("data-option"),
+          el: r
+        }));
+        const a = [...o].map((r) => r.getAttribute("data-option"));
+        n.setAttribute("d4-value", a.join());
+        break;
+    }
+  }
+}, Ps = (n) => {
+  const i = n.s.cityLang;
+  n.classList.contains("city") && (n.s.dropdownEl.querySelector(".dropdown-list").innerHTML = "", Object.keys(Oe[i]).forEach((t) => {
+    const e = document.createElement("li");
+    e.textContent = t, e.setAttribute("data-option", t), n.s.dropdownEl.querySelector(".dropdown-list").append(e);
+  }), n.s.allLi = n.querySelectorAll(".dropdown-list li"));
+}, Ns = (n, i) => {
+  const t = n.s.cityLang;
+  Oe[t][i].forEach((e, s) => {
+    const o = document.createElement("li");
+    o.textContent = e[0], o.setAttribute("data-option", e[0]), n.querySelector(".dropdown-list").append(o);
+  });
+}, _i = () => {
+  L('dropdown-el[d4-status="open"]').forEach((i) => {
+    i.close();
+  });
+}, js = () => {
+  const { SETTINGS: n } = qe;
+  ((t, e) => {
+    Object.keys(e).forEach((s) => {
+      t.style.setProperty(`--${s}`, e[s]);
+    });
+  })(document.documentElement, n.scrollbar);
+};
+js();
+document.addEventListener("click", function() {
+  _i();
+});
+var It, $i, Ot, xi, Pt, Ci, Nt, Hi;
+class ki extends HTMLElement {
+  constructor() {
+    super();
+    h(this, It);
+    h(this, Ot);
+    h(this, Pt);
+    h(this, Nt);
+    this.initialize = !1;
+  }
+  static get observedAttributes() {
+    return ["d4-status", "d4-placeholder", "d4-value"];
+  }
+  attributeChangedCallback(t, e, s) {
+    const o = this;
+    switch (t) {
+      case "d4-status":
+        if (e === null || e === s)
+          return;
+        (s === "open" || s === "close") && o.emit(s);
+        break;
+      case "d4-value":
+        if (e === null || e === s)
+          return;
+        if (s !== "")
+          switch (o.hasAttribute("multiple") ? "multiple" : "single") {
+            case "single":
+              const r = o.querySelector(`.dropdown-list li[data-option="${s}"]`);
+              w(r) ? x(o, [...o.s.allLi].indexOf(r)) : x(o, -1);
+              break;
+            case "multiple":
+              const l = [];
+              o.querySelector(".dropdown-list li").classList.remove("active"), s.split(",").forEach((u) => {
+                const p = o.querySelector(`.dropdown-list li[data-option="${u}"]`);
+                w(p) && (p.classList.add("active"), l.push(p));
+              });
+              const c = l.map((u) => [...o.s.allLi].indexOf(u));
+              x(o, c);
+              break;
+          }
+        else
+          x(o, -1);
+        o.emit("change");
+        break;
+      case "d4-placeholder":
+        if (e === null)
+          return;
+        e !== s && o.s.value.index < 0 && x(o, o.s.value.index);
+        break;
+    }
+  }
+  connectedCallback() {
+    const t = this;
+    t.initialize || t.classList.contains("d4-initialize") || (t.initialize = !0, d(this, It, $i).call(this));
+  }
+  open() {
+    const t = this, e = t.querySelector(".dropdown-scroller").clientHeight, s = t.classList.contains("filter"), o = () => s ? t.querySelector(".dropdown-scroller .filter-bar") ? e : t.querySelector(".filter-bar").clientHeight + e : e;
+    return _i(), t.setAttribute("d4-status", "open"), t.setAttribute("d4-default-height", o()), t.style.cssText = `--maxHeight: ${o()}px;`, t.s.dropdownEl.style.cssText = `
+      height: ${o()}px;
+      z-index: 2;
+    `, this;
+  }
+  close() {
+    const t = this, e = t.s.dropdownEl.querySelectorAll(".has-sublayer"), s = parseInt(t.getAttribute("d4-default-height"));
+    return t.setAttribute("d4-status", "close"), t.s.dropdownEl.style.height = "0px", e.forEach((o) => {
+      o.classList.remove("open");
+    }), t.style.cssText = `--maxHeight: ${s}px;`, t.s.subDropdownTotalH = 0, this;
+  }
+  scrollTo(t) {
+    const e = this, { viewport: s } = e.__scroller__.elements();
+    s.scrollTo({
+      top: t,
+      behavior: "smooth"
+    });
+  }
+  update() {
+    this.__events__.selectOption();
+  }
+}
+It = new WeakSet(), $i = function() {
+  this.s = {}, this.__events__ = {}, this.hasAttribute("d4-status") || this.setAttribute("d4-status", "close"), this.hasAttribute("d4-value") || this.setAttribute("d4-value", ""), d(this, Ot, xi).call(this);
+}, Ot = new WeakSet(), xi = function() {
+  this.s.childDom = this.childNodes, this.s.template = Is(this), this.innerHTML = "", this.append(this.s.template), d(this, Pt, Ci).call(this);
+}, Pt = new WeakSet(), Ci = function() {
+  var s;
+  const t = this;
+  t.s.allLi = t.querySelectorAll(".dropdown-list li"), t.s.selectDisplayEl = t.querySelector(".select-display"), t.s.dropdownEl = t.querySelector(".dropdown"), t.s.selectType = t.hasAttribute("multiple") ? "multiple" : "single", t.s.cityLang = t.hasAttribute("city-lang") ? t.getAttribute("city-lang") : "zh-tw", Ps(t), t.s.subDropdownTotalH = 0;
+  const e = t.getAttribute("d4-value");
+  switch (t.s.selectType) {
+    case "single":
+      let o;
+      if (t.classList.contains("dist")) {
+        const r = document.querySelector(`dropdown-el[dist-select="${t.id}"]`), l = r ? r.getAttribute("d4-value") !== "" : !1;
+        if (r && l) {
+          const c = r.getAttribute("d4-value");
+          if (Ns(t, c), t.s.allLi = t.querySelectorAll(".dropdown-list li"), t.classList.remove("disabled"), t.getAttribute("d4-value") !== "") {
+            const u = e.split(",")[1];
+            o = t.querySelector(`.dropdown-list li[data-option="${u}"]`), t.setAttribute("d4-value", u);
+          }
+        }
+      } else
+        o = t.querySelector(`.dropdown-list li[data-option="${e}"]`);
+      w(o) ? (o.classList.add("active"), t.s.activeLi = o, t.s.value = {
+        index: [...t.s.allLi].indexOf(o),
+        id: e,
+        el: o
+      }) : (t.s.activeLi = void 0, t.s.value = {
+        index: -1,
+        id: void 0,
+        el: void 0
+      });
+      break;
+    case "multiple":
+      const a = [];
+      e.split(",").forEach((r) => {
+        const l = t.querySelector(`.dropdown-list li[data-option="${r}"]`);
+        w(l) && a.push(l);
+      }), a.length > 0 ? t.s.value = {
+        index: a.map((r) => [...t.s.allLi].indexOf(r)),
+        id: a.map((r) => r.getAttribute("data-option")),
+        el: a.map((r) => r)
+      } : t.s.value = {
+        index: [],
+        id: void 0,
+        el: void 0
+      };
+      break;
+  }
+  x(t, t.s.value.index), d(s = t, Nt, Hi).call(s), t.classList.add("d4-initialize");
+}, Nt = new WeakSet(), Hi = function() {
+  const t = this;
+  t.__events__.dropdownToggle = () => {
+    t.addEventListener("click", function(e) {
+      switch (e.stopPropagation(), t.getAttribute("d4-status")) {
+        case "open":
+          t.close();
+          break;
+        case "close":
+          t.open();
+          break;
+      }
+    });
+  }, t.__events__.transitionend = () => {
+    function e(s) {
+      if (s.target === this) {
+        const o = t.getAttribute("d4-status"), a = t.classList.contains("filter");
+        switch (o) {
+          case "open":
+            const r = t.querySelector(".dropdown-scroller"), l = () => {
+              if (t.__scroller__) {
+                const { viewport: c } = t.__scroller__.elements();
+                if (w(t.s.activeLi)) {
+                  const u = t.s.activeLi.clientHeight / 2, p = t.s.activeLi.offsetTop, g = p - r.clientHeight / 2 + u > 0 ? p - r.clientHeight / 2 + u : 0;
+                  c.scrollTo({
+                    top: g,
+                    behavior: "smooth"
+                  });
+                } else
+                  c.scrollTo({
+                    top: 0,
+                    behavior: "smooth"
+                  });
+              }
+            };
+            a && (t.querySelector(".filter-bar input").disabled = !1, t.querySelector(".filter-bar input").focus()), t.s.selectType === "single" && l();
+            break;
+          case "close":
+            t.__scroller__.update(!0), t.s.dropdownEl.removeAttribute("style"), a && (t.querySelector(".filter-bar input").disabled = !0);
+            break;
+        }
+      }
+    }
+    t.s.dropdownEl.addEventListener("transitionend", e);
+  }, t.__events__.bindScrollbar = (e = this) => {
+    const s = e.querySelector(".dropdown-scroller");
+    e.__scroller__ = Me(s, {
+      overflowBehavior: {
+        x: "hidden"
+      }
+    });
+  }, t.__events__.selectOption = (e = this) => {
+    let s, o;
+    const a = e.querySelector(".dropdown-scroller"), r = e.classList.contains("city");
+    e.s.allLi = e.querySelectorAll(".dropdown-list li"), e.s.allLi.forEach((l) => {
+      l.addEventListener("click", function(c) {
+        var m;
+        const u = this, p = [...e.s.allLi].indexOf(u), g = parseInt(e.getAttribute("d4-default-height"));
+        if (u.classList.contains("has-sublayer")) {
+          c.stopPropagation();
+          const f = u.querySelector(".sub-dropdown"), b = f.querySelector(".sub-dropdown-list"), y = parseInt(getComputedStyle(b).marginTop) + parseInt(getComputedStyle(b).marginBottom);
+          f.style.cssText = `--height: ${b.offsetHeight + y}px`;
+          const H = parseInt(f.style.cssText.replace("--height:", "").trim()), G = parseInt(getComputedStyle(a).maxHeight), S = () => {
+            s = g + e.s.subDropdownTotalH, o = s > G ? G : s, e.style.cssText = `--maxHeight: ${o}px;`, e.s.dropdownEl.style.height = `${o}px`;
+          };
+          u.classList.contains("open") ? (u.classList.remove("open"), e.s.subDropdownTotalH -= H, S()) : (u.classList.add("open"), e.s.subDropdownTotalH += H, S());
+          const R = () => {
+            e.__scroller__.update(!0), f.removeEventListener("transitionend", R);
+          };
+          f.addEventListener("transitionend", R);
+        } else
+          switch (Os(e), e.s.selectType) {
+            case "single":
+              if (e.setAttribute("d4-value", u.getAttribute("data-option")), r) {
+                const f = e.s.cityLang, b = l.textContent.trim(), y = document.getElementById(e.getAttribute("dist-select"));
+                y && (y.querySelector(".dropdown-list").textContent = "", x(y, -1), Oe[f][b].forEach((H, G) => {
+                  const S = document.createElement("li");
+                  S.textContent = H[0], S.setAttribute("data-option", H[0]), y.querySelector(".dropdown-list").append(S);
+                }), e.__events__.selectOption(y));
+              }
+              (m = u.parentNode.closest("li")) != null && m.classList.contains("has-sublayer") && (c.stopPropagation(), e.close());
+              break;
+            case "multiple":
+              c.stopPropagation(), u.classList.toggle("active"), x(e, p);
+              break;
+          }
+      });
+    });
+  }, t.__events__.filterHandler = () => {
+    t.classList.contains("filter") && (t.querySelector(".filter-bar").addEventListener("click", function(e) {
+      e.stopPropagation();
+    }), t.querySelector(".filter-input").addEventListener("input", function() {
+      const e = this.value.toUpperCase();
+      t.s.allLi.forEach((s) => {
+        s.textContent.toUpperCase().includes(e) ? s.removeAttribute("style") : s.style.display = "none";
+      });
+    }));
+  }, t.__events__.removeTag = () => {
+    t.s.selectType !== "single" && t.s.selectDisplayEl.addEventListener("click", function(e) {
+      if (e.target.classList.contains("select-display"))
+        return;
+      if ((e.target.classList.contains("option-btn") ? e.target : e.target.parentElement).contains(e.target) && (e.stopPropagation(), e.target.classList.contains("remove-icon"))) {
+        const a = e.target.parentElement.getAttribute("data-option");
+        t.s.dropdownEl.querySelector(`.dropdown-list li[data-option="${a}"]`).classList.remove("active"), t.s.activeLi = t.querySelectorAll(".dropdown-list li.active"), e.target.parentElement.remove();
+        const r = [...t.s.activeLi];
+        t.s.value = r.map((c) => ({
+          index: [...t.s.allLi].indexOf(c),
+          id: c.getAttribute("data-option"),
+          el: c
+        })), t.s.activeLi = r;
+        const l = r.map((c) => c.getAttribute("data-option"));
+        t.setAttribute("d4-value", l.join()), r.length <= 0 && (t.s.selectDisplayEl.textContent = t.getAttribute("d4-placeholder").trim());
+      }
+    });
+  }, t.__events__.dropdownToggle(), t.__events__.bindScrollbar(), t.__events__.selectOption(), t.__events__.filterHandler(), t.__events__.removeTag(), t.__events__.transitionend();
+};
+Object.assign(ki.prototype, O);
+customElements.define("dropdown-el", ki);
+function ct(n) {
+  const i = {};
+  return [...n.attributes].forEach((t) => {
+    if (t.name.includes("duration-")) {
+      const e = t.name.replace("duration-", ""), s = t.nodeValue;
+      i[e] = Number(s);
+    }
+  }), Object.keys(i).length === 0 ? null : i;
+}
+function Be(n) {
+  if (ct(n)) {
+    let i;
+    const t = Object.keys(ct(n)).map((e) => ({
+      value: e,
+      point: e
+    }));
+    t.sort((e, s) => parseInt(s.value, 10) - parseInt(e.value, 10));
+    for (let e = 0; e < t.length; e += 1) {
+      const { point: s, value: o } = t[e];
+      window.matchMedia(`(max-width: ${o}px)`).matches && (i = s);
+    }
+    return i ? Number(ct(n)[i]) : n.s.options.duration;
+  } else
+    return n.s.options.duration;
+}
+function zs(n) {
+  const { behavior: i, continual: t, gap: e } = n.s.options, s = n.childNodes, o = document.createElement("div"), a = document.createElement("div");
+  o.className = "animate-container", a.className = "animate-item", [...s].forEach((l) => {
+    a.append(l);
+  });
+  function r() {
+    const l = a.cloneNode(!0);
+    return l.classList.add("clone"), n.s.cloneAnimation = null, n.s.cloneAnimateEl = l, l;
+  }
+  n.s.animation = null, n.s.animateEl = a, n.textContent = "", o.append(a), n.append(o), a.clientWidth * 2 + e >= n.clientWidth ? i === "normal" && t && o.append(r()) : n.s.options.continual = !1;
+}
+function _(n) {
+  const { behavior: i, direction: t, continual: e } = n.s.options;
+  let s = {};
+  switch (i) {
+    case "normal":
+      let o, a;
+      switch (t) {
+        case "top":
+          o = e ? "translate3d(0,100%,0)" : `translate3d(0,${n.clientHeight}px,0)`, a = "translate3d(0,-100%,0)", s.animate1 = [{ transform: o }, { transform: a }], e && (s.animate2 = [{ transform: "translate3d(0,0,0)" }, { transform: "translate3d(0,-200%,0)" }]);
+          break;
+        case "right":
+          o = e ? "translate3d(0,0,0)" : "translate3d(-100%,0,0)", a = e ? "translate3d(200%,0,0)" : `translate3d(${n.clientWidth}px,0,0)`, s.animate1 = [{ transform: o }, { transform: a }], e && (s.animate2 = [{ transform: "translate3d(-100%,0,0)" }, { transform: "translate3d(100%,0,0)" }]);
+          break;
+        case "bottom":
+          o = "translate3d(0,-100%,0)", a = e ? "translate3d(0,100%,0)" : `translate3d(0,${n.clientHeight}px,0)`, s.animate1 = [{ transform: o }, { transform: a }], e && (s.animate2 = [{ transform: "translate3d(0,-200%,0)" }, { transform: "translate3d(0,0,0)" }]);
+          break;
+        case "left":
+          o = e ? "translate3d(100%,0,0)" : `translate3d(${n.clientWidth}px,0,0)`, a = "translate3d(-100%,0,0)", s.animate1 = [{ transform: o }, { transform: a }], e && (s.animate2 = [{ transform: "translate3d(0,0,0)" }, { transform: "translate3d(-200%,0,0)" }]);
+          break;
+      }
+      break;
+    case "alternate":
+      switch (t) {
+        case "top":
+          s.animate1 = [{ transform: `translate3d(0,calc(${n.clientHeight}px - 100%),0)` }, { transform: "translate3d(0,0,0)" }, { transform: `translate3d(0,calc(${n.clientHeight}px - 100%),0)` }];
+          break;
+        case "right":
+          s.animate1 = [{ transform: "translate3d(0,0,0)" }, { transform: `translate3d(calc(-100% + ${n.clientWidth}px),0,0)` }, { transform: "translate3d(0,0,0)" }];
+          break;
+        case "bottom":
+          s.animate1 = [{ transform: "translate3d(0,0,0)" }, { transform: `translate3d(0,calc(${n.clientHeight}px - 100%),0)` }, { transform: "translate3d(0,0,0)" }];
+          break;
+        case "left":
+          s.animate1 = [{ transform: `translate3d(calc(-100% + ${n.clientWidth}px),0,0)` }, { transform: "translate3d(0,0,0)" }, { transform: `translate3d(calc(-100% + ${n.clientWidth}px),0,0)` }];
+          break;
+      }
+      break;
+    case "endStop":
+      switch (t) {
+        case "top":
+          s.animate1 = [{ transform: `translate3d(0,${n.clientHeight}px,0)` }, { transform: "translate3d(0,0,0)" }];
+          break;
+        case "right":
+          s.animate1 = [{ transform: "translate3d(-100%,0,0)" }, { transform: "translate3d(0,0,0)" }];
+          break;
+        case "bottom":
+          s.animate1 = [{ transform: "translate3d(0,-100%,0)" }, { transform: `translate3d(0,calc(${n.clientHeight}px - 100%),0)` }];
+          break;
+        case "left":
+          s.animate1 = [{ transform: `translate3d(${n.clientWidth}px,0,0)` }, { transform: `translate3d(calc(${n.clientWidth}px - 100%),0,0)` }];
+          break;
+      }
+      break;
+  }
+  return s;
+}
+function Ws(n) {
+  let i;
+  return function(t) {
+    i && clearTimeout(i), i = setTimeout(n, 200, t);
+  };
+}
+var jt, Mi, zt, qi, Wt, Ii, Bt, Oi;
+class Bs extends HTMLElement {
+  constructor() {
+    super();
+    h(this, jt);
+    h(this, zt);
+    h(this, Wt);
+    h(this, Bt);
+    this.initialize = !1;
+  }
+  static get observedAttributes() {
+    return [];
+  }
+  attributeChangedCallback(t, e, s) {
+  }
+  connectedCallback() {
+    this.initialize || (this.initialize = !0, d(this, jt, Mi).call(this));
+  }
+  play() {
+    this.s.animation.play(), this.s.animateEl.classList.add("start"), this.s.options.continual && (this.s.cloneAnimation.play(), this.s.cloneAnimateEl.classList.add("start"));
+  }
+  pause() {
+    this.s.animation.pause(), this.s.options.continual && this.s.cloneAnimation.pause();
+  }
+}
+jt = new WeakSet(), Mi = function() {
+  const t = {
+    direction: this.getAttribute("direction") || $.SETTINGS.direction,
+    // up / down / left / right
+    behavior: this.getAttribute("behavior") || $.SETTINGS.behavior,
+    // normal / alternate / endStop
+    duration: Number(this.getAttribute("duration")) || $.SETTINGS.duration,
+    // ms
+    durationBreakpoints: ct(this) || $.SETTINGS.durationBreakpoints,
+    autoplay: this.getAttribute("autoplay") || $.SETTINGS.autoplay,
+    // normal / alternate / endStop
+    pauseOnMouseenter: this.getAttribute("pauseOnMouseEnter") ? this.getAttribute("pauseOnMouseEnter") === "true" : $.SETTINGS.pauseOnMouseenter,
+    // true / false
+    continual: this.getAttribute("continual") ? this.getAttribute("continual") === "true" : $.SETTINGS.continual,
+    // true / false
+    gap: Number(this.getAttribute("gap")) || $.SETTINGS.gap
+  };
+  this.s = {}, this.s.options = t, this.s.nowDuration = Be(this), zs(this), d(this, zt, qi).call(this);
+}, zt = new WeakSet(), qi = function() {
+  const { direction: t, continual: e, gap: s } = this.s.options;
+  switch (t) {
+    case "left":
+    case "right":
+      this.style.cssText = `--continual-gap: ${s}px;`;
+      break;
+    case "top":
+    case "bottom":
+      e ? this.style.cssText = `height: ${this.s.animateEl.clientHeight}px;--continual-gap: ${s}px;` : this.style.cssText = `min-height: ${this.s.animateEl.clientHeight}px;--continual-gap: ${s}px;`;
+      break;
+  }
+  d(this, Wt, Ii).call(this), d(this, Bt, Oi).call(this), e && this.classList.add("continual"), this.classList.add("m4-initialize");
+}, Wt = new WeakSet(), Ii = function() {
+  const t = this, { direction: e, behavior: s, duration: o, autoplay: a, pauseOnMouseenter: r, continual: l } = t.s.options;
+  let c;
+  function u() {
+    switch (s) {
+      case "normal":
+        t.s.animateEl.style.transform = `${_(t).animate1[0].transform}`, t.s.animation = t.s.animateEl.animate(_(t).animate1, {
+          duration: t.s.nowDuration,
+          iterations: 1 / 0
+        }), l && (t.s.cloneAnimateEl.style.transform = `${_(t).animate2[0].transform}`, t.s.cloneAnimation = t.s.cloneAnimateEl.animate(_(t).animate2, {
+          duration: t.s.nowDuration,
+          delay: -t.s.nowDuration / 2,
+          iterations: 1 / 0
+        }));
+        break;
+      case "alternate":
+        let m = function() {
+          let f = [];
+          switch (e) {
+            case "top":
+              p = Math.abs(t.s.animateEl.scrollHeight - t.clientHeight), g = parseInt(t.s.nowDuration / (p * 2)) * t.s.animateEl.scrollHeight, f = [{ transform: `translate3d(0,${t.clientHeight}px,0)` }, { transform: `translate3d(0,calc(${t.clientHeight}px - 100%),0)` }];
+              break;
+            case "right":
+              p = Math.abs(t.s.animateEl.scrollWidth - t.clientWidth), g = parseInt(t.s.nowDuration / (p * 2)) * t.s.animateEl.scrollWidth, f = [{ transform: "translate3d(-100%,0,0)" }, { transform: "translate3d(0,0,0)" }];
+              break;
+            case "bottom":
+              p = Math.abs(t.s.animateEl.scrollHeight - t.clientHeight), g = parseInt(o / (p * 2)) * t.s.animateEl.scrollHeight, f = [{ transform: "translate3d(0,-100%,0)" }, { transform: "translate3d(0,0,0)" }];
+              break;
+            case "left":
+              p = Math.abs(t.s.animateEl.scrollWidth - t.clientWidth), g = parseInt(o / (p * 2)) * t.s.animateEl.scrollWidth, f = [{ transform: `translate3d(${t.clientWidth}px,0,0)` }, { transform: `translate3d(calc(-100% + ${t.clientWidth}px),0,0)` }];
+              break;
+          }
+          return f;
+        }, p, g;
+        (t.clientHeight > t.s.animateEl.scrollHeight || e === "left" || e === "right") && (t.s.animateEl.style.transform = `${m()[0].transform}`, t.s.animateEl.animate(m(), {
+          duration: g,
+          fill: "forwards"
+        }).finished.then(() => {
+          t.s.animation = t.s.animateEl.animate(_(t).animate1, {
+            duration: t.s.nowDuration,
+            iterations: 1 / 0
+          });
+        })), t.s.animation && t.s.animation.ready.then(() => {
+          t.s.animateEl.classList.add("ready");
+        });
+        break;
+      case "endStop":
+        t.s.animateEl.style.transform = `${_(t).animate1[0].transform}`, t.s.animation = t.s.animateEl.animate(_(t).animate1, {
+          duration: t.s.nowDuration,
+          fill: "forwards"
+        });
+        break;
+    }
+    t.s.animateEl.classList.add("start"), a === !1 && (t.s.animateEl.classList.remove("start"), t.s.animation.cancel());
+  }
+  clearTimeout(c), c = setTimeout(
+    () => {
+      u();
+    },
+    a || 0
+  ), t.addEventListener("mouseenter", function() {
+    t.s.animation && r && t.s.animation.playState === "running" && t.pause();
+  }), t.addEventListener("mouseleave", function() {
+    t.s.animation && r && t.s.animation.playState === "paused" && t.play();
+  });
+}, Bt = new WeakSet(), Oi = function() {
+  const t = this;
+  function e() {
+    const s = t.s.animation.startTime, o = t.s.cloneAnimation ? t.s.cloneAnimation.startTime : null;
+    t.s.nowDuration = Be(t), t.s.animation.cancel(), t.s.cloneAnimation && t.s.cloneAnimation.cancel(), t.s.animation = t.s.animateEl.animate(_(t).animate1, {
+      duration: t.s.nowDuration,
+      iterations: 1 / 0
+    }), t.s.animation.startTime = s, t.s.cloneAnimation && (t.s.cloneAnimation = t.s.cloneAnimateEl.animate(_(t).animate2, {
+      duration: t.s.nowDuration,
+      delay: -t.s.nowDuration / 2,
+      iterations: 1 / 0
+    }), t.s.cloneAnimation.startTime = o);
+  }
+  window.addEventListener("resize", Ws(e));
+};
+customElements.define("marquee-el", Bs);
+const ht = function(n, i) {
+  let t;
+  return function(e) {
+    t && clearTimeout(t), t = setTimeout(n, 200, e);
+  };
+}, k = (n, i) => {
+  if (rt(n)) {
+    n.forEach((t) => {
+      t.classList.add(i);
+    });
+    return;
+  }
+  n.classList.add(i);
+}, D = (n, i) => {
+  if (rt(n)) {
+    n.forEach((t) => {
+      t.classList.remove(i);
+    });
+    return;
+  }
+  n.classList.remove(i);
+};
+var Gt, Pi, Rt, Ni, Xt, ji, tt, _e, W, dt, Ft, zi;
+class Ge {
+  constructor(i) {
+    // 初始化
+    h(this, Gt);
+    // 左右箭頭事件綁定
+    h(this, Rt);
+    // 左右拖拉事件綁定
+    h(this, Xt);
+    // 卷軸位置判斷
+    h(this, tt);
+    // 隱藏按鈕判斷
+    h(this, W);
+    // 選項事件綁定
+    h(this, Ft);
+    this.$element = i, this.option = i.s.option.drag, d(this, Gt, Pi).call(this);
+  }
+  // 更新 active 位置
+  update(i) {
+    const t = this.$element.querySelector(".wrapper"), e = t == null ? void 0 : t.querySelector(".active");
+    if (e) {
+      const s = e.offsetLeft + e.getBoundingClientRect().width / 2 - t.getBoundingClientRect().width / 2;
+      t.scrollTo({
+        left: s,
+        behavior: "smooth"
+      });
+    }
+  }
+}
+Gt = new WeakSet(), Pi = function() {
+  var e, s, o, a, r, l;
+  const i = this;
+  if (!i.$element)
+    return;
+  i.$container = i.$element.querySelector(".drag-container"), i.$wrapper = i.$container.querySelector(".wrapper");
+  const t = () => {
+    var c, u;
+    d(c = i, tt, _e).call(c), d(u = i, W, dt).call(u);
+  };
+  i.$wrapper.removeEventListener("scroll", t), i.$wrapper.addEventListener("scroll", t), window.removeEventListener("resize", ht(t)), window.addEventListener("resize", ht(t)), (i.option.draggable || i.$element.s.type == "collapse") && d(e = i, Xt, ji).call(e), i.option.navigation && i.$element.s.type !== "collapse" && (i.$container.insertAdjacentHTML(
+    E.prepend,
+    `<div class="navigation">
+        <div class="button prev">
+          <div></div>
+        </div>
+        <div class="button next">
+          <div></div>
+        </div>
+      </div>`
+  ), i.$button = (s = i.$container) == null ? void 0 : s.querySelectorAll(".button"), d(o = i, Rt, Ni).call(o)), d(a = i, tt, _e).call(a), d(r = i, W, dt).call(r), d(l = i, Ft, zi).call(l), i.update();
+}, Rt = new WeakSet(), Ni = function() {
+  const i = this, { $wrapper: t, $button: e } = i, s = function() {
+    const o = this.classList.contains("next"), a = parseInt(t.getBoundingClientRect().width * 0.7);
+    t.scrollTo({
+      left: o ? t.scrollLeft + a : t.scrollLeft - a,
+      behavior: "smooth"
+    }), setTimeout(() => {
+      var r;
+      d(r = i, W, dt).call(r);
+    }, 100);
+  };
+  e.forEach((o) => {
+    o.removeEventListener("click", s), o.addEventListener("click", s);
+  });
+}, Xt = new WeakSet(), ji = function() {
+  const { $wrapper: i } = this;
+  let t = !1, e = !1, s = 0, o = 0;
+  const a = function(p) {
+    p.preventDefault(), e = !1, t = !0, s = p.pageX - i.offsetLeft, o = i.scrollLeft;
+  };
+  i.removeEventListener("mousedown", a), i.addEventListener("mousedown", a);
+  const r = function() {
+    e = !1, t = !1;
+  };
+  i.removeEventListener("mouseleave", r), i.addEventListener("mouseleave", r);
+  const l = function(p) {
+    p.preventDefault(), t = !1;
+  };
+  i.removeEventListener("mouseup", l), i.addEventListener("mouseup", l);
+  const c = function(p) {
+    if (p.preventDefault(), e = !0, !t)
+      return;
+    const m = p.pageX - i.offsetLeft - s;
+    i.scrollTo({
+      left: o - m
+    });
+  };
+  i.removeEventListener("mousemove", c), i.addEventListener("mousemove", c);
+  const u = function(p) {
+    e && (p.preventDefault(), p.stopPropagation());
+  };
+  i.querySelectorAll("a").forEach((p) => {
+    p.removeEventListener("click", u), p.addEventListener("click", u);
+  });
+}, tt = new WeakSet(), _e = function() {
+  const { $container: i, $wrapper: t } = this, e = t.scrollWidth - t.clientWidth, s = t.scrollLeft;
+  e <= 0 || (k(i, "scrollable"), s == 0 ? (D(i, "scrollable"), k(t, "start"), D(t, "end")) : s >= e ? (D(i, "scrollable"), D(t, "start"), k(t, "end")) : (k(t, "center"), D(t, "start"), D(t, "end")));
+}, W = new WeakSet(), dt = function() {
+  const { $wrapper: i, $button: t, $element: e } = this;
+  if (!t)
+    return;
+  const s = i.scrollWidth - i.clientWidth, o = i.scrollLeft;
+  if (s <= 0) {
+    k(t, "hide"), D(t, "active"), k(e, "noScrollable");
+    return;
+  }
+  s > 0 && (k(t, "active"), D(e, "noScrollable")), o == 0 ? t.forEach((a) => {
+    if (a.classList.contains("next")) {
+      D(a, "hide");
+      return;
+    }
+    k(a, "hide");
+  }) : o >= s ? t.forEach((a) => {
+    if (a.classList.contains("next")) {
+      k(a, "hide");
+      return;
+    }
+    D(a, "hide");
+  }) : D(t, "hide");
+}, Ft = new WeakSet(), zi = function() {
+  const { $element: i } = this, t = (s) => {
+    if (this.option.selected) {
+      const o = s.getAttribute("data-option").trim();
+      i.setAttribute("m4-status", o);
+    }
+  };
+  function e() {
+    t(this);
+  }
+  this.$container.querySelectorAll(".item").forEach((s) => {
+    s.removeEventListener("click", e), s.addEventListener("click", e);
+  });
+};
+var Yt, Wi, Ut, Bi, Jt, Gi, Zt, Ri;
+class Gs {
+  constructor(i) {
+    // 初始化
+    h(this, Yt);
+    // 隱藏按鈕判斷
+    h(this, Ut);
+    // 展開箭頭事件綁定
+    h(this, Jt);
+    // 選項事件綁定
+    h(this, Zt);
+    this.$element = i, this.option = i.s.option.collapse, d(this, Yt, Wi).call(this);
+  }
+}
+Yt = new WeakSet(), Wi = function() {
+  this.$element && (this.$container = this.$element.querySelector(".collapse-container"), this.$wrapper = this.$container.querySelector(".wrapper"), d(this, Ut, Bi).call(this) && d(this, Jt, Gi).call(this), d(this, Zt, Ri).call(this));
+}, Ut = new WeakSet(), Bi = function() {
+  const i = this.$element.querySelector(".drag-container"), t = i.querySelector(".wrapper");
+  return t.scrollWidth - t.clientWidth > 0 ? (i.insertAdjacentHTML(E.append, '<div class="open-collapse"></div>'), this.$button = i.querySelector(".open-collapse"), !0) : !1;
+}, Jt = new WeakSet(), Gi = function() {
+  const { $element: i, $button: t } = this, e = function() {
+    i.classList.contains("expand") ? i.classList.remove("expand") : i.classList.add("expand");
+  };
+  t.removeEventListener("click", e), t.addEventListener("click", e);
+}, Zt = new WeakSet(), Ri = function() {
+  const { $element: i } = this, t = (s, o) => {
+    if (i != null && i.classList.contains("expand") ? i == null || i.classList.remove("expand") : i == null || i.classList.add("expand"), this.option.selected) {
+      const a = s.getAttribute("data-option").trim();
+      i.setAttribute("m4-status", a);
+    }
+  };
+  function e() {
+    t(this);
+  }
+  this.$container.querySelectorAll(".item").forEach((s) => {
+    s.removeEventListener("click", e), s.addEventListener("click", e);
+  });
+};
+const Rs = (n) => {
+  const { type: i, option: t, originalDomString: e } = n.s, s = document.createElement("div");
+  return i == "drag" && (s.innerHTML = C.TEMPLATE[i]().trim(), s.querySelector(".drag-container .wrapper").insertAdjacentHTML(E.append, e)), i == "collapse" && (s.innerHTML = C.TEMPLATE[i](t == null ? void 0 : t.collapse).trim(), s.querySelector(".drag-container .wrapper").insertAdjacentHTML(E.append, e), s.querySelector(".collapse-container .wrapper").insertAdjacentHTML(E.append, e)), i == "dropdown" && (s.innerHTML = C.TEMPLATE[i](t == null ? void 0 : t.dropdown).trim(), s.querySelector("dropdown-el").insertAdjacentHTML(E.append, e)), s.children;
+};
+var Qt, Xi, Vt, Fi, et, ke, B, ut;
+class Xs extends HTMLElement {
+  constructor() {
+    super();
+    h(this, Qt);
+    h(this, Vt);
+    // 斷點設定
+    h(this, et);
+    // check type
+    h(this, B);
+    this.initialize = !1, this.__events__ = {}, this.s = {}, this.s.originalDomString = this.innerHTML.trim().replace(/\n/g, ""), this.previousWidth = window.innerWidth;
+  }
+  static get observedAttributes() {
+    return ["m4-type", "m4-status"];
+  }
+  attributeChangedCallback(t, e, s) {
+    var o, a, r;
+    switch (t) {
+      case "m4-type":
+        if (e === null || e === s)
+          return;
+        this.s.type = s, d(this, B, ut).call(this);
+        break;
+      case "m4-status":
+        if (e === s)
+          return;
+        const l = this.getAttribute("m4-type");
+        if (l !== "drag" && l !== "collapse")
+          return;
+        this.querySelectorAll(".drag-container .item").forEach((c) => {
+          c.classList.remove("active");
+        }), (o = this.querySelector(`.drag-container .item[data-option="${s}"]`)) == null || o.classList.add("active"), l === "collapse" && (this.querySelectorAll(".collapse-container .item").forEach((c) => {
+          c.classList.remove("active");
+        }), (a = this.querySelector(`.collapse-container .item[data-option="${s}"]`)) == null || a.classList.add("active")), (r = this.constructor.drag) == null || r.update(this);
+        break;
+    }
+  }
+  connectedCallback() {
+    this.initialize || this.classList.contains("m4-init") || (this.initialize = !0, d(this, Qt, Xi).call(this));
+  }
+  update() {
+    d(this, et, ke).call(this);
+  }
+}
+Qt = new WeakSet(), Xi = function() {
+  let t = {};
+  this.hasAttribute("m4-value") || this.setAttribute("m4-value", ""), this.s.type = this.getAttribute("m4-type") ?? C.SETTINGS.type, this.hasAttribute("m4-option") && (t = this.getAttribute("m4-option") ? JSON.parse(this.getAttribute("m4-option")) : {}, this.removeAttribute("m4-option"));
+  const e = (s) => {
+    if (s.type === "resize") {
+      if (window.innerWidth === this.previousWidth)
+        return;
+      this.previousWidth = window.innerWidth;
+    }
+    this.update();
+  };
+  window.removeEventListener("resize", ht(e)), window.addEventListener("resize", ht(e)), this.s.option = {}, this.s.option.drag = Object.assign({}, C.SETTINGS.drag, t == null ? void 0 : t.drag), this.s.option.collapse = Object.assign({}, C.SETTINGS.collapse, t == null ? void 0 : t.collapse), this.s.option.dropdown = Object.assign({}, C.SETTINGS.dropdown, t == null ? void 0 : t.dropdown), this.s.option.breakpoint = Object.assign({}, C.SETTINGS.breakpoint, t == null ? void 0 : t.breakpoint), d(this, Vt, Fi).call(this);
+}, Vt = new WeakSet(), Fi = function() {
+  this.classList.add("m4-init"), d(this, et, ke).call(this);
+}, et = new WeakSet(), ke = function() {
+  const t = Object.keys(this.s.option.breakpoint);
+  if (!t.length) {
+    d(this, B, ut).call(this);
+    return;
+  }
+  t.map((e) => Number(e)).sort((e, s) => s - e).some((e) => {
+    var s, o, a, r;
+    return window.innerWidth >= e && (this.s.type = (s = this.s.option.breakpoint[e]) == null ? void 0 : s.type, this.setAttribute("m4-type", this.s.type), this.s.option.drag = Object.assign({}, this.s.option.drag, (o = this.s.option.breakpoint[e]) == null ? void 0 : o.drag), this.s.option.collapse = Object.assign({}, this.s.option.collapse, (a = this.s.option.breakpoint[e]) == null ? void 0 : a.collapse), this.s.option.dropdown = Object.assign({}, this.s.option.dropdown, (r = this.s.option.breakpoint[e]) == null ? void 0 : r.dropdown)), d(this, B, ut).call(this), window.innerWidth >= e;
+  });
+}, B = new WeakSet(), ut = function() {
+  var o;
+  const { type: t } = this.s;
+  this.innerHTML = "", [...Rs(this)].forEach((a) => {
+    this.append(a);
+  });
+  const e = this.querySelector(`.drag-container .item[data-option="${this.getAttribute("m4-status")}"]`), s = this.querySelector(`.collapse-container .item[data-option="${this.getAttribute("m4-status")}"]`);
+  switch (e == null || e.classList.add("active"), s == null || s.classList.add("active"), t) {
+    case "drag":
+      setTimeout(() => {
+        this.constructor.drag = new Ge(this);
+      }, 10);
+      break;
+    case "collapse":
+      setTimeout(() => {
+        this.constructor.drag = new Ge(this), this.constructor.collapse = new Gs(this);
+      }, 10);
+      break;
+  }
+  (o = this.constructor.drag) == null || o.update(this);
+};
+customElements.define("multipurpose-nav", Xs);
+var Kt, Ui, te, Ji, it, $e, N, F, ee, Zi, ie, Qi, se, Vi, ne, Ki, oe, ts, ae, es, re, is, le, ss, ce, ns, q, z, de, os, ue, as, he, rs, pe, ls;
+class Yi extends HTMLElement {
+  // 定義組件的初始狀態
+  constructor(t, e) {
+    super();
+    h(this, Kt);
+    h(this, te);
+    // 第一關 判斷數量以及id設定
+    h(this, it);
+    // 第二關 id命名提醒
+    h(this, N);
+    h(this, ee);
+    h(this, ie);
+    h(this, se);
+    // 執行函式
+    // 移動至指定位置
+    h(this, ne);
+    // 移動
+    h(this, oe);
+    // 步驟狀態
+    h(this, ae);
+    // next 按鈕狀態
+    h(this, re);
+    // prev 按鈕狀態
+    h(this, le);
+    // 頁籤狀態
+    h(this, ce);
+    // 第三關各種元件判斷 及 執行
+    h(this, q);
+    // 消失動畫
+    h(this, de);
+    // 出現動畫
+    h(this, ue);
+    // 狀態
+    h(this, he);
+    // resize
+    h(this, pe);
+  }
+  // 當組件的屬性被更改時會被呼叫
+  static get observedAttributes() {
+    return ["t4-active"];
+  }
+  attributeChangedCallback(t, e, s) {
+    t === "t4-active" && e !== s && d(this, he, rs).call(this, s);
+  }
+  connectedCallback() {
+    this.classList.contains("t4-initialize") || d(this, Kt, Ui).call(this);
+  }
+  //  ------------- 我是分隔線呦 -------------
+  // 頁籤切換
+  tabClick(t) {
+    const { t: e } = this, s = e.tabs.indexOf(t) % e.tabPanels.length, o = e.tabGroup === "true" ? String(s) : t.getAttribute("t4-id");
+    this.setActiveTab(o), setTimeout(() => {
+      d(this, q, z).call(this, "eventAnchor");
+    }, e.transition.duration);
+  }
+  // 外部呼叫方法 $0.setActiveTab(0)
+  setActiveTab(t) {
+    const { t: e } = this, s = t === "" ? e.tabPanels[0].getAttribute("t4-id") : t;
+    e.activeTab = s, this.setAttribute("t4-active", s);
+    const o = d(this, N, F).call(this, s);
+    e.tabPanels.forEach((a, r) => {
+      r === o ? d(this, ue, as).call(this, r) : d(this, de, os).call(this, r);
+    });
+  }
+  // 外部呼叫方法 $0.goNext()
+  goNext() {
+    const t = d(this, N, F).call(this, this.t.activeTab), e = Math.min(this.t.tabPanels.length - 1, t + 1), s = this.t.tabPanels[e].getAttribute("t4-id");
+    this.setActiveTab(s);
+  }
+  // 外部呼叫方法 $0.goPrev()
+  goPrev() {
+    const t = d(this, N, F).call(this, this.t.activeTab), e = Math.max(0, t - 1), s = this.t.tabPanels[e].getAttribute("t4-id");
+    this.setActiveTab(s);
+  }
+  // 外部呼叫方法 $0.update()
+  update() {
+    this.t.tabs = d(this, it, $e).call(this), cs(), console.log("tab update!!!!");
+  }
+}
+Kt = new WeakSet(), Ui = function() {
+  const t = this.getAttribute("t4-name"), { SETTINGS: e } = Ue;
+  document.querySelectorAll(`tab-el[t4-name=${t}]`).length > 1 && console.warn(t, "名字有重複喔！！！"), this.t = {
+    tabs: [],
+    name: t,
+    tabPanels: [...this.children],
+    activeTab: "",
+    stepOutput: e.stepOutput,
+    recordUrl: this.getAttribute("t4-url") || e.recordUrl,
+    type: this.getAttribute("t4-type") || e.type,
+    display: this.getAttribute("t4-display") || e.display,
+    defaultPage: this.getAttribute("t4-defaultPage") || e.defaultPage,
+    anchor: this.getAttribute("t4-anchor"),
+    gap: this.getAttribute("t4-gap") || e.anchorGap,
+    transition: {
+      duration: this.getAttribute("t4-duration") || e.transition.duration,
+      timing: this.getAttribute("t4-timing") || e.transition.timing,
+      delay: this.getAttribute("t4-delay") || e.transition.delay
+    },
+    tabGroup: this.getAttribute("t4-group") || e.tabGroup
+  }, this.__events__ = {}, this.t.tabs = d(this, it, $e).call(this), this.t.step = document.querySelector(`[t4-control="${this.t.name}"]${this.t.stepOutput}`), d(this, te, Ji).call(this);
+}, te = new WeakSet(), Ji = function() {
+  if (this.t.activeTab = this.t.defaultPage, this.t.display === "swiper" && d(this, ee, Zi).call(this), this.t.recordUrl) {
+    const e = new URLSearchParams(document.location.search).get(this.t.name), s = document.querySelectorAll(`[t4-name="${this.t.name}"] .tab-panel[t4-id="${e}"]`);
+    e && s.length === 1 ? this.t.activeTab = e : console.warn(`沒有${e}這頁喔！！`);
+  }
+  this.setActiveTab(this.t.activeTab), this.classList.add("t4-initialize"), d(this, pe, ls).call(this);
+}, it = new WeakSet(), $e = function() {
+  const { t } = this, e = Array.from(document.querySelectorAll(`[t4-control="${t.name}"][t4-role="tab"]`));
+  return t.type === "normal" && t.tabGroup === "true" && t.tabPanels.length !== e.length && console.warn("按鈕與內容數量不同喔", t.tabPanels.length, e.length), t.tabGroup === "true" ? t.tabPanels.forEach((s, o) => s.setAttribute("t4-id", o)) : t.tabPanels.forEach((s) => {
+    s.getAttribute("t4-id") || console.warn(s, "請幫我設定id！！");
+  }), e;
+}, N = new WeakSet(), F = function(t) {
+  const { t: e } = this, s = e.tabPanels.filter((a) => a.getAttribute("t4-id") === t);
+  s.length > 1 && console.warn("有兩個相同id設定", s);
+  const o = s[0];
+  return o ? e.tabPanels.indexOf(o) : (console.warn(`找不到t4-id為${t}的頁籤`), 0);
+}, ee = new WeakSet(), Zi = function() {
+  const t = document.createElement("div");
+  t.classList.add("swiper-container");
+  const e = document.createElement("div");
+  e.classList.add("swiper-wrapper"), this.t.tabPanels.forEach((s) => {
+    e.appendChild(s.cloneNode(!0));
+  }), this.t.tabPanels = [...e.children], t.appendChild(e), this.innerHTML = "", this.appendChild(t), d(this, ie, Qi).call(this);
+}, ie = new WeakSet(), Qi = function() {
+  const t = this.querySelector(".swiper-container"), e = this.querySelector(".swiper-wrapper"), s = this.t.tabPanels;
+  t.style.overflow = "hidden", e.style.display = "flex";
+  const o = s.length * 100 + "%";
+  e.style.width = o;
+}, se = new WeakSet(), Vi = function(t) {
+  const { t: e } = this;
+  if (e.recordUrl === "true") {
+    const s = new URLSearchParams(document.location.search);
+    s.set(e.name, t);
+    const o = `${window.location.pathname}?${s.toString()}`;
+    history.replaceState({ t4Id: t }, "", o);
+  }
+}, ne = new WeakSet(), Ki = function() {
+  const t = parseInt(this.t.gap, 10), e = window.pageYOffset, o = this.getBoundingClientRect().top + e - t;
+  d(this, oe, ts).call(this, o);
+}, oe = new WeakSet(), ts = function(t) {
+  window.scrollTo({
+    top: t,
+    behavior: "smooth"
+  });
+}, ae = new WeakSet(), es = function(t) {
+  let e = parseInt(t, 10) + 1;
+  this.t.step.textContent = `${e}`, this.t.step.setAttribute("now-page", e);
+}, re = new WeakSet(), is = function(t) {
+  const e = document.querySelectorAll(`[t4-role="next"][t4-control="${this.t.name}"]`), s = this.t.tabPanels.length === 1, o = t === this.t.tabPanels.length - 1;
+  e.forEach((a) => {
+    s || o ? a.setAttribute("disabled", "") : a.removeAttribute("disabled");
+  });
+}, le = new WeakSet(), ss = function(t) {
+  const e = document.querySelectorAll(`[t4-role="prev"][t4-control="${this.t.name}"]`), s = this.t.tabPanels.length === 1, o = t === 0;
+  e.forEach((a) => {
+    s || o ? a.setAttribute("disabled", "") : a.removeAttribute("disabled");
+  });
+}, ce = new WeakSet(), ns = function(t, e) {
+  this.t.tabGroup === "true" ? this.t.tabs.forEach((s, o) => {
+    o == t ? s.setAttribute("aria-selected", !0) : s.setAttribute("aria-selected", !1);
+  }) : this.t.tabs.forEach((s, o) => {
+    s.getAttribute("t4-id") === e ? s.setAttribute("aria-selected", !0) : s.setAttribute("aria-selected", !1);
+  });
+}, q = new WeakSet(), z = function(t, e, s) {
+  switch (t) {
+    case "step":
+      ye(this.t.step) && d(this, ae, es).call(this, e);
+      break;
+    case "eventAnchor":
+      this.t.anchor && d(this, ne, Ki).call(this);
+      break;
+    case "tabState":
+      this.t.type == "normal" && d(this, ce, ns).call(this, e, s);
+      break;
+    case "btnState":
+      d(this, re, is).call(this, e), d(this, le, ss).call(this, e);
+      break;
+    case "tabUrl":
+      this.t.recordUrl === "true" && d(this, se, Vi).call(this, e);
+      break;
+    default:
+      console.warn("請增加判斷，謝謝");
+      break;
+  }
+}, de = new WeakSet(), os = function(t) {
+  const { t: e } = this;
+  this.t.transition;
+  const s = e.tabPanels[t];
+  switch (s.classList.remove("show"), s.classList.add("hide"), e.display) {
+    case "fade":
+      s.style.cssText = "display: none; opacity: 0;";
+      break;
+    case "slide":
+      s.style.cssText = "display: none; opacity: 0; max-height: unset;";
+      break;
+    case "swiper":
+      break;
+    default:
+      s.style.display = "none";
+      break;
+  }
+}, ue = new WeakSet(), as = function(t) {
+  const { duration: e, timing: s, delay: o } = this.t.transition, a = this.t.tabPanels[t];
+  let r;
+  switch (a.classList.add("show"), a.classList.remove("hide"), a.style.transition = `opacity ${e}ms ${s} ${o}ms`, a.style.display = "block", this.t.display) {
+    case "fade":
+      a.style.opacity = "0", r = setTimeout(() => {
+        clearTimeout(r), a.style.opacity = "1";
+      }, 100);
+      break;
+    case "slide":
+      console.warn(this.t.display, "抱歉，好像壞掉了...");
+      const l = a.offsetHeight;
+      a.style.opacity = "1", a.style.maxHeight = "0", r = setTimeout(() => {
+        clearTimeout(r), a.style.maxHeight = l + "px";
+      }, 100);
+      break;
+    case "swiper":
+      a.style.opacity = "1";
+      const c = this.querySelector(".swiper-wrapper"), u = this.t.tabPanels[0].offsetWidth, p = -t * u;
+      c.style.transition = `transform ${e}ms ${s} ${o}ms`, c.style.transform = `translateX(${p}px)`;
+      break;
+    default:
+      console.warn(this.t.display, "沒有這個效果請自己想辦法!!!!");
+      break;
+  }
+}, he = new WeakSet(), rs = function(t) {
+  const e = d(this, N, F).call(this, t);
+  d(this, q, z).call(this, "step", e), d(this, q, z).call(this, "btnState", e), d(this, q, z).call(this, "tabState", e, t), d(this, q, z).call(this, "tabUrl", t), this.emit("change");
+}, pe = new WeakSet(), ls = function() {
+  const t = this;
+  window.addEventListener(
+    "resize",
+    Fs(() => {
+      t.update();
+    }, 1e3)
+  );
+};
+function Fs(n, i = 1e3) {
+  let t;
+  return function(e) {
+    t && clearTimeout(t), t = setTimeout(n, i, e);
+  };
+}
+function cs() {
+  const n = document.querySelectorAll("[t4-control]");
+  document.addEventListener("click", function(i) {
+    let t = !1;
+    for (const e of n)
+      if (e.contains(i.target) || i.target.closest("[t4-control]") === e) {
+        t = !0;
+        break;
+      }
+    if (t) {
+      const e = i.target.closest("[t4-control]"), s = e.getAttribute("t4-control"), o = document.querySelectorAll(`tab-el[t4-name="${s}"]`), a = e.getAttribute("t4-role");
+      o.forEach((r) => {
+        switch (a) {
+          case "tab":
+            r.tabClick(e);
+            break;
+          case "next":
+            r.goNext(e);
+            break;
+          case "prev":
+            r.goPrev(e);
+            break;
+          default:
+            console.warn("你是誰？？", e);
+            break;
+        }
+      });
+    }
+  });
+}
+cs();
+Object.assign(Yi.prototype, O);
+customElements.define("tab-el", Yi);
+const Re = (n) => {
+  const { defaultOptions: i } = n.collapse, { collapseClass: t, target: e, transition: s } = i, o = n.querySelector(e);
+  n.classList.add(t), o.style.height = 0, o.style["transition-property"] = s.property, o.style["transition-duration"] = s.duration, o.style["transition-timing-function"] = s.function, o.style["transition-delay"] = s.delay, o.style.overflow = "hidden";
+}, Ys = (n) => {
+  const { defaultOptions: i } = n.collapse, { collapseClass: t, target: e, transition: s } = i, o = n.querySelector(e), a = o.children[0].offsetHeight;
+  n.collapse.height = a, n.classList.remove(t), o.style.display = "block", o.style.height = `${a}px`, o.style["transition-property"] = s.property, o.style["transition-duration"] = s.duration, o.style["transition-timing-function"] = s.function, o.style["transition-delay"] = s.delay, o.style.overflow = "hidden";
+};
+var st, xe, me, ds, ge, us, nt, Ce;
+class Us {
+  constructor(i, t = {}) {
+    h(this, st);
+    h(this, me);
+    h(this, ge);
+    h(this, nt);
+    !at(i) && !ye(i) && !rt(i) && !w(i) || (this.__storage__ = {
+      el: i,
+      options: t
+    }, this.active = "data-collapse-active", d(this, st, xe).call(this));
+  }
+  update() {
+    d(this, st, xe).call(this);
+  }
+}
+st = new WeakSet(), xe = function() {
+  const { el: i, options: t } = this.__storage__, { SETTINGS: e, EVENTS: s } = Je;
+  if (this.elements = t.state == "not active" ? L(i + `:not([${this.active}])`) : L(i), this.options = Object.assign({}, e, t), this.__events__ = Object.assign({}, s), this.options.on)
+    for (const [o, a] of Object.entries(this.options.on))
+      this.__events__[o] = [a];
+  d(this, me, ds).call(this);
+}, me = new WeakSet(), ds = function() {
+  const { elements: i, options: t } = this;
+  i.forEach((e) => {
+    e.collapse = {}, e.collapse.instance = this, e.collapse.defaultOptions = t, e.collapse.methods = {}, e.collapse.methods.update = this.update, e.setAttribute(this.active, ""), d(this, ge, us).call(this, e);
+  }), this.emit("init");
+}, ge = new WeakSet(), us = function(i) {
+  const { options: t } = this, { collapseClass: e, block: s, target: o, defaultOpen: a, targetStopPropagation: r, defaultActiveMark: l } = t, c = i, u = c.querySelector(o);
+  if (c.collapse.height = u.children[0].offsetHeight, a ? (u.style.height = `${u.children[0].offsetHeight}px`, c.classList.remove(e)) : !c.classList.contains(l) && !c.hasAttribute(l) ? (c.classList.add(e), u.style.height = "0px", u.style.overflow = "hidden") : (u.style.height = `${u.children[0].offsetHeight}px`, c.classList.remove(e)), c.removeEventListener("click", d(this, nt, Ce)), c.addEventListener("click", d(this, nt, Ce)), r) {
+    const p = (g) => {
+      g.stopPropagation();
+    };
+    u.removeEventListener("click", p), u.addEventListener("click", p);
+  }
+}, nt = new WeakSet(), Ce = function() {
+  const { instance: i, defaultOptions: t } = this.collapse, { collapseClass: e, block: s, target: o, single: a } = t, r = this;
+  r.classList.contains(e) ? (a && r.parentNode.querySelectorAll(`.${r.classList[0]}`).forEach((l) => {
+    Re(l);
+  }), Ys(r)) : Re(r), i.emit("afterCollapse");
+};
+Object.assign(Us.prototype, O);
+function Js(n, i) {
+  const t = i, { color: e, opacity: s, duration: o } = i.s.options;
+  let a = document.createElement("span"), r = n.clientX - t.getBoundingClientRect().left, l = n.clientY - t.getBoundingClientRect().top;
+  a.style.cssText = `background: ${e};left: ${r}px;top: ${l}px;opacity: ${s};animation-duration: ${o}ms`, a.classList.add("circle"), t.appendChild(a), setTimeout(function() {
+    a.remove();
+  }, `${o}`);
+}
+function hs() {
+  document.querySelectorAll("ripple-btn").forEach((n) => {
+    n.querySelector(".hover-ball"), n.style.setProperty("--r", ""), n.classList.remove("entered");
+  });
+}
+document.addEventListener("click", hs);
+var ot, He, fe, ps, ve, ms, be, gs;
+class Zs extends HTMLElement {
+  constructor() {
+    super();
+    h(this, ot);
+    h(this, fe);
+    h(this, ve);
+    h(this, be);
+    this.initialize = !1;
+  }
+  connectedCallback() {
+    const t = this;
+    t.initialize || t.classList.contains("r4-initialize") || (t.initialize = !0, d(this, ot, He).call(this));
+  }
+  update() {
+    this.classList.remove("r4-initialize"), this.querySelector("i.hover-ball").remove(), d(this, ot, He).call(this);
+  }
+}
+ot = new WeakSet(), He = function() {
+  const { SETTINGS: t } = Ze;
+  this.s = {};
+  function e(o) {
+    let a = !!o;
+    return a = o === "true", a;
+  }
+  const s = {
+    color: this.getAttribute("r4-color") || t.color,
+    opacity: this.getAttribute("r4-opacity") || t.opacity,
+    duration: Number(this.getAttribute("r4-duration")) || t.duration,
+    speed: Number(this.getAttribute("r4-speed")) || t.speed,
+    hover: this.getAttribute("r4-hover") ? e(this.getAttribute("r4-hover")) : t.hover,
+    click: this.getAttribute("r4-hover-click") ? e(this.getAttribute("r4-hover-click")) : t.click
+  };
+  this.s.options = s, this.s.options.hover && this.classList.add("hover-btn"), d(this, fe, ps).call(this);
+}, fe = new WeakSet(), ps = function() {
+  d(this, ve, ms).call(this), d(this, be, gs).call(this), this.classList.add("r4-initialize");
+}, ve = new WeakSet(), ms = function() {
+  const t = this, e = document.createElement("i");
+  e.classList.add("hover-ball"), e.style.transitionDuration = `${t.s.options.speed}ms`, t.appendChild(e);
+}, be = new WeakSet(), gs = function() {
+  const t = this.querySelector("i.hover-ball"), e = this;
+  e.addEventListener("click", function(a) {
+    a.stopPropagation(), e.s.options.click && Js(a, e);
+  });
+  let s = "ontouchstart" in document.documentElement ? "touchstart" : "mouseenter", o = "ontouchend" in document.documentElement ? "touchend" : "mouseleave";
+  e.addEventListener(s, function(a) {
+    if (s === "touchstart" && hs(), e.s.options.hover) {
+      const r = Math.round(s === "mouseenter" ? a.clientX - e.getBoundingClientRect().left : a.changedTouches[0].clientX - e.getBoundingClientRect().x), l = Math.round(s === "mouseenter" ? a.clientY - e.getBoundingClientRect().top : a.changedTouches[0].clientY - e.getBoundingClientRect().y), { offsetWidth: c, offsetHeight: u } = e, p = Math.ceil(Math.sqrt(c ** 2 + u ** 2) * 2);
+      e.style.setProperty("--r", p), t.style.left = r + "px", t.style.top = l + "px", e.classList.add("entered");
+    }
+  }), e.addEventListener(o, function(a) {
+    if (o !== "touchend" && e.s.options.hover) {
+      const r = Math.round(o === "mouseleave" ? a.clientX - e.getBoundingClientRect().left : a.changedTouches[0].clientX - e.getBoundingClientRect().x), l = Math.round(o === "mouseleave" ? a.clientY - e.getBoundingClientRect().top : a.changedTouches[0].clientY - e.getBoundingClientRect().y);
+      e.style.setProperty("--r", ""), t.style.left = r + "px", t.style.top = l + "px", e.classList.remove("entered");
+    }
+  });
+};
+customElements.define("ripple-btn", Zs);
+class Qs {
+  constructor() {
+    this.init();
+  }
+  init() {
+    const i = document.querySelectorAll("*:not([video-id]) > img"), t = (o, a) => {
+      const r = document.createElement("div"), l = document.createElement("span"), c = document.createElement("span"), u = Math.sqrt(o ** 2 + a ** 2), p = Math.asin(a / u) * 180 / Math.PI;
+      return r.className = "no-image", l.className = "slash1", l.style.cssText = `
+          width: ${u}px;
+          transform: rotate(${p}deg);
+        `, c.className = "slash2", c.style.cssText = `
+          width: ${u}px;
+          transform: rotate(${-p}deg);
+        `, r.appendChild(l), r.appendChild(c), r;
+    }, e = document.querySelectorAll(".error-image");
+    for (let o = 0; o < e.length; o++)
+      e[o].remove();
+    i.forEach((o) => {
+      let a;
+      const r = o.parentElement.clientWidth, l = o.parentElement.clientHeight;
+      if (o.classList.contains("lazy") || o.classList.contains("swiper-lazy") ? a = o.getAttribute("data-src") : a = o.getAttribute("src"), a === "") {
+        const c = document.createElement("div"), u = getComputedStyle(o.parentElement).position;
+        c.className = "error-image", u === "static" && (o.parentElement.style.position = "relative"), o.parentElement.appendChild(c), c.style.cssText = `
+          position: absolute;
+          top: 50%;
+          left: 50%;
+          width: 100%;
+          height: 100%;
+          transform: translate(-50%,-50%);
+          z-index: 1;
+        `, c.appendChild(t(r, l));
+      }
+    });
+    function s() {
+      const o = document.querySelectorAll(".no-image");
+      o.length <= 0 || o.forEach((a) => {
+        const r = a.parentElement.clientWidth, l = a.parentElement.clientHeight, c = Math.sqrt(r ** 2 + l ** 2), u = Math.asin(l / c) * 180 / Math.PI;
+        a.querySelector(".slash1").style.cssText = `
+          width: ${c}px;
+          transform: rotate(${u}deg);
+        `, a.querySelector(".slash2").style.cssText = `
+          width: ${c}px;
+          transform: rotate(${-u}deg);
+        `;
+      });
+    }
+    window.addEventListener("resize", s);
+  }
+  reValidate() {
+    this.init();
+  }
+}
+function Xe(n, i) {
+  return n ? function(t, e) {
+    Function(n)(t, e);
+  } : i;
+}
+function Vs(n, i, t, e) {
+  const s = i.params, o = n.closest("[data-upload-item]").querySelector("[data-preview]");
+  o.querySelector("img") && o.querySelector("img").remove(), o.appendChild(e.imgElement);
+  const a = n.dataset.group, r = document.querySelector(i.el).dataset.index;
+  if (s.compress) {
+    const l = t.name.substring(t.name.lastIndexOf(".")).replace("."), c = t.name.replace(`.${l}`, "");
+    e.originalCanvas.toBlob(
+      function(u) {
+        const p = new File([u], `${c}`, { type: t.type });
+        uploadImage[`${a}`][r] = {
+          file: p,
+          info: e
+        }, s.on.changeAfter && typeof s.on.changeAfter == "function" && s.on.changeAfter(n, e);
+      },
+      t.type,
+      s.compress
+    );
+  } else
+    uploadImage[`${a}`][r] = {
+      file: t,
+      info: e
+    }, s.on.changeAfter && typeof s.on.changeAfter == "function" && s.on.changeAfter(n, e);
+}
+function Ks(n, i, t, e) {
+  const s = document.createElement("canvas"), o = s.getContext("2d"), a = i.width, l = i.height / a * 100, c = e / t * 100;
+  let u = 0, p = 0;
+  switch (s.width = t, s.height = e, n.previewSize) {
+    case "contain":
+      l < c ? (u = s.width, p = t * l / 100) : l > c ? (u = e / l * 100, p = s.height) : (u = s.width, p = s.height);
+      break;
+    case "cover":
+      l < c ? (u = e / l * 100, p = s.height) : l > c ? (u = s.width, p = t * l / 100) : l === c && (u = s.width, p = s.height);
+      break;
+  }
+  const g = (s.width - u) * 0.5, m = (s.height - p) * 0.5;
+  return o.drawImage(i, g, m, u, p), s;
+}
+function tn(n, i) {
+  return new Promise((t, e) => {
+    if (i) {
+      const s = new Image();
+      s.src = i, s.classList.add(n.previewSize), s.onload = () => {
+        let o = {
+          imgElement: s,
+          originalCanvas: Ks(n, s, s.width, s.height),
+          info: {
+            originalWidth: s.width,
+            originalHeight: s.height,
+            ratio: s.height / s.width * 100 + "%"
+          }
+        };
+        t(o);
+      };
+    } else
+      t();
+  });
+}
+function en(n, i) {
+  const t = Math.pow(10, i);
+  return Math.round(n * t) / t;
+}
+function sn(n, i) {
+  let t = n.size / 1024 / 1024;
+  return `${en(t, 2)}` <= i;
+}
+function nn(n, i, t) {
+  if (n.target.files.length <= 0)
+    return;
+  const e = n.target.files[0], s = i.closest("[data-upload-item]");
+  let o = new FileReader();
+  o.onload = (a) => {
+    const r = e.type.split("/")[0] === "image" ? a.target.result : null;
+    if (t.params.sizeLimit && !sn(e, t.params.sizeLimit)) {
+      i.value = "", s.classList.add("over-limit"), t.params.on.overLimit && typeof t.params.on.overLimit == "function" && t.params.on.overLimit(i, t.params.sizeLimit);
+      return;
+    } else
+      s.classList.remove("over-limit"), s.classList.add("uploaded"), tn(t.params, r).then((l) => {
+        Vs(i, t, e, l);
+      });
+  }, o.readAsDataURL(e);
+}
+class on {
+  constructor(i, t) {
+    const e = this;
+    e.el = i, e.params = {
+      on: {
+        changeAfter: null,
+        overLimit: null
+      },
+      group: "group",
+      //群組名稱 (type: String)
+      sizeLimit: 2,
+      //大小限制 (type: Number 單位: MB)
+      previewSize: "cover",
+      //縮圖形式 (type: String 'contain' || 'cover')
+      compress: 0.8
+      //壓縮品質 (type: Number 0~1 || false)
+    }, Object.assign(e.params, t), e.init();
+  }
+  init() {
+    const i = this, t = document.querySelectorAll(`${i.el}:not(.preview-active)`);
+    t.length <= 0 || (window.uploadImage = {}, t.forEach((e, s) => {
+      e.classList.add("preview-active");
+      const o = {
+        group: e.dataset.group || i.params.group,
+        sizeLimit: parseInt(e.dataset.limit) || i.params.sizeLimit,
+        previewSize: e.dataset.previewSize || i.params.previewSize,
+        compress: e.dataset.compress || i.params.compress,
+        on: {
+          changeAfter: Xe(e.dataset.changeAfter, i.params.on.changeAfter),
+          overLimit: Xe(e.dataset.overLimit, i.params.on.overLimit)
+        }
+      };
+      i.params = o, typeof uploadImage[`${o.group}`] > "u" && (uploadImage[`${o.group}`] = []), e.dataset.group || (e.dataset.group = o.group), e.dataset.index = document.querySelectorAll(`[data-group="${o.group}"]`).length - 1, e.addEventListener("change", function(a) {
+        nn(a, e, i);
+      });
+    }));
+  }
+}
+export {
+  Qe as A,
+  Tn as B,
+  Us as C,
+  ki as D,
+  En as E,
+  An as F,
+  Ln as G,
+  Sn as H,
+  Qs as I,
+  Dn as J,
+  _n as K,
+  kn as L,
+  U as M,
+  $n as N,
+  xn as O,
+  Cn as P,
+  Hn as Q,
+  Zs as R,
+  Mn as S,
+  Yi as T,
+  qn as U,
+  In as V,
+  On as W,
+  Pn as X,
+  Nn as Y,
+  w as a,
+  rt as b,
+  Ts as c,
+  ws as d,
+  Y as e,
+  E as f,
+  L as g,
+  mn as h,
+  at as i,
+  ui as j,
+  Bs as k,
+  Xs as l,
+  on as m,
+  Hs as n,
+  jn as o,
+  gn as p,
+  Ei as q,
+  Ai as r,
+  ys as s,
+  fn as t,
+  vn as u,
+  qs as v,
+  bn as w,
+  Cs as x,
+  yn as y,
+  wn as z
+};
+//# sourceMappingURL=image-preview-bundle.js.map