@xwadex/fesd 0.0.14-re.82 → 0.0.14-re.83

package/dist/image-preview-bundle.js

@@ -2,7 +2,7 @@ var fs = (n, i, t) => {
   if (!i.has(n))
     throw TypeError("Cannot " + t);
 };
-var p = (n, i, 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);
@@ -365,7 +365,7 @@ const Y = {
     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", h = c ? "left" : "top", m = c ? "width" : "height", g = w(e) ? A(e) : document.scrollingElement, v = g[u], b = w(t) ? A(t).getBoundingClientRect()[h] : 0 - v, y = w(s) ? A(s).getBoundingClientRect()[m] : 0, H = b - a - y, G = 15;
+  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", m = c ? "width" : "height", g = w(e) ? A(e) : document.scrollingElement, v = g[u], b = w(t) ? A(t).getBoundingClientRect()[p] : 0 - v, y = w(s) ? A(s).getBoundingClientRect()[m] : 0, H = b - a - y, G = 15;
   let S = 0;
   if (H === 0)
     return;
@@ -384,9 +384,9 @@ const Y = {
 var J, Ee, pt, Ve, mt, Ke;
 class Qe {
   constructor(i, t = {}) {
-    p(this, J);
-    p(this, pt);
-    p(this, mt);
+    h(this, J);
+    h(this, pt);
+    h(this, mt);
     this.__storage__ = {
       el: i,
       options: t
@@ -463,11 +463,11 @@ var gt, ei, ft, ii, vt, si, bt, ni, yt, oi;
 class ti extends HTMLElement {
   constructor() {
     super();
-    p(this, gt);
-    p(this, ft);
-    p(this, vt);
-    p(this, bt);
-    p(this, yt);
+    h(this, gt);
+    h(this, ft);
+    h(this, vt);
+    h(this, bt);
+    h(this, yt);
     this.initialize = !1;
   }
   static get observedAttributes() {
@@ -506,7 +506,7 @@ gt = new WeakSet(), ei = function() {
     overflowBehavior: {
       x: "hidden"
     }
-  }), d(this, bt, ni).call(this);
+  }), 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;
@@ -598,8 +598,8 @@ const { MODALS: Ie } = window, ai = (n, i, ...t) => {
     [...c].forEach((m) => {
       u.append(m);
     });
-    const h = Ie[t] || A(n.target);
-    r("complete", h), li(n, i);
+    const p = Ie[t] || A(n.target);
+    r("complete", p), li(n, i);
   }).catch((l) => {
     r("error", l);
   });
@@ -607,9 +607,9 @@ const { MODALS: Ie } = window, ai = (n, i, ...t) => {
 var Z, Ae, wt, ci, Tt, di;
 const P = class P {
   constructor(i, t = {}) {
-    p(this, Z);
-    p(this, wt);
-    p(this, Tt);
+    h(this, Z);
+    h(this, wt);
+    h(this, Tt);
     this.__storage__ = {
       el: i,
       options: t
@@ -674,13 +674,13 @@ 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: h, bottom: m } = s.getBoundingClientRect(), g = t * (r / 100), v = t * (l / 100);
-    if (h - e <= g && m - e >= v && s.offsetParent)
+    const { class: o, delay: a, start: r, end: l, repeat: c, instance: u } = s.aost, { top: p, bottom: m } = s.getBoundingClientRect(), g = t * (r / 100), v = t * (l / 100);
+    if (p - e <= g && m - e >= v && s.offsetParent)
       setTimeout(() => {
         s.classList.add(o);
       }, a);
     else {
-      const y = s.classList.contains(o) && c === "down" && h - e >= g || c === "up" && m - e <= v || c === !0;
+      const y = s.classList.contains(o) && c === "down" && p - e >= g || c === "up" && m - e <= v || c === !0;
       setTimeout(() => {
         y && s.classList.remove(o);
       }, a);
@@ -690,8 +690,8 @@ const _s = (n, i) => {
 var Q, Le, Et, hi;
 class ui {
   constructor(i, t = {}) {
-    p(this, Q);
-    p(this, Et);
+    h(this, Q);
+    h(this, Et);
     this.__storage__ = {
       el: i,
       options: t
@@ -746,20 +746,20 @@ 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();
-    p(this, At);
-    p(this, Lt);
-    p(this, St);
+    h(this, At);
+    h(this, Lt);
+    h(this, St);
     // youtube iframe
-    p(this, Dt);
+    h(this, Dt);
     // vimeo iframe
-    p(this, _t);
+    h(this, _t);
     // youku iframe
-    p(this, kt);
-    p(this, $t);
+    h(this, kt);
+    h(this, $t);
     // 2025.02.11 新增 ig 
-    p(this, xt);
+    h(this, xt);
     // 2025.02.11 新增 tiktok 
-    p(this, Ct);
+    h(this, Ct);
     d(this, At, pi).call(this);
   }
   play() {
@@ -847,7 +847,7 @@ At = new WeakSet(), pi = function() {
   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/" allowtransparency="true" allowfullscreen="true" frameborder="0" height="100%" data-instgrm-payload-id="instagram-media-payload-0" scrolling="no"></iframe>`;
+  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>`;
@@ -994,8 +994,8 @@ function kn() {
 function $n(n, i, t, e, s) {
   const o = this, r = f(n).html().split("<br>");
   let l = "", c = 0;
-  r.forEach((u, h) => {
-    h !== 0 && (l += "<br>"), u.split("").forEach((g, v) => {
+  r.forEach((u, p) => {
+    p !== 0 && (l += "<br>"), u.split("").forEach((g, v) => {
       i ? (v === 0 && (l += '<span class="letter-wrap" style="display: inline-block">'), g === " " ? 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;` : ""}"` : ""}>${g}</span>`, c++), v === u.length - 1 && (l += "</span>")) : g === " " ? 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;` : ""}"` : ""}>${g}</span>`, c++);
     });
   }), f(n).html(l);
@@ -1084,11 +1084,11 @@ const We = (n) => n.videoId !== "" || typeof n.videoId < "u", Ms = (n) => n.$sel
 var V, Se, Ht, Li, Mt, Si, K, De, qt, Di;
 class qs {
   constructor(i, t = {}) {
-    p(this, V);
-    p(this, Ht);
-    p(this, Mt);
-    p(this, K);
-    p(this, qt);
+    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;
@@ -1114,7 +1114,7 @@ V = new WeakSet(), Se = function() {
     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: h } = e;
+  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 m = null;
     if (u === "on") {
@@ -1122,7 +1122,7 @@ V = new WeakSet(), Se = function() {
       const g = s.querySelector("img");
       g.insertAdjacentHTML(E.after, t[o]);
       const v = (g == null ? void 0 : g.getAttribute("src")) || (g == null ? void 0 : g.getAttribute("data-src"));
-      !v && r == "youtube" ? h ? g.setAttribute("src", `http://img.youtube.com/vi/${a}/maxresdefault.jpg `) : g.setAttribute("src", `https://img.youtube.com/vi/${a}/0.jpg`) : !v && r == "vimeo" ? g.setAttribute("src", `https://vumbnail.com/${a}_large.jpg`) : !v && 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) => {
+      !v && r == "youtube" ? p ? g.setAttribute("src", `http://img.youtube.com/vi/${a}/maxresdefault.jpg `) : g.setAttribute("src", `https://img.youtube.com/vi/${a}/0.jpg`) : !v && r == "vimeo" ? g.setAttribute("src", `https://vumbnail.com/${a}_large.jpg`) : !v && 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;
         g.setAttribute("src", `${y}`);
       }).catch(function(b) {
@@ -1137,7 +1137,7 @@ V = new WeakSet(), Se = function() {
       const g = s.querySelector("img");
       g.insertAdjacentHTML(E.after, t[o]);
       const v = (g == null ? void 0 : g.getAttribute("src")) || (g == null ? void 0 : g.getAttribute("data-src"));
-      !v && r == "youtube" ? h ? g.setAttribute("src", `http://img.youtube.com/vi/${a}/maxresdefault.jpg `) : g.setAttribute("src", `https://img.youtube.com/vi/${a}/0.jpg`) : !v && r == "vimeo" ? g.setAttribute("src", `https://vumbnail.com/${a}_large.jpg`) : !v && 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) => {
+      !v && r == "youtube" ? p ? g.setAttribute("src", `http://img.youtube.com/vi/${a}/maxresdefault.jpg `) : g.setAttribute("src", `https://img.youtube.com/vi/${a}/0.jpg`) : !v && r == "vimeo" ? g.setAttribute("src", `https://vumbnail.com/${a}_large.jpg`) : !v && 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;
         g.setAttribute("src", `${y}`);
       }).catch(function(b) {
@@ -1150,29 +1150,33 @@ V = new WeakSet(), Se = function() {
     m.video || (m.video = {}, m.video.params = e), m.video.eventHandler = d(this, K, De), m.addEventListener("click", m.video.eventHandler);
   }
 }, K = new WeakSet(), De = function(i) {
-  const { video: t, emit: e } = this, { $selector: s, videoMode: o, videoTarget: a, videoTargetRoute: r, videoType: l } = t.params, c = new Fe({ callback_loaded: (u) => {
+  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 u = {
+    const p = {
       target: a,
       route: r,
       on: {
-        complete(h) {
-          h.querySelector(".modal-content").insertAdjacentHTML("beforeend", Te(t.params)), h.querySelector(".modal-content").setAttribute("video-typeStyle", `${l}`);
+        complete(m) {
+          if (l == "instagram") {
+            const g = (v) => `${c}`;
+            m.querySelector(".modal-content").insertAdjacentHTML("beforeend", g(t.params)), m.querySelector(".modal-content").setAttribute("video-typeStyle", `${l}`), window.instgrm && window.instgrm.Embeds.process();
+          } else
+            m.querySelector(".modal-content").insertAdjacentHTML("beforeend", Te(t.params)), m.querySelector(".modal-content").setAttribute("video-typeStyle", `${l}`);
         },
-        open(h) {
-          const m = h.querySelectorAll("[data-overlayscrollbars-viewport]");
-          c.update(), Ei([...m]);
+        open(m) {
+          const g = m.querySelectorAll("[data-overlayscrollbars-viewport]");
+          u.update(), window.modalScroll.update(), Ei([...g]);
         },
-        close(h) {
-          const m = h.querySelectorAll("[data-overlayscrollbars-viewport]");
-          Ai([...m]);
+        close(m) {
+          const g = m.querySelectorAll("[data-overlayscrollbars-viewport]");
+          Ai([...g]);
         },
-        destroy(h) {
+        destroy(m) {
         }
       }
     };
-    U.open(u);
+    U.open(p);
   } else
     o == "onPage" && (t.params.videoAutoplay = "on", s.innerHTML = Te(t.params));
 }, qt = new WeakSet(), Di = function(i) {
@@ -1189,7 +1193,8 @@ V = new WeakSet(), Se = function() {
     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
+    videoHighQualityPic: i.getAttribute("video-highquality") || t.videoHighQuality,
+    videoIgHtml: i.getAttribute("video-ig") || t.videoIgHtml
   };
 };
 Object.assign(qs.prototype, O);
@@ -2033,8 +2038,8 @@ const Oe = {
   );
   const l = e.querySelector(".dropdown-list");
   return [...t].forEach((c) => {
-    c.tagName === "LI" && (c.classList.contains("has-sublayer") ? [...c.querySelectorAll("li")].forEach((h) => {
-      (!h.hasAttribute("data-option") || h.getAttribute("data-option").trim() === "") && h.setAttribute("data-option", h.textContent.trim());
+    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) => {
@@ -2128,10 +2133,10 @@ var It, $i, Ot, xi, Pt, Ci, Nt, Hi;
 class ki extends HTMLElement {
   constructor() {
     super();
-    p(this, It);
-    p(this, Ot);
-    p(this, Pt);
-    p(this, Nt);
+    h(this, It);
+    h(this, Ot);
+    h(this, Pt);
+    h(this, Nt);
     this.initialize = !1;
   }
   static get observedAttributes() {
@@ -2157,8 +2162,8 @@ class ki extends HTMLElement {
             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}"]`);
-                w(h) && (h.classList.add("active"), l.push(h));
+                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);
@@ -2276,7 +2281,7 @@ It = new WeakSet(), $i = function() {
               if (t.__scroller__) {
                 const { viewport: c } = t.__scroller__.elements();
                 if (w(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 u = t.s.activeLi.clientHeight / 2, p = t.s.activeLi.offsetTop, m = p - r.clientHeight / 2 + u > 0 ? p - r.clientHeight / 2 + u : 0;
                   c.scrollTo({
                     top: m,
                     behavior: "smooth"
@@ -2310,7 +2315,7 @@ It = new WeakSet(), $i = function() {
     e.s.allLi = e.querySelectorAll(".dropdown-list li"), e.s.allLi.forEach((l) => {
       l.addEventListener("click", function(c) {
         var g;
-        const u = this, h = [...e.s.allLi].indexOf(u), m = parseInt(e.getAttribute("d4-default-height"));
+        const u = this, p = [...e.s.allLi].indexOf(u), m = parseInt(e.getAttribute("d4-default-height"));
         if (u.classList.contains("has-sublayer")) {
           c.stopPropagation();
           const v = u.querySelector(".sub-dropdown"), b = v.querySelector(".sub-dropdown-list"), y = parseInt(getComputedStyle(b).marginTop) + parseInt(getComputedStyle(b).marginBottom);
@@ -2336,7 +2341,7 @@ It = new WeakSet(), $i = function() {
               (g = u.parentNode.closest("li")) != null && g.classList.contains("has-sublayer") && (c.stopPropagation(), e.close());
               break;
             case "multiple":
-              c.stopPropagation(), u.classList.toggle("active"), x(e, h);
+              c.stopPropagation(), u.classList.toggle("active"), x(e, p);
               break;
           }
       });
@@ -2473,10 +2478,10 @@ var jt, Mi, zt, qi, Wt, Ii, Bt, Oi;
 class Bs extends HTMLElement {
   constructor() {
     super();
-    p(this, jt);
-    p(this, zt);
-    p(this, Wt);
-    p(this, Bt);
+    h(this, jt);
+    h(this, zt);
+    h(this, Wt);
+    h(this, Bt);
     this.initialize = !1;
   }
   static get observedAttributes() {
@@ -2545,20 +2550,20 @@ jt = new WeakSet(), Mi = function() {
           let v = [];
           switch (e) {
             case "top":
-              h = Math.abs(t.s.animateEl.scrollHeight - t.clientHeight), m = parseInt(t.s.nowDuration / (h * 2)) * t.s.animateEl.scrollHeight, v = [{ transform: `translate3d(0,${t.clientHeight}px,0)` }, { transform: `translate3d(0,calc(${t.clientHeight}px - 100%),0)` }];
+              p = Math.abs(t.s.animateEl.scrollHeight - t.clientHeight), m = parseInt(t.s.nowDuration / (p * 2)) * t.s.animateEl.scrollHeight, v = [{ transform: `translate3d(0,${t.clientHeight}px,0)` }, { transform: `translate3d(0,calc(${t.clientHeight}px - 100%),0)` }];
               break;
             case "right":
-              h = Math.abs(t.s.animateEl.scrollWidth - t.clientWidth), m = parseInt(t.s.nowDuration / (h * 2)) * t.s.animateEl.scrollWidth, v = [{ transform: "translate3d(-100%,0,0)" }, { transform: "translate3d(0,0,0)" }];
+              p = Math.abs(t.s.animateEl.scrollWidth - t.clientWidth), m = parseInt(t.s.nowDuration / (p * 2)) * t.s.animateEl.scrollWidth, v = [{ transform: "translate3d(-100%,0,0)" }, { transform: "translate3d(0,0,0)" }];
               break;
             case "bottom":
-              h = Math.abs(t.s.animateEl.scrollHeight - t.clientHeight), m = parseInt(o / (h * 2)) * t.s.animateEl.scrollHeight, v = [{ transform: "translate3d(0,-100%,0)" }, { transform: "translate3d(0,0,0)" }];
+              p = Math.abs(t.s.animateEl.scrollHeight - t.clientHeight), m = parseInt(o / (p * 2)) * t.s.animateEl.scrollHeight, v = [{ transform: "translate3d(0,-100%,0)" }, { transform: "translate3d(0,0,0)" }];
               break;
             case "left":
-              h = Math.abs(t.s.animateEl.scrollWidth - t.clientWidth), m = parseInt(o / (h * 2)) * t.s.animateEl.scrollWidth, v = [{ transform: `translate3d(${t.clientWidth}px,0,0)` }, { transform: `translate3d(calc(-100% + ${t.clientWidth}px),0,0)` }];
+              p = Math.abs(t.s.animateEl.scrollWidth - t.clientWidth), m = parseInt(o / (p * 2)) * t.s.animateEl.scrollWidth, v = [{ transform: `translate3d(${t.clientWidth}px,0,0)` }, { transform: `translate3d(calc(-100% + ${t.clientWidth}px),0,0)` }];
               break;
           }
           return v;
-        }, h, m;
+        }, p, m;
         (t.clientHeight > t.s.animateEl.scrollHeight || e === "left" || e === "right") && (t.s.animateEl.style.transform = `${g()[0].transform}`, t.s.animateEl.animate(g(), {
           duration: m,
           fill: "forwards"
@@ -2632,17 +2637,17 @@ var Gt, Pi, Xt, Ni, Rt, ji, tt, _e, W, dt, Ft, zi;
 class Ge {
   constructor(i) {
     // 初始化
-    p(this, Gt);
+    h(this, Gt);
     // 左右箭頭事件綁定
-    p(this, Xt);
+    h(this, Xt);
     // 左右拖拉事件綁定
-    p(this, Rt);
+    h(this, Rt);
     // 卷軸位置判斷
-    p(this, tt);
+    h(this, tt);
     // 隱藏按鈕判斷
-    p(this, W);
+    h(this, W);
     // 選項事件綁定
-    p(this, Ft);
+    h(this, Ft);
     this.$element = i, this.option = i.s.option.drag, d(this, Gt, Pi).call(this);
   }
   // 更新 active 位置
@@ -2695,32 +2700,32 @@ Gt = new WeakSet(), Pi = function() {
 }, Rt = new WeakSet(), ji = function() {
   const { $wrapper: i } = this;
   let t = !1, e = !1, s = 0, o = 0;
-  const a = function(h) {
-    h.preventDefault(), e = !1, t = !0, s = h.pageX - i.offsetLeft, o = i.scrollLeft;
+  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(h) {
-    h.preventDefault(), t = !1;
+  const l = function(p) {
+    p.preventDefault(), t = !1;
   };
   i.removeEventListener("mouseup", l), i.addEventListener("mouseup", l);
-  const c = function(h) {
-    if (h.preventDefault(), e = !0, !t)
+  const c = function(p) {
+    if (p.preventDefault(), e = !0, !t)
       return;
-    const g = h.pageX - i.offsetLeft - s;
+    const g = p.pageX - i.offsetLeft - s;
     i.scrollTo({
       left: o - g
     });
   };
   i.removeEventListener("mousemove", c), i.addEventListener("mousemove", c);
-  const u = function(h) {
-    e && (h.preventDefault(), h.stopPropagation());
+  const u = function(p) {
+    e && (p.preventDefault(), p.stopPropagation());
   };
-  i.querySelectorAll("a").forEach((h) => {
-    h.removeEventListener("click", u), h.addEventListener("click", u);
+  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;
@@ -2765,13 +2770,13 @@ var Yt, Wi, Ut, Bi, Jt, Gi, Zt, Xi;
 class Gs {
   constructor(i) {
     // 初始化
-    p(this, Yt);
+    h(this, Yt);
     // 隱藏按鈕判斷
-    p(this, Ut);
+    h(this, Ut);
     // 展開箭頭事件綁定
-    p(this, Jt);
+    h(this, Jt);
     // 選項事件綁定
-    p(this, Zt);
+    h(this, Zt);
     this.$element = i, this.option = i.s.option.collapse, d(this, Yt, Wi).call(this);
   }
 }
@@ -2807,12 +2812,12 @@ var Qt, Ri, Vt, Fi, et, ke, B, ut;
 class Rs extends HTMLElement {
   constructor() {
     super();
-    p(this, Qt);
-    p(this, Vt);
+    h(this, Qt);
+    h(this, Vt);
     // 斷點設定
-    p(this, et);
+    h(this, et);
     // check type
-    p(this, B);
+    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() {
@@ -2898,38 +2903,38 @@ class Yi extends HTMLElement {
   // 定義組件的初始狀態
   constructor(t, e) {
     super();
-    p(this, Kt);
-    p(this, te);
+    h(this, Kt);
+    h(this, te);
     // 第一關 判斷數量以及id設定
-    p(this, it);
+    h(this, it);
     // 第二關 id命名提醒
-    p(this, N);
-    p(this, ee);
-    p(this, ie);
-    p(this, se);
+    h(this, N);
+    h(this, ee);
+    h(this, ie);
+    h(this, se);
     // 執行函式
     // 移動至指定位置
-    p(this, ne);
+    h(this, ne);
     // 移動
-    p(this, oe);
+    h(this, oe);
     // 步驟狀態
-    p(this, ae);
+    h(this, ae);
     // next 按鈕狀態
-    p(this, re);
+    h(this, re);
     // prev 按鈕狀態
-    p(this, le);
+    h(this, le);
     // 頁籤狀態
-    p(this, ce);
+    h(this, ce);
     // 第三關各種元件判斷 及 執行
-    p(this, q);
+    h(this, q);
     // 消失動畫
-    p(this, de);
+    h(this, de);
     // 出現動畫
-    p(this, ue);
+    h(this, ue);
     // 狀態
-    p(this, he);
+    h(this, he);
     // resize
-    p(this, pe);
+    h(this, pe);
   }
   // 當組件的屬性被更改時會被呼叫
   static get observedAttributes() {
@@ -3082,7 +3087,7 @@ Kt = new WeakSet(), Ui = function() {
   const { t: e } = this;
   this.t.transition;
   const s = e.tabPanels[t];
-  switch (s.classList.add("hide"), e.display) {
+  switch (s.classList.remove("show"), s.classList.add("hide"), e.display) {
     case "fade":
       s.style.cssText = "display: none; opacity: 0;";
       break;
@@ -3098,7 +3103,7 @@ Kt = new WeakSet(), Ui = function() {
 }, 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.remove("hide"), a.style.transition = `opacity ${e}ms ${s} ${o}ms`, a.style.display = "block", this.t.display) {
+  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";
@@ -3113,8 +3118,8 @@ Kt = new WeakSet(), Ui = function() {
       break;
     case "swiper":
       a.style.opacity = "1";
-      const c = this.querySelector(".swiper-wrapper"), u = this.t.tabPanels[0].offsetWidth, h = -t * u;
-      c.style.transition = `transform ${e}ms ${s} ${o}ms`, c.style.transform = `translateX(${h}px)`;
+      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, "沒有這個效果請自己想辦法!!!!");
@@ -3181,10 +3186,10 @@ const Xe = (n) => {
 var st, xe, me, ds, ge, us, nt, Ce;
 class Us {
   constructor(i, t = {}) {
-    p(this, st);
-    p(this, me);
-    p(this, ge);
-    p(this, nt);
+    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
@@ -3208,10 +3213,10 @@ st = new WeakSet(), xe = function() {
 }, 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 h = (m) => {
+    const p = (m) => {
       m.stopPropagation();
     };
-    u.removeEventListener("click", h), u.addEventListener("click", h);
+    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;
@@ -3237,10 +3242,10 @@ var ot, He, fe, ps, ve, ms, be, gs;
 class Zs extends HTMLElement {
   constructor() {
     super();
-    p(this, ot);
-    p(this, fe);
-    p(this, ve);
-    p(this, be);
+    h(this, ot);
+    h(this, fe);
+    h(this, ve);
+    h(this, be);
     this.initialize = !1;
   }
   connectedCallback() {
@@ -3280,8 +3285,8 @@ ot = new WeakSet(), He = function() {
   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, h = Math.ceil(Math.sqrt(c ** 2 + u ** 2) * 2);
-      e.style.setProperty("--r", h), t.style.left = r + "px", t.style.top = l + "px", e.classList.add("entered");
+      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) {
@@ -3297,13 +3302,13 @@ class Qs {
   }
   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"), 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(${h}deg);
+          transform: rotate(${p}deg);
         `, c.className = "slash2", c.style.cssText = `
           width: ${u}px;
-          transform: rotate(${-h}deg);
+          transform: rotate(${-p}deg);
         `, r.appendChild(l), r.appendChild(c), r;
     }, e = document.querySelectorAll(".error-image");
     for (let o = 0; o < e.length; o++)
@@ -3356,9 +3361,9 @@ function Vs(n, i, t, e) {
     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 });
+        const p = new File([u], `${c}`, { type: t.type });
         uploadImage[`${a}`][r] = {
-          file: h,
+          file: p,
           info: e
         }, s.on.changeAfter && typeof s.on.changeAfter == "function" && s.on.changeAfter(n, e);
       },
@@ -3373,17 +3378,17 @@ function Vs(n, i, t, 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, h = 0;
+  let u = 0, p = 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 ? (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, h = s.height) : l > c ? (u = s.width, h = t * l / 100) : l === c && (u = s.width, h = s.height);
+      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 m = (s.width - u) * 0.5, g = (s.height - h) * 0.5;
-  return o.drawImage(i, m, g, u, h), s;
+  const m = (s.width - u) * 0.5, g = (s.height - p) * 0.5;
+  return o.drawImage(i, m, g, u, p), s;
 }
 function tn(n, i) {
   return new Promise((t, e) => {