vistaview 0.7.0 → 0.7.1

package/dist/lib/image-state.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"image-state.d.ts","sourceRoot":"","sources":["../../src/lib/image-state.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAG5C,MAAM,MAAM,0BAA0B,GAAG;IACvC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF,qBAAa,eAAe;IAC1B,OAAO,CAAC,YAAY,CAAS;IAC7B,OAAO,CAAC,KAAK,CAAiC;IAC9C,OAAO,CAAC,IAAI,CAAwB;IACpC,OAAO,CAAC,aAAa,CAA4C;IACjE,OAAO,CAAC,YAAY,CAAgB;IACpC,OAAO,CAAC,YAAY,CAAuE;IAC3F,OAAO,CAAC,oBAAoB,CAAkB;IAG9C,OAAO,CAAC,KAAK,CAAa;IAC1B,OAAO,CAAC,SAAS,CAAkB;IACnC,OAAO,CAAC,OAAO,CAA4D;gBAE/D,YAAY,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,GAAG,EAAE,0BAA0B,KAAK,IAAI;IAKpF,KAAK;IAUL,KAAK;IAYL,eAAe,CAAC,KAAK,EAAE,gBAAgB;IAsBvC,gBAAgB,CAAC,MAAM,CAAC,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE;IAIlD,IAAI,CAAC,MAAM,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE;IAcrC,OAAO,CAAC,mBAAmB;IAO3B,SAAS,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE;IA0D1D,gBAAgB,CAAC,OAAO,EAAE,YAAY,GAAG,MAAM,IAAI;IAqDnD,OAAO,CAAC,kBAAkB,CAAa;IACvC,WAAW,CAAC,WAAW,EAAE,MAAM;IA+B/B,SAAS,CAAC,UAAU,GAAE,OAAc,GAAG,OAAO,GAAG,IAAI;CAsGtD"}
+{"version":3,"file":"image-state.d.ts","sourceRoot":"","sources":["../../src/lib/image-state.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAG5C,MAAM,MAAM,0BAA0B,GAAG;IACvC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF,qBAAa,eAAe;IAC1B,OAAO,CAAC,YAAY,CAAS;IAC7B,OAAO,CAAC,KAAK,CAAiC;IAC9C,OAAO,CAAC,IAAI,CAAwB;IACpC,OAAO,CAAC,aAAa,CAA4C;IACjE,OAAO,CAAC,YAAY,CAAgB;IACpC,OAAO,CAAC,YAAY,CAAuE;IAC3F,OAAO,CAAC,oBAAoB,CAAkB;IAG9C,OAAO,CAAC,KAAK,CAAa;IAC1B,OAAO,CAAC,SAAS,CAAkB;IACnC,OAAO,CAAC,OAAO,CAA4D;gBAE/D,YAAY,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,GAAG,EAAE,0BAA0B,KAAK,IAAI;IAKpF,KAAK;IAUL,KAAK;IAYL,eAAe,CAAC,KAAK,EAAE,gBAAgB;IAsBvC,gBAAgB,CAAC,MAAM,CAAC,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE;IAIlD,IAAI,CAAC,MAAM,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE;IAcrC,OAAO,CAAC,mBAAmB;IAO3B,SAAS,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE;IA0D1D,gBAAgB,CAAC,OAAO,EAAE,YAAY,GAAG,MAAM,IAAI;IAqDnD,OAAO,CAAC,kBAAkB,CAAa;IACvC,WAAW,CAAC,WAAW,EAAE,MAAM;IA+B/B,SAAS,CAAC,UAAU,GAAE,OAAc,GAAG,OAAO,GAAG,IAAI;CAuGtD"}

package/dist/vistaview.js

@@ -5,27 +5,27 @@ function S(s) {
   return s && !/^0(px|%|r?em|vw|vh|vmin|vmax|cm|mm|in|pt|pc|ex|ch)?$/i.test(s.trim()) && s;
 }
 function z(s) {
-  const e = window.getComputedStyle(s).objectFit || "", { width: n, height: i } = s.getBoundingClientRect(), o = s.naturalWidth, a = s.naturalHeight;
+  const e = window.getComputedStyle(s).objectFit || "", { width: i, height: n } = s.getBoundingClientRect(), o = s.naturalWidth, r = s.naturalHeight;
   if (!e)
-    return { width: n, height: i };
-  if (!o || !a)
-    return { width: n, height: i };
-  const r = o / a, l = n / i;
+    return { width: i, height: n };
+  if (!o || !r)
+    return { width: i, height: n };
+  const a = o / r, l = i / n;
   switch (e) {
     case "fill":
-      return { width: n, height: i };
+      return { width: i, height: n };
     case "none":
-      return { width: o, height: a };
+      return { width: o, height: r };
     case "contain":
-      return r > l ? { width: n, height: n / r } : { width: i * r, height: i };
+      return a > l ? { width: i, height: i / a } : { width: n * a, height: n };
     case "cover":
-      return r < l ? { width: n, height: n / r } : { width: i * r, height: i };
+      return a < l ? { width: i, height: i / a } : { width: n * a, height: n };
     case "scale-down": {
-      const c = { width: o, height: a }, m = r > l ? { width: n, height: n / r } : { width: i * r, height: i };
+      const c = { width: o, height: r }, m = a > l ? { width: i, height: i / a } : { width: n * a, height: n };
       return m.width <= c.width && m.height <= c.height ? m : c;
     }
   }
-  return { width: n, height: i };
+  return { width: i, height: n };
 }
 function D(s) {
   const t = getComputedStyle(s), e = s.getBoundingClientRect();
@@ -43,12 +43,12 @@ function D(s) {
   };
 }
 function k(s) {
-  const t = s.imageElm ? D(s.imageElm) : null, e = s.anchorElm ? D(s.anchorElm) : null, n = S(t == null ? void 0 : t.borderRadius), i = e && S(e == null ? void 0 : e.borderRadius), o = (i ? e == null ? void 0 : e.borderRadius : n ? t == null ? void 0 : t.borderRadius : "") || "";
+  const t = s.imageElm ? D(s.imageElm) : null, e = s.anchorElm ? D(s.anchorElm) : null, i = S(t == null ? void 0 : t.borderRadius), n = e && S(e == null ? void 0 : e.borderRadius), o = (n ? e == null ? void 0 : e.borderRadius : i ? t == null ? void 0 : t.borderRadius : "") || "";
   return {
     fit: (t == null ? void 0 : t.objectFit) || (e == null ? void 0 : e.objectFit) || "",
     pos: (t == null ? void 0 : t.objectPosition) || "",
     br: o,
-    overflow: i ? e.overflow : n ? t.overflow : "",
+    overflow: n ? e.overflow : i ? t.overflow : "",
     nw: (t == null ? void 0 : t.naturalWidth) || 0,
     nh: (t == null ? void 0 : t.naturalHeight) || 0,
     w: (e == null ? void 0 : e.width) || (t == null ? void 0 : t.width) || 0,
@@ -57,37 +57,37 @@ function k(s) {
     left: (e == null ? void 0 : e.left) || (t == null ? void 0 : t.left) || 0
   };
 }
-function W(s, t, e, n = !1) {
+function W(s, t, e, i = !1) {
   const {
-    fit: i,
+    fit: n,
     w: o,
-    h: a,
+    h: r,
     // this ones makes things hard. not used.
     // pos,
     // overflow,
-    nw: r,
+    nw: a,
     nh: l,
     br: c,
     top: m,
     left: p
-  } = k(s), L = Math.min(Math.max(p, -o), window.innerWidth + o) - window.innerWidth / 2 + o / 2, g = Math.min(Math.max(m, -a), window.innerHeight + a) - window.innerHeight / 2 + a / 2, d = e.style;
-  d.width = `${o}px`, d.height = `${a}px`, d.objectFit = i, e.width = r, e.height = l, d.setProperty("--vvw-init-radius", `${c}`), d.setProperty("--vvw-pulse-radius", `calc(1.3 * ${c})`), d.setProperty("--vvw-init-x", `${L}px`), d.setProperty("--vvw-init-y", `${g}px`), n && (d.setProperty("--vvw-current-x", `${L}px`), d.setProperty("--vvw-current-y", `${g}px`));
-  const u = z(s.imageElm), y = Math.min(o, u.width), f = Math.min(a, u.height), v = t.style;
-  v.setProperty("--vvw-init-radius", `${c}`), v.setProperty("--vvw-init-w", `${y}px`), v.setProperty("--vvw-init-h", `${f}px`), n && (v.setProperty("--vvw-current-radius", `${c}`), v.setProperty("--vvw-current-w", `${y}px`), v.setProperty("--vvw-current-h", `${f}px`), t.dataset.vvwWidth = y.toString(), t.dataset.vvwHeight = f.toString());
+  } = k(s), L = Math.min(Math.max(p, -o), window.innerWidth + o) - window.innerWidth / 2 + o / 2, g = Math.min(Math.max(m, -r), window.innerHeight + r) - window.innerHeight / 2 + r / 2, d = e.style;
+  d.width = `${o}px`, d.height = `${r}px`, d.objectFit = n, e.width = a, e.height = l, d.setProperty("--vvw-init-radius", `${c}`), d.setProperty("--vvw-pulse-radius", `calc(1.3 * ${c})`), d.setProperty("--vvw-init-x", `${L}px`), d.setProperty("--vvw-init-y", `${g}px`), i && (d.setProperty("--vvw-current-x", `${L}px`), d.setProperty("--vvw-current-y", `${g}px`));
+  const u = z(s.imageElm), y = Math.min(o, u.width), f = Math.min(r, u.height), v = t.style;
+  v.setProperty("--vvw-init-radius", `${c}`), v.setProperty("--vvw-init-w", `${y}px`), v.setProperty("--vvw-init-h", `${f}px`), i && (v.setProperty("--vvw-current-radius", `${c}`), v.setProperty("--vvw-current-w", `${y}px`), v.setProperty("--vvw-current-h", `${f}px`), t.dataset.vvwWidth = y.toString(), t.dataset.vvwHeight = f.toString());
 }
 function M(s) {
-  const t = window.innerWidth, e = window.innerHeight, n = s.naturalWidth, i = s.naturalHeight;
-  if (!n || !i)
+  const t = window.innerWidth, e = window.innerHeight, i = s.naturalWidth, n = s.naturalHeight;
+  if (!i || !n)
     throw new Error("Image natural dimensions are zero");
-  if (n < t && i < e)
+  if (i < t && n < e)
     return {
-      width: n,
-      height: i
+      width: i,
+      height: n
     };
-  const o = n / i, a = t / e;
-  let r, l;
-  return o > a ? (r = t, l = t / o) : (l = e, r = e * o), {
-    width: r,
+  const o = i / n, r = t / e;
+  let a, l;
+  return o > r ? (a = t, l = t / o) : (l = e, a = e * o), {
+    width: a,
     height: l
   };
 }
@@ -115,10 +115,10 @@ function B() {
   }), $);
 }
 function P(s) {
-  const e = B().createHTML(s), n = document.createElement("template");
-  n.innerHTML = e;
-  const i = n.content;
-  return n.remove(), i;
+  const e = B().createHTML(s), i = document.createElement("template");
+  i.innerHTML = e;
+  const n = i.content;
+  return i.remove(), n;
 }
 function j() {
   return {
@@ -126,8 +126,8 @@ function j() {
     icon: Y,
     onClick: async (s) => {
       var o;
-      const t = await fetch(s.src), e = await t.blob(), n = t.url, i = document.createElement("a");
-      i.href = URL.createObjectURL(e), i.download = ((o = n.split("/").pop()) == null ? void 0 : o.split("?")[0].split("#")[0]) || "download", document.body.appendChild(i), i.click(), document.body.removeChild(i);
+      const t = await fetch(s.src), e = await t.blob(), i = t.url, n = document.createElement("a");
+      n.href = URL.createObjectURL(e), n.download = ((o = i.split("/").pop()) == null ? void 0 : o.split("?")[0].split("#")[0]) || "download", document.body.appendChild(n), n.click(), document.body.removeChild(n);
     }
   };
 }
@@ -157,13 +157,13 @@ function U(s, t) {
       <img class="vvw-img-hi" src="${s.src}" alt="${s.alt || ""}" />`
     )
   );
-  const n = e.querySelector("img.vvw-img-lo"), i = e.querySelector("img.vvw-img-hi");
-  return W(s, i, n, t === 0), e;
+  const i = e.querySelector("img.vvw-img-lo"), n = e.querySelector("img.vvw-img-hi");
+  return W(s, n, i, t === 0), e;
 }
 function K({
   controls: s
 }) {
-  const t = (n) => n ? n.map(V).join("") : "";
+  const t = (i) => i ? i.map(V).join("") : "";
   return P(
     `<div class="vvw-root" id="vvw-root">
     <div class="vvw-container">
@@ -199,38 +199,38 @@ function G(s) {
   s.imageContainer.style.width = `${(t * 2 + 1) * 100}vw`, s.imageContainer.style.left = `-${t * 100}vw`, s.imageContainer.style.display = "flex", J(s);
 }
 function J(s) {
-  let t = { x: 0, y: 0 }, e = { x: 0, y: 0 }, n = null;
-  s.registerPointerListener((i) => {
+  let t = { x: 0, y: 0 }, e = { x: 0, y: 0 }, i = null;
+  s.registerPointerListener((n) => {
     var o;
-    if (!i.hasInternalExecution && !(i.pointers.length > 1)) {
-      if (i.event === "down" && (t = { x: i.pointer.x, y: i.pointer.y }, e = { x: i.pointer.x, y: i.pointer.y }, (o = i.abortController) == null || o.abort()), i.event === "move") {
-        e = { x: i.pointer.x, y: i.pointer.y };
-        const a = e.x - t.x, r = e.y - t.y;
-        if (!n && Math.abs(r) > Math.abs(a) || n === "y") {
-          const l = r / window.innerHeight * 100;
-          s.imageContainer.style.transition = "none", s.imageContainer.style.transform = `translateY(${l}vh)`, n = "y";
-        } else if (!n && Math.abs(a) > Math.abs(r) || n === "x") {
-          const l = a / window.innerWidth * 100;
-          s.imageContainer.style.transition = "none", s.imageContainer.style.transform = `translateX(${l}vw)`, n = "x";
+    if (!n.hasInternalExecution && !(n.pointers.length > 1)) {
+      if (n.event === "down" && (t = { x: n.pointer.x, y: n.pointer.y }, e = { x: n.pointer.x, y: n.pointer.y }, (o = n.abortController) == null || o.abort()), n.event === "move") {
+        e = { x: n.pointer.x, y: n.pointer.y };
+        const r = e.x - t.x, a = e.y - t.y;
+        if (!i && Math.abs(a) > Math.abs(r) || i === "y") {
+          const l = a / window.innerHeight * 100;
+          s.imageContainer.style.transition = "none", s.imageContainer.style.transform = `translateY(${l}vh)`, i = "y";
+        } else if (!i && Math.abs(r) > Math.abs(a) || i === "x") {
+          const l = r / window.innerWidth * 100;
+          s.imageContainer.style.transition = "none", s.imageContainer.style.transform = `translateX(${l}vw)`, i = "x";
         }
       }
-      if (i.event === "up" || i.event === "cancel") {
-        let a = function(r) {
+      if (n.event === "up" || n.event === "cancel") {
+        let r = function(a) {
           var l;
           (l = s.imageContainer) == null || l.addEventListener("transitionend", function c() {
             var m;
             (m = s.imageContainer) == null || m.removeEventListener("transitionend", c), s.imageContainer.style.transition = "", s.imageContainer.style.transform = "";
-          }), s.imageContainer.style.transition = "transform 222ms ease", s.imageContainer.style.transform = r;
+          }), s.imageContainer.style.transition = "transform 222ms ease", s.imageContainer.style.transform = a;
         };
-        if (n === "y") {
-          const r = e.y - t.y;
-          Math.abs(r) > 144 ? (s.imageContainer.style.transition = "transform 222ms ease", s.imageContainer.style.transform = "translateY(0vh)", s.close()) : a("translateY(0vh)");
+        if (i === "y") {
+          const a = e.y - t.y;
+          Math.abs(a) > 144 ? (s.imageContainer.style.transition = "transform 222ms ease", s.imageContainer.style.transform = "translateY(0vh)", s.close()) : r("translateY(0vh)");
         }
-        if (n === "x") {
-          const r = e.x - t.x, l = i.pointer.movementX, c = 1;
-          s.imageContainer.style.transition = "", r > 0 && Math.abs(l) > c ? s.prev() : r < 0 && Math.abs(l) > c ? s.next() : a("translateX(0vw)");
+        if (i === "x") {
+          const a = e.x - t.x, l = n.pointer.movementX, c = 1;
+          s.imageContainer.style.transition = "", a > 0 && Math.abs(l) > c ? s.prev() : a < 0 && Math.abs(l) > c ? s.next() : r("translateX(0vw)");
         }
-        n = null, t = { x: 0, y: 0 }, e = { x: 0, y: 0 };
+        i = null, t = { x: 0, y: 0 }, e = { x: 0, y: 0 };
       }
     }
   });
@@ -240,10 +240,10 @@ function Q(s) {
 function tt({
   vistaView: { isReducedMotion: s },
   htmlElements: { to: t },
-  index: { from: e, to: n },
-  vistaView: { elements: i, imageContainer: o, options: a }
-}, r) {
-  if (!(!t || r.aborted || s || !(Math.abs(n - e) === 1 || e === 0 && n === i.length - 1 || e === i.length - 1 && n === 0)))
+  index: { from: e, to: i },
+  vistaView: { elements: n, imageContainer: o, options: r }
+}, a) {
+  if (!(!t || a.aborted || s || !(Math.abs(i - e) === 1 || e === 0 && i === n.length - 1 || e === n.length - 1 && i === 0)))
     return {
       cleanup: () => {
         o.style.transition = "", o.style.transform = "";
@@ -258,11 +258,11 @@ function tt({
         ), o.addEventListener(
           "transitioncancel",
           () => {
-            r.aborted && c();
+            a.aborted && c();
           },
           { once: !0 }
         );
-        const m = Math.round(a.animationDurationBase * 100) / 100, p = n === e + 1 || e === i.length - 1 && n === 0 ? "translateX(-100vw)" : "translateX(100vw)";
+        const m = Math.round(r.animationDurationBase * 100) / 100, p = i === e + 1 || e === n.length - 1 && i === 0 ? "translateX(-100vw)" : "translateX(100vw)";
         o.style.transition = `transform ${m}ms ease`, o.style.transform = p;
       })
     };
@@ -290,7 +290,7 @@ class et {
         id: t.pointerId
       };
       this.pointers.push(e), this.listeners.forEach(
-        (n) => n({
+        (i) => i({
           event: "down",
           pointer: e,
           pointers: this.pointers,
@@ -301,9 +301,9 @@ class et {
     h(this, "onPointerMove", (t) => {
       if (!this.listeners.length) return;
       t.preventDefault();
-      const e = this.pointers.find((n) => n.id === t.pointerId);
+      const e = this.pointers.find((i) => i.id === t.pointerId);
       e && (e.movementX = t.movementX, e.movementY = t.movementY, e.x = t.clientX, e.y = t.clientY, this.listeners.forEach(
-        (n) => n({
+        (i) => i({
           event: "move",
           pointer: e,
           pointers: this.pointers,
@@ -317,15 +317,15 @@ class et {
       t.preventDefault();
       const e = this.pointers.findIndex((o) => o.id === t.pointerId);
       if (e === -1) return;
-      const n = this.pointers[e];
-      n.x = t.clientX, n.y = t.clientY;
-      const i = this.pointers.length;
+      const i = this.pointers[e];
+      i.x = t.clientX, i.y = t.clientY;
+      const n = this.pointers.length;
       this.pointers.splice(e, 1), this.listeners.forEach(
         (o) => o({
           event: "up",
-          pointer: n,
+          pointer: i,
           pointers: this.pointers,
-          lastPointerLen: i
+          lastPointerLen: n
         })
       );
     });
@@ -335,15 +335,15 @@ class et {
       t.preventDefault();
       const e = this.pointers.findIndex((o) => o.id === t.pointerId);
       if (e === -1) return;
-      const n = this.pointers[e];
-      n.x = t.clientX, n.y = t.clientY;
-      const i = this.pointers.length;
+      const i = this.pointers[e];
+      i.x = t.clientX, i.y = t.clientY;
+      const n = this.pointers.length;
       this.pointers.splice(e, 1), this.listeners.forEach(
         (o) => o({
           event: "cancel",
-          pointer: n,
+          pointer: i,
           pointers: this.pointers,
-          lastPointerLen: i
+          lastPointerLen: n
         })
       );
     });
@@ -362,13 +362,13 @@ class et {
     this.listeners = this.listeners.filter((e) => e !== t);
   }
   getPointerDistance(t, e) {
-    const n = t.x - e.x, i = t.y - e.y;
-    return Math.sqrt(n * n + i * i);
+    const i = t.x - e.x, n = t.y - e.y;
+    return Math.sqrt(i * i + n * n);
   }
   getCentroid() {
     if (this.pointers.length === 0) return null;
     const t = this.pointers.reduce(
-      (e, n) => (e.x += n.x, e.y += n.y, e),
+      (e, i) => (e.x += i.x, e.y += i.y, e),
       { x: 0, y: 0 }
     );
     return {
@@ -404,10 +404,10 @@ class it {
       width: t.naturalWidth * this.maxZoomLevel
     }, !t.dataset.vvwWidth || !t.dataset.vvwHeight)
       throw new Error("VistaImageState: Image dataset vvwWidth or vvwHeight not set.");
-    const e = parseFloat(t.dataset.vvwWidth), n = parseFloat(t.dataset.vvwHeight);
+    const e = parseFloat(t.dataset.vvwWidth), i = parseFloat(t.dataset.vvwHeight);
     this.minDimension = {
       initialWidth: e,
-      initialHeight: n,
+      initialHeight: i,
       minWidth: e * 0.1,
       closingWidth: e * 0.5
     }, this.accumulatedTranslate = { x: 0, y: 0 };
@@ -418,87 +418,81 @@ class it {
   move(t) {
     this.image && (this.rect || (this.rect = this.image.getBoundingClientRect()), this.translate.x = C(t.x - this.initialCenter.x), this.translate.y = C(t.y - this.initialCenter.y), this.image.style.transform = `translate3d(${this.translate.x}px, ${this.translate.y}px, 0px) scale(${this.scale})`);
   }
-  snapToTargetIfClose(t, e, n = 1) {
-    return Math.abs(t - e) <= n && (t = e), t;
+  snapToTargetIfClose(t, e, i = 1) {
+    return Math.abs(t - e) <= i && (t = e), t;
   }
   scaleMove(t, e) {
     if (!this.image) return;
     this.rect || (this.rect = this.image.getBoundingClientRect()), e || (e = this.initialCenter);
-    const n = this.snapToTargetIfClose(
+    const i = this.snapToTargetIfClose(
       q(this.rect.width * t, this.minDimension.minWidth, this.maxDimension.width),
       this.minDimension.initialWidth
     );
     this.onScale && this.onScale({
-      scale: n / (this.maxDimension.width / this.maxZoomLevel),
-      isMax: n >= this.maxDimension.width,
-      isMin: n <= this.minDimension.initialWidth
-    }), this.scale = C(n / this.rect.width);
-    const i = this.rect.left + this.rect.width / 2, o = this.rect.top + this.rect.height / 2, a = this.initialCenter.x - i, r = this.initialCenter.y - o, l = a * (1 - this.scale), c = r * (1 - this.scale), m = e.x - this.initialCenter.x, p = e.y - this.initialCenter.y;
-    this.translate.x = C(l + m), this.translate.y = C(c + p), this.image.style.transform = `translate3d(${this.translate.x}px, ${this.translate.y}px, 0px) scale(${this.scale})`, n <= this.minDimension.closingWidth ? this.image.style.opacity = "0.5" : this.image.style.opacity = "";
+      scale: i / (this.maxDimension.width / this.maxZoomLevel),
+      isMax: i >= this.maxDimension.width,
+      isMin: i <= this.minDimension.initialWidth
+    }), this.scale = C(i / this.rect.width);
+    const n = this.rect.left + this.rect.width / 2, o = this.rect.top + this.rect.height / 2, r = this.initialCenter.x - n, a = this.initialCenter.y - o, l = r * (1 - this.scale), c = a * (1 - this.scale), m = e.x - this.initialCenter.x, p = e.y - this.initialCenter.y;
+    this.translate.x = C(l + m), this.translate.y = C(c + p), this.image.style.transform = `translate3d(${this.translate.x}px, ${this.translate.y}px, 0px) scale(${this.scale})`, i <= this.minDimension.closingWidth ? this.image.style.opacity = "0.5" : this.image.style.opacity = "";
   }
   moveAndNormalize(t) {
-    let e = 0, n = !1;
-    const i = ({ x: o, y: a }) => {
-      if (n)
+    let e = 0, i = !1;
+    const n = ({ x: o, y: r }) => {
+      if (i)
         return;
-      if (Math.abs(o) < 1e-3 && Math.abs(a) < 1e-3)
+      if (Math.abs(o) < 1e-3 && Math.abs(r) < 1e-3)
         return this.normalize();
-      o *= 0.9, a *= 0.9;
-      const r = this.image.getBoundingClientRect();
-      this.translate.x = C(this.translate.x + o), this.translate.y = C(this.translate.y + a), r.right < window.innerWidth / 2 && (this.translate.x += (window.innerWidth / 2 - r.right) * 0.1, o *= 0.7), r.left > window.innerWidth / 2 && (this.translate.x -= (r.left - window.innerWidth / 2) * 0.1, o *= 0.7), r.bottom < window.innerHeight / 2 && (this.translate.y += (window.innerHeight / 2 - r.bottom) * 0.1, a *= 0.7), r.top > window.innerHeight / 2 && (this.translate.y -= (r.top - window.innerHeight / 2) * 0.1, a *= 0.7), this.image.style.transform = `translate3d(${this.translate.x}px, ${this.translate.y}px, 0px) scale(${this.scale})`, e = requestAnimationFrame(() => i({ x: o, y: a }));
+      o *= 0.9, r *= 0.9;
+      const a = this.image.getBoundingClientRect();
+      this.translate.x = C(this.translate.x + o), this.translate.y = C(this.translate.y + r), a.right < window.innerWidth / 2 && (this.translate.x += (window.innerWidth / 2 - a.right) * 0.1, o *= 0.7), a.left > window.innerWidth / 2 && (this.translate.x -= (a.left - window.innerWidth / 2) * 0.1, o *= 0.7), a.bottom < window.innerHeight / 2 && (this.translate.y += (window.innerHeight / 2 - a.bottom) * 0.1, r *= 0.7), a.top > window.innerHeight / 2 && (this.translate.y -= (a.top - window.innerHeight / 2) * 0.1, r *= 0.7), this.image.style.transform = `translate3d(${this.translate.x}px, ${this.translate.y}px, 0px) scale(${this.scale})`, e = requestAnimationFrame(() => n({ x: o, y: r }));
     };
-    return i({
+    return n({
       x: t.movementX,
       y: t.movementY
     }), () => {
-      n = !0, cancelAnimationFrame(e), this.normalize(!1);
+      i = !0, cancelAnimationFrame(e), this.normalize(!1);
     };
   }
   animateZoom(t) {
     if (!this.image) return;
     this.rect || (this.rect = this.image.getBoundingClientRect());
-    const e = Date.now(), n = this.image;
-    this.rect.width * t < this.minDimension.closingWidth || n.width < Math.floor(this.minDimension.initialWidth) || (n.addEventListener(
+    const e = Date.now(), i = this.image;
+    this.rect.width * t < this.minDimension.closingWidth || i.width < Math.floor(this.minDimension.initialWidth) || (i.addEventListener(
       "transitionend",
       () => {
-        this.animationTimestamp === e && n && (n.style.transition = "", this.normalize());
+        this.animationTimestamp === e && i && (i.style.transition = "", this.normalize());
       },
       { once: !0 }
-    ), n.style.transition || (n.style.transition = "all 222ms ease"), this.animationTimestamp = e, this.scaleMove(t));
+    ), i.style.transition || (i.style.transition = "all 222ms ease"), this.animationTimestamp = e, this.scaleMove(t));
   }
   normalize(t = !0) {
     if (!this.image || !this.rect) return;
-    const e = this.snapToTargetIfClose(
-      this.rect.width * this.scale,
-      this.minDimension.initialWidth
-    ), n = this.snapToTargetIfClose(
-      this.rect.height * this.scale,
-      this.minDimension.initialHeight
-    );
-    if (this.image.style.width = `${e}px`, this.image.style.height = `${n}px`, this.scale = 1, this.image.style.opacity = "", this.accumulatedTranslate.x += this.translate.x, this.accumulatedTranslate.y += this.translate.y, this.image.style.left = `calc(50% + ${this.accumulatedTranslate.x}px)`, this.image.style.top = `calc(50% + ${this.accumulatedTranslate.y}px)`, this.translate = { x: 0, y: 0 }, this.image.style.transform = "", this.rect = this.image.getBoundingClientRect(), e <= this.minDimension.closingWidth)
-      return this.clean(), !0;
-    if (e < this.minDimension.initialWidth)
+    const e = this.rect.width * this.scale, i = e <= this.minDimension.closingWidth, n = i ? e : this.snapToTargetIfClose(this.rect.width * this.scale, this.minDimension.initialWidth), o = i ? this.rect.height * this.scale : this.snapToTargetIfClose(this.rect.height * this.scale, this.minDimension.initialHeight);
+    if (this.image.style.width = `${n}px`, this.image.style.height = `${o}px`, this.scale = 1, this.image.style.opacity = "", this.accumulatedTranslate.x += this.translate.x, this.accumulatedTranslate.y += this.translate.y, this.image.style.left = `calc(50% + ${this.accumulatedTranslate.x}px)`, this.image.style.top = `calc(50% + ${this.accumulatedTranslate.y}px)`, this.translate = { x: 0, y: 0 }, this.image.style.transform = "", this.rect = this.image.getBoundingClientRect(), i)
+      return !0;
+    if (n < this.minDimension.initialWidth)
       this.accumulatedTranslate.x = 0, this.accumulatedTranslate.y = 0, requestAnimationFrame(() => {
-        const i = this.image;
-        i && (i.addEventListener(
+        const r = this.image;
+        r && (r.addEventListener(
           "transitionend",
           () => {
-            i && (this.clean(), this.rect = null);
+            r && (this.clean(), this.rect = null);
           },
           { once: !0 }
-        ), i.style.transition = "all 222ms ease", i.style.width = `${this.minDimension.initialWidth}px`, i.style.height = `${this.minDimension.initialHeight}px`, i.style.left = "50%", i.style.top = "50%");
+        ), r.style.transition = "all 222ms ease", r.style.width = `${this.minDimension.initialWidth}px`, r.style.height = `${this.minDimension.initialHeight}px`, r.style.left = "50%", r.style.top = "50%");
       });
     else if (t) {
-      let i = !1;
-      if (this.rect.right < window.innerWidth / 2 && (i = !0, this.accumulatedTranslate.x += window.innerWidth / 2 - this.rect.right), this.rect.left > window.innerWidth / 2 && (i = !0, this.accumulatedTranslate.x -= this.rect.left - window.innerWidth / 2), this.rect.bottom < window.innerHeight / 2 && (i = !0, this.accumulatedTranslate.y += window.innerHeight / 2 - this.rect.bottom), this.rect.top > window.innerHeight / 2 && (i = !0, this.accumulatedTranslate.y -= this.rect.top - window.innerHeight / 2), i) {
-        const o = this.image;
-        o.addEventListener(
+      let r = !1;
+      if (this.rect.right < window.innerWidth / 2 && (r = !0, this.accumulatedTranslate.x += window.innerWidth / 2 - this.rect.right), this.rect.left > window.innerWidth / 2 && (r = !0, this.accumulatedTranslate.x -= this.rect.left - window.innerWidth / 2), this.rect.bottom < window.innerHeight / 2 && (r = !0, this.accumulatedTranslate.y += window.innerHeight / 2 - this.rect.bottom), this.rect.top > window.innerHeight / 2 && (r = !0, this.accumulatedTranslate.y -= this.rect.top - window.innerHeight / 2), r) {
+        const a = this.image;
+        a.addEventListener(
           "transitionend",
           () => {
-            o && (o.style.transition = "", this.rect = null);
+            a && (a.style.transition = "", this.rect = null);
           },
           { once: !0 }
-        ), o.style.transition = "all 222ms ease", o.style.left = `calc(50% + ${this.accumulatedTranslate.x}px)`, o.style.top = `calc(50% + ${this.accumulatedTranslate.y}px)`;
+        ), a.style.transition = "all 222ms ease", a.style.left = `calc(50% + ${this.accumulatedTranslate.x}px)`, a.style.top = `calc(50% + ${this.accumulatedTranslate.y}px)`;
       } else
         this.rect = null;
     }
@@ -509,15 +503,15 @@ class nt {
     h(this, "fiolast", {});
   }
   // first in out
-  fio(t, e, n = 50) {
-    const o = Date.now() - (this.fiolast[e] ?? 0), a = () => {
+  fio(t, e, i = 50) {
+    const o = Date.now() - (this.fiolast[e] ?? 0), r = () => {
       this.fiolast[e] = Date.now(), t();
     };
     if (!this.fiolast[e]) {
-      a();
+      r();
       return;
     }
-    o >= n && a();
+    o >= i && r();
   }
 }
 const x = {
@@ -579,10 +573,10 @@ class st {
     });
     h(this, "onResizeHandler", () => {
       this.currentChildren.htmls.forEach((t, e) => {
-        const n = this.currentChildren.images[e], i = t.querySelector("img.vvw-img-hi"), o = t.querySelector("img.vvw-img-lo");
-        if (W(n, i, o, !1), i.classList.contains("vvw--loaded")) {
-          const { width: a, height: r } = M(i);
-          i.style.setProperty("--vvw-current-w", `${a}px`), i.style.setProperty("--vvw-current-h", `${r}px`), i.dataset.vvwWidth = a.toString(), i.dataset.vvwHeight = r.toString();
+        const i = this.currentChildren.images[e], n = t.querySelector("img.vvw-img-hi"), o = t.querySelector("img.vvw-img-lo");
+        if (W(i, n, o, !1), n.classList.contains("vvw--loaded")) {
+          const { width: r, height: a } = M(n);
+          n.style.setProperty("--vvw-current-w", `${r}px`), n.style.setProperty("--vvw-current-h", `${a}px`), n.dataset.vvwWidth = r.toString(), n.dataset.vvwHeight = a.toString();
         }
       });
     });
@@ -590,35 +584,35 @@ class st {
     h(this, "pointerListeners", []);
     h(this, "getInternalPointerListener", () => {
       const t = this.imageState;
-      let e = 0, n = !1, i = () => {
+      let e = 0, i = !1, n = () => {
       };
       return (o) => {
         if (o.event === "down") {
-          if (i(), this.isZoomedIn && o.pointers.length === 1) {
-            const a = this.pointers.getCentroid();
-            t.setInitialCenter(a);
+          if (n(), this.isZoomedIn && o.pointers.length === 1) {
+            const r = this.pointers.getCentroid();
+            t.setInitialCenter(r);
           }
           if (o.pointers.length >= 2) {
-            n = !0;
-            const a = this.pointers.getCentroid();
-            e = this.pointers.getPointerDistance(o.pointers[0], o.pointers[1]), t.setInitialCenter(a);
+            i = !0;
+            const r = this.pointers.getCentroid();
+            e = this.pointers.getPointerDistance(o.pointers[0], o.pointers[1]), t.setInitialCenter(r);
           }
         } else if (o.event === "move") {
           if (this.isZoomedIn && o.pointers.length === 1 && o.lastPointerLen === 0) {
-            const a = this.pointers.getCentroid();
-            t.move(a);
+            const r = this.pointers.getCentroid();
+            t.move(r);
           }
-          if (o.pointers.length >= 2 && n) {
-            const a = this.pointers.getCentroid(), r = this.pointers.getPointerDistance(o.pointers[0], o.pointers[1]);
-            t.scaleMove(r / e, a);
+          if (o.pointers.length >= 2 && i) {
+            const r = this.pointers.getCentroid(), a = this.pointers.getPointerDistance(o.pointers[0], o.pointers[1]);
+            t.scaleMove(a / e, r);
           }
-        } else (o.event === "up" || o.event === "cancel") && (n || this.isZoomedIn) && (n ? (n = !1, t.normalize() && requestAnimationFrame(() => {
+        } else (o.event === "up" || o.event === "cancel") && (i || this.isZoomedIn) && (i ? (i = !1, t.normalize() && requestAnimationFrame(() => {
           this.close();
-        })) : this.isZoomedIn && o.pointers.length === 0 && (i = t.moveAndNormalize(o.pointer)));
+        })) : this.isZoomedIn && o.pointers.length === 0 && (n = t.moveAndNormalize(o.pointer)));
         this.pointerListeners.forEach(
-          (a) => a({
+          (r) => r({
             ...o,
-            hasInternalExecution: this.isZoomedIn || n,
+            hasInternalExecution: this.isZoomedIn || i,
             abortController: this.abortController
           })
         );
@@ -633,72 +627,72 @@ class st {
       }
     }, this.imageState = new it(
       this.options.maxZoomLevel,
-      (n) => {
-        var i, o, a, r, l, c;
-        n.isMin ? (this.isZoomedIn = !1, (i = this.qs(".vvw-zoom-out")) == null || i.setAttribute("disabled", "true"), (o = this.qs('.vvw-item[data-vvw-idx="' + this.currentIndex + '"]')) == null || o.style.setProperty(
+      (i) => {
+        var n, o, r, a, l, c;
+        i.isMin ? (this.isZoomedIn = !1, (n = this.qs(".vvw-zoom-out")) == null || n.setAttribute("disabled", "true"), (o = this.qs('.vvw-item[data-vvw-idx="' + this.currentIndex + '"]')) == null || o.style.setProperty(
           "pointer-events",
           "none"
-        )) : (this.isZoomedIn = !0, (a = this.qs(".vvw-zoom-out")) == null || a.removeAttribute("disabled"), (r = this.qs('.vvw-item[data-vvw-idx="' + this.currentIndex + '"]')) == null || r.style.setProperty(
+        )) : (this.isZoomedIn = !0, (r = this.qs(".vvw-zoom-out")) == null || r.removeAttribute("disabled"), (a = this.qs('.vvw-item[data-vvw-idx="' + this.currentIndex + '"]')) == null || a.style.setProperty(
           "pointer-events",
           "auto"
-        )), n.isMax ? (l = this.qs(".vvw-zoom-in")) == null || l.setAttribute("disabled", "true") : (c = this.qs(".vvw-zoom-in")) == null || c.removeAttribute("disabled");
+        )), i.isMax ? (l = this.qs(".vvw-zoom-in")) == null || l.setAttribute("disabled", "true") : (c = this.qs(".vvw-zoom-in")) == null || c.removeAttribute("disabled");
       }
-    ), this.options.setupFunction && (this.setupFunction = this.options.setupFunction), this.options.closeFunction && (this.closeFunction = this.options.closeFunction), this.options.initFunction && (this.initFunction = this.options.initFunction), this.options.transitionFunction && (this.transitionFunction = this.options.transitionFunction), this.isReducedMotion = window.matchMedia("(prefers-reduced-motion: reduce)").matches, this.elements instanceof NodeList && this.elements.forEach((n, i) => {
-      n.dataset.vistaIdx = i.toString(), n.addEventListener("click", this.defaultOnClickHandler), n.addEventListener("pointerup", this.onClickElements);
+    ), this.options.setupFunction && (this.setupFunction = this.options.setupFunction), this.options.closeFunction && (this.closeFunction = this.options.closeFunction), this.options.initFunction && (this.initFunction = this.options.initFunction), this.options.transitionFunction && (this.transitionFunction = this.options.transitionFunction), this.isReducedMotion = window.matchMedia("(prefers-reduced-motion: reduce)").matches, this.elements instanceof NodeList && this.elements.forEach((i, n) => {
+      i.dataset.vistaIdx = n.toString(), i.addEventListener("click", this.defaultOnClickHandler), i.addEventListener("pointerup", this.onClickElements);
     });
   }
   qs(t) {
     return this.root ? this.root.querySelector(t) : null;
   }
   async swap(t, e) {
-    const n = this.options.preloads || 0, i = this.currentIndex, { htmls: o, images: a } = this.getChildElements(n, i), r = this.imageContainer, l = this.currentChildren, c = {
+    const i = this.options.preloads || 0, n = this.currentIndex, { htmls: o, images: r } = this.getChildElements(i, n), a = this.imageContainer, l = this.currentChildren, c = {
       htmlElements: { from: l.htmls, to: o },
-      images: { from: l.images, to: a },
+      images: { from: l.images, to: r },
       index: { from: t, to: this.currentIndex },
       via: e || { next: !1, prev: !1 },
       vistaView: this
     };
-    this.setupFunction(c), this.currentChildren = { htmls: o, images: a }, this.displayActiveIndex();
+    this.setupFunction(c), this.currentChildren = { htmls: o, images: r }, this.displayActiveIndex();
     const m = this.abortController.signal;
     if (performance.now() - this.lastSwapTime < this.options.rapidLimit) {
-      r.innerHTML = "", this.transitionCleanup && this.transitionCleanup(), o.forEach((b) => {
-        r.appendChild(b);
+      a.innerHTML = "", this.transitionCleanup && this.transitionCleanup(), o.forEach((b) => {
+        a.appendChild(b);
       }), this.lastSwapTime = performance.now(), this.waitForImagesToLoad(), this.options.onImageView && this.options.onImageView(c);
       return;
     }
     const g = this.transitionFunction(c, m);
     g && (this.transitionCleanup = g.cleanup, await g.transitionEnded), this.lastSwapTime = performance.now();
-    const d = o[Math.floor(o.length / 2)].dataset.vvwIdx, u = r.querySelector(
+    const d = o[Math.floor(o.length / 2)].dataset.vvwIdx, u = a.querySelector(
       `.vvw-item[data-vvw-idx="${d}"] img.vvw-img-hi`
     ), y = this.imageTransitions.get(u);
     this.imageTransitions.delete(u);
     const f = u.getAttribute("style") || "", v = u.classList.contains("vvw--loaded"), E = u.classList.contains("vvw--ready"), I = u.width, T = u.height;
-    this.imageState.reset(), r.innerHTML = "", this.transitionCleanup && this.transitionCleanup(), o.forEach((b) => {
+    this.imageState.reset(), a.innerHTML = "", this.transitionCleanup && this.transitionCleanup(), o.forEach((b) => {
       const w = b.querySelector("img.vvw-img-hi");
-      b.dataset.vvwPos === "0" && !m.aborted && f && I && T && (v && (w.classList.add("vvw--loaded"), w.dataset.vvwWidth = u.dataset.vvwWidth || "", w.dataset.vvwHeight = u.dataset.vvwHeight || ""), E && (w.classList.add("vvw--ready"), w.width = I, w.height = T), w.setAttribute("style", f)), r.appendChild(b), b.dataset.vvwPos === "0" && !m.aborted && E ? (this.imageState.setCurrentImage(w), this.imageState.setInitialCenter()) : b.dataset.vvwPos === "0" && !m.aborted && f && I && T && v && y && (this.imageTransitions.set(w, y), this.transitionImage(w, () => {
+      b.dataset.vvwPos === "0" && !m.aborted && f && I && T && (v && (w.classList.add("vvw--loaded"), w.dataset.vvwWidth = u.dataset.vvwWidth || "", w.dataset.vvwHeight = u.dataset.vvwHeight || ""), E && (w.classList.add("vvw--ready"), w.width = I, w.height = T), w.setAttribute("style", f)), a.appendChild(b), b.dataset.vvwPos === "0" && !m.aborted && E ? (this.imageState.setCurrentImage(w), this.imageState.setInitialCenter()) : b.dataset.vvwPos === "0" && !m.aborted && f && I && T && v && y && (this.imageTransitions.set(w, y), this.transitionImage(w, () => {
         this.imageState.setCurrentImage(w), this.imageState.setInitialCenter(), w.classList.add("vvw--ready");
       }));
     }), this.waitForImagesToLoad(), this.options.onImageView && this.options.onImageView(c);
   }
   getChildElements(t, e) {
-    const n = [], i = [];
+    const i = [], n = [];
     for (let o = -t; o <= t; o++) {
-      const a = (e + o + this.elements.length) % this.elements.length, r = this.elements[a], l = r instanceof HTMLImageElement ? r : r instanceof HTMLAnchorElement && r.querySelector("img") || void 0, c = r instanceof HTMLElement ? {
-        index: a,
+      const r = (e + o + this.elements.length) % this.elements.length, a = this.elements[r], l = a instanceof HTMLImageElement ? a : a instanceof HTMLAnchorElement && a.querySelector("img") || void 0, c = a instanceof HTMLElement ? {
+        index: r,
         imageElm: l instanceof HTMLImageElement ? l : void 0,
-        anchorElm: r instanceof HTMLAnchorElement ? r : void 0,
-        src: r.dataset.vistaviewSrc || r.getAttribute("href") || r.getAttribute("src") || "",
-        thumb: r.dataset.vistaviewThumb || (l instanceof HTMLImageElement ? l.getAttribute("src") : void 0) || r.getAttribute("href") || void 0,
+        anchorElm: a instanceof HTMLAnchorElement ? a : void 0,
+        src: a.dataset.vistaviewSrc || a.getAttribute("href") || a.getAttribute("src") || "",
+        thumb: a.dataset.vistaviewThumb || (l instanceof HTMLImageElement ? l.getAttribute("src") : void 0) || a.getAttribute("href") || void 0,
         alt: l instanceof HTMLImageElement && l.getAttribute("alt") || void 0
       } : {
-        index: a,
-        ...r
+        index: r,
+        ...a
       };
-      i.push(c), n.push(U(c, o));
+      n.push(c), i.push(U(c, o));
     }
     return {
-      htmls: n,
-      images: i
+      htmls: i,
+      images: n
     };
   }
   zoomIn() {
@@ -720,58 +714,58 @@ class st {
     );
   }
   displayActiveIndex() {
-    var a;
+    var r;
     const t = this.currentIndex;
-    this.elements instanceof NodeList && this.elements.forEach((r, l) => {
-      r.style.opacity = "", l === t && (r.style.opacity = "0");
+    this.elements instanceof NodeList && this.elements.forEach((a, l) => {
+      a.style.opacity = "", l === t && (a.style.opacity = "0");
     });
-    const e = this.qs(".vvw-index"), n = `${t + 1}`, i = `${this.elements.length}`;
-    e && (e.textContent = `${n} / ${i}`);
+    const e = this.qs(".vvw-index"), i = `${t + 1}`, n = `${this.elements.length}`;
+    e && (e.textContent = `${i} / ${n}`);
     const o = this.qs(".vvw-desc");
     if (o) {
-      const r = (a = this.currentChildren) == null ? void 0 : a.images.find((c) => c.index === t), l = (r == null ? void 0 : r.alt) || "";
-      l ? (o.textContent = l, o.setAttribute("aria-label", `Image ${n} of ${i}: ${l}`)) : (o.textContent = "", o.setAttribute("aria-label", `Image ${n} of ${i}`));
+      const a = (r = this.currentChildren) == null ? void 0 : r.images.find((c) => c.index === t), l = (a == null ? void 0 : a.alt) || "";
+      l ? (o.textContent = l, o.setAttribute("aria-label", `Image ${i} of ${n}: ${l}`)) : (o.textContent = "", o.setAttribute("aria-label", `Image ${i} of ${n}`));
     }
   }
   transitionImage(t, e) {
-    const n = this.imageTransitions.get(t);
-    n && requestAnimationFrame(() => {
-      const { current: i, target: o } = n, a = {
-        width: i.width + (o.width - i.width) * 0.1,
-        height: i.height + (o.height - i.height) * 0.1,
-        radius: i.radius + (o.radius - i.radius) * 0.1
+    const i = this.imageTransitions.get(t);
+    i && requestAnimationFrame(() => {
+      const { current: n, target: o } = i, r = {
+        width: n.width + (o.width - n.width) * 0.1,
+        height: n.height + (o.height - n.height) * 0.1,
+        radius: n.radius + (o.radius - n.radius) * 0.1
       };
-      Math.abs(a.width - o.width) < 0.5 && Math.abs(a.height - o.height) < 0.5 && Math.abs(a.radius - o.radius) < 0.5 ? (t.style.setProperty("--vvw-current-w", `${o.width}px`), t.style.setProperty("--vvw-current-h", `${o.height}px`), t.style.setProperty("--vvw-current-radius", `${o.radius}px`), this.imageTransitions.delete(t), e()) : (t.style.setProperty("--vvw-current-w", `${a.width}px`), t.style.setProperty("--vvw-current-h", `${a.height}px`), t.style.setProperty("--vvw-current-radius", `${a.radius}px`), this.imageTransitions.set(t, { current: a, target: o }), this.transitionImage(t, e));
+      Math.abs(r.width - o.width) < 0.5 && Math.abs(r.height - o.height) < 0.5 && Math.abs(r.radius - o.radius) < 0.5 ? (t.style.setProperty("--vvw-current-w", `${o.width}px`), t.style.setProperty("--vvw-current-h", `${o.height}px`), t.style.setProperty("--vvw-current-radius", `${o.radius}px`), this.imageTransitions.delete(t), e()) : (t.style.setProperty("--vvw-current-w", `${r.width}px`), t.style.setProperty("--vvw-current-h", `${r.height}px`), t.style.setProperty("--vvw-current-radius", `${r.radius}px`), this.imageTransitions.set(t, { current: r, target: o }), this.transitionImage(t, e));
     });
   }
   waitForImagesToLoad() {
-    this.imageContainer.querySelectorAll("img.vvw-img-hi:not(.vvw--loaded)").forEach((n) => {
-      const i = n, o = () => {
+    this.imageContainer.querySelectorAll("img.vvw-img-hi:not(.vvw--loaded)").forEach((i) => {
+      const n = i, o = () => {
         var c;
-        i.width = i.naturalWidth, i.height = i.naturalHeight;
-        const a = (c = i.parentElement) == null ? void 0 : c.matches(`[data-vvw-idx="${this.currentIndex}"]`), { width: r, height: l } = M(i);
-        i.dataset.vvwWidth = r.toString(), i.dataset.vvwHeight = l.toString(), i.classList.add("vvw--loaded"), this.imageTransitions.set(i, {
+        n.width = n.naturalWidth, n.height = n.naturalHeight;
+        const r = (c = n.parentElement) == null ? void 0 : c.matches(`[data-vvw-idx="${this.currentIndex}"]`), { width: a, height: l } = M(n);
+        n.dataset.vvwWidth = a.toString(), n.dataset.vvwHeight = l.toString(), n.classList.add("vvw--loaded"), this.imageTransitions.set(n, {
           current: {
-            width: i.style.getPropertyValue("--vvw-current-w") ? parseFloat(i.style.getPropertyValue("--vvw-current-w")) : 0,
-            height: i.style.getPropertyValue("--vvw-current-h") ? parseFloat(i.style.getPropertyValue("--vvw-current-h")) : 0,
-            radius: i.style.getPropertyValue("--vvw-current-radius") ? parseFloat(i.style.getPropertyValue("--vvw-current-radius")) : 0
+            width: n.style.getPropertyValue("--vvw-current-w") ? parseFloat(n.style.getPropertyValue("--vvw-current-w")) : 0,
+            height: n.style.getPropertyValue("--vvw-current-h") ? parseFloat(n.style.getPropertyValue("--vvw-current-h")) : 0,
+            radius: n.style.getPropertyValue("--vvw-current-radius") ? parseFloat(n.style.getPropertyValue("--vvw-current-radius")) : 0
           },
-          target: { width: r, height: l, radius: 0 }
-        }), this.transitionImage(i, () => {
-          a && (this.imageState.setCurrentImage(i), this.imageState.setInitialCenter()), i.classList.add("vvw--ready");
+          target: { width: a, height: l, radius: 0 }
+        }), this.transitionImage(n, () => {
+          r && (this.imageState.setCurrentImage(n), this.imageState.setInitialCenter()), n.classList.add("vvw--ready");
         });
       };
-      if (i.complete && i.naturalWidth !== 0) {
+      if (n.complete && n.naturalWidth !== 0) {
         o();
         return;
       }
-      i.addEventListener("load", () => {
+      n.addEventListener("load", () => {
         o();
-      }), i.addEventListener("error", () => {
-        var r;
-        i.classList.add("vvw--loaderror");
-        const a = document.createElement("p");
-        a.className = "vvw-img-err", a.setAttribute("role", "alert"), a.textContent = "Error loading image", (r = i.parentNode) == null || r.appendChild(a);
+      }), n.addEventListener("error", () => {
+        var a;
+        n.classList.add("vvw--loaderror");
+        const r = document.createElement("p");
+        r.className = "vvw-img-err", r.setAttribute("role", "alert"), r.textContent = "Error loading image", (a = n.parentNode) == null || a.appendChild(r);
       });
     });
   }
@@ -793,14 +787,14 @@ class st {
     if (document.body.prepend(e), this.root = document.body.querySelector("#vvw-root"), !this.root)
       throw new Error("Failed to setup VistaView root element.");
     this.imageContainer = this.qs(".vvw-image-container"), this.options.animationDurationBase && this.root.style.setProperty("--vvw-anim-dur", `${this.options.animationDurationBase}`), this.options.initialZIndex !== void 0 && this.root.style.setProperty("--vvw-init-z", `${this.options.initialZIndex ?? 0}`), this.options.arrowOnSmallScreens && this.root.classList.add("vvw-arrow-sm");
-    const n = this.options.preloads || 0, i = t, { images: o, htmls: a } = this.getChildElements(n, i), r = {
-      htmlElements: { from: null, to: a },
+    const i = this.options.preloads || 0, n = t, { images: o, htmls: r } = this.getChildElements(i, n), a = {
+      htmlElements: { from: null, to: r },
       images: { from: null, to: o },
       index: { from: null, to: this.currentIndex },
       via: { next: !1, prev: !1 },
       vistaView: this
     };
-    this.setupFunction(r), this.currentChildren = { htmls: a, images: o }, a.forEach((d) => {
+    this.setupFunction(a), this.currentChildren = { htmls: r, images: o }, r.forEach((d) => {
       this.imageContainer.appendChild(d);
     }), (c = this.qs(".vvw-close")) == null || c.addEventListener("click", () => this.close()), (m = this.qs(".vvw-zoom-in")) == null || m.addEventListener("click", () => this.zoomIn()), (p = this.qs(".vvw-zoom-out")) == null || p.addEventListener("click", () => this.zoomOut()), (L = this.qs(".vvw-prev>button")) == null || L.addEventListener("click", () => this.prev()), (g = this.qs(".vvw-next>button")) == null || g.addEventListener("click", () => this.next()), this.options.keyboardListeners && window.addEventListener("keydown", this.onKeyDown), window.addEventListener("wheel", this.onScroll, { passive: !1 }), window.addEventListener("resize", this.onResizeHandler), this.pointers = new et({
       elm: this.imageContainer,
@@ -835,17 +829,17 @@ class st {
           (u = this.root) == null || u.classList.add("vvw--settled"), this.waitForImagesToLoad(), this.imageState.reset();
         },
         { once: !0 }
-      ), this.root.classList.add("vvw--active"), this.displayActiveIndex(), this.options.onOpen && this.options.onOpen(this), this.options.onImageView && this.options.onImageView(r);
+      ), this.root.classList.add("vvw--active"), this.displayActiveIndex(), this.options.onOpen && this.options.onOpen(this), this.options.onImageView && this.options.onImageView(a);
     });
   }
   /// CLOSE
   async close(t = !0) {
     x.somethingOpened === this && this.root && (t ? await new Promise((e) => {
-      let i = 0;
+      let n = 0;
       this.root.addEventListener("transitionend", (o) => {
-        o.target === this.root && (i++, i === 2 && this.elements instanceof NodeList && this.elements.forEach((a) => {
-          a.style.opacity = "";
-        }), i === 3 && e(null));
+        o.target === this.root && (n++, n === 2 && this.elements instanceof NodeList && this.elements.forEach((r) => {
+          r.style.opacity = "";
+        }), n === 3 && e(null));
       }), this.root.classList.add("vvw--closing");
     }) : this.elements instanceof NodeList && this.elements.forEach((e) => {
       e.style.opacity = "";
@@ -874,25 +868,25 @@ class st {
   view(t, e) {
     if (x.somethingOpened !== this || t < 0 || t >= this.elements.length)
       return;
-    const n = this.currentIndex;
+    const i = this.currentIndex;
     this.currentIndex = t;
-    const i = this.abortController;
-    i == null || i.abort(), this.abortController = new AbortController(), this.swap(n, e);
+    const n = this.abortController;
+    n == null || n.abort(), this.abortController = new AbortController(), this.swap(i, e);
   }
 }
 function ot(s) {
   let t = null;
   if (typeof s == "string" ? t = document.querySelectorAll(s) : s instanceof NodeList && (t = s), t)
     for (let e = 0; e < t.length; e++) {
-      const n = t[e];
-      if (!(n.dataset.vistaviewSrc || n.getAttribute("href") || n.getAttribute("src") || ""))
+      const i = t[e];
+      if (!(i.dataset.vistaviewSrc || i.getAttribute("href") || i.getAttribute("src") || ""))
         return `Element at index ${e} is missing 'src' / 'data-vistaview-src' / 'href' attribute.`;
     }
   else {
     const e = s;
-    for (let n = 0; n < e.length; n++)
-      if (!e[n].src)
-        return `Element at index ${n} is missing 'src' attribute.`;
+    for (let i = 0; i < e.length; i++)
+      if (!e[i].src)
+        return `Element at index ${i} is missing 'src' attribute.`;
   }
   return t || s;
 }
@@ -901,16 +895,16 @@ function at({ elements: s, ...t }) {
   let e = ot(s);
   if (typeof e == "string")
     return null;
-  const n = new st(e, t);
+  const i = new st(e, t);
   return {
-    open: (i = 0) => n.open(i),
-    close: () => n.close(),
-    next: () => n.next(),
-    prev: () => n.prev(),
-    destroy: () => n.destroy(),
-    getCurrentIndex: () => n.getCurrentIndex(),
-    view: (i) => {
-      n.view(i);
+    open: (n = 0) => i.open(n),
+    close: () => i.close(),
+    next: () => i.next(),
+    prev: () => i.prev(),
+    destroy: () => i.destroy(),
+    getCurrentIndex: () => i.getCurrentIndex(),
+    view: (n) => {
+      i.view(n);
     }
   };
 }

package/dist/vistaview.umd.js

@@ -1,11 +1,11 @@
-(function(v,w){typeof exports=="object"&&typeof module<"u"?w(exports):typeof define=="function"&&define.amd?define(["exports"],w):(v=typeof globalThis<"u"?globalThis:v||self,w(v.VistaView={}))})(this,(function(v){"use strict";var rt=Object.defineProperty;var at=(v,w,I)=>w in v?rt(v,w,{enumerable:!0,configurable:!0,writable:!0,value:I}):v[w]=I;var l=(v,w,I)=>at(v,typeof w!="symbol"?w+"":w,I);function w(o){return o&&!/^0(px|%|r?em|vw|vh|vmin|vmax|cm|mm|in|pt|pc|ex|ch)?$/i.test(o.trim())&&o}function I(o){const e=window.getComputedStyle(o).objectFit||"",{width:n,height:i}=o.getBoundingClientRect(),s=o.naturalWidth,a=o.naturalHeight;if(!e)return{width:n,height:i};if(!s||!a)return{width:n,height:i};const r=s/a,h=n/i;switch(e){case"fill":return{width:n,height:i};case"none":return{width:s,height:a};case"contain":return r>h?{width:n,height:n/r}:{width:i*r,height:i};case"cover":return r<h?{width:n,height:n/r}:{width:i*r,height:i};case"scale-down":{const c={width:s,height:a},m=r>h?{width:n,height:n/r}:{width:i*r,height:i};return m.width<=c.width&&m.height<=c.height?m:c}}return{width:n,height:i}}function W(o){const t=getComputedStyle(o),e=o.getBoundingClientRect();return{objectFit:t.objectFit,borderRadius:t.borderRadius,objectPosition:t.objectPosition,overflow:t.overflow,top:e.top,left:e.left,width:e.width,height:e.height,naturalWidth:o.naturalWidth,naturalHeight:o.naturalHeight}}function k(o){const t=o.imageElm?W(o.imageElm):null,e=o.anchorElm?W(o.anchorElm):null,n=w(t==null?void 0:t.borderRadius),i=e&&w(e==null?void 0:e.borderRadius),s=(i?e==null?void 0:e.borderRadius:n?t==null?void 0:t.borderRadius:"")||"";return{fit:(t==null?void 0:t.objectFit)||(e==null?void 0:e.objectFit)||"",pos:(t==null?void 0:t.objectPosition)||"",br:s,overflow:i?e.overflow:n?t.overflow:"",nw:(t==null?void 0:t.naturalWidth)||0,nh:(t==null?void 0:t.naturalHeight)||0,w:(e==null?void 0:e.width)||(t==null?void 0:t.width)||0,h:(e==null?void 0:e.height)||(t==null?void 0:t.height)||0,top:(e==null?void 0:e.top)||(t==null?void 0:t.top)||0,left:(e==null?void 0:e.left)||(t==null?void 0:t.left)||0}}function P(o,t,e,n=!1){const{fit:i,w:s,h:a,nw:r,nh:h,br:c,top:m,left:f}=k(o),$=Math.min(Math.max(f,-s),window.innerWidth+s)-window.innerWidth/2+s/2,y=Math.min(Math.max(m,-a),window.innerHeight+a)-window.innerHeight/2+a/2,d=e.style;d.width=`${s}px`,d.height=`${a}px`,d.objectFit=i,e.width=r,e.height=h,d.setProperty("--vvw-init-radius",`${c}`),d.setProperty("--vvw-pulse-radius",`calc(1.3 * ${c})`),d.setProperty("--vvw-init-x",`${$}px`),d.setProperty("--vvw-init-y",`${y}px`),n&&(d.setProperty("--vvw-current-x",`${$}px`),d.setProperty("--vvw-current-y",`${y}px`));const u=I(o.imageElm),C=Math.min(s,u.width),x=Math.min(a,u.height),p=t.style;p.setProperty("--vvw-init-radius",`${c}`),p.setProperty("--vvw-init-w",`${C}px`),p.setProperty("--vvw-init-h",`${x}px`),n&&(p.setProperty("--vvw-current-radius",`${c}`),p.setProperty("--vvw-current-w",`${C}px`),p.setProperty("--vvw-current-h",`${x}px`),t.dataset.vvwWidth=C.toString(),t.dataset.vvwHeight=x.toString())}function F(o){const t=window.innerWidth,e=window.innerHeight,n=o.naturalWidth,i=o.naturalHeight;if(!n||!i)throw new Error("Image natural dimensions are zero");if(n<t&&i<e)return{width:n,height:i};const s=n/i,a=t/e;let r,h;return s>a?(r=t,h=t/s):(h=e,r=e*s),{width:r,height:h}}function q(o,t,e){return Math.min(Math.max(o,t),e)}function L(o,t=2){const e=Math.pow(10,t);return Math.round(o*e)/e}const R='<svg viewBox="0 0 24 24"><path d="m15 18-6-6 6-6"/></svg>',O='<svg viewBox="0 0 24 24"><path d="m9 18 6-6-6-6"/></svg>',Z='<svg viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" x2="16.65" y1="21" y2="16.65"/><line x1="11" x2="11" y1="8" y2="14"/><line x1="8" x2="14" y1="11" y2="11"/></svg>',X='<svg viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" x2="16.65" y1="21" y2="16.65"/><line x1="8" x2="14" y1="11" y2="11"/></svg>',N='<svg viewBox="0 0 24 24"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>',Y='<svg viewBox="0 0 24 24"><path d="M12 15V3"/><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><path d="m7 10 5 5 5-5"/></svg>';let D=null;function B(){return D||(window.trustedTypes||(window.trustedTypes={createPolicy:(o,t)=>t}),D=window.trustedTypes.createPolicy("vistaView-policy",{createHTML:o=>o,createScript:()=>{throw new Error("Not implemented")},createScriptURL:()=>{throw new Error("Not implemented")}}),D)}function A(o){const e=B().createHTML(o),n=document.createElement("template");n.innerHTML=e;const i=n.content;return n.remove(),i}function z(){return{name:"download",icon:Y,onClick:async o=>{var s;const t=await fetch(o.src),e=await t.blob(),n=t.url,i=document.createElement("a");i.href=URL.createObjectURL(e),i.download=((s=n.split("/").pop())==null?void 0:s.split("?")[0].split("#")[0])||"download",document.body.appendChild(i),i.click(),document.body.removeChild(i)}}}function j(o){if(typeof o=="string")switch(o){case"zoomIn":return`<button aria-label="Zoom In" class="vvw-zoom-in vvw-ui">${Z}</button>`;case"zoomOut":return`<button aria-label="Zoom Out" disabled class="vvw-zoom-out vvw-ui">${X}</button>`;case"close":return`<button aria-label="Close" class="vvw-close vvw-ui">${N}</button>`;case"indexDisplay":return'<div class="vvw-index vvw-ui" aria-hidden="true"></div>';case"description":return'<div class="vvw-desc vvw-ui" role="status" aria-live="polite" aria-atomic="true"></div>';default:return""}return`<button class="vvw-ui" aria-label="${o.description||o.name}" data-vvw-control="${o.name}">${o.icon}</button>`}function V(o,t){const e=document.createElement("div");e.className="vvw-item",e.dataset.vvwPos=`${t!==void 0?t:""}`,e.dataset.vvwIdx=o.index.toString(),e.appendChild(A(`<img class="vvw-img-lo" src="${o.thumb||o.src}" alt="${o.alt||""}" />
-      <img class="vvw-img-hi" src="${o.src}" alt="${o.alt||""}" />`));const n=e.querySelector("img.vvw-img-lo"),i=e.querySelector("img.vvw-img-hi");return P(o,i,n,t===0),e}function U({controls:o}){const t=n=>n?n.map(j).join(""):"";return A(`<div class="vvw-root" id="vvw-root">
+(function(v,w){typeof exports=="object"&&typeof module<"u"?w(exports):typeof define=="function"&&define.amd?define(["exports"],w):(v=typeof globalThis<"u"?globalThis:v||self,w(v.VistaView={}))})(this,(function(v){"use strict";var rt=Object.defineProperty;var at=(v,w,I)=>w in v?rt(v,w,{enumerable:!0,configurable:!0,writable:!0,value:I}):v[w]=I;var h=(v,w,I)=>at(v,typeof w!="symbol"?w+"":w,I);function w(s){return s&&!/^0(px|%|r?em|vw|vh|vmin|vmax|cm|mm|in|pt|pc|ex|ch)?$/i.test(s.trim())&&s}function I(s){const e=window.getComputedStyle(s).objectFit||"",{width:i,height:n}=s.getBoundingClientRect(),o=s.naturalWidth,r=s.naturalHeight;if(!e)return{width:i,height:n};if(!o||!r)return{width:i,height:n};const a=o/r,l=i/n;switch(e){case"fill":return{width:i,height:n};case"none":return{width:o,height:r};case"contain":return a>l?{width:i,height:i/a}:{width:n*a,height:n};case"cover":return a<l?{width:i,height:i/a}:{width:n*a,height:n};case"scale-down":{const c={width:o,height:r},m=a>l?{width:i,height:i/a}:{width:n*a,height:n};return m.width<=c.width&&m.height<=c.height?m:c}}return{width:i,height:n}}function W(s){const t=getComputedStyle(s),e=s.getBoundingClientRect();return{objectFit:t.objectFit,borderRadius:t.borderRadius,objectPosition:t.objectPosition,overflow:t.overflow,top:e.top,left:e.left,width:e.width,height:e.height,naturalWidth:s.naturalWidth,naturalHeight:s.naturalHeight}}function k(s){const t=s.imageElm?W(s.imageElm):null,e=s.anchorElm?W(s.anchorElm):null,i=w(t==null?void 0:t.borderRadius),n=e&&w(e==null?void 0:e.borderRadius),o=(n?e==null?void 0:e.borderRadius:i?t==null?void 0:t.borderRadius:"")||"";return{fit:(t==null?void 0:t.objectFit)||(e==null?void 0:e.objectFit)||"",pos:(t==null?void 0:t.objectPosition)||"",br:o,overflow:n?e.overflow:i?t.overflow:"",nw:(t==null?void 0:t.naturalWidth)||0,nh:(t==null?void 0:t.naturalHeight)||0,w:(e==null?void 0:e.width)||(t==null?void 0:t.width)||0,h:(e==null?void 0:e.height)||(t==null?void 0:t.height)||0,top:(e==null?void 0:e.top)||(t==null?void 0:t.top)||0,left:(e==null?void 0:e.left)||(t==null?void 0:t.left)||0}}function P(s,t,e,i=!1){const{fit:n,w:o,h:r,nw:a,nh:l,br:c,top:m,left:f}=k(s),$=Math.min(Math.max(f,-o),window.innerWidth+o)-window.innerWidth/2+o/2,y=Math.min(Math.max(m,-r),window.innerHeight+r)-window.innerHeight/2+r/2,d=e.style;d.width=`${o}px`,d.height=`${r}px`,d.objectFit=n,e.width=a,e.height=l,d.setProperty("--vvw-init-radius",`${c}`),d.setProperty("--vvw-pulse-radius",`calc(1.3 * ${c})`),d.setProperty("--vvw-init-x",`${$}px`),d.setProperty("--vvw-init-y",`${y}px`),i&&(d.setProperty("--vvw-current-x",`${$}px`),d.setProperty("--vvw-current-y",`${y}px`));const u=I(s.imageElm),C=Math.min(o,u.width),x=Math.min(r,u.height),p=t.style;p.setProperty("--vvw-init-radius",`${c}`),p.setProperty("--vvw-init-w",`${C}px`),p.setProperty("--vvw-init-h",`${x}px`),i&&(p.setProperty("--vvw-current-radius",`${c}`),p.setProperty("--vvw-current-w",`${C}px`),p.setProperty("--vvw-current-h",`${x}px`),t.dataset.vvwWidth=C.toString(),t.dataset.vvwHeight=x.toString())}function F(s){const t=window.innerWidth,e=window.innerHeight,i=s.naturalWidth,n=s.naturalHeight;if(!i||!n)throw new Error("Image natural dimensions are zero");if(i<t&&n<e)return{width:i,height:n};const o=i/n,r=t/e;let a,l;return o>r?(a=t,l=t/o):(l=e,a=e*o),{width:a,height:l}}function q(s,t,e){return Math.min(Math.max(s,t),e)}function L(s,t=2){const e=Math.pow(10,t);return Math.round(s*e)/e}const R='<svg viewBox="0 0 24 24"><path d="m15 18-6-6 6-6"/></svg>',O='<svg viewBox="0 0 24 24"><path d="m9 18 6-6-6-6"/></svg>',Z='<svg viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" x2="16.65" y1="21" y2="16.65"/><line x1="11" x2="11" y1="8" y2="14"/><line x1="8" x2="14" y1="11" y2="11"/></svg>',X='<svg viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" x2="16.65" y1="21" y2="16.65"/><line x1="8" x2="14" y1="11" y2="11"/></svg>',N='<svg viewBox="0 0 24 24"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>',Y='<svg viewBox="0 0 24 24"><path d="M12 15V3"/><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><path d="m7 10 5 5 5-5"/></svg>';let D=null;function B(){return D||(window.trustedTypes||(window.trustedTypes={createPolicy:(s,t)=>t}),D=window.trustedTypes.createPolicy("vistaView-policy",{createHTML:s=>s,createScript:()=>{throw new Error("Not implemented")},createScriptURL:()=>{throw new Error("Not implemented")}}),D)}function A(s){const e=B().createHTML(s),i=document.createElement("template");i.innerHTML=e;const n=i.content;return i.remove(),n}function z(){return{name:"download",icon:Y,onClick:async s=>{var o;const t=await fetch(s.src),e=await t.blob(),i=t.url,n=document.createElement("a");n.href=URL.createObjectURL(e),n.download=((o=i.split("/").pop())==null?void 0:o.split("?")[0].split("#")[0])||"download",document.body.appendChild(n),n.click(),document.body.removeChild(n)}}}function j(s){if(typeof s=="string")switch(s){case"zoomIn":return`<button aria-label="Zoom In" class="vvw-zoom-in vvw-ui">${Z}</button>`;case"zoomOut":return`<button aria-label="Zoom Out" disabled class="vvw-zoom-out vvw-ui">${X}</button>`;case"close":return`<button aria-label="Close" class="vvw-close vvw-ui">${N}</button>`;case"indexDisplay":return'<div class="vvw-index vvw-ui" aria-hidden="true"></div>';case"description":return'<div class="vvw-desc vvw-ui" role="status" aria-live="polite" aria-atomic="true"></div>';default:return""}return`<button class="vvw-ui" aria-label="${s.description||s.name}" data-vvw-control="${s.name}">${s.icon}</button>`}function V(s,t){const e=document.createElement("div");e.className="vvw-item",e.dataset.vvwPos=`${t!==void 0?t:""}`,e.dataset.vvwIdx=s.index.toString(),e.appendChild(A(`<img class="vvw-img-lo" src="${s.thumb||s.src}" alt="${s.alt||""}" />
+      <img class="vvw-img-hi" src="${s.src}" alt="${s.alt||""}" />`));const i=e.querySelector("img.vvw-img-lo"),n=e.querySelector("img.vvw-img-hi");return P(s,n,i,t===0),e}function U({controls:s}){const t=i=>i?i.map(j).join(""):"";return A(`<div class="vvw-root" id="vvw-root">
     <div class="vvw-container">
       <div class="vvw-bg"></div>
       <div class="vvw-image-container"></div>
-      <div class="vvw-top-bar"><div>${t(o==null?void 0:o.topLeft)}</div><div>${t(o==null?void 0:o.topCenter)}</div><div>${t(o==null?void 0:o.topRight)}</div></div>
-      <div class="vvw-bottom-bar"><div>${t(o==null?void 0:o.bottomLeft)}</div><div>${t(o==null?void 0:o.bottomCenter)}</div><div>${t(o==null?void 0:o.bottomRight)}</div></div>
+      <div class="vvw-top-bar"><div>${t(s==null?void 0:s.topLeft)}</div><div>${t(s==null?void 0:s.topCenter)}</div><div>${t(s==null?void 0:s.topRight)}</div></div>
+      <div class="vvw-bottom-bar"><div>${t(s==null?void 0:s.bottomLeft)}</div><div>${t(s==null?void 0:s.bottomCenter)}</div><div>${t(s==null?void 0:s.bottomRight)}</div></div>
       <div class="vvw-prev vvw-ui"><button aria-label="Previous">${R}</button></div>
       <div class="vvw-next vvw-ui"><button aria-label="Next">${O}</button></div>
     </div>
-    </div>`)}const M={animationDurationBase:333,maxZoomLevel:2,preloads:1,keyboardListeners:!0,arrowOnSmallScreens:!1,rapidLimit:222,controls:{topLeft:["indexDisplay"],topRight:["zoomIn","zoomOut",z(),"close"],bottomLeft:["description"]}};function K(o){}function _(o){const t=o.options.preloads;o.imageContainer.style.width=`${(t*2+1)*100}vw`,o.imageContainer.style.left=`-${t*100}vw`,o.imageContainer.style.display="flex",G(o)}function G(o){let t={x:0,y:0},e={x:0,y:0},n=null;o.registerPointerListener(i=>{var s;if(!i.hasInternalExecution&&!(i.pointers.length>1)){if(i.event==="down"&&(t={x:i.pointer.x,y:i.pointer.y},e={x:i.pointer.x,y:i.pointer.y},(s=i.abortController)==null||s.abort()),i.event==="move"){e={x:i.pointer.x,y:i.pointer.y};const a=e.x-t.x,r=e.y-t.y;if(!n&&Math.abs(r)>Math.abs(a)||n==="y"){const h=r/window.innerHeight*100;o.imageContainer.style.transition="none",o.imageContainer.style.transform=`translateY(${h}vh)`,n="y"}else if(!n&&Math.abs(a)>Math.abs(r)||n==="x"){const h=a/window.innerWidth*100;o.imageContainer.style.transition="none",o.imageContainer.style.transform=`translateX(${h}vw)`,n="x"}}if(i.event==="up"||i.event==="cancel"){let a=function(r){var h;(h=o.imageContainer)==null||h.addEventListener("transitionend",function c(){var m;(m=o.imageContainer)==null||m.removeEventListener("transitionend",c),o.imageContainer.style.transition="",o.imageContainer.style.transform=""}),o.imageContainer.style.transition="transform 222ms ease",o.imageContainer.style.transform=r};if(n==="y"){const r=e.y-t.y;Math.abs(r)>144?(o.imageContainer.style.transition="transform 222ms ease",o.imageContainer.style.transform="translateY(0vh)",o.close()):a("translateY(0vh)")}if(n==="x"){const r=e.x-t.x,h=i.pointer.movementX,c=1;o.imageContainer.style.transition="",r>0&&Math.abs(h)>c?o.prev():r<0&&Math.abs(h)>c?o.next():a("translateX(0vw)")}n=null,t={x:0,y:0},e={x:0,y:0}}}})}function J(o){}function Q({vistaView:{isReducedMotion:o},htmlElements:{to:t},index:{from:e,to:n},vistaView:{elements:i,imageContainer:s,options:a}},r){if(!(!t||r.aborted||o||!(Math.abs(n-e)===1||e===0&&n===i.length-1||e===i.length-1&&n===0)))return{cleanup:()=>{s.style.transition="",s.style.transform=""},transitionEnded:new Promise(c=>{s.addEventListener("transitionend",()=>{c()},{once:!0}),s.addEventListener("transitioncancel",()=>{r.aborted&&c()},{once:!0});const m=Math.round(a.animationDurationBase*100)/100,f=n===e+1||e===i.length-1&&n===0?"translateX(-100vw)":"translateX(100vw)";s.style.transition=`transform ${m}ms ease`,s.style.transform=f})}}class tt{constructor({elm:t,listeners:e}){l(this,"pointers",[]);l(this,"elm");l(this,"listeners",[]);l(this,"lastPointerDownId",null);l(this,"removeLastPointer",()=>{if(this.pointers.length&&this.lastPointerDownId!==null){const t=this.pointers.findIndex(e=>e.id===this.lastPointerDownId);t!==-1&&this.pointers.splice(t,1)}});l(this,"onPointerDown",t=>{if(!this.listeners.length||t.button!==0)return;t.preventDefault(),this.lastPointerDownId=t.pointerId,window.addEventListener("contextmenu",this.removeLastPointer,{once:!0}),window.addEventListener("auxclick",this.removeLastPointer,{once:!0});let e={x:t.clientX,y:t.clientY,movementX:0,movementY:0,id:t.pointerId};this.pointers.push(e),this.listeners.forEach(n=>n({event:"down",pointer:e,pointers:this.pointers,lastPointerLen:this.pointers.length-1}))});l(this,"onPointerMove",t=>{if(!this.listeners.length)return;t.preventDefault();const e=this.pointers.find(n=>n.id===t.pointerId);e&&(e.movementX=t.movementX,e.movementY=t.movementY,e.x=t.clientX,e.y=t.clientY,this.listeners.forEach(n=>n({event:"move",pointer:e,pointers:this.pointers,lastPointerLen:this.pointers.length-1})))});l(this,"onPointerUp",t=>{if(!this.listeners.length||t.button!==0||(window.removeEventListener("contextmenu",this.removeLastPointer),window.removeEventListener("auxclick",this.removeLastPointer),t.target instanceof Node&&!this.elm.contains(t.target)&&t.target!==document.querySelector("html")&&t.target!==document))return;t.preventDefault();const e=this.pointers.findIndex(s=>s.id===t.pointerId);if(e===-1)return;const n=this.pointers[e];n.x=t.clientX,n.y=t.clientY;const i=this.pointers.length;this.pointers.splice(e,1),this.listeners.forEach(s=>s({event:"up",pointer:n,pointers:this.pointers,lastPointerLen:i}))});l(this,"onPointerCancel",t=>{if(!this.listeners.length||t.target instanceof Node&&!this.elm.contains(t.target)&&t.target!==document.querySelector("html")&&t.target!==document)return;t.preventDefault();const e=this.pointers.findIndex(s=>s.id===t.pointerId);if(e===-1)return;const n=this.pointers[e];n.x=t.clientX,n.y=t.clientY;const i=this.pointers.length;this.pointers.splice(e,1),this.listeners.forEach(s=>s({event:"cancel",pointer:n,pointers:this.pointers,lastPointerLen:i}))});this.elm=t??document,e&&(this.listeners=e),this.startListeners()}startListeners(){this.elm.addEventListener("pointerdown",this.onPointerDown),this.elm.addEventListener("pointermove",this.onPointerMove),document.addEventListener("pointerup",this.onPointerUp),document.addEventListener("pointercancel",this.onPointerCancel)}removeListeners(){this.elm.removeEventListener("pointerdown",this.onPointerDown),this.elm.removeEventListener("pointermove",this.onPointerMove),document.removeEventListener("pointerup",this.onPointerUp),document.removeEventListener("pointercancel",this.onPointerCancel),this.pointers=[]}addEventListener(t){this.listeners.push(t)}removeEventListener(t){this.listeners=this.listeners.filter(e=>e!==t)}getPointerDistance(t,e){const n=t.x-e.x,i=t.y-e.y;return Math.sqrt(n*n+i*i)}getCentroid(){if(this.pointers.length===0)return null;const t=this.pointers.reduce((e,n)=>(e.x+=n.x,e.y+=n.y,e),{x:0,y:0});return{x:t.x/this.pointers.length,y:t.y/this.pointers.length}}}class et{constructor(t,e){l(this,"maxZoomLevel");l(this,"image",null);l(this,"rect",null);l(this,"initialCenter",{x:0,y:0});l(this,"maxDimension",{width:0});l(this,"minDimension",{initialWidth:0,initialHeight:0,minWidth:0,closingWidth:0});l(this,"accumulatedTranslate",{x:0,y:0});l(this,"scale",1);l(this,"translate",{x:0,y:0});l(this,"onScale",null);l(this,"animationTimestamp",0);this.maxZoomLevel=t,this.onScale=e}clean(){this.image&&(this.image.style.transform="",this.image.style.width="",this.image.style.height="",this.image.style.top="",this.image.style.left="",this.image.style.opacity="")}reset(){this.clean(),this.image=null,this.rect=null,this.initialCenter={x:window.innerWidth/2,y:window.innerHeight/2},this.maxDimension={width:0},this.minDimension={initialWidth:0,initialHeight:0,minWidth:0,closingWidth:0},this.accumulatedTranslate={x:0,y:0},this.scale=1,this.translate={x:0,y:0}}setCurrentImage(t){if(this.rect=null,this.image=t,this.maxDimension={width:t.naturalWidth*this.maxZoomLevel},!t.dataset.vvwWidth||!t.dataset.vvwHeight)throw new Error("VistaImageState: Image dataset vvwWidth or vvwHeight not set.");const e=parseFloat(t.dataset.vvwWidth),n=parseFloat(t.dataset.vvwHeight);this.minDimension={initialWidth:e,initialHeight:n,minWidth:e*.1,closingWidth:e*.5},this.accumulatedTranslate={x:0,y:0}}setInitialCenter(t){this.initialCenter=t||{x:window.innerWidth/2,y:window.innerHeight/2}}move(t){this.image&&(this.rect||(this.rect=this.image.getBoundingClientRect()),this.translate.x=L(t.x-this.initialCenter.x),this.translate.y=L(t.y-this.initialCenter.y),this.image.style.transform=`translate3d(${this.translate.x}px, ${this.translate.y}px, 0px) scale(${this.scale})`)}snapToTargetIfClose(t,e,n=1){return Math.abs(t-e)<=n&&(t=e),t}scaleMove(t,e){if(!this.image)return;this.rect||(this.rect=this.image.getBoundingClientRect()),e||(e=this.initialCenter);const n=this.snapToTargetIfClose(q(this.rect.width*t,this.minDimension.minWidth,this.maxDimension.width),this.minDimension.initialWidth);this.onScale&&this.onScale({scale:n/(this.maxDimension.width/this.maxZoomLevel),isMax:n>=this.maxDimension.width,isMin:n<=this.minDimension.initialWidth}),this.scale=L(n/this.rect.width);const i=this.rect.left+this.rect.width/2,s=this.rect.top+this.rect.height/2,a=this.initialCenter.x-i,r=this.initialCenter.y-s,h=a*(1-this.scale),c=r*(1-this.scale),m=e.x-this.initialCenter.x,f=e.y-this.initialCenter.y;this.translate.x=L(h+m),this.translate.y=L(c+f),this.image.style.transform=`translate3d(${this.translate.x}px, ${this.translate.y}px, 0px) scale(${this.scale})`,n<=this.minDimension.closingWidth?this.image.style.opacity="0.5":this.image.style.opacity=""}moveAndNormalize(t){let e=0,n=!1;const i=({x:s,y:a})=>{if(n)return;if(Math.abs(s)<.001&&Math.abs(a)<.001)return this.normalize();s*=.9,a*=.9;const r=this.image.getBoundingClientRect();this.translate.x=L(this.translate.x+s),this.translate.y=L(this.translate.y+a),r.right<window.innerWidth/2&&(this.translate.x+=(window.innerWidth/2-r.right)*.1,s*=.7),r.left>window.innerWidth/2&&(this.translate.x-=(r.left-window.innerWidth/2)*.1,s*=.7),r.bottom<window.innerHeight/2&&(this.translate.y+=(window.innerHeight/2-r.bottom)*.1,a*=.7),r.top>window.innerHeight/2&&(this.translate.y-=(r.top-window.innerHeight/2)*.1,a*=.7),this.image.style.transform=`translate3d(${this.translate.x}px, ${this.translate.y}px, 0px) scale(${this.scale})`,e=requestAnimationFrame(()=>i({x:s,y:a}))};return i({x:t.movementX,y:t.movementY}),()=>{n=!0,cancelAnimationFrame(e),this.normalize(!1)}}animateZoom(t){if(!this.image)return;this.rect||(this.rect=this.image.getBoundingClientRect());const e=Date.now(),n=this.image;this.rect.width*t<this.minDimension.closingWidth||n.width<Math.floor(this.minDimension.initialWidth)||(n.addEventListener("transitionend",()=>{this.animationTimestamp===e&&n&&(n.style.transition="",this.normalize())},{once:!0}),n.style.transition||(n.style.transition="all 222ms ease"),this.animationTimestamp=e,this.scaleMove(t))}normalize(t=!0){if(!this.image||!this.rect)return;const e=this.snapToTargetIfClose(this.rect.width*this.scale,this.minDimension.initialWidth),n=this.snapToTargetIfClose(this.rect.height*this.scale,this.minDimension.initialHeight);if(this.image.style.width=`${e}px`,this.image.style.height=`${n}px`,this.scale=1,this.image.style.opacity="",this.accumulatedTranslate.x+=this.translate.x,this.accumulatedTranslate.y+=this.translate.y,this.image.style.left=`calc(50% + ${this.accumulatedTranslate.x}px)`,this.image.style.top=`calc(50% + ${this.accumulatedTranslate.y}px)`,this.translate={x:0,y:0},this.image.style.transform="",this.rect=this.image.getBoundingClientRect(),e<=this.minDimension.closingWidth)return this.clean(),!0;if(e<this.minDimension.initialWidth)this.accumulatedTranslate.x=0,this.accumulatedTranslate.y=0,requestAnimationFrame(()=>{const i=this.image;i&&(i.addEventListener("transitionend",()=>{i&&(this.clean(),this.rect=null)},{once:!0}),i.style.transition="all 222ms ease",i.style.width=`${this.minDimension.initialWidth}px`,i.style.height=`${this.minDimension.initialHeight}px`,i.style.left="50%",i.style.top="50%")});else if(t){let i=!1;if(this.rect.right<window.innerWidth/2&&(i=!0,this.accumulatedTranslate.x+=window.innerWidth/2-this.rect.right),this.rect.left>window.innerWidth/2&&(i=!0,this.accumulatedTranslate.x-=this.rect.left-window.innerWidth/2),this.rect.bottom<window.innerHeight/2&&(i=!0,this.accumulatedTranslate.y+=window.innerHeight/2-this.rect.bottom),this.rect.top>window.innerHeight/2&&(i=!0,this.accumulatedTranslate.y-=this.rect.top-window.innerHeight/2),i){const s=this.image;s.addEventListener("transitionend",()=>{s&&(s.style.transition="",this.rect=null)},{once:!0}),s.style.transition="all 222ms ease",s.style.left=`calc(50% + ${this.accumulatedTranslate.x}px)`,s.style.top=`calc(50% + ${this.accumulatedTranslate.y}px)`}else this.rect=null}}}class it{constructor(){l(this,"fiolast",{})}fio(t,e,n=50){const s=Date.now()-(this.fiolast[e]??0),a=()=>{this.fiolast[e]=Date.now(),t()};if(!this.fiolast[e]){a();return}s>=n&&a()}}const b={somethingOpened:null};class nt{constructor(t,e={}){l(this,"options");l(this,"elements");l(this,"isReducedMotion");l(this,"currentIndex",-1);l(this,"currentChildren",null);l(this,"setupFunction",K);l(this,"initFunction",_);l(this,"closeFunction",J);l(this,"transitionFunction",Q);l(this,"pointers",null);l(this,"imageState");l(this,"imageTransitions",new Map);l(this,"root",null);l(this,"imageContainer",null);l(this,"onClickElements",t=>{t.preventDefault();const e=t.currentTarget;e.dataset.vistaIdx&&this.open(parseInt(e.dataset.vistaIdx))});l(this,"defaultOnClickHandler",t=>t.preventDefault());l(this,"abortController",null);l(this,"throttle",new it);l(this,"lastSwapTime",0);l(this,"transitionCleanup",null);l(this,"isZoomedIn",!1);l(this,"onKeyDown",t=>{switch(t.key){case"ArrowLeft":t.preventDefault(),this.prev();break;case"ArrowRight":t.preventDefault(),this.next();break;case"ArrowUp":t.preventDefault(),this.zoomIn();break;case"ArrowDown":t.preventDefault(),this.zoomOut();break;case"Escape":t.preventDefault(),this.close();break}});l(this,"onScroll",t=>{t.preventDefault();const e=t.deltaY;this.imageState.setInitialCenter({x:t.clientX,y:t.clientY}),e<0?this.zoomIn():e>0&&this.zoomOut()});l(this,"onResizeHandler",()=>{this.currentChildren.htmls.forEach((t,e)=>{const n=this.currentChildren.images[e],i=t.querySelector("img.vvw-img-hi"),s=t.querySelector("img.vvw-img-lo");if(P(n,i,s,!1),i.classList.contains("vvw--loaded")){const{width:a,height:r}=F(i);i.style.setProperty("--vvw-current-w",`${a}px`),i.style.setProperty("--vvw-current-h",`${r}px`),i.dataset.vvwWidth=a.toString(),i.dataset.vvwHeight=r.toString()}})});l(this,"pointerListeners",[]);l(this,"getInternalPointerListener",()=>{const t=this.imageState;let e=0,n=!1,i=()=>{};return s=>{if(s.event==="down"){if(i(),this.isZoomedIn&&s.pointers.length===1){const a=this.pointers.getCentroid();t.setInitialCenter(a)}if(s.pointers.length>=2){n=!0;const a=this.pointers.getCentroid();e=this.pointers.getPointerDistance(s.pointers[0],s.pointers[1]),t.setInitialCenter(a)}}else if(s.event==="move"){if(this.isZoomedIn&&s.pointers.length===1&&s.lastPointerLen===0){const a=this.pointers.getCentroid();t.move(a)}if(s.pointers.length>=2&&n){const a=this.pointers.getCentroid(),r=this.pointers.getPointerDistance(s.pointers[0],s.pointers[1]);t.scaleMove(r/e,a)}}else(s.event==="up"||s.event==="cancel")&&(n||this.isZoomedIn)&&(n?(n=!1,t.normalize()&&requestAnimationFrame(()=>{this.close()})):this.isZoomedIn&&s.pointers.length===0&&(i=t.moveAndNormalize(s.pointer)));this.pointerListeners.forEach(a=>a({...s,hasInternalExecution:this.isZoomedIn||n,abortController:this.abortController}))}});this.elements=t,this.options={...M,...e,controls:{...M.controls,...e.controls}},this.imageState=new et(this.options.maxZoomLevel,n=>{var i,s,a,r,h,c;n.isMin?(this.isZoomedIn=!1,(i=this.qs(".vvw-zoom-out"))==null||i.setAttribute("disabled","true"),(s=this.qs('.vvw-item[data-vvw-idx="'+this.currentIndex+'"]'))==null||s.style.setProperty("pointer-events","none")):(this.isZoomedIn=!0,(a=this.qs(".vvw-zoom-out"))==null||a.removeAttribute("disabled"),(r=this.qs('.vvw-item[data-vvw-idx="'+this.currentIndex+'"]'))==null||r.style.setProperty("pointer-events","auto")),n.isMax?(h=this.qs(".vvw-zoom-in"))==null||h.setAttribute("disabled","true"):(c=this.qs(".vvw-zoom-in"))==null||c.removeAttribute("disabled")}),this.options.setupFunction&&(this.setupFunction=this.options.setupFunction),this.options.closeFunction&&(this.closeFunction=this.options.closeFunction),this.options.initFunction&&(this.initFunction=this.options.initFunction),this.options.transitionFunction&&(this.transitionFunction=this.options.transitionFunction),this.isReducedMotion=window.matchMedia("(prefers-reduced-motion: reduce)").matches,this.elements instanceof NodeList&&this.elements.forEach((n,i)=>{n.dataset.vistaIdx=i.toString(),n.addEventListener("click",this.defaultOnClickHandler),n.addEventListener("pointerup",this.onClickElements)})}qs(t){return this.root?this.root.querySelector(t):null}async swap(t,e){const n=this.options.preloads||0,i=this.currentIndex,{htmls:s,images:a}=this.getChildElements(n,i),r=this.imageContainer,h=this.currentChildren,c={htmlElements:{from:h.htmls,to:s},images:{from:h.images,to:a},index:{from:t,to:this.currentIndex},via:e||{next:!1,prev:!1},vistaView:this};this.setupFunction(c),this.currentChildren={htmls:s,images:a},this.displayActiveIndex();const m=this.abortController.signal;if(performance.now()-this.lastSwapTime<this.options.rapidLimit){r.innerHTML="",this.transitionCleanup&&this.transitionCleanup(),s.forEach(E=>{r.appendChild(E)}),this.lastSwapTime=performance.now(),this.waitForImagesToLoad(),this.options.onImageView&&this.options.onImageView(c);return}const y=this.transitionFunction(c,m);y&&(this.transitionCleanup=y.cleanup,await y.transitionEnded),this.lastSwapTime=performance.now();const d=s[Math.floor(s.length/2)].dataset.vvwIdx,u=r.querySelector(`.vvw-item[data-vvw-idx="${d}"] img.vvw-img-hi`),C=this.imageTransitions.get(u);this.imageTransitions.delete(u);const x=u.getAttribute("style")||"",p=u.classList.contains("vvw--loaded"),T=u.classList.contains("vvw--ready"),S=u.width,H=u.height;this.imageState.reset(),r.innerHTML="",this.transitionCleanup&&this.transitionCleanup(),s.forEach(E=>{const g=E.querySelector("img.vvw-img-hi");E.dataset.vvwPos==="0"&&!m.aborted&&x&&S&&H&&(p&&(g.classList.add("vvw--loaded"),g.dataset.vvwWidth=u.dataset.vvwWidth||"",g.dataset.vvwHeight=u.dataset.vvwHeight||""),T&&(g.classList.add("vvw--ready"),g.width=S,g.height=H),g.setAttribute("style",x)),r.appendChild(E),E.dataset.vvwPos==="0"&&!m.aborted&&T?(this.imageState.setCurrentImage(g),this.imageState.setInitialCenter()):E.dataset.vvwPos==="0"&&!m.aborted&&x&&S&&H&&p&&C&&(this.imageTransitions.set(g,C),this.transitionImage(g,()=>{this.imageState.setCurrentImage(g),this.imageState.setInitialCenter(),g.classList.add("vvw--ready")}))}),this.waitForImagesToLoad(),this.options.onImageView&&this.options.onImageView(c)}getChildElements(t,e){const n=[],i=[];for(let s=-t;s<=t;s++){const a=(e+s+this.elements.length)%this.elements.length,r=this.elements[a],h=r instanceof HTMLImageElement?r:r instanceof HTMLAnchorElement&&r.querySelector("img")||void 0,c=r instanceof HTMLElement?{index:a,imageElm:h instanceof HTMLImageElement?h:void 0,anchorElm:r instanceof HTMLAnchorElement?r:void 0,src:r.dataset.vistaviewSrc||r.getAttribute("href")||r.getAttribute("src")||"",thumb:r.dataset.vistaviewThumb||(h instanceof HTMLImageElement?h.getAttribute("src"):void 0)||r.getAttribute("href")||void 0,alt:h instanceof HTMLImageElement&&h.getAttribute("alt")||void 0}:{index:a,...r};i.push(c),n.push(V(c,s))}return{htmls:n,images:i}}zoomIn(){this.throttle.fio(()=>{this.imageState.animateZoom(1.68)},"zoom",222)}zoomOut(){this.throttle.fio(()=>{this.imageState.animateZoom(.68)},"zoom",222)}displayActiveIndex(){var a;const t=this.currentIndex;this.elements instanceof NodeList&&this.elements.forEach((r,h)=>{r.style.opacity="",h===t&&(r.style.opacity="0")});const e=this.qs(".vvw-index"),n=`${t+1}`,i=`${this.elements.length}`;e&&(e.textContent=`${n} / ${i}`);const s=this.qs(".vvw-desc");if(s){const r=(a=this.currentChildren)==null?void 0:a.images.find(c=>c.index===t),h=(r==null?void 0:r.alt)||"";h?(s.textContent=h,s.setAttribute("aria-label",`Image ${n} of ${i}: ${h}`)):(s.textContent="",s.setAttribute("aria-label",`Image ${n} of ${i}`))}}transitionImage(t,e){const n=this.imageTransitions.get(t);n&&requestAnimationFrame(()=>{const{current:i,target:s}=n,a={width:i.width+(s.width-i.width)*.1,height:i.height+(s.height-i.height)*.1,radius:i.radius+(s.radius-i.radius)*.1};Math.abs(a.width-s.width)<.5&&Math.abs(a.height-s.height)<.5&&Math.abs(a.radius-s.radius)<.5?(t.style.setProperty("--vvw-current-w",`${s.width}px`),t.style.setProperty("--vvw-current-h",`${s.height}px`),t.style.setProperty("--vvw-current-radius",`${s.radius}px`),this.imageTransitions.delete(t),e()):(t.style.setProperty("--vvw-current-w",`${a.width}px`),t.style.setProperty("--vvw-current-h",`${a.height}px`),t.style.setProperty("--vvw-current-radius",`${a.radius}px`),this.imageTransitions.set(t,{current:a,target:s}),this.transitionImage(t,e))})}waitForImagesToLoad(){this.imageContainer.querySelectorAll("img.vvw-img-hi:not(.vvw--loaded)").forEach(n=>{const i=n,s=()=>{var c;i.width=i.naturalWidth,i.height=i.naturalHeight;const a=(c=i.parentElement)==null?void 0:c.matches(`[data-vvw-idx="${this.currentIndex}"]`),{width:r,height:h}=F(i);i.dataset.vvwWidth=r.toString(),i.dataset.vvwHeight=h.toString(),i.classList.add("vvw--loaded"),this.imageTransitions.set(i,{current:{width:i.style.getPropertyValue("--vvw-current-w")?parseFloat(i.style.getPropertyValue("--vvw-current-w")):0,height:i.style.getPropertyValue("--vvw-current-h")?parseFloat(i.style.getPropertyValue("--vvw-current-h")):0,radius:i.style.getPropertyValue("--vvw-current-radius")?parseFloat(i.style.getPropertyValue("--vvw-current-radius")):0},target:{width:r,height:h,radius:0}}),this.transitionImage(i,()=>{a&&(this.imageState.setCurrentImage(i),this.imageState.setInitialCenter()),i.classList.add("vvw--ready")})};if(i.complete&&i.naturalWidth!==0){s();return}i.addEventListener("load",()=>{s()}),i.addEventListener("error",()=>{var r;i.classList.add("vvw--loaderror");const a=document.createElement("p");a.className="vvw-img-err",a.setAttribute("role","alert"),a.textContent="Error loading image",(r=i.parentNode)==null||r.appendChild(a)})})}registerPointerListener(t){this.pointerListeners.push(t)}unregisterPointerListeners(){this.pointerListeners=[]}open(t=0){var c,m,f,$,y;if(b.somethingOpened)return;b.somethingOpened=this,this.currentIndex=t,document.body.style.overflow="hidden";const e=U({controls:this.options.controls});if(document.body.prepend(e),this.root=document.body.querySelector("#vvw-root"),!this.root)throw new Error("Failed to setup VistaView root element.");this.imageContainer=this.qs(".vvw-image-container"),this.options.animationDurationBase&&this.root.style.setProperty("--vvw-anim-dur",`${this.options.animationDurationBase}`),this.options.initialZIndex!==void 0&&this.root.style.setProperty("--vvw-init-z",`${this.options.initialZIndex??0}`),this.options.arrowOnSmallScreens&&this.root.classList.add("vvw-arrow-sm");const n=this.options.preloads||0,i=t,{images:s,htmls:a}=this.getChildElements(n,i),r={htmlElements:{from:null,to:a},images:{from:null,to:s},index:{from:null,to:this.currentIndex},via:{next:!1,prev:!1},vistaView:this};this.setupFunction(r),this.currentChildren={htmls:a,images:s},a.forEach(d=>{this.imageContainer.appendChild(d)}),(c=this.qs(".vvw-close"))==null||c.addEventListener("click",()=>this.close()),(m=this.qs(".vvw-zoom-in"))==null||m.addEventListener("click",()=>this.zoomIn()),(f=this.qs(".vvw-zoom-out"))==null||f.addEventListener("click",()=>this.zoomOut()),($=this.qs(".vvw-prev>button"))==null||$.addEventListener("click",()=>this.prev()),(y=this.qs(".vvw-next>button"))==null||y.addEventListener("click",()=>this.next()),this.options.keyboardListeners&&window.addEventListener("keydown",this.onKeyDown),window.addEventListener("wheel",this.onScroll,{passive:!1}),window.addEventListener("resize",this.onResizeHandler),this.pointers=new tt({elm:this.imageContainer,listeners:[this.getInternalPointerListener()]});const h={};[...this.options.controls.topLeft||[],...this.options.controls.topRight||[],...this.options.controls.topCenter||[],...this.options.controls.bottomCenter||[],...this.options.controls.bottomLeft||[],...this.options.controls.bottomRight||[]].forEach(d=>{typeof d!="string"&&(h[d.name]=d)}),this.root.querySelectorAll("button[data-vvw-control]").forEach(d=>{const u=d;u.addEventListener("click",C=>{const x=C.currentTarget.dataset.vvwControl,p=h[x],T=this.currentChildren.images.find(S=>S.index===this.currentIndex);p&&T&&(p.onClick.constructor.name==="AsyncFunction"?(u.classList.add("vvw--loading"),p.onClick(T,this).finally(()=>{u.classList.remove("vvw--loading")})):p.onClick(T,this))})}),this.initFunction(this),requestAnimationFrame(()=>{var d;(d=this.root)==null||d.addEventListener("transitionend",()=>{var u;(u=this.root)==null||u.classList.add("vvw--settled"),this.waitForImagesToLoad(),this.imageState.reset()},{once:!0}),this.root.classList.add("vvw--active"),this.displayActiveIndex(),this.options.onOpen&&this.options.onOpen(this),this.options.onImageView&&this.options.onImageView(r)})}async close(t=!0){b.somethingOpened===this&&this.root&&(t?await new Promise(e=>{let i=0;this.root.addEventListener("transitionend",s=>{s.target===this.root&&(i++,i===2&&this.elements instanceof NodeList&&this.elements.forEach(a=>{a.style.opacity=""}),i===3&&e(null))}),this.root.classList.add("vvw--closing")}):this.elements instanceof NodeList&&this.elements.forEach(e=>{e.style.opacity=""}),this.options.keyboardListeners&&window.removeEventListener("keydown",this.onKeyDown),window.removeEventListener("resize",this.onResizeHandler),window.removeEventListener("wheel",this.onScroll),this.unregisterPointerListeners(),this.pointers.removeListeners(),this.root.remove(),this.root=null,this.imageContainer=null,this.currentChildren=null,this.currentIndex=-1,document.body.style.overflow="",b.somethingOpened=null,this.closeFunction(this),this.options.onClose&&this.options.onClose(this))}next(){if(b.somethingOpened!==this)return;const t=(this.currentIndex+1)%this.elements.length;this.view(t,{next:!0,prev:!1})}prev(){if(b.somethingOpened!==this)return;const t=(this.currentIndex-1+this.elements.length)%this.elements.length;this.view(t,{next:!1,prev:!0})}destroy(){this.close(!1),this.elements instanceof NodeList&&this.elements.forEach(t=>{t.removeAttribute("data-vista-idx"),t.removeEventListener("click",this.defaultOnClickHandler),t.removeEventListener("pointerup",this.onClickElements)})}getCurrentIndex(){return b.somethingOpened!==this?-1:this.currentIndex}view(t,e){if(b.somethingOpened!==this||t<0||t>=this.elements.length)return;const n=this.currentIndex;this.currentIndex=t;const i=this.abortController;i==null||i.abort(),this.abortController=new AbortController,this.swap(n,e)}}function st(o){let t=null;if(typeof o=="string"?t=document.querySelectorAll(o):o instanceof NodeList&&(t=o),t)for(let e=0;e<t.length;e++){const n=t[e];if(!(n.dataset.vistaviewSrc||n.getAttribute("href")||n.getAttribute("src")||""))return`Element at index ${e} is missing 'src' / 'data-vistaview-src' / 'href' attribute.`}else{const e=o;for(let n=0;n<e.length;n++)if(!e[n].src)return`Element at index ${n} is missing 'src' attribute.`}return t||o}function ot({elements:o,...t}){if(!o)throw new Error("No elements");let e=st(o);if(typeof e=="string")return null;const n=new nt(e,t);return{open:(i=0)=>n.open(i),close:()=>n.close(),next:()=>n.next(),prev:()=>n.prev(),destroy:()=>n.destroy(),getCurrentIndex:()=>n.getCurrentIndex(),view:i=>{n.view(i)}}}v.DefaultOptions=M,v.vistaView=ot,v.vistaViewDownload=z,Object.defineProperty(v,Symbol.toStringTag,{value:"Module"})}));
+    </div>`)}const M={animationDurationBase:333,maxZoomLevel:2,preloads:1,keyboardListeners:!0,arrowOnSmallScreens:!1,rapidLimit:222,controls:{topLeft:["indexDisplay"],topRight:["zoomIn","zoomOut",z(),"close"],bottomLeft:["description"]}};function K(s){}function _(s){const t=s.options.preloads;s.imageContainer.style.width=`${(t*2+1)*100}vw`,s.imageContainer.style.left=`-${t*100}vw`,s.imageContainer.style.display="flex",G(s)}function G(s){let t={x:0,y:0},e={x:0,y:0},i=null;s.registerPointerListener(n=>{var o;if(!n.hasInternalExecution&&!(n.pointers.length>1)){if(n.event==="down"&&(t={x:n.pointer.x,y:n.pointer.y},e={x:n.pointer.x,y:n.pointer.y},(o=n.abortController)==null||o.abort()),n.event==="move"){e={x:n.pointer.x,y:n.pointer.y};const r=e.x-t.x,a=e.y-t.y;if(!i&&Math.abs(a)>Math.abs(r)||i==="y"){const l=a/window.innerHeight*100;s.imageContainer.style.transition="none",s.imageContainer.style.transform=`translateY(${l}vh)`,i="y"}else if(!i&&Math.abs(r)>Math.abs(a)||i==="x"){const l=r/window.innerWidth*100;s.imageContainer.style.transition="none",s.imageContainer.style.transform=`translateX(${l}vw)`,i="x"}}if(n.event==="up"||n.event==="cancel"){let r=function(a){var l;(l=s.imageContainer)==null||l.addEventListener("transitionend",function c(){var m;(m=s.imageContainer)==null||m.removeEventListener("transitionend",c),s.imageContainer.style.transition="",s.imageContainer.style.transform=""}),s.imageContainer.style.transition="transform 222ms ease",s.imageContainer.style.transform=a};if(i==="y"){const a=e.y-t.y;Math.abs(a)>144?(s.imageContainer.style.transition="transform 222ms ease",s.imageContainer.style.transform="translateY(0vh)",s.close()):r("translateY(0vh)")}if(i==="x"){const a=e.x-t.x,l=n.pointer.movementX,c=1;s.imageContainer.style.transition="",a>0&&Math.abs(l)>c?s.prev():a<0&&Math.abs(l)>c?s.next():r("translateX(0vw)")}i=null,t={x:0,y:0},e={x:0,y:0}}}})}function J(s){}function Q({vistaView:{isReducedMotion:s},htmlElements:{to:t},index:{from:e,to:i},vistaView:{elements:n,imageContainer:o,options:r}},a){if(!(!t||a.aborted||s||!(Math.abs(i-e)===1||e===0&&i===n.length-1||e===n.length-1&&i===0)))return{cleanup:()=>{o.style.transition="",o.style.transform=""},transitionEnded:new Promise(c=>{o.addEventListener("transitionend",()=>{c()},{once:!0}),o.addEventListener("transitioncancel",()=>{a.aborted&&c()},{once:!0});const m=Math.round(r.animationDurationBase*100)/100,f=i===e+1||e===n.length-1&&i===0?"translateX(-100vw)":"translateX(100vw)";o.style.transition=`transform ${m}ms ease`,o.style.transform=f})}}class tt{constructor({elm:t,listeners:e}){h(this,"pointers",[]);h(this,"elm");h(this,"listeners",[]);h(this,"lastPointerDownId",null);h(this,"removeLastPointer",()=>{if(this.pointers.length&&this.lastPointerDownId!==null){const t=this.pointers.findIndex(e=>e.id===this.lastPointerDownId);t!==-1&&this.pointers.splice(t,1)}});h(this,"onPointerDown",t=>{if(!this.listeners.length||t.button!==0)return;t.preventDefault(),this.lastPointerDownId=t.pointerId,window.addEventListener("contextmenu",this.removeLastPointer,{once:!0}),window.addEventListener("auxclick",this.removeLastPointer,{once:!0});let e={x:t.clientX,y:t.clientY,movementX:0,movementY:0,id:t.pointerId};this.pointers.push(e),this.listeners.forEach(i=>i({event:"down",pointer:e,pointers:this.pointers,lastPointerLen:this.pointers.length-1}))});h(this,"onPointerMove",t=>{if(!this.listeners.length)return;t.preventDefault();const e=this.pointers.find(i=>i.id===t.pointerId);e&&(e.movementX=t.movementX,e.movementY=t.movementY,e.x=t.clientX,e.y=t.clientY,this.listeners.forEach(i=>i({event:"move",pointer:e,pointers:this.pointers,lastPointerLen:this.pointers.length-1})))});h(this,"onPointerUp",t=>{if(!this.listeners.length||t.button!==0||(window.removeEventListener("contextmenu",this.removeLastPointer),window.removeEventListener("auxclick",this.removeLastPointer),t.target instanceof Node&&!this.elm.contains(t.target)&&t.target!==document.querySelector("html")&&t.target!==document))return;t.preventDefault();const e=this.pointers.findIndex(o=>o.id===t.pointerId);if(e===-1)return;const i=this.pointers[e];i.x=t.clientX,i.y=t.clientY;const n=this.pointers.length;this.pointers.splice(e,1),this.listeners.forEach(o=>o({event:"up",pointer:i,pointers:this.pointers,lastPointerLen:n}))});h(this,"onPointerCancel",t=>{if(!this.listeners.length||t.target instanceof Node&&!this.elm.contains(t.target)&&t.target!==document.querySelector("html")&&t.target!==document)return;t.preventDefault();const e=this.pointers.findIndex(o=>o.id===t.pointerId);if(e===-1)return;const i=this.pointers[e];i.x=t.clientX,i.y=t.clientY;const n=this.pointers.length;this.pointers.splice(e,1),this.listeners.forEach(o=>o({event:"cancel",pointer:i,pointers:this.pointers,lastPointerLen:n}))});this.elm=t??document,e&&(this.listeners=e),this.startListeners()}startListeners(){this.elm.addEventListener("pointerdown",this.onPointerDown),this.elm.addEventListener("pointermove",this.onPointerMove),document.addEventListener("pointerup",this.onPointerUp),document.addEventListener("pointercancel",this.onPointerCancel)}removeListeners(){this.elm.removeEventListener("pointerdown",this.onPointerDown),this.elm.removeEventListener("pointermove",this.onPointerMove),document.removeEventListener("pointerup",this.onPointerUp),document.removeEventListener("pointercancel",this.onPointerCancel),this.pointers=[]}addEventListener(t){this.listeners.push(t)}removeEventListener(t){this.listeners=this.listeners.filter(e=>e!==t)}getPointerDistance(t,e){const i=t.x-e.x,n=t.y-e.y;return Math.sqrt(i*i+n*n)}getCentroid(){if(this.pointers.length===0)return null;const t=this.pointers.reduce((e,i)=>(e.x+=i.x,e.y+=i.y,e),{x:0,y:0});return{x:t.x/this.pointers.length,y:t.y/this.pointers.length}}}class et{constructor(t,e){h(this,"maxZoomLevel");h(this,"image",null);h(this,"rect",null);h(this,"initialCenter",{x:0,y:0});h(this,"maxDimension",{width:0});h(this,"minDimension",{initialWidth:0,initialHeight:0,minWidth:0,closingWidth:0});h(this,"accumulatedTranslate",{x:0,y:0});h(this,"scale",1);h(this,"translate",{x:0,y:0});h(this,"onScale",null);h(this,"animationTimestamp",0);this.maxZoomLevel=t,this.onScale=e}clean(){this.image&&(this.image.style.transform="",this.image.style.width="",this.image.style.height="",this.image.style.top="",this.image.style.left="",this.image.style.opacity="")}reset(){this.clean(),this.image=null,this.rect=null,this.initialCenter={x:window.innerWidth/2,y:window.innerHeight/2},this.maxDimension={width:0},this.minDimension={initialWidth:0,initialHeight:0,minWidth:0,closingWidth:0},this.accumulatedTranslate={x:0,y:0},this.scale=1,this.translate={x:0,y:0}}setCurrentImage(t){if(this.rect=null,this.image=t,this.maxDimension={width:t.naturalWidth*this.maxZoomLevel},!t.dataset.vvwWidth||!t.dataset.vvwHeight)throw new Error("VistaImageState: Image dataset vvwWidth or vvwHeight not set.");const e=parseFloat(t.dataset.vvwWidth),i=parseFloat(t.dataset.vvwHeight);this.minDimension={initialWidth:e,initialHeight:i,minWidth:e*.1,closingWidth:e*.5},this.accumulatedTranslate={x:0,y:0}}setInitialCenter(t){this.initialCenter=t||{x:window.innerWidth/2,y:window.innerHeight/2}}move(t){this.image&&(this.rect||(this.rect=this.image.getBoundingClientRect()),this.translate.x=L(t.x-this.initialCenter.x),this.translate.y=L(t.y-this.initialCenter.y),this.image.style.transform=`translate3d(${this.translate.x}px, ${this.translate.y}px, 0px) scale(${this.scale})`)}snapToTargetIfClose(t,e,i=1){return Math.abs(t-e)<=i&&(t=e),t}scaleMove(t,e){if(!this.image)return;this.rect||(this.rect=this.image.getBoundingClientRect()),e||(e=this.initialCenter);const i=this.snapToTargetIfClose(q(this.rect.width*t,this.minDimension.minWidth,this.maxDimension.width),this.minDimension.initialWidth);this.onScale&&this.onScale({scale:i/(this.maxDimension.width/this.maxZoomLevel),isMax:i>=this.maxDimension.width,isMin:i<=this.minDimension.initialWidth}),this.scale=L(i/this.rect.width);const n=this.rect.left+this.rect.width/2,o=this.rect.top+this.rect.height/2,r=this.initialCenter.x-n,a=this.initialCenter.y-o,l=r*(1-this.scale),c=a*(1-this.scale),m=e.x-this.initialCenter.x,f=e.y-this.initialCenter.y;this.translate.x=L(l+m),this.translate.y=L(c+f),this.image.style.transform=`translate3d(${this.translate.x}px, ${this.translate.y}px, 0px) scale(${this.scale})`,i<=this.minDimension.closingWidth?this.image.style.opacity="0.5":this.image.style.opacity=""}moveAndNormalize(t){let e=0,i=!1;const n=({x:o,y:r})=>{if(i)return;if(Math.abs(o)<.001&&Math.abs(r)<.001)return this.normalize();o*=.9,r*=.9;const a=this.image.getBoundingClientRect();this.translate.x=L(this.translate.x+o),this.translate.y=L(this.translate.y+r),a.right<window.innerWidth/2&&(this.translate.x+=(window.innerWidth/2-a.right)*.1,o*=.7),a.left>window.innerWidth/2&&(this.translate.x-=(a.left-window.innerWidth/2)*.1,o*=.7),a.bottom<window.innerHeight/2&&(this.translate.y+=(window.innerHeight/2-a.bottom)*.1,r*=.7),a.top>window.innerHeight/2&&(this.translate.y-=(a.top-window.innerHeight/2)*.1,r*=.7),this.image.style.transform=`translate3d(${this.translate.x}px, ${this.translate.y}px, 0px) scale(${this.scale})`,e=requestAnimationFrame(()=>n({x:o,y:r}))};return n({x:t.movementX,y:t.movementY}),()=>{i=!0,cancelAnimationFrame(e),this.normalize(!1)}}animateZoom(t){if(!this.image)return;this.rect||(this.rect=this.image.getBoundingClientRect());const e=Date.now(),i=this.image;this.rect.width*t<this.minDimension.closingWidth||i.width<Math.floor(this.minDimension.initialWidth)||(i.addEventListener("transitionend",()=>{this.animationTimestamp===e&&i&&(i.style.transition="",this.normalize())},{once:!0}),i.style.transition||(i.style.transition="all 222ms ease"),this.animationTimestamp=e,this.scaleMove(t))}normalize(t=!0){if(!this.image||!this.rect)return;const e=this.rect.width*this.scale,i=e<=this.minDimension.closingWidth,n=i?e:this.snapToTargetIfClose(this.rect.width*this.scale,this.minDimension.initialWidth),o=i?this.rect.height*this.scale:this.snapToTargetIfClose(this.rect.height*this.scale,this.minDimension.initialHeight);if(this.image.style.width=`${n}px`,this.image.style.height=`${o}px`,this.scale=1,this.image.style.opacity="",this.accumulatedTranslate.x+=this.translate.x,this.accumulatedTranslate.y+=this.translate.y,this.image.style.left=`calc(50% + ${this.accumulatedTranslate.x}px)`,this.image.style.top=`calc(50% + ${this.accumulatedTranslate.y}px)`,this.translate={x:0,y:0},this.image.style.transform="",this.rect=this.image.getBoundingClientRect(),i)return!0;if(n<this.minDimension.initialWidth)this.accumulatedTranslate.x=0,this.accumulatedTranslate.y=0,requestAnimationFrame(()=>{const r=this.image;r&&(r.addEventListener("transitionend",()=>{r&&(this.clean(),this.rect=null)},{once:!0}),r.style.transition="all 222ms ease",r.style.width=`${this.minDimension.initialWidth}px`,r.style.height=`${this.minDimension.initialHeight}px`,r.style.left="50%",r.style.top="50%")});else if(t){let r=!1;if(this.rect.right<window.innerWidth/2&&(r=!0,this.accumulatedTranslate.x+=window.innerWidth/2-this.rect.right),this.rect.left>window.innerWidth/2&&(r=!0,this.accumulatedTranslate.x-=this.rect.left-window.innerWidth/2),this.rect.bottom<window.innerHeight/2&&(r=!0,this.accumulatedTranslate.y+=window.innerHeight/2-this.rect.bottom),this.rect.top>window.innerHeight/2&&(r=!0,this.accumulatedTranslate.y-=this.rect.top-window.innerHeight/2),r){const a=this.image;a.addEventListener("transitionend",()=>{a&&(a.style.transition="",this.rect=null)},{once:!0}),a.style.transition="all 222ms ease",a.style.left=`calc(50% + ${this.accumulatedTranslate.x}px)`,a.style.top=`calc(50% + ${this.accumulatedTranslate.y}px)`}else this.rect=null}}}class it{constructor(){h(this,"fiolast",{})}fio(t,e,i=50){const o=Date.now()-(this.fiolast[e]??0),r=()=>{this.fiolast[e]=Date.now(),t()};if(!this.fiolast[e]){r();return}o>=i&&r()}}const b={somethingOpened:null};class nt{constructor(t,e={}){h(this,"options");h(this,"elements");h(this,"isReducedMotion");h(this,"currentIndex",-1);h(this,"currentChildren",null);h(this,"setupFunction",K);h(this,"initFunction",_);h(this,"closeFunction",J);h(this,"transitionFunction",Q);h(this,"pointers",null);h(this,"imageState");h(this,"imageTransitions",new Map);h(this,"root",null);h(this,"imageContainer",null);h(this,"onClickElements",t=>{t.preventDefault();const e=t.currentTarget;e.dataset.vistaIdx&&this.open(parseInt(e.dataset.vistaIdx))});h(this,"defaultOnClickHandler",t=>t.preventDefault());h(this,"abortController",null);h(this,"throttle",new it);h(this,"lastSwapTime",0);h(this,"transitionCleanup",null);h(this,"isZoomedIn",!1);h(this,"onKeyDown",t=>{switch(t.key){case"ArrowLeft":t.preventDefault(),this.prev();break;case"ArrowRight":t.preventDefault(),this.next();break;case"ArrowUp":t.preventDefault(),this.zoomIn();break;case"ArrowDown":t.preventDefault(),this.zoomOut();break;case"Escape":t.preventDefault(),this.close();break}});h(this,"onScroll",t=>{t.preventDefault();const e=t.deltaY;this.imageState.setInitialCenter({x:t.clientX,y:t.clientY}),e<0?this.zoomIn():e>0&&this.zoomOut()});h(this,"onResizeHandler",()=>{this.currentChildren.htmls.forEach((t,e)=>{const i=this.currentChildren.images[e],n=t.querySelector("img.vvw-img-hi"),o=t.querySelector("img.vvw-img-lo");if(P(i,n,o,!1),n.classList.contains("vvw--loaded")){const{width:r,height:a}=F(n);n.style.setProperty("--vvw-current-w",`${r}px`),n.style.setProperty("--vvw-current-h",`${a}px`),n.dataset.vvwWidth=r.toString(),n.dataset.vvwHeight=a.toString()}})});h(this,"pointerListeners",[]);h(this,"getInternalPointerListener",()=>{const t=this.imageState;let e=0,i=!1,n=()=>{};return o=>{if(o.event==="down"){if(n(),this.isZoomedIn&&o.pointers.length===1){const r=this.pointers.getCentroid();t.setInitialCenter(r)}if(o.pointers.length>=2){i=!0;const r=this.pointers.getCentroid();e=this.pointers.getPointerDistance(o.pointers[0],o.pointers[1]),t.setInitialCenter(r)}}else if(o.event==="move"){if(this.isZoomedIn&&o.pointers.length===1&&o.lastPointerLen===0){const r=this.pointers.getCentroid();t.move(r)}if(o.pointers.length>=2&&i){const r=this.pointers.getCentroid(),a=this.pointers.getPointerDistance(o.pointers[0],o.pointers[1]);t.scaleMove(a/e,r)}}else(o.event==="up"||o.event==="cancel")&&(i||this.isZoomedIn)&&(i?(i=!1,t.normalize()&&requestAnimationFrame(()=>{this.close()})):this.isZoomedIn&&o.pointers.length===0&&(n=t.moveAndNormalize(o.pointer)));this.pointerListeners.forEach(r=>r({...o,hasInternalExecution:this.isZoomedIn||i,abortController:this.abortController}))}});this.elements=t,this.options={...M,...e,controls:{...M.controls,...e.controls}},this.imageState=new et(this.options.maxZoomLevel,i=>{var n,o,r,a,l,c;i.isMin?(this.isZoomedIn=!1,(n=this.qs(".vvw-zoom-out"))==null||n.setAttribute("disabled","true"),(o=this.qs('.vvw-item[data-vvw-idx="'+this.currentIndex+'"]'))==null||o.style.setProperty("pointer-events","none")):(this.isZoomedIn=!0,(r=this.qs(".vvw-zoom-out"))==null||r.removeAttribute("disabled"),(a=this.qs('.vvw-item[data-vvw-idx="'+this.currentIndex+'"]'))==null||a.style.setProperty("pointer-events","auto")),i.isMax?(l=this.qs(".vvw-zoom-in"))==null||l.setAttribute("disabled","true"):(c=this.qs(".vvw-zoom-in"))==null||c.removeAttribute("disabled")}),this.options.setupFunction&&(this.setupFunction=this.options.setupFunction),this.options.closeFunction&&(this.closeFunction=this.options.closeFunction),this.options.initFunction&&(this.initFunction=this.options.initFunction),this.options.transitionFunction&&(this.transitionFunction=this.options.transitionFunction),this.isReducedMotion=window.matchMedia("(prefers-reduced-motion: reduce)").matches,this.elements instanceof NodeList&&this.elements.forEach((i,n)=>{i.dataset.vistaIdx=n.toString(),i.addEventListener("click",this.defaultOnClickHandler),i.addEventListener("pointerup",this.onClickElements)})}qs(t){return this.root?this.root.querySelector(t):null}async swap(t,e){const i=this.options.preloads||0,n=this.currentIndex,{htmls:o,images:r}=this.getChildElements(i,n),a=this.imageContainer,l=this.currentChildren,c={htmlElements:{from:l.htmls,to:o},images:{from:l.images,to:r},index:{from:t,to:this.currentIndex},via:e||{next:!1,prev:!1},vistaView:this};this.setupFunction(c),this.currentChildren={htmls:o,images:r},this.displayActiveIndex();const m=this.abortController.signal;if(performance.now()-this.lastSwapTime<this.options.rapidLimit){a.innerHTML="",this.transitionCleanup&&this.transitionCleanup(),o.forEach(E=>{a.appendChild(E)}),this.lastSwapTime=performance.now(),this.waitForImagesToLoad(),this.options.onImageView&&this.options.onImageView(c);return}const y=this.transitionFunction(c,m);y&&(this.transitionCleanup=y.cleanup,await y.transitionEnded),this.lastSwapTime=performance.now();const d=o[Math.floor(o.length/2)].dataset.vvwIdx,u=a.querySelector(`.vvw-item[data-vvw-idx="${d}"] img.vvw-img-hi`),C=this.imageTransitions.get(u);this.imageTransitions.delete(u);const x=u.getAttribute("style")||"",p=u.classList.contains("vvw--loaded"),T=u.classList.contains("vvw--ready"),S=u.width,H=u.height;this.imageState.reset(),a.innerHTML="",this.transitionCleanup&&this.transitionCleanup(),o.forEach(E=>{const g=E.querySelector("img.vvw-img-hi");E.dataset.vvwPos==="0"&&!m.aborted&&x&&S&&H&&(p&&(g.classList.add("vvw--loaded"),g.dataset.vvwWidth=u.dataset.vvwWidth||"",g.dataset.vvwHeight=u.dataset.vvwHeight||""),T&&(g.classList.add("vvw--ready"),g.width=S,g.height=H),g.setAttribute("style",x)),a.appendChild(E),E.dataset.vvwPos==="0"&&!m.aborted&&T?(this.imageState.setCurrentImage(g),this.imageState.setInitialCenter()):E.dataset.vvwPos==="0"&&!m.aborted&&x&&S&&H&&p&&C&&(this.imageTransitions.set(g,C),this.transitionImage(g,()=>{this.imageState.setCurrentImage(g),this.imageState.setInitialCenter(),g.classList.add("vvw--ready")}))}),this.waitForImagesToLoad(),this.options.onImageView&&this.options.onImageView(c)}getChildElements(t,e){const i=[],n=[];for(let o=-t;o<=t;o++){const r=(e+o+this.elements.length)%this.elements.length,a=this.elements[r],l=a instanceof HTMLImageElement?a:a instanceof HTMLAnchorElement&&a.querySelector("img")||void 0,c=a instanceof HTMLElement?{index:r,imageElm:l instanceof HTMLImageElement?l:void 0,anchorElm:a instanceof HTMLAnchorElement?a:void 0,src:a.dataset.vistaviewSrc||a.getAttribute("href")||a.getAttribute("src")||"",thumb:a.dataset.vistaviewThumb||(l instanceof HTMLImageElement?l.getAttribute("src"):void 0)||a.getAttribute("href")||void 0,alt:l instanceof HTMLImageElement&&l.getAttribute("alt")||void 0}:{index:r,...a};n.push(c),i.push(V(c,o))}return{htmls:i,images:n}}zoomIn(){this.throttle.fio(()=>{this.imageState.animateZoom(1.68)},"zoom",222)}zoomOut(){this.throttle.fio(()=>{this.imageState.animateZoom(.68)},"zoom",222)}displayActiveIndex(){var r;const t=this.currentIndex;this.elements instanceof NodeList&&this.elements.forEach((a,l)=>{a.style.opacity="",l===t&&(a.style.opacity="0")});const e=this.qs(".vvw-index"),i=`${t+1}`,n=`${this.elements.length}`;e&&(e.textContent=`${i} / ${n}`);const o=this.qs(".vvw-desc");if(o){const a=(r=this.currentChildren)==null?void 0:r.images.find(c=>c.index===t),l=(a==null?void 0:a.alt)||"";l?(o.textContent=l,o.setAttribute("aria-label",`Image ${i} of ${n}: ${l}`)):(o.textContent="",o.setAttribute("aria-label",`Image ${i} of ${n}`))}}transitionImage(t,e){const i=this.imageTransitions.get(t);i&&requestAnimationFrame(()=>{const{current:n,target:o}=i,r={width:n.width+(o.width-n.width)*.1,height:n.height+(o.height-n.height)*.1,radius:n.radius+(o.radius-n.radius)*.1};Math.abs(r.width-o.width)<.5&&Math.abs(r.height-o.height)<.5&&Math.abs(r.radius-o.radius)<.5?(t.style.setProperty("--vvw-current-w",`${o.width}px`),t.style.setProperty("--vvw-current-h",`${o.height}px`),t.style.setProperty("--vvw-current-radius",`${o.radius}px`),this.imageTransitions.delete(t),e()):(t.style.setProperty("--vvw-current-w",`${r.width}px`),t.style.setProperty("--vvw-current-h",`${r.height}px`),t.style.setProperty("--vvw-current-radius",`${r.radius}px`),this.imageTransitions.set(t,{current:r,target:o}),this.transitionImage(t,e))})}waitForImagesToLoad(){this.imageContainer.querySelectorAll("img.vvw-img-hi:not(.vvw--loaded)").forEach(i=>{const n=i,o=()=>{var c;n.width=n.naturalWidth,n.height=n.naturalHeight;const r=(c=n.parentElement)==null?void 0:c.matches(`[data-vvw-idx="${this.currentIndex}"]`),{width:a,height:l}=F(n);n.dataset.vvwWidth=a.toString(),n.dataset.vvwHeight=l.toString(),n.classList.add("vvw--loaded"),this.imageTransitions.set(n,{current:{width:n.style.getPropertyValue("--vvw-current-w")?parseFloat(n.style.getPropertyValue("--vvw-current-w")):0,height:n.style.getPropertyValue("--vvw-current-h")?parseFloat(n.style.getPropertyValue("--vvw-current-h")):0,radius:n.style.getPropertyValue("--vvw-current-radius")?parseFloat(n.style.getPropertyValue("--vvw-current-radius")):0},target:{width:a,height:l,radius:0}}),this.transitionImage(n,()=>{r&&(this.imageState.setCurrentImage(n),this.imageState.setInitialCenter()),n.classList.add("vvw--ready")})};if(n.complete&&n.naturalWidth!==0){o();return}n.addEventListener("load",()=>{o()}),n.addEventListener("error",()=>{var a;n.classList.add("vvw--loaderror");const r=document.createElement("p");r.className="vvw-img-err",r.setAttribute("role","alert"),r.textContent="Error loading image",(a=n.parentNode)==null||a.appendChild(r)})})}registerPointerListener(t){this.pointerListeners.push(t)}unregisterPointerListeners(){this.pointerListeners=[]}open(t=0){var c,m,f,$,y;if(b.somethingOpened)return;b.somethingOpened=this,this.currentIndex=t,document.body.style.overflow="hidden";const e=U({controls:this.options.controls});if(document.body.prepend(e),this.root=document.body.querySelector("#vvw-root"),!this.root)throw new Error("Failed to setup VistaView root element.");this.imageContainer=this.qs(".vvw-image-container"),this.options.animationDurationBase&&this.root.style.setProperty("--vvw-anim-dur",`${this.options.animationDurationBase}`),this.options.initialZIndex!==void 0&&this.root.style.setProperty("--vvw-init-z",`${this.options.initialZIndex??0}`),this.options.arrowOnSmallScreens&&this.root.classList.add("vvw-arrow-sm");const i=this.options.preloads||0,n=t,{images:o,htmls:r}=this.getChildElements(i,n),a={htmlElements:{from:null,to:r},images:{from:null,to:o},index:{from:null,to:this.currentIndex},via:{next:!1,prev:!1},vistaView:this};this.setupFunction(a),this.currentChildren={htmls:r,images:o},r.forEach(d=>{this.imageContainer.appendChild(d)}),(c=this.qs(".vvw-close"))==null||c.addEventListener("click",()=>this.close()),(m=this.qs(".vvw-zoom-in"))==null||m.addEventListener("click",()=>this.zoomIn()),(f=this.qs(".vvw-zoom-out"))==null||f.addEventListener("click",()=>this.zoomOut()),($=this.qs(".vvw-prev>button"))==null||$.addEventListener("click",()=>this.prev()),(y=this.qs(".vvw-next>button"))==null||y.addEventListener("click",()=>this.next()),this.options.keyboardListeners&&window.addEventListener("keydown",this.onKeyDown),window.addEventListener("wheel",this.onScroll,{passive:!1}),window.addEventListener("resize",this.onResizeHandler),this.pointers=new tt({elm:this.imageContainer,listeners:[this.getInternalPointerListener()]});const l={};[...this.options.controls.topLeft||[],...this.options.controls.topRight||[],...this.options.controls.topCenter||[],...this.options.controls.bottomCenter||[],...this.options.controls.bottomLeft||[],...this.options.controls.bottomRight||[]].forEach(d=>{typeof d!="string"&&(l[d.name]=d)}),this.root.querySelectorAll("button[data-vvw-control]").forEach(d=>{const u=d;u.addEventListener("click",C=>{const x=C.currentTarget.dataset.vvwControl,p=l[x],T=this.currentChildren.images.find(S=>S.index===this.currentIndex);p&&T&&(p.onClick.constructor.name==="AsyncFunction"?(u.classList.add("vvw--loading"),p.onClick(T,this).finally(()=>{u.classList.remove("vvw--loading")})):p.onClick(T,this))})}),this.initFunction(this),requestAnimationFrame(()=>{var d;(d=this.root)==null||d.addEventListener("transitionend",()=>{var u;(u=this.root)==null||u.classList.add("vvw--settled"),this.waitForImagesToLoad(),this.imageState.reset()},{once:!0}),this.root.classList.add("vvw--active"),this.displayActiveIndex(),this.options.onOpen&&this.options.onOpen(this),this.options.onImageView&&this.options.onImageView(a)})}async close(t=!0){b.somethingOpened===this&&this.root&&(t?await new Promise(e=>{let n=0;this.root.addEventListener("transitionend",o=>{o.target===this.root&&(n++,n===2&&this.elements instanceof NodeList&&this.elements.forEach(r=>{r.style.opacity=""}),n===3&&e(null))}),this.root.classList.add("vvw--closing")}):this.elements instanceof NodeList&&this.elements.forEach(e=>{e.style.opacity=""}),this.options.keyboardListeners&&window.removeEventListener("keydown",this.onKeyDown),window.removeEventListener("resize",this.onResizeHandler),window.removeEventListener("wheel",this.onScroll),this.unregisterPointerListeners(),this.pointers.removeListeners(),this.root.remove(),this.root=null,this.imageContainer=null,this.currentChildren=null,this.currentIndex=-1,document.body.style.overflow="",b.somethingOpened=null,this.closeFunction(this),this.options.onClose&&this.options.onClose(this))}next(){if(b.somethingOpened!==this)return;const t=(this.currentIndex+1)%this.elements.length;this.view(t,{next:!0,prev:!1})}prev(){if(b.somethingOpened!==this)return;const t=(this.currentIndex-1+this.elements.length)%this.elements.length;this.view(t,{next:!1,prev:!0})}destroy(){this.close(!1),this.elements instanceof NodeList&&this.elements.forEach(t=>{t.removeAttribute("data-vista-idx"),t.removeEventListener("click",this.defaultOnClickHandler),t.removeEventListener("pointerup",this.onClickElements)})}getCurrentIndex(){return b.somethingOpened!==this?-1:this.currentIndex}view(t,e){if(b.somethingOpened!==this||t<0||t>=this.elements.length)return;const i=this.currentIndex;this.currentIndex=t;const n=this.abortController;n==null||n.abort(),this.abortController=new AbortController,this.swap(i,e)}}function st(s){let t=null;if(typeof s=="string"?t=document.querySelectorAll(s):s instanceof NodeList&&(t=s),t)for(let e=0;e<t.length;e++){const i=t[e];if(!(i.dataset.vistaviewSrc||i.getAttribute("href")||i.getAttribute("src")||""))return`Element at index ${e} is missing 'src' / 'data-vistaview-src' / 'href' attribute.`}else{const e=s;for(let i=0;i<e.length;i++)if(!e[i].src)return`Element at index ${i} is missing 'src' attribute.`}return t||s}function ot({elements:s,...t}){if(!s)throw new Error("No elements");let e=st(s);if(typeof e=="string")return null;const i=new nt(e,t);return{open:(n=0)=>i.open(n),close:()=>i.close(),next:()=>i.next(),prev:()=>i.prev(),destroy:()=>i.destroy(),getCurrentIndex:()=>i.getCurrentIndex(),view:n=>{i.view(n)}}}v.DefaultOptions=M,v.vistaView=ot,v.vistaViewDownload=z,Object.defineProperty(v,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vistaview",
-  "version": "0.7.0",
+  "version": "0.7.1",
   "description": "A lightweight, zero-dependency image lightbox library with smooth animations and touch support",
   "keywords": [
     "image",