vistaview 1.0.3 → 2.0.0

package/dist/vistaview.js

@@ -1,1013 +0,0 @@
-var S = Object.defineProperty;
-var D = (s, t, e) => t in s ? S(s, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[t] = e;
-var r = (s, t, e) => D(s, typeof t != "symbol" ? t + "" : t, e);
-import { V as T, a as L } from "./vista-box-zG6ZgBcI.js";
-const I = {
-  // debug, don't remove
-  // animationDurationBase: 1000,
-  animationDurationBase: 333,
-  maxZoomLevel: 2,
-  preloads: 1,
-  keyboardListeners: !0,
-  arrowOnSmallScreens: !1,
-  rapidLimit: 222,
-  controls: {
-    topLeft: ["indexDisplay"],
-    topRight: ["zoomIn", "zoomOut", "close"],
-    bottomLeft: ["description"]
-  }
-}, 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>', q = '<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>', M = '<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>', H = '<svg viewBox="0 0 24 24"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>';
-let E = null;
-function W() {
-  return E || (window.trustedTypes || (window.trustedTypes = {
-    createPolicy: (s, t) => t
-  }), E = window.trustedTypes.createPolicy("vistaView-policy", {
-    createHTML: (s) => s,
-    // HTML is generated by us, not user input
-    createScript: () => {
-      throw new Error("Not implemented");
-    },
-    createScriptURL: () => {
-      throw new Error("Not implemented");
-    }
-  }), E);
-}
-function F(s) {
-  const e = W().createHTML(s), i = document.createElement("template");
-  i.innerHTML = e;
-  const n = i.content;
-  return i.remove(), n;
-}
-function A(s, t) {
-  if (typeof s == "string")
-    switch (s) {
-      case "zoomIn":
-        return `<div class="vvw-ui"><button aria-label="Zoom In" class="vvw-zoom-in">${q}</button></div>`;
-      case "zoomOut":
-        return `<div class="vvw-ui"><button aria-label="Zoom Out" disabled class="vvw-zoom-out">${M}</button></div>`;
-      case "close":
-        return `<div class="vvw-ui"><button aria-label="Close" class="vvw-close">${H}</button></div>`;
-      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:
-        const e = t[s];
-        return e && e.control ? `<div class="vvw-ext vvw-ui" aria-label="${e.description || e.name}" data-vvw-control="${e.name}"></div>` : (console.warn(`Unknown control: ${s}. Will return empty string.`), "");
-    }
-  return "";
-}
-function $({
-  controls: s,
-  extensions: t
-}) {
-  const e = {};
-  t.forEach((o) => {
-    e[o.name] = o;
-  });
-  const i = (o) => o ? o.map((a) => A(a, e)).join("") : "", n = F(
-    `<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>${i(s == null ? void 0 : s.topLeft)}</div>
-        <div>${i(s == null ? void 0 : s.topCenter)}</div>
-        <div>${i(s == null ? void 0 : s.topRight)}</div>
-      </div>
-      <div class="vvw-bottom-bar">
-        <div>${i(s == null ? void 0 : s.bottomLeft)}</div>
-        <div>${i(s == null ? void 0 : s.bottomCenter)}</div>
-        <div>${i(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>`
-  );
-  return [
-    ...(s == null ? void 0 : s.topLeft) || [],
-    ...(s == null ? void 0 : s.topCenter) || [],
-    ...(s == null ? void 0 : s.topRight) || [],
-    ...(s == null ? void 0 : s.bottomLeft) || [],
-    ...(s == null ? void 0 : s.bottomCenter) || [],
-    ...(s == null ? void 0 : s.bottomRight) || []
-  ].forEach((o) => {
-    const a = e[o];
-    if (a && a.control) {
-      const h = n.querySelector(`[data-vvw-control="${a.name}"]`), l = a.control();
-      h && l && h.appendChild(l);
-    }
-  }), n;
-}
-function k(s, t) {
-}
-function V(s) {
-  N(s);
-}
-function N(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 a = e.x - t.x, h = e.y - t.y;
-        if (!i && Math.abs(h) > Math.abs(a) || i === "y") {
-          const l = h / window.innerHeight * 100;
-          s.imageContainer.style.transition = "none", s.imageContainer.style.transform = `translateY(${l}vh)`, i = "y";
-        } else if (!i && Math.abs(a) > Math.abs(h) || i === "x" && n.state.elmLength > 1) {
-          const l = a / 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 a = function(h) {
-          var l;
-          (l = s.imageContainer) == null || l.addEventListener("transitionend", function d() {
-            var p;
-            (p = s.imageContainer) == null || p.removeEventListener("transitionend", d), s.imageContainer.style.transition = "", s.imageContainer.style.transform = "";
-          }), s.imageContainer.style.transition = "transform 222ms ease", s.imageContainer.style.transform = h;
-        };
-        if (i === "y") {
-          const h = e.y - t.y;
-          Math.abs(h) > 144 ? (s.imageContainer.style.transition = "transform 222ms ease", s.imageContainer.style.transform = "translateY(0vh)", s.close()) : a("translateY(0vh)");
-        }
-        if (i === "x" && n.state.elmLength > 1) {
-          const h = e.x - t.x;
-          s.imageContainer.style.transition = "", h > 64 ? s.prev() : h < -64 ? s.next() : a("translateX(0vw)");
-        }
-        i = null, t = { x: 0, y: 0 }, e = { x: 0, y: 0 };
-      }
-    }
-  });
-}
-function B(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";
-}
-function U(s) {
-}
-function X({ htmlElements: { to: s }, index: { from: t, to: e } }, i, n) {
-  const { imageContainer: o, options: a } = n, { isReducedMotion: h } = n.state;
-  if (!(!s || i.aborted || h || !(Math.abs(e - t) === 1 || t === 0 && e === n.state.elmLength - 1 || t === n.state.elmLength - 1 && e === 0)))
-    return {
-      cleanup: () => {
-        o.style.transition = "", o.style.transform = "";
-      },
-      transitionEnded: new Promise((d) => {
-        o.addEventListener(
-          "transitionend",
-          () => {
-            d();
-          },
-          { once: !0 }
-        ), o.addEventListener(
-          "transitioncancel",
-          () => {
-            i.aborted && d();
-          },
-          { once: !0 }
-        );
-        const p = Math.round(a.animationDurationBase * 100) / 100, u = e === t + 1 || t === n.state.elmLength - 1 && e === 0 ? "translateX(-100vw)" : "translateX(100vw)";
-        o.style.transition = `transform ${p}ms ease`, o.style.transform = u;
-      })
-    };
-}
-function z(s) {
-  const t = window.innerWidth, e = window.innerHeight, i = s.naturalWidth, n = s.naturalHeight;
-  if (!i || !n)
-    throw console.error("Error", s), new Error("Image natural dimensions are zero");
-  if (i < t && n < e)
-    return {
-      width: i,
-      height: n
-    };
-  const o = i / n, a = t / e;
-  let h, l;
-  return o > a ? (h = t, l = t / o) : (l = e, h = e * o), {
-    width: h,
-    height: l
-  };
-}
-class Y extends T {
-  constructor(e) {
-    super(e);
-    r(this, "element");
-    r(this, "rect", null);
-    r(this, "animateNormalizeTimeout", null);
-    const i = document.createElement("img");
-    i.alt = this.config.alt || "", i.classList.add("vvw-img-hi"), this.element = i, i.onerror = (n) => {
-      this.isLoadedRejected(n);
-    }, i.src = this.config.src, i.decode().then(() => {
-      this.onLoad();
-    }).catch((n) => {
-      this.isLoadedRejected(n);
-    }), this.setSizes({
-      stableSize: !1,
-      initDimension: !0
-    });
-  }
-  onWidthChange(e) {
-    super.onWidthChange(e);
-    const i = this.getFromParsedSrcSet(e);
-    if (i && this.element.src !== i) {
-      const n = new Image();
-      n.onload = () => {
-        n.decode().then(() => {
-          this.isCancelled || (this.element.src = i);
-        });
-      }, n.src = i;
-    }
-  }
-  onLoad() {
-    if (this.isCancelled) return;
-    const e = this.element;
-    e.width = e.naturalWidth, e.height = e.naturalHeight, this.maxW = e.naturalWidth * this.maxZoomLevel;
-    const { width: i, height: n } = z(e);
-    this.fullH = n, this.fullW = i, this.minW = this.fullW * 0.5, this.isLoadedResolved(!0);
-  }
-  getFullSizeDim() {
-    return z(this.element);
-  }
-  normalize() {
-    super.normalize();
-    const e = this.element;
-    e.style.objectFit = "cover", e.style.borderRadius = "0";
-  }
-  // Used by: VistaImageEvent
-  scaleMove(e, i, n = !1) {
-    if (!this.isReady || !this.element) return;
-    this.rect || (this.rect = this.element.getBoundingClientRect()), i || (i = this.initPointerCenter);
-    const o = this.rect.left + this.rect.width / 2, a = this.rect.top + this.rect.height / 2, h = this.initPointerCenter.x - o, l = this.initPointerCenter.y - a, d = h * (1 - e), p = l * (1 - e), u = i.x - this.initPointerCenter.x, v = i.y - this.initPointerCenter.y;
-    n ? L.start({
-      vistaImage: this,
-      target: {
-        transform: {
-          x: d + u,
-          y: p + v,
-          scale: e
-        }
-      },
-      onComplete: () => {
-        this.setFinalTransform();
-      },
-      shouldWait: () => !1
-    }) : this.state.transform = {
-      x: d + u,
-      y: p + v,
-      scale: e
-    };
-    const m = this.element.getBoundingClientRect().width * e;
-    this.isZoomedIn = m > this.fullW, this.state.lessThanMinWidth = m <= this.minW, this.onScale({
-      vistaImage: this,
-      scale: m / this.fullW,
-      isMax: m >= this.maxW,
-      isMin: m <= this.fullW
-    });
-  }
-  animateZoom(e, i) {
-    this.state.width * e < this.minW || this.scaleMove(e, i, !0);
-  }
-  // Used by: VistaImageEvent
-  momentumThrow(e) {
-    if (!this.isReady)
-      return () => {
-      };
-    if (!this.isThrowing)
-      return this.setFinalTransform(), () => {
-      };
-    if (Math.abs(e.x) < 0.1 && Math.abs(e.y) < 0.1) {
-      const n = this.element.getBoundingClientRect();
-      return L.start({
-        vistaImage: this,
-        target: {
-          transform: {
-            x: n.right < window.innerWidth / 2 ? this.state.transform.x + (window.innerWidth / 2 - n.right) : n.left > window.innerWidth / 2 ? this.state.transform.x - (n.left - window.innerWidth / 2) : this.state.transform.x,
-            y: n.bottom < window.innerHeight / 2 ? this.state.transform.y + (window.innerHeight / 2 - n.bottom) : n.top > window.innerHeight / 2 ? this.state.transform.y - (n.top - window.innerHeight / 2) : this.state.transform.y
-          }
-        },
-        onComplete: () => {
-          this.isThrowing = !1, this.setFinalTransform();
-        },
-        shouldWait: () => !1
-      }), () => {
-      };
-    }
-    return requestAnimationFrame(() => {
-      if (!this.isThrowing) return this.momentumThrow({ x: 0, y: 0 });
-      const i = this.element, n = this.state.transform;
-      n.x += e.x, n.y += e.y;
-      const o = i.getBoundingClientRect();
-      n.x = n.x + e.x, n.y = n.y + e.y, o.right < window.innerWidth / 2 && (n.x += (window.innerWidth / 2 - o.right) * 0.1, e.x *= 0.7), o.left > window.innerWidth / 2 && (n.x -= (o.left - window.innerWidth / 2) * 0.1, e.x *= 0.7), o.bottom < window.innerHeight / 2 && (n.y += (window.innerHeight / 2 - o.bottom) * 0.1, e.y *= 0.7), o.top > window.innerHeight / 2 && (n.y -= (o.top - window.innerHeight / 2) * 0.1, e.y *= 0.7), this.state.transform = n, this.momentumThrow({
-        x: e.x * 0.9,
-        y: e.y * 0.9
-      });
-    }), () => {
-      L.stop(this), this.isThrowing = !1, this.setFinalTransform();
-    };
-  }
-  animateNormalize() {
-    this.animateNormalizeTimeout && clearTimeout(this.animateNormalizeTimeout), this.animateNormalizeTimeout = setTimeout(() => {
-      L.start({
-        vistaImage: this,
-        target: {
-          width: this.fullW,
-          height: this.fullH,
-          translate: { x: 0, y: 0 },
-          transform: { x: 0, y: 0, scale: 1 }
-        },
-        onComplete: () => {
-          this.setFinalTransform();
-        },
-        shouldWait: () => !1
-      });
-    }, 50);
-  }
-  // Used by: VistaImageEvent
-  setFinalTransform() {
-    if (!this.isReady) return;
-    this.rect = null, super.setFinalTransform({ propagateEvent: !1 });
-    const e = this.state.width <= this.minW;
-    if (this.state.width > this.maxW)
-      this.animateZoom(this.maxW / this.state.width);
-    else if (!e && this.state.width < this.fullW)
-      this.animateNormalize();
-    else if (this.pos === 0) {
-      const i = this.toObject();
-      this.vistaView.options.onContentChange && this.vistaView.options.onContentChange(i, this.vistaView), this.vistaView.state.extensions.forEach((n) => {
-        n.onContentChange && n.onContentChange(i, this.vistaView);
-      });
-    }
-    return {
-      close: e,
-      cancel: () => L.stop(this)
-    };
-  }
-}
-class Z {
-  constructor() {
-    r(this, "fiolast", {});
-  }
-  // first in out
-  fio(t, e, i = 50) {
-    const o = Date.now() - (this.fiolast[e] ?? 0), a = () => {
-      this.fiolast[e] = Date.now(), t();
-    };
-    if (!this.fiolast[e]) {
-      a();
-      return;
-    }
-    o >= i && a();
-  }
-}
-class j {
-  constructor() {
-    r(this, "open", !1);
-    r(this, "settled", !1);
-    r(this, "closing", !1);
-    r(this, "zoomedIn", !1);
-    r(this, "children", {
-      htmls: [],
-      images: []
-    });
-    r(this, "currentIndex", -1);
-    r(this, "elmLength", 0);
-    r(this, "abortController", new AbortController());
-    r(this, "isReducedMotion", !1);
-    r(this, "extensions", /* @__PURE__ */ new Set());
-  }
-}
-function P(s) {
-  return s && !/^0(px|%|r?em|vw|vh|vmin|vmax|cm|mm|in|pt|pc|ex|ch)?$/i.test(s.trim()) && s;
-}
-function _(s) {
-  const t = s instanceof HTMLAnchorElement ? s : null, e = s instanceof HTMLImageElement ? s : t == null ? void 0 : t.querySelector("img"), i = t ? getComputedStyle(t) : null, n = e ? getComputedStyle(e) : null;
-  let o = "0px", a = n ? n.objectFit : "contain";
-  return i && P(i.borderRadius) ? o = i.borderRadius : n && P(n.borderRadius) && (o = n.borderRadius), {
-    borderRadius: o,
-    objectFit: a
-  };
-}
-function K(s) {
-  const t = s.split(",").map((i) => i.trim()), e = [];
-  for (const i of t) {
-    const [n, o] = i.split(" ").map((a) => a.trim());
-    if (n && o && o.endsWith("w")) {
-      const a = parseInt(o.slice(0, -1), 10);
-      isNaN(a) || e.push({ src: n, width: a });
-    }
-  }
-  return e;
-}
-function G(s) {
-  const t = s instanceof HTMLImageElement ? s : s.querySelector("img"), e = s.dataset.vistaviewSrc || s.getAttribute("href") || s.getAttribute("src") || (t == null ? void 0 : t.getAttribute("src")) || "", i = s.dataset.vistaviewSrcset || s.getAttribute("srcset") || (t == null ? void 0 : t.getAttribute("srcset")) || "";
-  if (!e && !i)
-    throw console.error("VistaView Error:", s), new Error("VistaView: Element must have href, src, or srcSet");
-  const n = i ? K(i) : void 0, o = _(s);
-  return {
-    config: {
-      src: e,
-      alt: s.dataset.vistaviewAlt || s.getAttribute("alt") || (t == null ? void 0 : t.getAttribute("alt")) || "",
-      srcSet: i || void 0
-    },
-    parsedSrcSet: n != null && n.length ? n : void 0,
-    origin: {
-      anchor: s instanceof HTMLAnchorElement ? s : void 0,
-      image: t,
-      src: e,
-      srcSet: i,
-      borderRadius: o.borderRadius,
-      objectFit: o.objectFit
-    }
-  };
-}
-class J {
-  constructor({ elm: t, listeners: e }) {
-    r(this, "pointers", []);
-    r(this, "elm");
-    r(this, "listeners", []);
-    r(this, "lastPointerDownId", null);
-    r(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);
-      }
-    });
-    r(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
-        })
-      );
-    });
-    r(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
-        })
-      ));
-    });
-    r(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
-        })
-      );
-    });
-    r(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 Q {
-  constructor(t) {
-    //
-    r(this, "pointers", null);
-    // Pinch gesture state
-    r(this, "lastDistance", 0);
-    r(this, "pinchMode", !1);
-    r(this, "lastPinchEndTime", 0);
-    r(this, "PINCH_COOLDOWN", 111);
-    r(this, "cancelMove", () => {
-    });
-    r(this, "pointerListeners", []);
-    r(this, "vvw");
-    // private vistaImage: VistaImage;
-    r(this, "imageContainer", null);
-    r(this, "isPinching", () => this.pinchMode || performance.now() - this.lastPinchEndTime < this.PINCH_COOLDOWN);
-    r(this, "internalPointerListener", (t) => {
-      const e = this.vvw.state.children.images.find((i) => i.pos === 0);
-      if (t.event === "down") {
-        if (this.cancelMove(), this.vvw.state.zoomedIn && t.pointers.length === 1 && !this.isPinching()) {
-          const i = this.pointers.getCentroid();
-          e.setInitialCenter(i);
-        }
-        if (t.pointers.length >= 2) {
-          this.pinchMode = !0;
-          const i = this.pointers.getCentroid();
-          this.lastDistance = this.pointers.getPointerDistance(t.pointers[0], t.pointers[1]), e.setInitialCenter(i);
-        }
-      } else if (t.event === "move") {
-        if (this.vvw.state.zoomedIn && t.pointers.length === 1 && t.lastPointerLen === 0 && !this.isPinching()) {
-          const i = this.pointers.getCentroid();
-          e.scaleMove(1, i);
-        }
-        if (t.pointers.length >= 2 && this.pinchMode) {
-          const i = this.pointers.getCentroid(), n = this.pointers.getPointerDistance(t.pointers[0], t.pointers[1]);
-          e.scaleMove(n / this.lastDistance, i);
-        }
-      } else if ((t.event === "up" || t.event === "cancel") && (this.pinchMode || this.vvw.state.zoomedIn))
-        if (this.pinchMode) {
-          this.lastPinchEndTime = performance.now(), this.pinchMode = !1;
-          const i = e.setFinalTransform();
-          i != null && i.cancel && (this.cancelMove = i.cancel), i != null && i.close && requestAnimationFrame(() => {
-            this.vvw.close();
-          });
-        } else this.vvw.state.zoomedIn && t.pointers.length === 0 && !this.isPinching() && (e.isThrowing = !0, this.cancelMove = e.momentumThrow({
-          x: t.pointer.movementX,
-          y: t.pointer.movementY
-        }));
-      this.pointerListeners.forEach(
-        (i) => i({
-          ...t,
-          state: this.vvw.state,
-          hasInternalExecution: this.vvw.state.zoomedIn || this.isPinching(),
-          abortController: this.vvw.state.abortController
-        })
-      );
-    });
-    r(this, "onKeyDown", (t) => {
-      const e = this.vvw;
-      switch (t.key) {
-        case "ArrowLeft":
-          t.preventDefault(), e.prev();
-          break;
-        case "ArrowRight":
-          t.preventDefault(), e.next();
-          break;
-        case "ArrowUp":
-          t.preventDefault(), e.zoomIn();
-          break;
-        case "ArrowDown":
-          t.preventDefault(), e.zoomOut();
-          break;
-        case "Escape":
-          t.preventDefault(), e.close();
-          break;
-      }
-    });
-    r(this, "onScroll", (t) => {
-      t.preventDefault();
-      const e = this.vvw, i = this.vvw.state.children.images.find((o) => o.pos === 0), n = t.deltaY;
-      i.setInitialCenter({
-        x: t.clientX,
-        y: t.clientY
-      }), n < 0 ? e.zoomIn() : n > 0 && e.zoomOut();
-    });
-    r(this, "onResizeHandler", () => {
-      this.vvw.state.children.images.forEach((t) => {
-        t.setSizes();
-      });
-    });
-    this.vvw = t;
-  }
-  // register external pointer listener
-  registerPointerListener(t) {
-    this.pointerListeners.push(t);
-  }
-  start(t) {
-    this.vvw.options.keyboardListeners && window.addEventListener("keydown", this.onKeyDown), this.imageContainer = t, this.imageContainer.addEventListener("wheel", this.onScroll, { passive: !1 }), window.addEventListener("resize", this.onResizeHandler), this.pointers = new J({
-      elm: t,
-      listeners: [this.internalPointerListener]
-    });
-  }
-  stop() {
-    this.vvw.options.keyboardListeners && window.removeEventListener("keydown", this.onKeyDown), window.removeEventListener("resize", this.onResizeHandler), this.imageContainer.removeEventListener("wheel", this.onScroll), this.pointers.removeListeners(), this.pointerListeners = [];
-  }
-}
-const y = {
-  somethingOpened: null
-};
-class tt {
-  constructor(t, e = {}) {
-    r(this, "options");
-    r(this, "state", new j());
-    r(this, "imageContainer", null);
-    r(this, "externalPointerListener", []);
-    r(this, "elements");
-    r(this, "eventHandlers", null);
-    r(this, "imageSetupFunction", k);
-    r(this, "initFunction", V);
-    r(this, "openFunction", B);
-    r(this, "closeFunction", U);
-    r(this, "transitionFunction", X);
-    r(this, "throttle", new Z());
-    r(this, "root", null);
-    r(this, "onClickElements", (t) => {
-      t.preventDefault();
-      const e = this.qsOrigin(this.elements), i = Array.prototype.indexOf.call(e, t.currentTarget);
-      this.open(i);
-    });
-    r(this, "defaultOnClickHandler", (t) => t.preventDefault());
-    // ============================================================================
-    // SWAP LOGIC - handles image transitions between prev/next
-    // ============================================================================
-    r(this, "lastSwapTime", 0);
-    r(this, "isRapidSwap", !1);
-    r(this, "isRapidSwapRelease", 0);
-    r(this, "transitionCleanup", null);
-    // ============================================================================
-    // ACTIVATE/DEACTIVATE UI ELEMENTS
-    // ============================================================================
-    r(this, "tempDeactivatedUi", []);
-    r(this, "tempDeactivationRequestBy", null);
-    // ============================================================================
-    // ZOOM CONTROLS
-    // ============================================================================
-    r(this, "isZoomedIn", !1);
-    var i;
-    this.elements = t, this.options = {
-      ...I,
-      ...e,
-      controls: {
-        ...I.controls,
-        ...e.controls
-      }
-    }, this.options.imageSetupFunction && (this.imageSetupFunction = this.options.imageSetupFunction), this.options.closeFunction && (this.closeFunction = this.options.closeFunction), this.options.initFunction && (this.initFunction = this.options.initFunction), this.options.transitionFunction && (this.transitionFunction = this.options.transitionFunction), (i = this.options.extensions) == null || i.forEach((n) => {
-      this.state.extensions.add(n);
-    }), this.state.isReducedMotion = window.matchMedia("(prefers-reduced-motion: reduce)").matches, this.reset(), this.initFunction(this);
-  }
-  reset() {
-    if (typeof this.elements == "string") {
-      const t = this.qsOrigin(this.elements);
-      this.state.elmLength = t.length, t.forEach((e) => {
-        const i = e;
-        i.removeEventListener("click", this.defaultOnClickHandler), i.removeEventListener("pointerup", this.onClickElements), i.addEventListener("click", this.defaultOnClickHandler), i.addEventListener("pointerup", this.onClickElements);
-      });
-    } else
-      this.state.elmLength = this.elements.length;
-  }
-  // ============================================================================
-  // HELPER METHODS
-  // ============================================================================
-  qs(t) {
-    return this.root ? this.root.querySelector(t) : null;
-  }
-  qsOrigin(t) {
-    return document.querySelectorAll(t);
-  }
-  registerPointerListener(t) {
-    this.externalPointerListener.push(t);
-  }
-  getChildElements(t, e) {
-    const i = [], n = [], o = typeof this.elements == "string" ? this.qsOrigin(this.elements) : this.elements;
-    for (let a = -t; a <= t; a++) {
-      const h = (e + a + o.length) % o.length, l = o[h], p = {
-        elm: l instanceof HTMLElement ? G(l) : { config: l, origin: void 0, parsedSrcSet: void 0 },
-        pos: a,
-        index: h,
-        vistaView: this,
-        maxZoomLevel: this.options.maxZoomLevel,
-        transitionShouldWait: () => this.isRapidSwap,
-        onScale: ({
-          vistaImage: m,
-          isMin: c,
-          isMax: g
-        }) => {
-          var x, b, C, w;
-          m.index === this.state.currentIndex && (this.state.zoomedIn = !c, c ? (x = this.qs(".vvw-zoom-out")) == null || x.setAttribute("disabled", "true") : (b = this.qs(".vvw-zoom-out")) == null || b.removeAttribute("disabled"), g ? (C = this.qs(".vvw-zoom-in")) == null || C.setAttribute("disabled", "true") : (w = this.qs(".vvw-zoom-in")) == null || w.removeAttribute("disabled"));
-        }
-      };
-      let u = null;
-      this.state.extensions.forEach((m) => {
-        !u && m.onInitializeImage && (u = m.onInitializeImage(p));
-      });
-      const v = u ?? new Y(p), f = document.createElement("div");
-      f.className = "vvw-item", f.dataset.vvwPos = `${a}`, f.dataset.vvwIdx = `${h}`, v.thumb && f.appendChild(v.thumb), f.appendChild(v.element), i.push(v), n.push(f);
-    }
-    return {
-      htmls: n,
-      images: i
-    };
-  }
-  async swap(t, e) {
-    var f, m;
-    this.reactivateUi();
-    const i = this.options.preloads || 0, n = this.state.currentIndex, { htmls: o, images: a } = this.getChildElements(i, n), h = this.imageContainer, l = this.state.children, d = {
-      htmlElements: { from: l.htmls, to: o },
-      images: { from: l.images, to: a },
-      index: { from: t, to: this.state.currentIndex },
-      via: e || { next: !1, prev: !1 }
-    };
-    this.imageSetupFunction(d, this), this.state.zoomedIn = !1, (f = this.qs(".vvw-zoom-out")) == null || f.setAttribute("disabled", "true"), (m = this.qs(".vvw-zoom-in")) == null || m.removeAttribute("disabled");
-    const u = performance.now() - this.lastSwapTime < this.options.rapidLimit;
-    this.isRapidSwap = u;
-    const { images: v } = this.state.children;
-    if (this.state.children = { htmls: o, images: a }, this.displayCurrentInfo(), u)
-      v.forEach((c) => {
-        c.cancelPendingLoad(), c.destroy();
-      });
-    else {
-      const c = this.state.abortController.signal, g = this.transitionFunction(d, c, this);
-      g && (this.transitionCleanup = g.cleanup, await g.transitionEnded), this.lastSwapTime = performance.now(), v.forEach((w) => {
-        w.cancelPendingLoad();
-      });
-      const x = v.find((w) => w.index === n), b = x ? L.stop(x) : void 0, C = a.find((w) => w.index === n);
-      C && x && C.cloneStyleFrom(x, b), v.forEach((w) => {
-        w.destroy();
-      });
-    }
-    h.innerHTML = "", this.transitionCleanup && this.transitionCleanup(), o.forEach((c) => {
-      h.appendChild(c);
-    }), a.forEach((c) => {
-      c.init();
-    }), u ? (this.isRapidSwapRelease && clearTimeout(this.isRapidSwapRelease), this.isRapidSwapRelease = setTimeout(() => {
-      this.isRapidSwap = !1;
-    }, 333)) : this.isRapidSwap = !1, this.options.onImageView && this.options.onImageView(d, this), this.state.extensions.forEach((c) => {
-      c.onImageView && c.onImageView(d, this);
-    });
-  }
-  // ============================================================================
-  // UI UPDATES
-  // ============================================================================
-  displayCurrentInfo() {
-    const t = this.state.currentIndex;
-    typeof this.elements == "string" && this.qsOrigin(this.elements).forEach((a, h) => {
-      a.style.opacity = "", h === t && (a.style.opacity = "0");
-    });
-    const e = this.qs(".vvw-index"), i = `${t + 1}`, n = `${this.state.elmLength}`;
-    e && (e.textContent = `${i} / ${n}`);
-    const o = this.qs(".vvw-desc");
-    if (o) {
-      const a = this.state.children.images.find((l) => l.index === t), h = (a == null ? void 0 : a.config.alt) || "";
-      h ? (o.textContent = h, o.setAttribute("aria-label", `Image ${i} of ${n}: ${h}`), o.style.opacity = "") : (o.textContent = "", o.setAttribute("aria-label", `Image ${i} of ${n}`), o.style.opacity = "0");
-    }
-  }
-  deactivateUi(t, e) {
-    t.forEach((i) => {
-      var n, o;
-      i === "zoomIn" ? (n = this.qs(".vvw-zoom-in")) == null || n.setAttribute("disabled", "true") : i === "zoomOut" && ((o = this.qs(".vvw-zoom-out")) == null || o.setAttribute("disabled", "true")), this.tempDeactivatedUi.push(i);
-    }), this.tempDeactivationRequestBy = e || null, this.state.extensions.forEach((i) => {
-      i.onDeactivateUi && i.onDeactivateUi(t, this.tempDeactivationRequestBy, this);
-    });
-  }
-  reactivateUi() {
-    this.tempDeactivatedUi.forEach((t) => {
-      var e, i;
-      t === "zoomIn" ? (e = this.qs(".vvw-zoom-in")) == null || e.removeAttribute("disabled") : t === "zoomOut" && ((i = this.qs(".vvw-zoom-out")) == null || i.removeAttribute("disabled"));
-    }), this.state.extensions.forEach((t) => {
-      t.onReactivateUi && t.onReactivateUi(this.tempDeactivatedUi, this.tempDeactivationRequestBy, this);
-    }), this.tempDeactivatedUi = [], this.tempDeactivationRequestBy = null;
-  }
-  // ============================================================================
-  // LIFECYCLE METHODS - open, close, destroy
-  // ============================================================================
-  // OPEN
-  open(t = 0) {
-    var l, d, p, u, v, f, m;
-    if (y.somethingOpened) {
-      console.warn(
-        "Another VistaView instance is already opened. Close it first before opening a new one."
-      );
-      return;
-    }
-    y.somethingOpened = this, this.reset(), (t < 0 || t >= this.state.elmLength) && (t = (t % this.state.elmLength + this.state.elmLength) % this.state.elmLength), this.state.currentIndex = t, document.body.style.overflow = "hidden";
-    const e = $({
-      controls: this.options.controls,
-      extensions: this.state.extensions
-    });
-    if (document.body.append(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: a } = this.getChildElements(i, n), h = {
-      htmlElements: { from: null, to: a },
-      images: { from: null, to: o },
-      index: { from: null, to: this.state.currentIndex },
-      via: { next: !1, prev: !1 }
-    };
-    this.imageSetupFunction(h, this), this.state.children = { htmls: a, images: o }, a.forEach((c) => {
-      this.imageContainer.appendChild(c);
-    }), o.forEach((c) => {
-      c.init();
-    }), (l = this.qs(".vvw-close")) == null || l.addEventListener("click", () => this.close()), (d = this.qs(".vvw-zoom-in")) == null || d.addEventListener("click", () => this.zoomIn()), (p = this.qs(".vvw-zoom-out")) == null || p.addEventListener("click", () => this.zoomOut()), (u = this.qs(".vvw-prev>button")) == null || u.addEventListener("click", () => this.prev()), (v = this.qs(".vvw-next>button")) == null || v.addEventListener("click", () => this.next()), this.state.elmLength < 2 && ((f = this.qs(".vvw-prev")) == null || f.classList.add("vvw--hidden"), (m = this.qs(".vvw-next")) == null || m.classList.add("vvw--hidden")), this.openFunction(this), this.eventHandlers = new Q(this), this.externalPointerListener.forEach((c) => {
-      this.eventHandlers.registerPointerListener(c);
-    }), this.eventHandlers.start(this.imageContainer), requestAnimationFrame(() => {
-      requestAnimationFrame(() => {
-        var c;
-        (c = this.root) == null || c.addEventListener(
-          "transitionend",
-          () => {
-            var g;
-            (g = this.root) == null || g.classList.add("vvw--settled");
-          },
-          { once: !0 }
-        ), this.root.classList.add("vvw--active"), this.displayCurrentInfo(), this.options.onOpen && this.options.onOpen(this), this.options.onImageView && this.options.onImageView(h, this), this.state.extensions.forEach((g) => {
-          g.onOpen && g.onOpen(this), g.onImageView && g.onImageView(h, this);
-        });
-      });
-    });
-  }
-  /// CLOSE
-  async close(t = !0) {
-    y.somethingOpened === this && this.root && (this.eventHandlers.stop(), this.eventHandlers = null, this.state.children.images.forEach((e) => {
-      e.prepareClose();
-    }), t ? await new Promise((e) => {
-      let n = 0;
-      this.root.addEventListener("transitionend", (o) => {
-        o.target === this.root && (n++, n === 2 && typeof this.elements == "string" && (this.state.children.images.forEach((a) => {
-          a.destroy();
-        }), this.qsOrigin(this.elements).forEach((a) => {
-          a.style.opacity = "";
-        })), n === 3 && e(null));
-      }), this.root.classList.add("vvw--closing");
-    }) : typeof this.elements == "string" && (this.state.children.images.forEach((e) => {
-      e.destroy();
-    }), this.qsOrigin(this.elements).forEach((e) => {
-      e.style.opacity = "";
-    })), this.root.remove(), this.root = null, this.imageContainer = null, this.state.children = { htmls: [], images: [] }, this.state.currentIndex = -1, this.state.children.images.forEach((e) => {
-      e.destroy();
-    }), document.body.style.overflow = "", y.somethingOpened = null, this.closeFunction(this), this.options.onClose && this.options.onClose(this), this.state.extensions.forEach((e) => {
-      e.onClose && e.onClose(this);
-    }));
-  }
-  // DESTROY
-  destroy() {
-    this.close(!1), this.externalPointerListener = [], typeof this.elements == "string" && this.qsOrigin(this.elements).forEach((t) => {
-      t.removeAttribute("data-vista-idx"), t.removeEventListener("click", this.defaultOnClickHandler), t.removeEventListener("pointerup", this.onClickElements);
-    });
-  }
-  // ============================================================================
-  // NAVIGATION METHODS - next, prev, view
-  // ============================================================================
-  next() {
-    if (y.somethingOpened !== this) {
-      console.warn("This VistaView instance is not opened.");
-      return;
-    }
-    const t = (this.state.currentIndex + 1) % this.state.elmLength;
-    this.view(t, { next: !0, prev: !1 });
-  }
-  prev() {
-    if (y.somethingOpened !== this) {
-      console.warn("This VistaView instance is not opened.");
-      return;
-    }
-    const t = (this.state.currentIndex - 1 + this.state.elmLength) % this.state.elmLength;
-    this.view(t, { next: !1, prev: !0 });
-  }
-  view(t, e) {
-    if (y.somethingOpened !== this) {
-      console.warn("This VistaView instance is not opened.");
-      return;
-    }
-    if (this.state.elmLength < 2)
-      return;
-    (t < 0 || t >= this.state.elmLength) && (t = (t % this.state.elmLength + this.state.elmLength) % this.state.elmLength);
-    const i = this.state.currentIndex;
-    this.state.currentIndex = t;
-    const n = this.state.abortController;
-    n == null || n.abort(), this.state.abortController = new AbortController(), this.swap(i, e);
-  }
-  zoomIn() {
-    if (y.somethingOpened !== this) {
-      console.warn("This VistaView instance is not opened.");
-      return;
-    }
-    this.tempDeactivatedUi.includes("zoomIn") || this.throttle.fio(
-      () => {
-        const t = this.state.children.images.find((e) => e.pos === 0);
-        t == null || t.animateZoom(1.68);
-      },
-      "zoom",
-      222
-    );
-  }
-  zoomOut() {
-    if (y.somethingOpened !== this) {
-      console.warn("This VistaView instance is not opened.");
-      return;
-    }
-    this.tempDeactivatedUi.includes("zoomOut") || this.throttle.fio(
-      () => {
-        const t = this.state.children.images.find((e) => e.pos === 0);
-        t == null || t.animateZoom(0.68);
-      },
-      "zoom",
-      222
-    );
-  }
-  getCurrentIndex() {
-    return this.state.currentIndex;
-  }
-}
-function et(s) {
-  let t = null;
-  if (typeof s == "string") {
-    if (t = document.querySelectorAll(s), t.length === 0)
-      return new Error("No elements found in node list.").toString();
-    for (let e = 0; e < t.length; e++) {
-      const i = t[e], n = i.tagName.toLowerCase();
-      if (n !== "img" && n !== "a")
-        return new Error(`Invalid element at index ${e}: expected <img>, <a>, got <${n}>`);
-      if (n === "a" && !(i.querySelector("img") !== null))
-        return new Error(`Invalid <a> element at index ${e}: must contain <img>`);
-    }
-  } else {
-    const e = s;
-    for (let i = 0; i < e.length; i++)
-      if (!e[i].src)
-        return new Error(`Invalid image data at index ${i}: must have 'src'`);
-  }
-  return s;
-}
-function st({ elements: s, ...t }) {
-  if (!s)
-    return console.error(s), console.error("no elements provided"), console.warn("VistaView: silently returning."), null;
-  let e = et(s);
-  if (e instanceof Error)
-    return console.error(e), console.warn("VistaView: silently returning."), null;
-  const i = new tt(e, t);
-  return {
-    open: (n = 0) => i.open(n),
-    reset: () => i.reset(),
-    close: () => i.close(),
-    next: () => i.next(),
-    prev: () => i.prev(),
-    zoomIn: () => i.zoomIn(),
-    zoomOut: () => i.zoomOut(),
-    destroy: () => i.destroy(),
-    getCurrentIndex: () => i.getCurrentIndex(),
-    view: (n) => {
-      i.view(n);
-    }
-  };
-}
-export {
-  I as DefaultOptions,
-  T as VistaBox,
-  L as VistaHiresTransition,
-  Y as VistaImage,
-  Q as VistaImageEvent,
-  J as VistaPointers,
-  j as VistaState,
-  tt as VistaView,
-  U as close,
-  k as imageSetup,
-  V as init,
-  B as open,
-  X as transition,
-  st as vistaView
-};