@xwadex/fesd 0.0.14-re.73 → 0.0.14-re.75

package/dist/image-preview-bundle.js

@@ -7,7 +7,7 @@ var p = (n, i, t) => {
     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) => (hs(n, i, "access private method"), t);
+var u = (n, i, t) => (hs(n, i, "access private method"), t);
 import { OverlayScrollbars as Ce } from "overlayscrollbars";
 import g from "jquery";
 import "./vendor-bundle.js";
@@ -112,21 +112,24 @@ const Y = {
       "scrollbar-radius": "10px"
     }
   },
-  TEMPLATE(n, i) {
+  TEMPLATE(n, i, t) {
+    const e = `
+      <div class="filter-bar">
+        <input class="filter-input" type="text" placeholder="${i}" disabled>
+      </div>
+      `;
     return `
-          <div class="select-wrapper">
-            <div class="select-display"></div>
-            <i class="dropdown-icon"></i>
-            <div class="dropdown">
-              ${n ? `<div class="filter-bar">
-                  <input class="filter-input" type="text" placeholder="${i}" disabled>
-                </div>` : ""}
-              <div class="dropdown-scroller">
-                <ul class="dropdown-list"></ul>
-              </div>
-            </div>
+      <div class="select-wrapper">
+        <div class="select-display"></div>
+        <i class="dropdown-icon"></i>
+        <div class="dropdown">
+          ${(n ? e : t) ?? ""}
+          <div class="dropdown-scroller">
+            <ul class="dropdown-list"></ul>
           </div>
-        `;
+        </div>
+      </div>
+    `;
   }
 }, fs = {
   SETTINGS: {
@@ -358,7 +361,7 @@ const Y = {
     return -t * ((n = n / e - 1) * n * n * n - 1) + i;
   }
 }, be = (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", h = c ? "left" : "top", m = c ? "width" : "height", f = b(e) ? T(e) : document.scrollingElement, v = f[u], C = b(t) ? T(t).getBoundingClientRect()[h] : 0 - v, L = b(s) ? T(s).getBoundingClientRect()[m] : 0, H = C - a - L, G = 15;
+  const { target: t, container: e, spacer: s, speed: o, gap: a, easing: r, direction: l } = n, c = l === "horizontal", d = c ? "scrollLeft" : "scrollTop", h = c ? "left" : "top", m = c ? "width" : "height", f = b(e) ? T(e) : document.scrollingElement, v = f[d], C = b(t) ? T(t).getBoundingClientRect()[h] : 0 - v, L = b(s) ? T(s).getBoundingClientRect()[m] : 0, H = C - a - L, G = 15;
   let A = 0;
   if (H === 0)
     return;
@@ -370,7 +373,7 @@ const Y = {
   const Ie = () => {
     A += G;
     const R = ws[r](A, v, H, o);
-    f[u] = R, A < o && requestAnimationFrame(Ie), A >= o && X("afterScroll");
+    f[d] = R, A < o && requestAnimationFrame(Ie), A >= o && X("afterScroll");
   };
   requestAnimationFrame(Ie);
 };
@@ -383,7 +386,7 @@ class Je {
     this.__storage__ = {
       el: i,
       options: t
-    }, this.active = "data-anchor-active", d(this, J, we).call(this);
+    }, this.active = "data-anchor-active", u(this, J, we).call(this);
   }
   destroy() {
     const { elements: i } = this;
@@ -393,7 +396,7 @@ class Je {
   }
   update() {
     var i;
-    return d(i = this.destroy(), J, we).call(i), this.emit("afterUpdate"), this;
+    return u(i = this.destroy(), J, we).call(i), this.emit("afterUpdate"), this;
   }
   static run(i) {
     const { SETTINGS: t } = lt, e = Object.assign({}, t, i);
@@ -419,11 +422,11 @@ J = new WeakSet(), we = function() {
   if (this.elements = t.state == "not active" ? E(i + `:not([${this.active}])`) : E(i), this.elements = E(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, Ze).call(this);
+  u(this, pt, Ze).call(this);
 }, pt = new WeakSet(), Ze = function() {
   const { elements: i, options: t } = this;
   i.forEach((e) => {
-    e.anchor = {}, e.anchor.instance = this, e.anchor.eventHandler = d(this, mt, Qe), 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, "");
+    e.anchor = {}, e.anchor.instance = this, e.anchor.eventHandler = u(this, mt, Qe), 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(), Qe = function() {
   const { defaultOptions: i, eventHandler: t, instance: e } = this.anchor, s = {
@@ -469,12 +472,12 @@ class Ve extends HTMLElement {
   attributeChangedCallback(t, e, s) {
     switch (t) {
       case ":state":
-        d(this, yt, si).call(this, s);
+        u(this, yt, si).call(this, s);
         break;
     }
   }
   connectedCallback() {
-    this.initialize || (this.initialize = !0, d(this, gt, Ke).call(this));
+    this.initialize || (this.initialize = !0, u(this, gt, Ke).call(this));
   }
   open() {
     return this.setAttribute(":state", "open"), this;
@@ -490,28 +493,28 @@ gt = new WeakSet(), Ke = function() {
   const { ATTRS: t } = I;
   this.__events__ = {}, this.getAttribute(":state") || this.setAttribute(":state", "close");
   const e = this.getAttribute(t.id) || vs();
-  this.getAttribute(t.id) || (y(`modern-modal needs a ${t.id} attribute with a unique id.`), this.setAttribute(t.id, e)), M[e] && y(`the ${t.id} "${e}" is already be used.`), M[e] = this, d(this, ft, ti).call(this);
+  this.getAttribute(t.id) || (y(`modern-modal needs a ${t.id} attribute with a unique id.`), this.setAttribute(t.id, e)), M[e] && y(`the ${t.id} "${e}" is already be used.`), M[e] = this, u(this, ft, ti).call(this);
 }, ft = new WeakSet(), ti = function() {
-  this.childDom = this.childNodes, this.template = Ts(this), this.innerHTML = "", this.append(this.template), d(this, vt, ei).call(this);
+  this.childDom = this.childNodes, this.template = Ts(this), this.innerHTML = "", this.append(this.template), u(this, vt, ei).call(this);
 }, vt = new WeakSet(), ei = function() {
   const t = this.querySelector(".modal-scroller");
   this.__scroller__ = Ce(t, {
     overflowBehavior: {
       x: "hidden"
     }
-  }), d(this, bt, ii).call(this);
+  }), u(this, bt, ii).call(this);
 }, bt = new WeakSet(), ii = 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();
+      const d = this.getAttribute(s);
+      (d && M[d] ? M[d] : 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();
+      const d = this.getAttribute(o);
+      (d && M[d] ? M[d] : t).destroy();
     });
   }), (l = t.querySelector("[stop-propagation]")) == null || l.addEventListener("click", function(c) {
     c.stopPropagation();
@@ -587,9 +590,9 @@ const { MODALS: Me } = window, ni = (n, i, ...t) => {
     i && (i.emit(l, ...c), ni(i, o[l], ...c)), i || oi(o[l], ...c);
   };
   fetch(e).then((l) => (r("success", a), l.text())).then((l) => {
-    const c = bs(l), u = T(s) || T(I.SETTINGS.container);
+    const c = bs(l), d = T(s) || T(I.SETTINGS.container);
     [...c].forEach((m) => {
-      u.append(m);
+      d.append(m);
     });
     const h = Me[t] || T(n.target);
     r("complete", h), ai(n, i);
@@ -606,7 +609,7 @@ const N = class N {
     this.__storage__ = {
       el: i,
       options: t
-    }, this.active = "data-modal-active", d(this, Z, Te).call(this);
+    }, this.active = "data-modal-active", u(this, Z, Te).call(this);
   }
   destroy() {
     const { elements: i } = this;
@@ -616,7 +619,7 @@ const N = class N {
   }
   update() {
     var i;
-    return d(i = this.destroy(), Z, Te).call(i), this.emit("update"), this;
+    return u(i = this.destroy(), Z, Te).call(i), this.emit("update"), this;
   }
   /** static method 'open' */
   static open(i) {
@@ -640,11 +643,11 @@ Z = new WeakSet(), Te = function() {
   if (this.elements = t.state == "not active" ? E(i + `:not([${this.active}])`) : E(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, ri).call(this);
+  u(this, wt, ri).call(this);
 }, wt = new WeakSet(), ri = function() {
   const { elements: i, options: t } = this;
   i.forEach((e) => {
-    e.modal = {}, e.modal.instance = this, e.modal.eventHandler = d(this, Tt, li), 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, "");
+    e.modal = {}, e.modal.instance = this, e.modal.eventHandler = u(this, Tt, li), 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(), li = function(i) {
   const { defaultOptions: t, eventHandler: e, instance: s } = this.modal, o = ys(this.getAttribute("data-modal-on"));
@@ -667,7 +670,7 @@ customElements.define("modern-modal", Ve);
 const Ls = (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: h, bottom: m } = s.getBoundingClientRect(), f = t * (r / 100), v = t * (l / 100);
+    const { class: o, delay: a, start: r, end: l, repeat: c, instance: d } = s.aost, { top: h, bottom: m } = s.getBoundingClientRect(), f = t * (r / 100), v = t * (l / 100);
     if (h - e <= f && m - e >= v && s.offsetParent)
       setTimeout(() => {
         s.classList.add(o);
@@ -688,7 +691,7 @@ class ci {
     this.__storage__ = {
       el: i,
       options: t
-    }, this.active = "data-aost-active", d(this, Q, Ee).call(this);
+    }, this.active = "data-aost-active", u(this, Q, Ee).call(this);
   }
   destroy(i) {
     const { elements: t, options: e } = this;
@@ -704,7 +707,7 @@ class ci {
   }
   update(i) {
     var t;
-    d(t = this.destroy(i), Q, Ee).call(t);
+    u(t = this.destroy(i), Q, Ee).call(t);
   }
 }
 Q = new WeakSet(), Ee = function() {
@@ -715,7 +718,7 @@ Q = new WeakSet(), Ee = function() {
   if (this.elements = t.state == "not active" ? E(i + `:not([${this.active}])`) : E(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, di).call(this);
+  u(this, Et, di).call(this);
 }, Et = new WeakSet(), di = function() {
   const { elements: i, options: t } = this, { scroller: e } = t, s = e === window || !b(e) ? window : T(e);
   this.eventHandler = () => {
@@ -749,7 +752,7 @@ class Ds extends HTMLElement {
     // youku iframe
     p(this, xt);
     p(this, $t);
-    d(this, Lt, ui).call(this);
+    u(this, Lt, ui).call(this);
   }
   play() {
     const { videoType: t } = this;
@@ -791,9 +794,9 @@ Lt = new WeakSet(), ui = function() {
     y("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"), d(this, At, hi).call(this);
+  this.videoId = this.getAttribute("video-id"), this.videoType = this.getAttribute("video-type"), this.autoplay = this.getAttribute("video-autoplay"), u(this, At, hi).call(this);
 }, At = new WeakSet(), hi = function() {
-  this.childDom = this.childNodes, this.template = Ss(this), this.innerHTML = "", this.append(this.template), d(this, St, pi).call(this);
+  this.childDom = this.childNodes, this.template = Ss(this), this.innerHTML = "", this.append(this.template), u(this, St, pi).call(this);
 }, St = new WeakSet(), pi = function() {
   const { videoType: t } = this;
   let e = "";
@@ -801,18 +804,18 @@ Lt = new WeakSet(), ui = function() {
     case "youtubeAPI":
       break;
     case "youtube":
-      e = d(this, Dt, mi).call(this);
+      e = u(this, Dt, mi).call(this);
       break;
     case "youkuAPI":
       break;
     case "youku":
-      e = d(this, xt, fi).call(this);
+      e = u(this, xt, fi).call(this);
       break;
     case "vimeo":
-      e = d(this, _t, gi).call(this);
+      e = u(this, _t, gi).call(this);
       break;
     case "bilibili":
-      e = d(this, $t, vi).call(this);
+      e = u(this, $t, vi).call(this);
       break;
   }
   this.querySelector(".player-wrapper").insertAdjacentHTML(w.prepend, e);
@@ -845,7 +848,7 @@ function yi(n) {
   }), g("html").removeClass("scrollLock"), ms(i);
 }
 async function hn(n = 0) {
-  if (!g(".loading-wrapper").length)
+  if (g(".loading-wrapper").length)
     return;
   g("body").append(`
   <div class="loading-wrapper">
@@ -971,9 +974,9 @@ function An() {
 function Sn(n, i, t, e, s) {
   const o = this, r = g(n).html().split("<br>");
   let l = "", c = 0;
-  r.forEach((u, h) => {
-    h !== 0 && (l += "<br>"), u.split("").forEach((f, v) => {
-      i ? (v === 0 && (l += '<span class="letter-wrap" style="display: inline-block">'), f === " " ? 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;` : ""}"` : ""}>${f}</span>`, c++), v === u.length - 1 && (l += "</span>")) : f === " " ? 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;` : ""}"` : ""}>${f}</span>`, c++);
+  r.forEach((d, h) => {
+    h !== 0 && (l += "<br>"), d.split("").forEach((f, v) => {
+      i ? (v === 0 && (l += '<span class="letter-wrap" style="display: inline-block">'), f === " " ? 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;` : ""}"` : ""}>${f}</span>`, c++), v === d.length - 1 && (l += "</span>")) : f === " " ? 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;` : ""}"` : ""}>${f}</span>`, c++);
     });
   }), g(n).html(l);
 }
@@ -1073,10 +1076,10 @@ class ks {
     this.__storage__ = {
       el: i,
       options: t
-    }, this.active = "data-video-active", d(this, V, Le).call(this);
+    }, this.active = "data-video-active", u(this, V, Le).call(this);
   }
   update() {
-    d(this, V, Le).call(this);
+    u(this, V, Le).call(this);
   }
 }
 V = new WeakSet(), Le = function() {
@@ -1084,27 +1087,27 @@ V = new WeakSet(), Le = function() {
   if (this.elements = t.state == "not active" ? E(i + `:not([${this.active}])`) : E(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, kt, wi).call(this);
+  u(this, kt, wi).call(this);
 }, kt = new WeakSet(), wi = 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, Ht, Ei).call(this, e), e.video.methods = {}, e.video.methods.update = this.update, e.setAttribute(this.active, ""), je(e.video.params) && !$s(e.video.params) && (e.setAttribute("video4-active", "on"), d(this, Ct, Ti).call(this, e)), je(e.video.params) || Ne("video4", "無法取得影片 ID");
+    e.video = {}, e.video.instance = this, e.video.defaultOptions = t, e.video.params = u(this, Ht, Ei).call(this, e), e.video.methods = {}, e.video.methods.update = this.update, e.setAttribute(this.active, ""), je(e.video.params) && !$s(e.video.params) && (e.setAttribute("video4-active", "on"), u(this, Ct, Ti).call(this, e)), je(e.video.params) || Ne("video4", "無法取得影片 ID");
   }), this.emit("init");
 }, Ct = new WeakSet(), Ti = function(i) {
-  const { LAYOUT: t } = Y, e = i.video.params, { $selector: s, videoLayoutNo: o, videoId: a, videoType: r, videoMode: l, videoButton: c, videoCover: u } = e;
+  const { LAYOUT: t } = Y, e = i.video.params, { $selector: s, videoLayoutNo: o, videoId: a, videoType: r, videoMode: l, videoButton: c, videoCover: d } = e;
   if (l === "onBox") {
     let h = null;
-    if (u === "on") {
+    if (d === "on") {
       i.classList.add("video4-cover"), s.querySelector("img") || (s.insertAdjacentHTML(w.prepend, '<picture><source srcset="" type="image/webp"><source srcset="" type="image/jpeg"><img src="" alt></picture>'), y("video4", "若啟用 [videoCover] 且選擇 onBox 模式必須於 video-target 內放置 img 結構，若無結構則自動加入圖片結構"));
       const m = s.querySelector("img");
       m.insertAdjacentHTML(w.after, t[o]);
       const f = (m == null ? void 0 : m.getAttribute("src")) || (m == null ? void 0 : m.getAttribute("data-src"));
       !f && r == "youtube" ? m.setAttribute("src", `https://img.youtube.com/vi/${a}/0.jpg`) : !f && r == "vimeo" ? m.setAttribute("src", `https://vumbnail.com/${a}_large.jpg`) : y("video4", "僅 youtube & vimeo 提供，無圖片時放置預設封面畫面，其他影片平台請自行上傳封面照片");
     }
-    c == "off" ? h = s : (h = s.querySelector(c) ?? s, s.querySelector(c) || y("video4", `找不到 videoButton 設定的 element -> '${c}' , 點擊物件轉移至 '${this.__storage__.el}'`)), h.video || (h.video = {}, h.video.params = e), h.video.eventHandler = d(this, K, Ae), h.addEventListener("click", h.video.eventHandler);
+    c == "off" ? h = s : (h = s.querySelector(c) ?? s, s.querySelector(c) || y("video4", `找不到 videoButton 設定的 element -> '${c}' , 點擊物件轉移至 '${this.__storage__.el}'`)), h.video || (h.video = {}, h.video.params = e), h.video.eventHandler = u(this, K, Ae), h.addEventListener("click", h.video.eventHandler);
   } else if (l === "onPage") {
     let h = null;
-    if (u == "on") {
+    if (d == "on") {
       i.classList.add("video4-cover"), s.querySelector("img") || (s.insertAdjacentHTML(w.prepend, '<picture><source srcset="" type="image/webp"><source srcset="" type="image/jpeg"><img src="" alt></picture>'), y("video", "若啟用 [videoCover] 且選擇 onBox 模式必須於 video-target 內放置 img 結構"));
       const m = s.querySelector("img");
       m.insertAdjacentHTML(w.after, t[o]);
@@ -1114,7 +1117,7 @@ V = new WeakSet(), Le = function() {
       s.innerHTML = ye(e);
       return;
     }
-    h.video || (h.video = {}, h.video.params = e), h.video.eventHandler = d(this, K, Ae), h.addEventListener("click", h.video.eventHandler);
+    h.video || (h.video = {}, h.video.params = e), h.video.eventHandler = u(this, K, Ae), h.addEventListener("click", h.video.eventHandler);
   }
 }, K = new WeakSet(), Ae = function(i) {
   const { video: t, emit: e } = this, { $selector: s, videoMode: o, videoTarget: a, videoTargetRoute: r } = t.params, l = new Xe({ callback_loaded: (c) => {
@@ -1124,18 +1127,18 @@ V = new WeakSet(), Le = function() {
       target: a,
       route: r,
       on: {
-        complete(u) {
-          u.querySelector(".modal-content").insertAdjacentHTML("beforeend", ye(t.params));
+        complete(d) {
+          d.querySelector(".modal-content").insertAdjacentHTML("beforeend", ye(t.params));
         },
-        open(u) {
-          const h = u.querySelectorAll("[data-overlayscrollbars-viewport]");
+        open(d) {
+          const h = d.querySelectorAll("[data-overlayscrollbars-viewport]");
           l.update(), bi([...h]);
         },
-        close(u) {
-          const h = u.querySelectorAll("[data-overlayscrollbars-viewport]");
+        close(d) {
+          const h = d.querySelectorAll("[data-overlayscrollbars-viewport]");
           yi([...h]);
         },
-        destroy(u) {
+        destroy(d) {
         }
       }
     };
@@ -1989,13 +1992,17 @@ const qe = {
     ]
   }
 }, Cs = (n) => {
-  const { TEMPLATE: i } = He, { childDom: t } = n.s, e = document.createElement("div"), s = n.classList.contains("filter"), o = n.getAttribute("filter-placeholder");
-  e.innerHTML = i(s, o);
-  const a = e.querySelector(".dropdown-list");
-  return [...t].forEach((r) => {
-    r.tagName === "LI" && (r.classList.contains("has-sublayer") ? [...r.querySelectorAll("li")].forEach((c) => {
-      (!c.hasAttribute("data-option") || c.getAttribute("data-option").trim() === "") && c.setAttribute("data-option", c.textContent.trim());
-    }) : (!r.hasAttribute("data-option") || r.getAttribute("data-option").trim() === "") && r.setAttribute("data-option", r.textContent.trim())), a.append(r);
+  const { TEMPLATE: i } = He, { childDom: t } = n.s, e = document.createElement("div"), s = n.classList.contains("filter"), o = n.getAttribute("filter-placeholder"), a = n.getAttribute("custom-template");
+  e.innerHTML = i(
+    s,
+    o,
+    a
+  );
+  const r = e.querySelector(".dropdown-list");
+  return [...t].forEach((l) => {
+    l.tagName === "LI" && (l.classList.contains("has-sublayer") ? [...l.querySelectorAll("li")].forEach((d) => {
+      (!d.hasAttribute("data-option") || d.getAttribute("data-option").trim() === "") && d.setAttribute("data-option", d.textContent.trim());
+    }) : (!l.hasAttribute("data-option") || l.getAttribute("data-option").trim() === "") && l.setAttribute("data-option", l.textContent.trim())), r.append(l);
   }), e.children[0];
 }, Hs = (n) => {
   var t;
@@ -2044,8 +2051,8 @@ const qe = {
         });
         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(w.append, u);
+          const l = r.getAttribute("data-option"), c = r.textContent.trim(), d = `<div class="option-btn" data-option="${l}"><div class="text">${c}</div><div class="remove-icon"></div></div>`;
+          n.s.selectDisplayEl.insertAdjacentHTML(w.append, d);
         })), n.s.activeLi = o, n.s.value = [...o].map((r) => ({
           index: [...e].indexOf(r),
           id: r.getAttribute("data-option"),
@@ -2116,11 +2123,11 @@ class Ai extends HTMLElement {
               break;
             case "multiple":
               const l = [];
-              o.querySelector(".dropdown-list li").classList.remove("active"), s.split(",").forEach((u) => {
-                const h = o.querySelector(`.dropdown-list li[data-option="${u}"]`);
+              o.querySelector(".dropdown-list li").classList.remove("active"), s.split(",").forEach((d) => {
+                const h = o.querySelector(`.dropdown-list li[data-option="${d}"]`);
                 b(h) && (h.classList.add("active"), l.push(h));
               });
-              const c = l.map((u) => [...o.s.allLi].indexOf(u));
+              const c = l.map((d) => [...o.s.allLi].indexOf(d));
               $(o, c);
               break;
           }
@@ -2137,7 +2144,7 @@ class Ai extends HTMLElement {
   }
   connectedCallback() {
     const t = this;
-    t.initialize || t.classList.contains("d4-initialize") || (t.initialize = !0, d(this, Mt, Si).call(this));
+    t.initialize || t.classList.contains("d4-initialize") || (t.initialize = !0, u(this, Mt, Si).call(this));
   }
   open() {
     const t = this, e = t.querySelector(".dropdown-scroller").clientHeight, s = t.classList.contains("filter"), o = () => s ? t.querySelector(".filter-bar").clientHeight + e : e;
@@ -2164,9 +2171,9 @@ class Ai extends HTMLElement {
   }
 }
 Mt = new WeakSet(), Si = function() {
-  this.s = {}, this.__events__ = {}, this.hasAttribute("d4-status") || this.setAttribute("d4-status", "close"), this.hasAttribute("d4-value") || this.setAttribute("d4-value", ""), d(this, qt, Di).call(this);
+  this.s = {}, this.__events__ = {}, this.hasAttribute("d4-status") || this.setAttribute("d4-status", "close"), this.hasAttribute("d4-value") || this.setAttribute("d4-value", ""), u(this, qt, Di).call(this);
 }, qt = new WeakSet(), Di = function() {
-  this.s.childDom = this.childNodes, this.s.template = Cs(this), this.innerHTML = "", this.append(this.s.template), d(this, It, _i).call(this);
+  this.s.childDom = this.childNodes, this.s.template = Cs(this), this.innerHTML = "", this.append(this.s.template), u(this, It, _i).call(this);
 }, It = new WeakSet(), _i = function() {
   var s;
   const t = this;
@@ -2180,8 +2187,8 @@ Mt = new WeakSet(), Si = function() {
         if (r && l) {
           const c = r.getAttribute("d4-value");
           if (qs(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);
+            const d = e.split(",")[1];
+            o = t.querySelector(`.dropdown-list li[data-option="${d}"]`), t.setAttribute("d4-value", d);
           }
         }
       } else
@@ -2212,7 +2219,7 @@ Mt = new WeakSet(), Si = function() {
       };
       break;
   }
-  $(t, t.s.value.index), d(s = t, Ot, xi).call(s), t.classList.add("d4-initialize");
+  $(t, t.s.value.index), u(s = t, Ot, xi).call(s), t.classList.add("d4-initialize");
 }, Ot = new WeakSet(), xi = function() {
   const t = this;
   t.__events__.dropdownToggle = () => {
@@ -2236,7 +2243,7 @@ Mt = new WeakSet(), Si = function() {
               if (t.__scroller__) {
                 const { viewport: c } = t.__scroller__.elements();
                 if (b(t.s.activeLi)) {
-                  const u = t.s.activeLi.clientHeight / 2, h = t.s.activeLi.offsetTop, m = h - r.clientHeight / 2 + u > 0 ? h - r.clientHeight / 2 + u : 0;
+                  const d = t.s.activeLi.clientHeight / 2, h = t.s.activeLi.offsetTop, m = h - r.clientHeight / 2 + d > 0 ? h - r.clientHeight / 2 + d : 0;
                   c.scrollTo({
                     top: m,
                     behavior: "smooth"
@@ -2270,15 +2277,15 @@ Mt = new WeakSet(), Si = function() {
     e.s.allLi = e.querySelectorAll(".dropdown-list li"), e.s.allLi.forEach((l) => {
       l.addEventListener("click", function(c) {
         var f;
-        const u = this, h = [...e.s.allLi].indexOf(u), m = parseInt(e.getAttribute("d4-default-height"));
-        if (u.classList.contains("has-sublayer")) {
+        const d = this, h = [...e.s.allLi].indexOf(d), m = parseInt(e.getAttribute("d4-default-height"));
+        if (d.classList.contains("has-sublayer")) {
           c.stopPropagation();
-          const v = u.querySelector(".sub-dropdown"), C = v.querySelector(".sub-dropdown-list"), L = parseInt(getComputedStyle(C).marginTop) + parseInt(getComputedStyle(C).marginBottom);
+          const v = d.querySelector(".sub-dropdown"), C = v.querySelector(".sub-dropdown-list"), L = parseInt(getComputedStyle(C).marginTop) + parseInt(getComputedStyle(C).marginBottom);
           v.style.cssText = `--height: ${C.offsetHeight + L}px`;
           const H = parseInt(v.style.cssText.replace("--height:", "").trim()), G = parseInt(getComputedStyle(a).maxHeight), A = () => {
             s = m + 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, A()) : (u.classList.add("open"), e.s.subDropdownTotalH += H, A());
+          d.classList.contains("open") ? (d.classList.remove("open"), e.s.subDropdownTotalH -= H, A()) : (d.classList.add("open"), e.s.subDropdownTotalH += H, A());
           const X = () => {
             e.__scroller__.update(!0), v.removeEventListener("transitionend", X);
           };
@@ -2286,17 +2293,17 @@ Mt = new WeakSet(), Si = function() {
         } else
           switch (Hs(e), e.s.selectType) {
             case "single":
-              if (e.setAttribute("d4-value", u.getAttribute("data-option")), r) {
+              if (e.setAttribute("d4-value", d.getAttribute("data-option")), r) {
                 const v = e.s.cityLang, C = l.textContent.trim(), L = document.getElementById(e.getAttribute("dist-select"));
                 L && (L.querySelector(".dropdown-list").textContent = "", $(L, -1), qe[v][C].forEach((H, G) => {
                   const A = document.createElement("li");
                   A.textContent = H[0], A.setAttribute("data-option", H[0]), L.querySelector(".dropdown-list").append(A);
                 }), e.__events__.selectOption(L));
               }
-              (f = u.parentNode.closest("li")) != null && f.classList.contains("has-sublayer") && (c.stopPropagation(), e.close());
+              (f = d.parentNode.closest("li")) != null && f.classList.contains("has-sublayer") && (c.stopPropagation(), e.close());
               break;
             case "multiple":
-              c.stopPropagation(), u.classList.toggle("active"), $(e, h);
+              c.stopPropagation(), d.classList.toggle("active"), $(e, h);
               break;
           }
       });
@@ -2367,7 +2374,7 @@ function Os(n) {
   }
   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 D(n) {
+function _(n) {
   const { behavior: i, direction: t, continual: e } = n.s.options;
   let s = {};
   switch (i) {
@@ -2445,7 +2452,7 @@ class Ps extends HTMLElement {
   attributeChangedCallback(t, e, s) {
   }
   connectedCallback() {
-    this.initialize || (this.initialize = !0, d(this, Nt, $i).call(this));
+    this.initialize || (this.initialize = !0, u(this, Nt, $i).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"));
@@ -2471,7 +2478,7 @@ Nt = new WeakSet(), $i = function() {
     // true / false
     gap: Number(this.getAttribute("gap")) || x.SETTINGS.gap
   };
-  this.s = {}, this.s.options = t, this.s.nowDuration = ze(this), Os(this), d(this, Pt, ki).call(this);
+  this.s = {}, this.s.options = t, this.s.nowDuration = ze(this), Os(this), u(this, Pt, ki).call(this);
 }, Pt = new WeakSet(), ki = function() {
   const { direction: t, continual: e, gap: s } = this.s.options;
   switch (t) {
@@ -2484,17 +2491,17 @@ Nt = new WeakSet(), $i = function() {
       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, jt, Ci).call(this), d(this, zt, Hi).call(this), e && this.classList.add("continual"), this.classList.add("m4-initialize");
+  u(this, jt, Ci).call(this), u(this, zt, Hi).call(this), e && this.classList.add("continual"), this.classList.add("m4-initialize");
 }, jt = new WeakSet(), Ci = function() {
   const t = this, { direction: e, behavior: s, duration: o, autoplay: a, pauseOnMouseenter: r, continual: l } = t.s.options;
   let c;
-  function u() {
+  function d() {
     switch (s) {
       case "normal":
-        t.s.animateEl.style.transform = `${D(t).animate1[0].transform}`, t.s.animation = t.s.animateEl.animate(D(t).animate1, {
+        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 = `${D(t).animate2[0].transform}`, t.s.cloneAnimation = t.s.cloneAnimateEl.animate(D(t).animate2, {
+        }), 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
@@ -2523,7 +2530,7 @@ Nt = new WeakSet(), $i = function() {
           duration: m,
           fill: "forwards"
         }).finished.then(() => {
-          t.s.animation = t.s.animateEl.animate(D(t).animate1, {
+          t.s.animation = t.s.animateEl.animate(_(t).animate1, {
             duration: t.s.nowDuration,
             iterations: 1 / 0
           });
@@ -2532,7 +2539,7 @@ Nt = new WeakSet(), $i = function() {
         });
         break;
       case "endStop":
-        t.s.animateEl.style.transform = `${D(t).animate1[0].transform}`, t.s.animation = t.s.animateEl.animate(D(t).animate1, {
+        t.s.animateEl.style.transform = `${_(t).animate1[0].transform}`, t.s.animation = t.s.animateEl.animate(_(t).animate1, {
           duration: t.s.nowDuration,
           fill: "forwards"
         });
@@ -2542,7 +2549,7 @@ Nt = new WeakSet(), $i = function() {
   }
   clearTimeout(c), c = setTimeout(
     () => {
-      u();
+      d();
     },
     a || 0
   ), t.addEventListener("mouseenter", function() {
@@ -2554,10 +2561,10 @@ Nt = new WeakSet(), $i = function() {
   const t = this;
   function e() {
     const s = t.s.animation.startTime, o = t.s.cloneAnimation ? t.s.cloneAnimation.startTime : null;
-    t.s.nowDuration = ze(t), t.s.animation.cancel(), t.s.cloneAnimation && t.s.cloneAnimation.cancel(), t.s.animation = t.s.animateEl.animate(D(t).animate1, {
+    t.s.nowDuration = ze(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(D(t).animate2, {
+    }), 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
@@ -2571,7 +2578,7 @@ const ht = function(n) {
   return function(t) {
     i && clearTimeout(i), i = setTimeout(n, 200, t);
   };
-}, _ = (n, i) => {
+}, D = (n, i) => {
   if (rt(n)) {
     n.forEach((t) => {
       t.classList.add(i);
@@ -2603,7 +2610,7 @@ class We {
     p(this, W);
     // 選項事件綁定
     p(this, Xt);
-    this.$element = i, this.option = i.s.option.drag, d(this, Wt, Mi).call(this);
+    this.$element = i, this.option = i.s.option.drag, u(this, Wt, Mi).call(this);
   }
   // 更新 active 位置
   update(i) {
@@ -2624,10 +2631,10 @@ Wt = new WeakSet(), Mi = function() {
     return;
   i.$container = i.$element.querySelector(".drag-container"), i.$wrapper = i.$container.querySelector(".wrapper");
   const t = () => {
-    var c, u;
-    d(c = i, tt, Se).call(c), d(u = i, W, dt).call(u);
+    var c, d;
+    u(c = i, tt, Se).call(c), u(d = i, W, dt).call(d);
   };
-  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, Gt, Ii).call(e), i.option.navigation && i.$element.s.type !== "collapse" && (i.$container.insertAdjacentHTML(
+  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") && u(e = i, Gt, Ii).call(e), i.option.navigation && i.$element.s.type !== "collapse" && (i.$container.insertAdjacentHTML(
     w.prepend,
     `<div class="navigation">
         <div class="button prev">
@@ -2637,7 +2644,7 @@ Wt = new WeakSet(), Mi = function() {
           <div></div>
         </div>
       </div>`
-  ), i.$button = (s = i.$container) == null ? void 0 : s.querySelectorAll(".button"), d(o = i, Bt, qi).call(o)), d(a = i, tt, Se).call(a), d(r = i, W, dt).call(r), d(l = i, Xt, Oi).call(l);
+  ), i.$button = (s = i.$container) == null ? void 0 : s.querySelectorAll(".button"), u(o = i, Bt, qi).call(o)), u(a = i, tt, Se).call(a), u(r = i, W, dt).call(r), u(l = i, Xt, Oi).call(l);
 }, Bt = new WeakSet(), qi = function() {
   const i = this, { $wrapper: t, $button: e } = i, s = function() {
     const o = this.classList.contains("next"), a = parseInt(t.getBoundingClientRect().width * 0.7);
@@ -2646,7 +2653,7 @@ Wt = new WeakSet(), Mi = function() {
       behavior: "smooth"
     }), setTimeout(() => {
       var r;
-      d(r = i, W, dt).call(r);
+      u(r = i, W, dt).call(r);
     }, 100);
   };
   e.forEach((o) => {
@@ -2676,33 +2683,33 @@ Wt = new WeakSet(), Mi = function() {
     });
   };
   i.removeEventListener("mousemove", c), i.addEventListener("mousemove", c);
-  const u = function(h) {
+  const d = function(h) {
     e && (h.preventDefault(), h.stopPropagation());
   };
   i.querySelectorAll("a").forEach((h) => {
-    h.removeEventListener("click", u), h.addEventListener("click", u);
+    h.removeEventListener("click", d), h.addEventListener("click", d);
   });
 }, tt = new WeakSet(), Se = function() {
   const { $container: i, $wrapper: t } = this, e = t.scrollWidth - t.clientWidth, s = t.scrollLeft;
-  e <= 0 || (_(i, "scrollable"), s == 0 ? (S(i, "scrollable"), _(t, "start"), S(t, "end")) : s >= e ? (S(i, "scrollable"), S(t, "start"), _(t, "end")) : (_(t, "center"), S(t, "start"), S(t, "end")));
+  e <= 0 || (D(i, "scrollable"), s == 0 ? (S(i, "scrollable"), D(t, "start"), S(t, "end")) : s >= e ? (S(i, "scrollable"), S(t, "start"), D(t, "end")) : (D(t, "center"), S(t, "start"), S(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) {
-    _(t, "hide"), S(t, "active"), _(e, "noScrollable");
+    D(t, "hide"), S(t, "active"), D(e, "noScrollable");
     return;
   }
-  s > 0 && _(t, "active"), o == 0 ? t.forEach((a) => {
+  s > 0 && (D(t, "active"), D(e, "scrollable"), S(e, "noScrollable")), o == 0 ? t.forEach((a) => {
     if (a.classList.contains("next")) {
       S(a, "hide");
       return;
     }
-    _(a, "hide");
+    D(a, "hide");
   }) : o >= s ? t.forEach((a) => {
     if (a.classList.contains("next")) {
-      _(a, "hide");
+      D(a, "hide");
       return;
     }
     S(a, "hide");
@@ -2732,11 +2739,11 @@ class js {
     p(this, Yt);
     // 選項事件綁定
     p(this, Ut);
-    this.$element = i, this.option = i.s.option.collapse, d(this, Rt, Ni).call(this);
+    this.$element = i, this.option = i.s.option.collapse, u(this, Rt, Ni).call(this);
   }
 }
 Rt = new WeakSet(), Ni = function() {
-  this.$element && (this.$container = this.$element.querySelector(".collapse-container"), this.$wrapper = this.$container.querySelector(".wrapper"), d(this, Ft, Pi).call(this) && d(this, Yt, ji).call(this), d(this, Ut, zi).call(this));
+  this.$element && (this.$container = this.$element.querySelector(".collapse-container"), this.$wrapper = this.$container.querySelector(".wrapper"), u(this, Ft, Pi).call(this) && u(this, Yt, ji).call(this), u(this, Ut, zi).call(this));
 }, Ft = new WeakSet(), Pi = function() {
   const i = this.$element.querySelector(".drag-container"), t = i.querySelector(".wrapper");
   return t.scrollWidth - t.clientWidth > 0 ? (i.insertAdjacentHTML(w.append, '<div class="open-collapse"></div>'), this.$button = i.querySelector(".open-collapse"), !0) : !1;
@@ -2784,7 +2791,7 @@ class Ws extends HTMLElement {
       case "m4-type":
         if (e === null || e === s)
           return;
-        this.s.type = s, d(this, B, ut).call(this);
+        this.s.type = s, u(this, B, ut).call(this);
         break;
       case "m4-status":
         if (e === s)
@@ -2801,10 +2808,10 @@ class Ws extends HTMLElement {
     }
   }
   connectedCallback() {
-    this.initialize || this.classList.contains("m4-init") || (this.initialize = !0, d(this, Jt, Wi).call(this));
+    this.initialize || this.classList.contains("m4-init") || (this.initialize = !0, u(this, Jt, Wi).call(this));
   }
   update() {
-    d(this, et, De).call(this);
+    u(this, et, De).call(this);
   }
 }
 Jt = new WeakSet(), Wi = function() {
@@ -2818,18 +2825,18 @@ Jt = new WeakSet(), Wi = function() {
     }
     this.update();
   };
-  window.removeEventListener("resize", ht(e)), window.addEventListener("resize", ht(e)), this.s.option = {}, this.s.option.drag = Object.assign({}, k.SETTINGS.drag, t == null ? void 0 : t.drag), this.s.option.collapse = Object.assign({}, k.SETTINGS.collapse, t == null ? void 0 : t.collapse), this.s.option.dropdown = Object.assign({}, k.SETTINGS.dropdown, t == null ? void 0 : t.dropdown), this.s.option.breakpoint = Object.assign({}, k.SETTINGS.breakpoint, t == null ? void 0 : t.breakpoint), d(this, Zt, Bi).call(this);
+  window.removeEventListener("resize", ht(e)), window.addEventListener("resize", ht(e)), this.s.option = {}, this.s.option.drag = Object.assign({}, k.SETTINGS.drag, t == null ? void 0 : t.drag), this.s.option.collapse = Object.assign({}, k.SETTINGS.collapse, t == null ? void 0 : t.collapse), this.s.option.dropdown = Object.assign({}, k.SETTINGS.dropdown, t == null ? void 0 : t.dropdown), this.s.option.breakpoint = Object.assign({}, k.SETTINGS.breakpoint, t == null ? void 0 : t.breakpoint), u(this, Zt, Bi).call(this);
 }, Zt = new WeakSet(), Bi = function() {
-  this.classList.add("m4-init"), d(this, et, De).call(this);
+  this.classList.add("m4-init"), u(this, et, De).call(this);
 }, et = new WeakSet(), De = function() {
   const t = Object.keys(this.s.option.breakpoint);
   if (!t.length) {
-    d(this, B, ut).call(this);
+    u(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;
+    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)), u(this, B, ut).call(this), window.innerWidth >= e;
   });
 }, B = new WeakSet(), ut = function() {
   var o;
@@ -2892,41 +2899,41 @@ class Gi extends HTMLElement {
     return ["t4-active"];
   }
   attributeChangedCallback(t, e, s) {
-    t === "t4-active" && e !== s && d(this, de, ss).call(this, s);
+    t === "t4-active" && e !== s && u(this, de, ss).call(this, s);
   }
   connectedCallback() {
-    this.classList.contains("t4-initialize") || d(this, Qt, Xi).call(this);
+    this.classList.contains("t4-initialize") || u(this, Qt, Xi).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");
+      u(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, P, F).call(this, s);
+    const o = u(this, P, F).call(this, s);
     e.tabPanels.forEach((a, r) => {
-      r === o ? d(this, ce, is).call(this, r) : d(this, le, es).call(this, r);
+      r === o ? u(this, ce, is).call(this, r) : u(this, le, es).call(this, r);
     });
   }
   // 外部呼叫方法 $0.goNext()
   goNext() {
-    const t = d(this, P, F).call(this, this.t.activeTab), e = Math.min(this.t.tabPanels.length - 1, t + 1), s = this.t.tabPanels[e].getAttribute("t4-id");
+    const t = u(this, P, 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, P, F).call(this, this.t.activeTab), e = Math.max(0, t - 1), s = this.t.tabPanels[e].getAttribute("t4-id");
+    const t = u(this, P, 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), os(), console.log("tab update!!!!");
+    this.t.tabs = u(this, it, _e).call(this), os(), console.log("tab update!!!!");
   }
 }
 Qt = new WeakSet(), Xi = function() {
@@ -2949,13 +2956,13 @@ Qt = new WeakSet(), Xi = function() {
       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, Vt, Ri).call(this);
+  }, this.__events__ = {}, this.t.tabs = u(this, it, _e).call(this), this.t.step = document.querySelector(`[t4-control="${this.t.name}"]${this.t.stepOutput}`), u(this, Vt, Ri).call(this);
 }, Vt = new WeakSet(), Ri = function() {
-  if (this.t.activeTab = this.t.defaultPage, this.t.display === "swiper" && d(this, Kt, Fi).call(this), this.t.recordUrl) {
+  if (this.t.activeTab = this.t.defaultPage, this.t.display === "swiper" && u(this, Kt, Fi).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, ue, ns).call(this);
+  this.setActiveTab(this.t.activeTab), this.classList.add("t4-initialize"), u(this, ue, ns).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) => {
@@ -2972,7 +2979,7 @@ Qt = new WeakSet(), Xi = function() {
   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, te, Yi).call(this);
+  }), this.t.tabPanels = [...e.children], t.appendChild(e), this.innerHTML = "", this.appendChild(t), u(this, te, Yi).call(this);
 }, te = new WeakSet(), Yi = function() {
   const t = this.querySelector(".swiper-container"), e = this.querySelector(".swiper-wrapper"), s = this.t.tabPanels;
   t.style.overflow = "hidden", e.style.display = "flex";
@@ -2988,7 +2995,7 @@ Qt = new WeakSet(), Xi = function() {
   }
 }, ie = new WeakSet(), Ji = function() {
   const t = parseInt(this.t.gap, 10), e = window.pageYOffset, o = this.getBoundingClientRect().top + e - t;
-  d(this, se, Zi).call(this, o);
+  u(this, se, Zi).call(this, o);
 }, se = new WeakSet(), Zi = function(t) {
   window.scrollTo({
     top: t,
@@ -3016,19 +3023,19 @@ Qt = new WeakSet(), Xi = function() {
 }, q = new WeakSet(), z = function(t, e, s) {
   switch (t) {
     case "step":
-      ve(this.t.step) && d(this, ne, Qi).call(this, e);
+      ve(this.t.step) && u(this, ne, Qi).call(this, e);
       break;
     case "eventAnchor":
-      this.t.anchor && d(this, ie, Ji).call(this);
+      this.t.anchor && u(this, ie, Ji).call(this);
       break;
     case "tabState":
-      this.t.type == "normal" && d(this, re, ts).call(this, e, s);
+      this.t.type == "normal" && u(this, re, ts).call(this, e, s);
       break;
     case "btnState":
-      d(this, oe, Vi).call(this, e), d(this, ae, Ki).call(this, e);
+      u(this, oe, Vi).call(this, e), u(this, ae, Ki).call(this, e);
       break;
     case "tabUrl":
-      this.t.recordUrl === "true" && d(this, ee, Ui).call(this, e);
+      this.t.recordUrl === "true" && u(this, ee, Ui).call(this, e);
       break;
     default:
       console.warn("請增加判斷，謝謝");
@@ -3069,7 +3076,7 @@ Qt = new WeakSet(), Xi = function() {
       break;
     case "swiper":
       a.style.opacity = "1";
-      const c = this.querySelector(".swiper-wrapper"), u = this.t.tabPanels[0].offsetWidth, h = -t * u;
+      const c = this.querySelector(".swiper-wrapper"), d = this.t.tabPanels[0].offsetWidth, h = -t * d;
       c.style.transition = `transform ${e}ms ${s} ${o}ms`, c.style.transform = `translateX(${h}px)`;
       break;
     default:
@@ -3077,8 +3084,8 @@ Qt = new WeakSet(), Xi = function() {
       break;
   }
 }, de = new WeakSet(), ss = function(t) {
-  const e = d(this, P, 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");
+  const e = u(this, P, F).call(this, t);
+  u(this, q, z).call(this, "step", e), u(this, q, z).call(this, "btnState", e), u(this, q, z).call(this, "tabState", e, t), u(this, q, z).call(this, "tabUrl", t), this.emit("change");
 }, ue = new WeakSet(), ns = function() {
   const t = this;
   window.addEventListener(
@@ -3144,10 +3151,10 @@ class Xs {
     !at(i) && !ve(i) && !rt(i) && !b(i) || (this.__storage__ = {
       el: i,
       options: t
-    }, this.active = "data-collapse-active", d(this, st, xe).call(this));
+    }, this.active = "data-collapse-active", u(this, st, xe).call(this));
   }
   update() {
-    d(this, st, xe).call(this);
+    u(this, st, xe).call(this);
   }
 }
 st = new WeakSet(), xe = function() {
@@ -3155,19 +3162,19 @@ st = new WeakSet(), xe = function() {
   if (this.elements = t.state == "not active" ? E(i + `:not([${this.active}])`) : E(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, he, as).call(this);
+  u(this, he, as).call(this);
 }, he = new WeakSet(), as = 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, pe, rs).call(this, e);
+    e.collapse = {}, e.collapse.instance = this, e.collapse.defaultOptions = t, e.collapse.methods = {}, e.collapse.methods.update = this.update, e.setAttribute(this.active, ""), u(this, pe, rs).call(this, e);
   }), this.emit("init");
 }, pe = new WeakSet(), rs = 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, $e)), c.addEventListener("click", d(this, nt, $e)), r) {
+  const { options: t } = this, { collapseClass: e, block: s, target: o, defaultOpen: a, targetStopPropagation: r, defaultActiveMark: l } = t, c = i, d = c.querySelector(o);
+  if (c.collapse.height = d.children[0].offsetHeight, a ? (d.style.height = `${d.children[0].offsetHeight}px`, c.classList.remove(e)) : !c.classList.contains(l) && !c.hasAttribute(l) ? (c.classList.add(e), d.style.height = "0px", d.style.overflow = "hidden") : (d.style.height = `${d.children[0].offsetHeight}px`, c.classList.remove(e)), c.removeEventListener("click", u(this, nt, $e)), c.addEventListener("click", u(this, nt, $e)), r) {
     const h = (m) => {
       m.stopPropagation();
     };
-    u.removeEventListener("click", h), u.addEventListener("click", h);
+    d.removeEventListener("click", h), d.addEventListener("click", h);
   }
 }, nt = new WeakSet(), $e = function() {
   const { instance: i, defaultOptions: t } = this.collapse, { collapseClass: e, block: s, target: o, single: a } = t, r = this;
@@ -3201,10 +3208,10 @@ class Fs extends HTMLElement {
   }
   connectedCallback() {
     const t = this;
-    t.initialize || t.classList.contains("r4-initialize") || (t.initialize = !0, d(this, ot, ke).call(this));
+    t.initialize || t.classList.contains("r4-initialize") || (t.initialize = !0, u(this, ot, ke).call(this));
   }
   update() {
-    this.classList.remove("r4-initialize"), this.querySelector("i.hover-ball").remove(), d(this, ot, ke).call(this);
+    this.classList.remove("r4-initialize"), this.querySelector("i.hover-ball").remove(), u(this, ot, ke).call(this);
   }
 }
 ot = new WeakSet(), ke = function() {
@@ -3222,9 +3229,9 @@ ot = new WeakSet(), ke = function() {
     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, me, cs).call(this);
+  this.s.options = s, this.s.options.hover && this.classList.add("hover-btn"), u(this, me, cs).call(this);
 }, me = new WeakSet(), cs = function() {
-  d(this, ge, ds).call(this), d(this, fe, us).call(this), this.classList.add("r4-initialize");
+  u(this, ge, ds).call(this), u(this, fe, us).call(this), this.classList.add("r4-initialize");
 }, ge = new WeakSet(), ds = function() {
   const t = this, e = document.createElement("i");
   e.classList.add("hover-ball"), e.style.transitionDuration = `${t.s.options.speed}ms`, t.appendChild(e);
@@ -3236,7 +3243,7 @@ ot = new WeakSet(), ke = function() {
   let s = "ontouchstart" in document.documentElement ? "touchstart" : "mouseenter", o = "ontouchend" in document.documentElement ? "touchend" : "mouseleave";
   e.addEventListener(s, function(a) {
     if (s === "touchstart" && ls(), 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, h = Math.ceil(Math.sqrt(c ** 2 + u ** 2) * 2);
+      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: d } = e, h = Math.ceil(Math.sqrt(c ** 2 + d ** 2) * 2);
       e.style.setProperty("--r", h), t.style.left = r + "px", t.style.top = l + "px", e.classList.add("entered");
     }
   }), e.addEventListener(o, function(a) {
@@ -3253,12 +3260,12 @@ class Ys {
   }
   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), h = Math.asin(a / u) * 180 / Math.PI;
+      const r = document.createElement("div"), l = document.createElement("span"), c = document.createElement("span"), d = Math.sqrt(o ** 2 + a ** 2), h = Math.asin(a / d) * 180 / Math.PI;
       return r.className = "no-image", l.className = "slash1", l.style.cssText = `
-          width: ${u}px;
+          width: ${d}px;
           transform: rotate(${h}deg);
         `, c.className = "slash2", c.style.cssText = `
-          width: ${u}px;
+          width: ${d}px;
           transform: rotate(${-h}deg);
         `, r.appendChild(l), r.appendChild(c), r;
     }, e = document.querySelectorAll(".error-image");
@@ -3268,8 +3275,8 @@ class Ys {
       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 = `
+        const c = document.createElement("div"), d = getComputedStyle(o.parentElement).position;
+        c.className = "error-image", d === "static" && (o.parentElement.style.position = "relative"), o.parentElement.appendChild(c), c.style.cssText = `
           position: absolute;
           top: 50%;
           left: 50%;
@@ -3283,13 +3290,13 @@ class Ys {
     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;
+        const r = a.parentElement.clientWidth, l = a.parentElement.clientHeight, c = Math.sqrt(r ** 2 + l ** 2), d = Math.asin(l / c) * 180 / Math.PI;
         a.querySelector(".slash1").style.cssText = `
           width: ${c}px;
-          transform: rotate(${u}deg);
+          transform: rotate(${d}deg);
         `, a.querySelector(".slash2").style.cssText = `
           width: ${c}px;
-          transform: rotate(${-u}deg);
+          transform: rotate(${-d}deg);
         `;
       });
     }
@@ -3311,8 +3318,8 @@ function Us(n, i, t, e) {
   if (s.compress) {
     const l = t.name.substring(t.name.lastIndexOf(".")).replace("."), c = t.name.replace(`.${l}`, "");
     e.originalCanvas.toBlob(
-      function(u) {
-        const h = new File([u], `${c}`, { type: t.type });
+      function(d) {
+        const h = new File([d], `${c}`, { type: t.type });
         uploadImage[`${a}`][r] = {
           file: h,
           info: e
@@ -3329,17 +3336,17 @@ function Us(n, i, t, e) {
 }
 function Js(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, h = 0;
+  let d = 0, h = 0;
   switch (s.width = t, s.height = e, n.previewSize) {
     case "contain":
-      l < c ? (u = s.width, h = t * l / 100) : l > c ? (u = e / l * 100, h = s.height) : (u = s.width, h = s.height);
+      l < c ? (d = s.width, h = t * l / 100) : l > c ? (d = e / l * 100, h = s.height) : (d = s.width, h = s.height);
       break;
     case "cover":
-      l < c ? (u = e / l * 100, h = s.height) : l > c ? (u = s.width, h = t * l / 100) : l === c && (u = s.width, h = s.height);
+      l < c ? (d = e / l * 100, h = s.height) : l > c ? (d = s.width, h = t * l / 100) : l === c && (d = s.width, h = s.height);
       break;
   }
-  const m = (s.width - u) * 0.5, f = (s.height - h) * 0.5;
-  return o.drawImage(i, m, f, u, h), s;
+  const m = (s.width - d) * 0.5, f = (s.height - h) * 0.5;
+  return o.drawImage(i, m, f, d, h), s;
 }
 function Zs(n, i) {
   return new Promise((t, e) => {