@wyxos/vibe 1.6.21 → 1.6.23

package/lib/index.js

@@ -1,23 +1,23 @@
-import { nextTick as G, defineComponent as rt, ref as k, computed as ne, onMounted as ot, onUnmounted as it, watch as ce, createElementBlock as R, openBlock as j, createCommentVNode as se, createElementVNode as V, normalizeStyle as Ee, renderSlot as ae, normalizeClass as he, withModifiers as Je, toDisplayString as Ae, Fragment as Ke, renderList as Qe, createVNode as Fe, withCtx as xe, mergeProps as be, TransitionGroup as $t, unref as Ht } from "vue";
-let Be = null;
-function Nt() {
-  if (Be != null) return Be;
-  const t = document.createElement("div");
-  t.style.visibility = "hidden", t.style.overflow = "scroll", t.style.msOverflowStyle = "scrollbar", t.style.width = "100px", t.style.height = "100px", document.body.appendChild(t);
-  const c = document.createElement("div");
-  c.style.width = "100%", t.appendChild(c);
-  const u = t.offsetWidth - c.offsetWidth;
-  return document.body.removeChild(t), Be = u, u;
+import { nextTick as q, ref as z, computed as Q, defineComponent as Je, onMounted as Ke, onUnmounted as Qe, watch as te, createElementBlock as R, openBlock as O, createCommentVNode as ee, createElementVNode as V, normalizeStyle as ge, renderSlot as _, normalizeClass as re, withModifiers as Ce, toDisplayString as He, unref as U, Fragment as je, renderList as Ve, createVNode as ke, withCtx as fe, mergeProps as de, TransitionGroup as wt } from "vue";
+let Le = null;
+function xt() {
+  if (Le != null) return Le;
+  const e = document.createElement("div");
+  e.style.visibility = "hidden", e.style.overflow = "scroll", e.style.msOverflowStyle = "scrollbar", e.style.width = "100px", e.style.height = "100px", document.body.appendChild(e);
+  const l = document.createElement("div");
+  l.style.width = "100%", e.appendChild(l);
+  const r = e.offsetWidth - l.offsetWidth;
+  return document.body.removeChild(e), Le = r, r;
 }
-function Ze(t, c, u, o = {}) {
+function qe(e, l, r, n = {}) {
   const {
-    gutterX: T = 0,
-    gutterY: w = 0,
-    header: y = 0,
-    footer: v = 0,
-    paddingLeft: I = 0,
-    paddingRight: L = 0,
-    sizes: i = {
+    gutterX: y = 0,
+    gutterY: h = 0,
+    header: m = 0,
+    footer: i = 0,
+    paddingLeft: w = 0,
+    paddingRight: b = 0,
+    sizes: a = {
       base: 1,
       sm: 2,
       md: 3,
@@ -25,336 +25,873 @@ function Ze(t, c, u, o = {}) {
       xl: 5,
       "2xl": 6
     },
-    placement: M = "masonry"
-  } = o;
-  let f = 0, N = 0;
+    placement: p = "masonry"
+  } = n;
+  let x = 0, M = 0;
   try {
-    if (c && c.nodeType === 1 && typeof window < "u" && window.getComputedStyle) {
-      const x = window.getComputedStyle(c);
-      f = parseFloat(x.paddingLeft) || 0, N = parseFloat(x.paddingRight) || 0;
+    if (l && l.nodeType === 1 && typeof window < "u" && window.getComputedStyle) {
+      const L = window.getComputedStyle(l);
+      x = parseFloat(L.paddingLeft) || 0, M = parseFloat(L.paddingRight) || 0;
     }
   } catch {
   }
-  const O = (I || 0) + f, B = (L || 0) + N, m = c.offsetWidth - c.clientWidth, l = m > 0 ? m + 2 : Nt() + 2, $ = c.offsetWidth - l - O - B, g = T * (u - 1), b = Math.floor(($ - g) / u), H = t.map((x) => {
-    const E = x.width, Y = x.height;
-    return Math.round(b * Y / E) + v + y;
+  const s = (w || 0) + x, g = (b || 0) + M, t = l.offsetWidth - l.clientWidth, d = t > 0 ? t + 2 : xt() + 2, v = l.offsetWidth - d - s - g, T = y * (r - 1), S = Math.floor((v - T) / r), E = e.map((L) => {
+    const k = L.width, W = L.height;
+    return Math.round(S * W / k) + i + m;
   });
-  if (M === "sequential-balanced") {
-    const x = H.length;
-    if (x === 0) return [];
-    const E = (P, C, Z) => P + (C > 0 ? w : 0) + Z;
-    let Y = Math.max(...H), n = H.reduce((P, C) => P + C, 0) + w * Math.max(0, x - 1);
-    const h = (P) => {
-      let C = 1, Z = 0, K = 0;
-      for (let Q = 0; Q < x; Q++) {
-        const le = H[Q], re = E(Z, K, le);
-        if (re <= P)
-          Z = re, K++;
-        else if (C++, Z = le, K = 1, le > P || C > u) return !1;
+  if (p === "sequential-balanced") {
+    const L = E.length;
+    if (L === 0) return [];
+    const k = (B, Y, G) => B + (Y > 0 ? h : 0) + G;
+    let W = Math.max(...E), o = E.reduce((B, Y) => B + Y, 0) + h * Math.max(0, L - 1);
+    const u = (B) => {
+      let Y = 1, G = 0, ne = 0;
+      for (let J = 0; J < L; J++) {
+        const ie = E[J], Z = k(G, ne, ie);
+        if (Z <= B)
+          G = Z, ne++;
+        else if (Y++, G = ie, ne = 1, ie > B || Y > r) return !1;
       }
-      return C <= u;
+      return Y <= r;
     };
-    for (; Y < n; ) {
-      const P = Math.floor((Y + n) / 2);
-      h(P) ? n = P : Y = P + 1;
+    for (; W < o; ) {
+      const B = Math.floor((W + o) / 2);
+      u(B) ? o = B : W = B + 1;
     }
-    const F = n, q = new Array(u).fill(0);
-    let J = u - 1, U = 0, A = 0;
-    for (let P = x - 1; P >= 0; P--) {
-      const C = H[P], Z = P < J;
-      !(E(U, A, C) <= F) || Z ? (q[J] = P + 1, J--, U = C, A = 1) : (U = E(U, A, C), A++);
+    const I = o, $ = new Array(r).fill(0);
+    let C = r - 1, F = 0, D = 0;
+    for (let B = L - 1; B >= 0; B--) {
+      const Y = E[B], G = B < C;
+      !(k(F, D, Y) <= I) || G ? ($[C] = B + 1, C--, F = Y, D = 1) : (F = k(F, D, Y), D++);
     }
-    q[0] = 0;
-    const ve = [], fe = new Array(u).fill(0);
-    for (let P = 0; P < u; P++) {
-      const C = q[P], Z = P + 1 < u ? q[P + 1] : x, K = P * (b + T);
-      for (let Q = C; Q < Z; Q++) {
-        const re = {
-          ...t[Q],
-          columnWidth: b,
+    $[0] = 0;
+    const j = [], X = new Array(r).fill(0);
+    for (let B = 0; B < r; B++) {
+      const Y = $[B], G = B + 1 < r ? $[B + 1] : L, ne = B * (S + y);
+      for (let J = Y; J < G; J++) {
+        const Z = {
+          ...e[J],
+          columnWidth: S,
           imageHeight: 0,
           columnHeight: 0,
           left: 0,
           top: 0
         };
-        re.imageHeight = H[Q] - (v + y), re.columnHeight = H[Q], re.left = K, re.top = fe[P], fe[P] += re.columnHeight + (Q + 1 < Z ? w : 0), ve.push(re);
+        Z.imageHeight = E[J] - (i + m), Z.columnHeight = E[J], Z.left = ne, Z.top = X[B], X[B] += Z.columnHeight + (J + 1 < G ? h : 0), j.push(Z);
       }
     }
-    return ve;
+    return j;
   }
-  const p = new Array(u).fill(0), W = [];
-  for (let x = 0; x < t.length; x++) {
-    const E = t[x], Y = {
-      ...E,
+  const f = new Array(r).fill(0), P = [];
+  for (let L = 0; L < e.length; L++) {
+    const k = e[L], W = {
+      ...k,
       columnWidth: 0,
       imageHeight: 0,
       columnHeight: 0,
       left: 0,
       top: 0
-    }, n = p.indexOf(Math.min(...p)), h = E.width, F = E.height;
-    Y.columnWidth = b, Y.left = n * (b + T), Y.imageHeight = Math.round(b * F / h), Y.columnHeight = Y.imageHeight + v + y, Y.top = p[n], p[n] += Y.columnHeight + w, W.push(Y);
+    }, o = f.indexOf(Math.min(...f)), u = k.width, I = k.height;
+    W.columnWidth = S, W.left = o * (S + y), W.imageHeight = Math.round(S * I / u), W.columnHeight = W.imageHeight + i + m, W.top = f[o], f[o] += W.columnHeight + h, P.push(W);
   }
-  return W;
+  return P;
 }
-var Ft = typeof global == "object" && global && global.Object === Object && global, Bt = typeof self == "object" && self && self.Object === Object && self, st = Ft || Bt || Function("return this")(), Ie = st.Symbol, ut = Object.prototype, Wt = ut.hasOwnProperty, At = ut.toString, Me = Ie ? Ie.toStringTag : void 0;
-function Dt(t) {
-  var c = Wt.call(t, Me), u = t[Me];
+var bt = typeof global == "object" && global && global.Object === Object && global, Mt = typeof self == "object" && self && self.Object === Object && self, Ze = bt || Mt || Function("return this")(), we = Ze.Symbol, et = Object.prototype, Tt = et.hasOwnProperty, Et = et.toString, me = we ? we.toStringTag : void 0;
+function It(e) {
+  var l = Tt.call(e, me), r = e[me];
   try {
-    t[Me] = void 0;
-    var o = !0;
+    e[me] = void 0;
+    var n = !0;
   } catch {
   }
-  var T = At.call(t);
-  return o && (c ? t[Me] = u : delete t[Me]), T;
+  var y = Et.call(e);
+  return n && (l ? e[me] = r : delete e[me]), y;
 }
-var Ot = Object.prototype, zt = Ot.toString;
-function Rt(t) {
-  return zt.call(t);
+var kt = Object.prototype, Lt = kt.toString;
+function St(e) {
+  return Lt.call(e);
 }
-var jt = "[object Null]", Ct = "[object Undefined]", et = Ie ? Ie.toStringTag : void 0;
-function qt(t) {
-  return t == null ? t === void 0 ? Ct : jt : et && et in Object(t) ? Dt(t) : Rt(t);
+var Ht = "[object Null]", Pt = "[object Undefined]", Ye = we ? we.toStringTag : void 0;
+function $t(e) {
+  return e == null ? e === void 0 ? Pt : Ht : Ye && Ye in Object(e) ? It(e) : St(e);
 }
-function Vt(t) {
-  return t != null && typeof t == "object";
+function Dt(e) {
+  return e != null && typeof e == "object";
 }
-var Yt = "[object Symbol]";
-function Ut(t) {
-  return typeof t == "symbol" || Vt(t) && qt(t) == Yt;
+var zt = "[object Symbol]";
+function Bt(e) {
+  return typeof e == "symbol" || Dt(e) && $t(e) == zt;
 }
-var _t = /\s/;
-function Xt(t) {
-  for (var c = t.length; c-- && _t.test(t.charAt(c)); )
+var Nt = /\s/;
+function Ft(e) {
+  for (var l = e.length; l-- && Nt.test(e.charAt(l)); )
     ;
-  return c;
+  return l;
 }
-var Gt = /^\s+/;
-function Jt(t) {
-  return t && t.slice(0, Xt(t) + 1).replace(Gt, "");
+var At = /^\s+/;
+function Wt(e) {
+  return e && e.slice(0, Ft(e) + 1).replace(At, "");
 }
-function De(t) {
-  var c = typeof t;
-  return t != null && (c == "object" || c == "function");
+function Pe(e) {
+  var l = typeof e;
+  return e != null && (l == "object" || l == "function");
 }
-var tt = NaN, Kt = /^[-+]0x[0-9a-f]+$/i, Qt = /^0b[01]+$/i, Zt = /^0o[0-7]+$/i, ea = parseInt;
-function at(t) {
-  if (typeof t == "number")
-    return t;
-  if (Ut(t))
-    return tt;
-  if (De(t)) {
-    var c = typeof t.valueOf == "function" ? t.valueOf() : t;
-    t = De(c) ? c + "" : c;
+var Ue = NaN, Rt = /^[-+]0x[0-9a-f]+$/i, Ot = /^0b[01]+$/i, Ct = /^0o[0-7]+$/i, jt = parseInt;
+function _e(e) {
+  if (typeof e == "number")
+    return e;
+  if (Bt(e))
+    return Ue;
+  if (Pe(e)) {
+    var l = typeof e.valueOf == "function" ? e.valueOf() : e;
+    e = Pe(l) ? l + "" : l;
   }
-  if (typeof t != "string")
-    return t === 0 ? t : +t;
-  t = Jt(t);
-  var u = Qt.test(t);
-  return u || Zt.test(t) ? ea(t.slice(2), u ? 2 : 8) : Kt.test(t) ? tt : +t;
+  if (typeof e != "string")
+    return e === 0 ? e : +e;
+  e = Wt(e);
+  var r = Ot.test(e);
+  return r || Ct.test(e) ? jt(e.slice(2), r ? 2 : 8) : Rt.test(e) ? Ue : +e;
 }
-var We = function() {
-  return st.Date.now();
-}, ta = "Expected a function", aa = Math.max, na = Math.min;
-function nt(t, c, u) {
-  var o, T, w, y, v, I, L = 0, i = !1, M = !1, f = !0;
-  if (typeof t != "function")
-    throw new TypeError(ta);
-  c = at(c) || 0, De(u) && (i = !!u.leading, M = "maxWait" in u, w = M ? aa(at(u.maxWait) || 0, c) : w, f = "trailing" in u ? !!u.trailing : f);
-  function N(p) {
-    var W = o, x = T;
-    return o = T = void 0, L = p, y = t.apply(x, W), y;
+var Se = function() {
+  return Ze.Date.now();
+}, Vt = "Expected a function", qt = Math.max, Yt = Math.min;
+function Xe(e, l, r) {
+  var n, y, h, m, i, w, b = 0, a = !1, p = !1, x = !0;
+  if (typeof e != "function")
+    throw new TypeError(Vt);
+  l = _e(l) || 0, Pe(r) && (a = !!r.leading, p = "maxWait" in r, h = p ? qt(_e(r.maxWait) || 0, l) : h, x = "trailing" in r ? !!r.trailing : x);
+  function M(f) {
+    var P = n, L = y;
+    return n = y = void 0, b = f, m = e.apply(L, P), m;
   }
-  function O(p) {
-    return L = p, v = setTimeout(l, c), i ? N(p) : y;
+  function s(f) {
+    return b = f, i = setTimeout(d, l), a ? M(f) : m;
   }
-  function B(p) {
-    var W = p - I, x = p - L, E = c - W;
-    return M ? na(E, w - x) : E;
+  function g(f) {
+    var P = f - w, L = f - b, k = l - P;
+    return p ? Yt(k, h - L) : k;
   }
-  function m(p) {
-    var W = p - I, x = p - L;
-    return I === void 0 || W >= c || W < 0 || M && x >= w;
+  function t(f) {
+    var P = f - w, L = f - b;
+    return w === void 0 || P >= l || P < 0 || p && L >= h;
   }
-  function l() {
-    var p = We();
-    if (m(p))
-      return $(p);
-    v = setTimeout(l, B(p));
+  function d() {
+    var f = Se();
+    if (t(f))
+      return v(f);
+    i = setTimeout(d, g(f));
   }
-  function $(p) {
-    return v = void 0, f && o ? N(p) : (o = T = void 0, y);
+  function v(f) {
+    return i = void 0, x && n ? M(f) : (n = y = void 0, m);
   }
-  function g() {
-    v !== void 0 && clearTimeout(v), L = 0, o = I = T = v = void 0;
+  function T() {
+    i !== void 0 && clearTimeout(i), b = 0, n = w = y = i = void 0;
   }
-  function b() {
-    return v === void 0 ? y : $(We());
+  function S() {
+    return i === void 0 ? m : v(Se());
   }
-  function H() {
-    var p = We(), W = m(p);
-    if (o = arguments, T = this, I = p, W) {
-      if (v === void 0)
-        return O(I);
-      if (M)
-        return clearTimeout(v), v = setTimeout(l, c), N(I);
+  function E() {
+    var f = Se(), P = t(f);
+    if (n = arguments, y = this, w = f, P) {
+      if (i === void 0)
+        return s(w);
+      if (p)
+        return clearTimeout(i), i = setTimeout(d, l), M(w);
     }
-    return v === void 0 && (v = setTimeout(l, c)), y;
+    return i === void 0 && (i = setTimeout(d, l)), m;
   }
-  return H.cancel = g, H.flush = b, H;
+  return E.cancel = T, E.flush = S, E;
 }
-function pe(t, c) {
-  const u = c ?? (typeof window < "u" ? window.innerWidth : 1024), o = t.sizes;
-  return u >= 1536 && o["2xl"] ? o["2xl"] : u >= 1280 && o.xl ? o.xl : u >= 1024 && o.lg ? o.lg : u >= 768 && o.md ? o.md : u >= 640 && o.sm ? o.sm : o.base;
+function ue(e, l) {
+  const r = l ?? (typeof window < "u" ? window.innerWidth : 1024), n = e.sizes;
+  return r >= 1536 && n["2xl"] ? n["2xl"] : r >= 1280 && n.xl ? n.xl : r >= 1024 && n.lg ? n.lg : r >= 768 && n.md ? n.md : r >= 640 && n.sm ? n.sm : n.base;
 }
-function la(t) {
-  const c = t ?? (typeof window < "u" ? window.innerWidth : 1024);
-  return c >= 1536 ? "2xl" : c >= 1280 ? "xl" : c >= 1024 ? "lg" : c >= 768 ? "md" : c >= 640 ? "sm" : "base";
+function Ut(e) {
+  const l = e ?? (typeof window < "u" ? window.innerWidth : 1024);
+  return l >= 1536 ? "2xl" : l >= 1280 ? "xl" : l >= 1024 ? "lg" : l >= 768 ? "md" : l >= 640 ? "sm" : "base";
 }
-function ra(t) {
-  return t.reduce((u, o) => Math.max(u, o.top + o.columnHeight), 0) + 500;
+function _t(e) {
+  return e.reduce((r, n) => Math.max(r, n.top + n.columnHeight), 0) + 500;
 }
-function oa(t) {
+function Xt(e) {
   return {
-    transform: `translate3d(${t.left}px, ${t.top}px, 0)`,
+    transform: `translate3d(${e.left}px, ${e.top}px, 0)`,
     top: "0px",
     left: "0px",
-    width: `${t.columnWidth}px`,
-    height: `${t.columnHeight}px`
+    width: `${e.columnWidth}px`,
+    height: `${e.columnHeight}px`
   };
 }
-function ia(t, c = 0) {
+function Gt(e, l = 0) {
   return {
-    style: oa(t),
-    "data-top": t.top,
-    "data-left": t.left,
-    "data-id": `${t.page}-${t.id}`,
-    "data-index": c
+    style: Xt(e),
+    "data-top": e.top,
+    "data-left": e.left,
+    "data-id": `${e.page}-${e.id}`,
+    "data-index": l
   };
 }
-function Oe(t, c) {
-  if (!t.length || c <= 0)
-    return new Array(Math.max(1, c)).fill(0);
-  const o = Array.from(new Set(t.map((y) => y.left))).sort((y, v) => y - v).slice(0, c), T = /* @__PURE__ */ new Map();
-  for (let y = 0; y < o.length; y++) T.set(o[y], y);
-  const w = new Array(o.length).fill(0);
-  for (const y of t) {
-    const v = T.get(y.left);
-    v != null && (w[v] = Math.max(w[v], y.top + y.columnHeight));
+function $e(e, l) {
+  if (!e.length || l <= 0)
+    return new Array(Math.max(1, l)).fill(0);
+  const n = Array.from(new Set(e.map((m) => m.left))).sort((m, i) => m - i).slice(0, l), y = /* @__PURE__ */ new Map();
+  for (let m = 0; m < n.length; m++) y.set(n[m], m);
+  const h = new Array(n.length).fill(0);
+  for (const m of e) {
+    const i = y.get(m.left);
+    i != null && (h[i] = Math.max(h[i], m.top + m.columnHeight));
   }
-  for (; w.length < c; ) w.push(0);
-  return w;
+  for (; h.length < l; ) h.push(0);
+  return h;
 }
-function sa(t, c) {
-  let u = 0, o = 0;
-  const T = 1e3;
-  function w(i, M) {
-    var O;
-    const f = (O = t.container) == null ? void 0 : O.value;
-    if (f) {
-      const B = f.scrollTop, m = f.clientHeight;
-      u = B - T, o = B + m + T;
+function Jt(e, l) {
+  let r = 0, n = 0;
+  const y = 1e3;
+  function h(a, p) {
+    var s;
+    const x = (s = e.container) == null ? void 0 : s.value;
+    if (x) {
+      const g = x.scrollTop, t = x.clientHeight;
+      r = g - y, n = g + t + y;
     }
-    return i + M >= u && i <= o;
+    return a + p >= r && a <= n;
   }
-  function y(i, M) {
-    const f = parseInt(i.dataset.left || "0", 10), N = parseInt(i.dataset.top || "0", 10), O = parseInt(i.dataset.index || "0", 10), B = i.offsetHeight || parseInt(getComputedStyle(i).height || "200", 10) || 200;
-    if (!w(N, B)) {
-      i.style.opacity = "1", i.style.transform = `translate3d(${f}px, ${N}px, 0) scale(1)`, i.style.transition = "none", M();
+  function m(a, p) {
+    var v;
+    const x = parseInt(a.dataset.left || "0", 10), M = parseInt(a.dataset.top || "0", 10), s = parseInt(a.dataset.index || "0", 10), g = a.offsetHeight || parseInt(getComputedStyle(a).height || "200", 10) || 200;
+    if ((v = l == null ? void 0 : l.virtualizing) != null && v.value) {
+      a.style.transition = "none", a.style.opacity = "1", a.style.transform = `translate3d(${x}px, ${M}px, 0) scale(1)`, a.style.removeProperty("--masonry-opacity-delay"), requestAnimationFrame(() => {
+        a.style.transition = "", p();
+      });
+      return;
+    }
+    if (!h(M, g)) {
+      a.style.opacity = "1", a.style.transform = `translate3d(${x}px, ${M}px, 0) scale(1)`, a.style.transition = "none", p();
       return;
     }
-    const m = Math.min(O * 20, 160), l = i.style.getPropertyValue("--masonry-opacity-delay");
-    i.style.setProperty("--masonry-opacity-delay", `${m}ms`), requestAnimationFrame(() => {
-      i.style.opacity = "1", i.style.transform = `translate3d(${f}px, ${N}px, 0) scale(1)`;
-      const $ = () => {
-        l ? i.style.setProperty("--masonry-opacity-delay", l) : i.style.removeProperty("--masonry-opacity-delay"), i.removeEventListener("transitionend", $), M();
+    const t = Math.min(s * 20, 160), d = a.style.getPropertyValue("--masonry-opacity-delay");
+    a.style.setProperty("--masonry-opacity-delay", `${t}ms`), requestAnimationFrame(() => {
+      a.style.opacity = "1", a.style.transform = `translate3d(${x}px, ${M}px, 0) scale(1)`;
+      const T = () => {
+        d ? a.style.setProperty("--masonry-opacity-delay", d) : a.style.removeProperty("--masonry-opacity-delay"), a.removeEventListener("transitionend", T), p();
       };
-      i.addEventListener("transitionend", $);
+      a.addEventListener("transitionend", T);
     });
   }
-  function v(i) {
-    const M = parseInt(i.dataset.left || "0", 10), f = parseInt(i.dataset.top || "0", 10);
-    i.style.opacity = "0", i.style.transform = `translate3d(${M}px, ${f + 10}px, 0) scale(0.985)`;
-  }
-  function I(i) {
-    const M = parseInt(i.dataset.left || "0", 10), f = parseInt(i.dataset.top || "0", 10), N = i.offsetHeight || parseInt(getComputedStyle(i).height || "200", 10) || 200;
-    if (!w(f, N)) {
-      i.style.transition = "none";
+  function i(a) {
+    var M;
+    const p = parseInt(a.dataset.left || "0", 10), x = parseInt(a.dataset.top || "0", 10);
+    if ((M = l == null ? void 0 : l.virtualizing) != null && M.value) {
+      a.style.transition = "none", a.style.opacity = "1", a.style.transform = `translate3d(${p}px, ${x}px, 0) scale(1)`, a.style.removeProperty("--masonry-opacity-delay");
       return;
     }
-    i.style.transition = "none", i.style.opacity = "1", i.style.transform = `translate3d(${M}px, ${f}px, 0) scale(1)`, i.style.removeProperty("--masonry-opacity-delay"), requestAnimationFrame(() => {
-      i.style.transition = "";
-    });
+    a.style.opacity = "0", a.style.transform = `translate3d(${p}px, ${x + 10}px, 0) scale(0.985)`;
   }
-  function L(i, M) {
-    const f = parseInt(i.dataset.left || "0", 10), N = parseInt(i.dataset.top || "0", 10), O = i.offsetHeight || parseInt(getComputedStyle(i).height || "200", 10) || 200;
-    if (!w(N, O)) {
-      i.style.transition = "none", i.style.opacity = "0", M();
+  function w(a) {
+    var s;
+    const p = parseInt(a.dataset.left || "0", 10), x = parseInt(a.dataset.top || "0", 10), M = a.offsetHeight || parseInt(getComputedStyle(a).height || "200", 10) || 200;
+    if (!((s = l == null ? void 0 : l.virtualizing) != null && s.value)) {
+      if (!h(x, M)) {
+        a.style.transition = "none";
+        return;
+      }
+      a.style.transition = "none", a.style.opacity = "1", a.style.transform = `translate3d(${p}px, ${x}px, 0) scale(1)`, a.style.removeProperty("--masonry-opacity-delay"), requestAnimationFrame(() => {
+        a.style.transition = "";
+      });
+    }
+  }
+  function b(a, p) {
+    var E;
+    const x = parseInt(a.dataset.left || "0", 10), M = parseInt(a.dataset.top || "0", 10), s = a.offsetHeight || parseInt(getComputedStyle(a).height || "200", 10) || 200;
+    if ((E = l == null ? void 0 : l.virtualizing) != null && E.value) {
+      p();
       return;
     }
-    const B = typeof (c == null ? void 0 : c.leaveDurationMs) == "number" ? c.leaveDurationMs : NaN;
-    let m = Number.isFinite(B) && B > 0 ? B : NaN;
-    if (!Number.isFinite(m)) {
-      const p = getComputedStyle(i).getPropertyValue("--masonry-leave-duration") || "", W = parseFloat(p);
-      m = Number.isFinite(W) && W > 0 ? W : 200;
+    if (!h(M, s)) {
+      a.style.transition = "none", a.style.opacity = "0", p();
+      return;
+    }
+    const g = typeof (l == null ? void 0 : l.leaveDurationMs) == "number" ? l.leaveDurationMs : NaN;
+    let t = Number.isFinite(g) && g > 0 ? g : NaN;
+    if (!Number.isFinite(t)) {
+      const P = getComputedStyle(a).getPropertyValue("--masonry-leave-duration") || "", L = parseFloat(P);
+      t = Number.isFinite(L) && L > 0 ? L : 200;
     }
-    const l = i.style.transitionDuration, $ = () => {
-      i.removeEventListener("transitionend", g), clearTimeout(b), i.style.transitionDuration = l || "";
-    }, g = (H) => {
-      (!H || H.target === i) && ($(), M());
-    }, b = setTimeout(() => {
-      $(), M();
-    }, m + 100);
+    const d = a.style.transitionDuration, v = () => {
+      a.removeEventListener("transitionend", T), clearTimeout(S), a.style.transitionDuration = d || "";
+    }, T = (f) => {
+      (!f || f.target === a) && (v(), p());
+    }, S = setTimeout(() => {
+      v(), p();
+    }, t + 100);
     requestAnimationFrame(() => {
-      i.style.transitionDuration = `${m}ms`, i.style.opacity = "0", i.style.transform = `translate3d(${f}px, ${N + 10}px, 0) scale(0.985)`, i.addEventListener("transitionend", g);
+      a.style.transitionDuration = `${t}ms`, a.style.opacity = "0", a.style.transform = `translate3d(${x}px, ${M + 10}px, 0) scale(0.985)`, a.addEventListener("transitionend", T);
     });
   }
   return {
-    onEnter: y,
-    onBeforeEnter: v,
-    onBeforeLeave: I,
-    onLeave: L
+    onEnter: m,
+    onBeforeEnter: i,
+    onBeforeLeave: w,
+    onLeave: b
   };
 }
-function ua({
-  container: t,
-  masonry: c,
-  columns: u,
-  containerHeight: o,
-  isLoading: T,
-  pageSize: w,
-  refreshLayout: y,
-  setItemsRaw: v,
-  loadNext: I,
-  loadThresholdPx: L
+function Kt({
+  container: e,
+  masonry: l,
+  columns: r,
+  containerHeight: n,
+  isLoading: y,
+  pageSize: h,
+  refreshLayout: m,
+  setItemsRaw: i,
+  loadNext: w,
+  loadThresholdPx: b
 }) {
-  let i = 0;
-  async function M(f) {
-    if (!t.value) return;
-    const N = f ?? Oe(c.value, u.value), O = N.length ? Math.max(...N) : 0, B = t.value.scrollTop + t.value.clientHeight, m = t.value.scrollTop > i + 1;
-    i = t.value.scrollTop;
-    const l = typeof L == "number" ? L : 200, $ = l >= 0 ? Math.max(0, O - l) : Math.max(0, O + l);
-    if (B >= $ && m && !T.value) {
-      await I(), await G();
+  let a = 0;
+  async function p(x) {
+    if (!e.value) return;
+    const M = x ?? $e(l.value, r.value), s = M.length ? Math.max(...M) : 0, g = e.value.scrollTop + e.value.clientHeight, t = e.value.scrollTop > a + 1;
+    a = e.value.scrollTop;
+    const d = typeof b == "number" ? b : 200, v = d >= 0 ? Math.max(0, s - d) : Math.max(0, s + d);
+    if (g >= v && t && !y.value) {
+      await w(), await q();
+      return;
+    }
+  }
+  return {
+    handleScroll: p
+  };
+}
+function Qt(e) {
+  const { useSwipeMode: l, masonry: r, isLoading: n, loadNext: y, loadPage: h, paginationHistory: m } = e, i = z(0), w = z(0), b = z(!1), a = z(0), p = z(0), x = z(null), M = Q(() => {
+    if (!l.value || r.value.length === 0) return null;
+    const o = Math.max(0, Math.min(i.value, r.value.length - 1));
+    return r.value[o] || null;
+  }), s = Q(() => {
+    if (!l.value || !M.value) return null;
+    const o = i.value + 1;
+    return o >= r.value.length ? null : r.value[o] || null;
+  }), g = Q(() => {
+    if (!l.value || !M.value) return null;
+    const o = i.value - 1;
+    return o < 0 ? null : r.value[o] || null;
+  });
+  function t() {
+    if (!x.value) return;
+    const o = x.value.clientHeight;
+    w.value = -i.value * o;
+  }
+  function d() {
+    if (!s.value) {
+      y();
+      return;
+    }
+    i.value++, t(), i.value >= r.value.length - 5 && y();
+  }
+  function v() {
+    g.value && (i.value--, t());
+  }
+  function T(o) {
+    l.value && (b.value = !0, a.value = o.touches[0].clientY, p.value = w.value, o.preventDefault());
+  }
+  function S(o) {
+    if (!l.value || !b.value) return;
+    const u = o.touches[0].clientY - a.value;
+    w.value = p.value + u, o.preventDefault();
+  }
+  function E(o) {
+    if (!l.value || !b.value) return;
+    b.value = !1;
+    const u = w.value - p.value;
+    Math.abs(u) > 100 ? u > 0 && g.value ? v() : u < 0 && s.value ? d() : t() : t(), o.preventDefault();
+  }
+  function f(o) {
+    l.value && (b.value = !0, a.value = o.clientY, p.value = w.value, o.preventDefault());
+  }
+  function P(o) {
+    if (!l.value || !b.value) return;
+    const u = o.clientY - a.value;
+    w.value = p.value + u, o.preventDefault();
+  }
+  function L(o) {
+    if (!l.value || !b.value) return;
+    b.value = !1;
+    const u = w.value - p.value;
+    Math.abs(u) > 100 ? u > 0 && g.value ? v() : u < 0 && s.value ? d() : t() : t(), o.preventDefault();
+  }
+  function k() {
+    !l.value && i.value > 0 && (i.value = 0, w.value = 0), l.value && r.value.length === 0 && !n.value && h(m.value[0]), l.value && t();
+  }
+  function W() {
+    i.value = 0, w.value = 0, b.value = !1;
+  }
+  return {
+    // State
+    currentSwipeIndex: i,
+    swipeOffset: w,
+    isDragging: b,
+    swipeContainer: x,
+    // Computed
+    currentItem: M,
+    nextItem: s,
+    previousItem: g,
+    // Functions
+    handleTouchStart: T,
+    handleTouchMove: S,
+    handleTouchEnd: E,
+    handleMouseDown: f,
+    handleMouseMove: P,
+    handleMouseUp: L,
+    goToNextItem: d,
+    goToPreviousItem: v,
+    snapToCurrentItem: t,
+    handleWindowResize: k,
+    reset: W
+  };
+}
+function he(e) {
+  return e instanceof Error ? e : new Error(String(e));
+}
+function Zt(e) {
+  const {
+    getNextPage: l,
+    masonry: r,
+    isLoading: n,
+    hasReachedEnd: y,
+    loadError: h,
+    currentPage: m,
+    paginationHistory: i,
+    refreshLayout: w,
+    retryMaxAttempts: b,
+    retryInitialDelayMs: a,
+    retryBackoffStepMs: p,
+    backfillEnabled: x,
+    backfillDelayMs: M,
+    backfillMaxCalls: s,
+    pageSize: g,
+    autoRefreshOnEmpty: t,
+    emits: d
+  } = e, v = z(!1);
+  let T = !1;
+  function S(u, I) {
+    return new Promise(($) => {
+      const C = Math.max(0, u | 0), F = Date.now();
+      I(C, C);
+      const D = setInterval(() => {
+        if (v.value) {
+          clearInterval(D), $();
+          return;
+        }
+        const j = Date.now() - F, X = Math.max(0, C - j);
+        I(X, C), X <= 0 && (clearInterval(D), $());
+      }, 100);
+    });
+  }
+  async function E(u) {
+    let I = 0;
+    const $ = b;
+    let C = a;
+    for (; ; )
+      try {
+        const F = await u();
+        return I > 0 && d("retry:stop", { attempt: I, success: !0 }), F;
+      } catch (F) {
+        if (I++, I > $)
+          throw d("retry:stop", { attempt: I - 1, success: !1 }), F;
+        d("retry:start", { attempt: I, max: $, totalMs: C }), await S(C, (D, j) => {
+          d("retry:tick", { attempt: I, remainingMs: D, totalMs: j });
+        }), C += p;
+      }
+  }
+  async function f(u) {
+    try {
+      const I = await E(() => l(u));
+      return w([...r.value, ...I.items]), I;
+    } catch (I) {
+      throw I;
+    }
+  }
+  async function P(u, I = !1) {
+    if (!I && !x || T || v.value || y.value) return;
+    const $ = (u || 0) + (g || 0);
+    if (!g || g <= 0) return;
+    if (i.value[i.value.length - 1] == null) {
+      y.value = !0;
+      return;
+    }
+    if (!(r.value.length >= $)) {
+      T = !0, n.value = !0;
+      try {
+        let F = 0;
+        for (d("backfill:start", { target: $, fetched: r.value.length, calls: F }); r.value.length < $ && F < s && i.value[i.value.length - 1] != null && !v.value && !y.value && T && (await S(M, (j, X) => {
+          d("backfill:tick", {
+            fetched: r.value.length,
+            target: $,
+            calls: F,
+            remainingMs: j,
+            totalMs: X
+          });
+        }), !(v.value || !T)); ) {
+          const D = i.value[i.value.length - 1];
+          if (D == null) {
+            y.value = !0;
+            break;
+          }
+          try {
+            if (v.value || !T) break;
+            const j = await f(D);
+            if (v.value || !T) break;
+            h.value = null, i.value.push(j.nextPage), j.nextPage == null && (y.value = !0);
+          } catch (j) {
+            if (v.value || !T) break;
+            h.value = he(j);
+          }
+          F++;
+        }
+        d("backfill:stop", { fetched: r.value.length, calls: F });
+      } finally {
+        T = !1, n.value = !1;
+      }
+    }
+  }
+  async function L(u) {
+    if (!n.value) {
+      v.value = !1, n.value = !0, y.value = !1, h.value = null;
+      try {
+        const I = r.value.length;
+        if (v.value) return;
+        const $ = await f(u);
+        return v.value ? void 0 : (h.value = null, m.value = u, i.value.push($.nextPage), $.nextPage == null && (y.value = !0), await P(I), $);
+      } catch (I) {
+        throw h.value = he(I), I;
+      } finally {
+        n.value = !1;
+      }
+    }
+  }
+  async function k() {
+    if (!n.value && !y.value) {
+      v.value = !1, n.value = !0, h.value = null;
+      try {
+        const u = r.value.length;
+        if (v.value) return;
+        const I = i.value[i.value.length - 1];
+        if (I == null) {
+          y.value = !0, n.value = !1;
+          return;
+        }
+        const $ = await f(I);
+        return v.value ? void 0 : (h.value = null, m.value = I, i.value.push($.nextPage), $.nextPage == null && (y.value = !0), await P(u), $);
+      } catch (u) {
+        throw h.value = he(u), u;
+      } finally {
+        n.value = !1;
+      }
+    }
+  }
+  async function W() {
+    if (!n.value) {
+      v.value = !1, n.value = !0;
+      try {
+        const u = m.value;
+        if (u == null) {
+          console.warn("[Masonry] No current page to refresh - currentPage:", m.value, "paginationHistory:", i.value);
+          return;
+        }
+        r.value = [], y.value = !1, h.value = null, i.value = [u];
+        const I = await f(u);
+        if (v.value) return;
+        h.value = null, m.value = u, i.value.push(I.nextPage), I.nextPage == null && (y.value = !0);
+        const $ = r.value.length;
+        return await P($), I;
+      } catch (u) {
+        throw h.value = he(u), u;
+      } finally {
+        n.value = !1;
+      }
+    }
+  }
+  function o() {
+    const u = T;
+    v.value = !0, n.value = !1, T = !1, u && d("backfill:stop", { fetched: r.value.length, calls: 0, cancelled: !0 });
+  }
+  return {
+    loadPage: L,
+    loadNext: k,
+    refreshCurrentPage: W,
+    cancelLoad: o,
+    maybeBackfillToTarget: P,
+    getContent: f
+  };
+}
+function ea(e) {
+  const {
+    masonry: l,
+    useSwipeMode: r,
+    refreshLayout: n,
+    refreshCurrentPage: y,
+    loadNext: h,
+    maybeBackfillToTarget: m,
+    autoRefreshOnEmpty: i,
+    paginationHistory: w
+  } = e;
+  async function b(s) {
+    const g = l.value.filter((t) => t.id !== s.id);
+    if (l.value = g, await q(), g.length === 0 && w.value.length > 0) {
+      if (i)
+        await y();
+      else
+        try {
+          await h(), await m(0, !0);
+        } catch {
+        }
       return;
     }
+    await new Promise((t) => requestAnimationFrame(() => t())), requestAnimationFrame(() => {
+      n(g);
+    });
+  }
+  async function a(s) {
+    if (!s || s.length === 0) return;
+    const g = new Set(s.map((d) => d.id)), t = l.value.filter((d) => !g.has(d.id));
+    if (l.value = t, await q(), t.length === 0 && w.value.length > 0) {
+      if (i)
+        await y();
+      else
+        try {
+          await h(), await m(0, !0);
+        } catch {
+        }
+      return;
+    }
+    await new Promise((d) => requestAnimationFrame(() => d())), requestAnimationFrame(() => {
+      n(t);
+    });
+  }
+  async function p(s, g) {
+    if (!s) return;
+    const t = l.value;
+    if (t.findIndex((S) => S.id === s.id) !== -1) return;
+    const v = [...t], T = Math.min(g, v.length);
+    v.splice(T, 0, s), l.value = v, await q(), r.value || (await new Promise((S) => requestAnimationFrame(() => S())), requestAnimationFrame(() => {
+      n(v);
+    }));
+  }
+  async function x(s, g) {
+    var L;
+    if (!s || s.length === 0) return;
+    if (!g || g.length !== s.length) {
+      console.warn("[Masonry] restoreMany: items and indices arrays must have the same length");
+      return;
+    }
+    const t = l.value, d = new Set(t.map((k) => k.id)), v = [];
+    for (let k = 0; k < s.length; k++)
+      d.has((L = s[k]) == null ? void 0 : L.id) || v.push({ item: s[k], index: g[k] });
+    if (v.length === 0) return;
+    const T = /* @__PURE__ */ new Map();
+    for (const { item: k, index: W } of v)
+      T.set(W, k);
+    const S = v.length > 0 ? Math.max(...v.map(({ index: k }) => k)) : -1, E = Math.max(t.length - 1, S), f = [];
+    let P = 0;
+    for (let k = 0; k <= E; k++)
+      T.has(k) ? f.push(T.get(k)) : P < t.length && (f.push(t[P]), P++);
+    for (; P < t.length; )
+      f.push(t[P]), P++;
+    l.value = f, await q(), r.value || (await new Promise((k) => requestAnimationFrame(() => k())), requestAnimationFrame(() => {
+      n(f);
+    }));
+  }
+  async function M() {
+    l.value = [];
+  }
+  return {
+    remove: b,
+    removeMany: a,
+    restore: p,
+    restoreMany: x,
+    removeAll: M
+  };
+}
+function ta(e) {
+  const {
+    masonry: l,
+    useSwipeMode: r,
+    container: n,
+    columns: y,
+    containerWidth: h,
+    masonryContentHeight: m,
+    layout: i,
+    fixedDimensions: w,
+    checkItemDimensions: b
+  } = e;
+  let a = [];
+  function p(g) {
+    const t = _t(g);
+    let d = 0;
+    if (n.value) {
+      const { scrollTop: v, clientHeight: T } = n.value;
+      d = v + T + 100;
+    }
+    m.value = Math.max(t, d);
+  }
+  function x(g) {
+    var T, S;
+    if (r.value) {
+      l.value = g;
+      return;
+    }
+    if (!n.value) return;
+    if (b(g, "refreshLayout"), g.length > 1e3 && a.length > g.length && a.length - g.length < 100) {
+      let E = !0;
+      for (let f = 0; f < g.length; f++)
+        if (((T = g[f]) == null ? void 0 : T.id) !== ((S = a[f]) == null ? void 0 : S.id)) {
+          E = !1;
+          break;
+        }
+      if (E) {
+        const f = g.map((P, L) => ({
+          ...a[L],
+          originalIndex: L
+        }));
+        p(f), l.value = f, a = f;
+        return;
+      }
+    }
+    const d = g.map((E, f) => ({
+      ...E,
+      originalIndex: f
+    })), v = n.value;
+    if (w.value && w.value.width !== void 0) {
+      const E = v.style.width, f = v.style.boxSizing;
+      v.style.boxSizing = "border-box", v.style.width = `${w.value.width}px`, v.offsetWidth;
+      const P = qe(d, v, y.value, i.value);
+      v.style.width = E, v.style.boxSizing = f, p(P), l.value = P, a = P;
+    } else {
+      const E = qe(d, v, y.value, i.value);
+      p(E), l.value = E, a = E;
+    }
+  }
+  function M(g, t) {
+    w.value = g, g && (g.width !== void 0 && (h.value = g.width), !r.value && n.value && l.value.length > 0 && q(() => {
+      y.value = ue(i.value, h.value), x(l.value), t && t();
+    }));
+  }
+  function s() {
+    y.value = ue(i.value, h.value), x(l.value);
   }
   return {
-    handleScroll: M
+    refreshLayout: x,
+    setFixedDimensions: M,
+    onResize: s,
+    calculateHeight: p
   };
 }
-const ca = { class: "flex-1 relative min-h-0" }, va = { class: "w-full h-full rounded-xl overflow-hidden shadow-sm transition-all duration-300 bg-white relative" }, fa = {
+function aa(e) {
+  const {
+    masonry: l,
+    container: r,
+    columns: n,
+    virtualBufferPx: y,
+    loadThresholdPx: h
+  } = e, m = z(e.handleScroll), i = z(0), w = z(0), b = y, a = z(!1), p = z({
+    distanceToTrigger: 0,
+    isNearTrigger: !1
+  }), x = Q(() => {
+    const t = i.value - b, d = i.value + w.value + b, v = l.value;
+    return !v || v.length === 0 ? [] : v.filter((S) => {
+      if (typeof S.top != "number" || typeof S.columnHeight != "number")
+        return !0;
+      const E = S.top;
+      return S.top + S.columnHeight >= t && E <= d;
+    });
+  });
+  function M(t) {
+    if (!r.value) return;
+    const { scrollTop: d, clientHeight: v } = r.value, T = d + v, S = t ?? $e(l.value, n.value), E = S.length ? Math.max(...S) : 0, f = typeof h == "number" ? h : 200, P = f >= 0 ? Math.max(0, E - f) : Math.max(0, E + f), L = Math.max(0, P - T), k = L <= 100;
+    p.value = {
+      distanceToTrigger: Math.round(L),
+      isNearTrigger: k
+    };
+  }
+  async function s() {
+    if (r.value) {
+      const d = r.value.scrollTop, v = r.value.clientHeight || window.innerHeight, T = v > 0 ? v : window.innerHeight;
+      i.value = d, w.value = T;
+    }
+    a.value = !0, await q(), await new Promise((d) => requestAnimationFrame(() => d())), a.value = !1;
+    const t = $e(l.value, n.value);
+    m.value(t), M(t);
+  }
+  function g() {
+    i.value = 0, w.value = 0, a.value = !1, p.value = {
+      distanceToTrigger: 0,
+      isNearTrigger: !1
+    };
+  }
+  return {
+    viewportTop: i,
+    viewportHeight: w,
+    virtualizing: a,
+    scrollProgress: p,
+    visibleMasonry: x,
+    updateScrollProgress: M,
+    updateViewport: s,
+    reset: g,
+    handleScroll: m
+  };
+}
+function na(e) {
+  const { masonry: l } = e, r = z(/* @__PURE__ */ new Set());
+  function n(m) {
+    return typeof m == "number" && m > 0 && Number.isFinite(m);
+  }
+  function y(m, i) {
+    try {
+      if (!Array.isArray(m) || m.length === 0) return;
+      const w = m.filter((a) => !n(a == null ? void 0 : a.width) || !n(a == null ? void 0 : a.height));
+      if (w.length === 0) return;
+      const b = [];
+      for (const a of w) {
+        const p = (a == null ? void 0 : a.id) ?? `idx:${l.value.indexOf(a)}`;
+        r.value.has(p) || (r.value.add(p), b.push(p));
+      }
+      if (b.length > 0) {
+        const a = b.slice(0, 10);
+        console.warn(
+          "[Masonry] Items missing width/height detected:",
+          {
+            context: i,
+            count: b.length,
+            sampleIds: a,
+            hint: "Ensure each item has positive width and height. Consider providing fallbacks (e.g., 512x512) at the data layer."
+          }
+        );
+      }
+    } catch {
+    }
+  }
+  function h() {
+    r.value.clear();
+  }
+  return {
+    checkItemDimensions: y,
+    invalidDimensionIds: r,
+    reset: h
+  };
+}
+const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full rounded-xl overflow-hidden shadow-sm transition-all duration-300 bg-white relative" }, ra = {
   key: 0,
   class: "absolute inset-0 flex flex-col items-center justify-center bg-slate-100 text-slate-400 text-sm p-4 text-center"
-}, da = {
+}, ia = {
   key: 1,
   class: "relative w-full h-full"
-}, ma = ["src"], ha = ["src", "autoplay", "controls"], ga = { class: "w-12 h-12 rounded-full bg-white/80 backdrop-blur-sm flex items-center justify-center shadow-sm" }, pa = {
+}, sa = ["src"], ua = ["src", "autoplay", "controls"], ca = { class: "w-12 h-12 rounded-full bg-white/80 backdrop-blur-sm flex items-center justify-center shadow-sm" }, va = {
   key: 3,
   class: "absolute bottom-2 left-1/2 transform -translate-x-1/2 flex items-center justify-center z-10"
-}, ya = {
+}, fa = {
   key: 4,
   class: "absolute inset-0 flex flex-col items-center justify-center bg-slate-50 text-slate-400 text-sm p-4 text-center"
-}, ke = /* @__PURE__ */ rt({
+}, xe = /* @__PURE__ */ Je({
   __name: "MasonryItem",
   props: {
     item: {},
@@ -367,276 +904,278 @@ const ca = { class: "flex-1 relative min-h-0" }, va = { class: "w-full h-full ro
     inSwipeMode: { type: Boolean, default: !1 }
   },
   emits: ["preload:success", "preload:error", "mouse-enter", "mouse-leave"],
-  setup(t, { emit: c }) {
-    const u = t, o = c, T = k(!1), w = k(!1), y = k(null), v = k(!1), I = k(!1), L = k(null), i = k(!1), M = k(!1), f = k(!1), N = k(null), O = k(null);
-    let B = null;
-    const m = ne(() => {
-      var n;
-      return u.type ?? ((n = u.item) == null ? void 0 : n.type) ?? "image";
-    }), l = ne(() => {
-      var n;
-      return u.notFound ?? ((n = u.item) == null ? void 0 : n.notFound) ?? !1;
-    }), $ = ne(() => !!u.inSwipeMode);
-    function g(n) {
-      o("mouse-enter", { item: u.item, type: n });
+  setup(e, { emit: l }) {
+    const r = e, n = l, y = z(!1), h = z(!1), m = z(null), i = z(!1), w = z(!1), b = z(null), a = z(!1), p = z(!1), x = z(!1), M = z(null), s = z(null);
+    let g = null;
+    const t = Q(() => {
+      var o;
+      return r.type ?? ((o = r.item) == null ? void 0 : o.type) ?? "image";
+    }), d = Q(() => {
+      var o;
+      return r.notFound ?? ((o = r.item) == null ? void 0 : o.notFound) ?? !1;
+    }), v = Q(() => !!r.inSwipeMode);
+    function T(o) {
+      n("mouse-enter", { item: r.item, type: o });
     }
-    function b(n) {
-      o("mouse-leave", { item: u.item, type: n });
+    function S(o) {
+      n("mouse-leave", { item: r.item, type: o });
     }
-    function H(n) {
-      if ($.value) return;
-      const h = n.target;
-      h && (h.paused ? h.play() : h.pause());
+    function E(o) {
+      if (v.value) return;
+      const u = o.target;
+      u && (u.paused ? u.play() : u.pause());
     }
-    function p(n) {
-      const h = n.target;
-      h && ($.value || h.play(), g("video"));
+    function f(o) {
+      const u = o.target;
+      u && (v.value || u.play(), T("video"));
     }
-    function W(n) {
-      const h = n.target;
-      h && ($.value || h.pause(), b("video"));
+    function P(o) {
+      const u = o.target;
+      u && (v.value || u.pause(), S("video"));
     }
-    function x(n) {
-      return new Promise((h, F) => {
-        if (!n) {
-          const A = new Error("No image source provided");
-          o("preload:error", { item: u.item, type: "image", src: n, error: A }), F(A);
+    function L(o) {
+      return new Promise((u, I) => {
+        if (!o) {
+          const D = new Error("No image source provided");
+          n("preload:error", { item: r.item, type: "image", src: o, error: D }), I(D);
           return;
         }
-        const q = new Image(), J = Date.now(), U = 300;
-        q.onload = () => {
-          const A = Date.now() - J, ve = Math.max(0, U - A);
+        const $ = new Image(), C = Date.now(), F = 300;
+        $.onload = () => {
+          const D = Date.now() - C, j = Math.max(0, F - D);
           setTimeout(async () => {
-            T.value = !0, w.value = !1, M.value = !1, await G(), await new Promise((fe) => setTimeout(fe, 100)), f.value = !0, o("preload:success", { item: u.item, type: "image", src: n }), h();
-          }, ve);
-        }, q.onerror = () => {
-          w.value = !0, T.value = !1, M.value = !1;
-          const A = new Error("Failed to load image");
-          o("preload:error", { item: u.item, type: "image", src: n, error: A }), F(A);
-        }, q.src = n;
+            y.value = !0, h.value = !1, p.value = !1, await q(), await new Promise((X) => setTimeout(X, 100)), x.value = !0, n("preload:success", { item: r.item, type: "image", src: o }), u();
+          }, j);
+        }, $.onerror = () => {
+          h.value = !0, y.value = !1, p.value = !1;
+          const D = new Error("Failed to load image");
+          n("preload:error", { item: r.item, type: "image", src: o, error: D }), I(D);
+        }, $.src = o;
       });
     }
-    function E(n) {
-      return new Promise((h, F) => {
-        if (!n) {
-          const A = new Error("No video source provided");
-          o("preload:error", { item: u.item, type: "video", src: n, error: A }), F(A);
+    function k(o) {
+      return new Promise((u, I) => {
+        if (!o) {
+          const D = new Error("No video source provided");
+          n("preload:error", { item: r.item, type: "video", src: o, error: D }), I(D);
           return;
         }
-        const q = document.createElement("video"), J = Date.now(), U = 300;
-        q.preload = "metadata", q.muted = !0, q.onloadedmetadata = () => {
-          const A = Date.now() - J, ve = Math.max(0, U - A);
+        const $ = document.createElement("video"), C = Date.now(), F = 300;
+        $.preload = "metadata", $.muted = !0, $.onloadedmetadata = () => {
+          const D = Date.now() - C, j = Math.max(0, F - D);
           setTimeout(async () => {
-            v.value = !0, I.value = !1, M.value = !1, await G(), await new Promise((fe) => setTimeout(fe, 100)), f.value = !0, o("preload:success", { item: u.item, type: "video", src: n }), h();
-          }, ve);
-        }, q.onerror = () => {
-          I.value = !0, v.value = !1, M.value = !1;
-          const A = new Error("Failed to load video");
-          o("preload:error", { item: u.item, type: "video", src: n, error: A }), F(A);
-        }, q.src = n;
+            i.value = !0, w.value = !1, p.value = !1, await q(), await new Promise((X) => setTimeout(X, 100)), x.value = !0, n("preload:success", { item: r.item, type: "video", src: o }), u();
+          }, j);
+        }, $.onerror = () => {
+          w.value = !0, i.value = !1, p.value = !1;
+          const D = new Error("Failed to load video");
+          n("preload:error", { item: r.item, type: "video", src: o, error: D }), I(D);
+        }, $.src = o;
       });
     }
-    async function Y() {
-      var h;
-      if (!i.value || M.value || l.value || m.value === "video" && v.value || m.value === "image" && T.value)
+    async function W() {
+      var u;
+      if (!a.value || p.value || d.value || t.value === "video" && i.value || t.value === "image" && y.value)
         return;
-      const n = (h = u.item) == null ? void 0 : h.src;
-      if (n)
-        if (M.value = !0, f.value = !1, m.value === "video") {
-          L.value = n, v.value = !1, I.value = !1;
+      const o = (u = r.item) == null ? void 0 : u.src;
+      if (o)
+        if (p.value = !0, x.value = !1, t.value === "video") {
+          b.value = o, i.value = !1, w.value = !1;
           try {
-            await E(n);
+            await k(o);
           } catch {
           }
         } else {
-          y.value = n, T.value = !1, w.value = !1;
+          m.value = o, y.value = !1, h.value = !1;
           try {
-            await x(n);
+            await L(o);
           } catch {
           }
         }
     }
-    return ot(() => {
-      N.value && (B = new IntersectionObserver(
-        (n) => {
-          n.forEach((h) => {
-            h.isIntersecting && h.intersectionRatio >= 1 ? i.value || (i.value = !0, Y()) : h.isIntersecting;
+    return Ke(() => {
+      M.value && (g = new IntersectionObserver(
+        (o) => {
+          o.forEach((u) => {
+            u.isIntersecting && u.intersectionRatio >= 1 ? a.value || (a.value = !0, W()) : u.isIntersecting;
           });
         },
         {
           // Only trigger when item is 100% visible (full height in view)
           threshold: [1]
         }
-      ), B.observe(N.value));
-    }), it(() => {
-      B && (B.disconnect(), B = null);
-    }), ce(
+      ), g.observe(M.value));
+    }), Qe(() => {
+      g && (g.disconnect(), g = null);
+    }), te(
       () => {
-        var n;
-        return (n = u.item) == null ? void 0 : n.src;
+        var o;
+        return (o = r.item) == null ? void 0 : o.src;
       },
-      async (n) => {
-        if (!(!n || l.value)) {
-          if (m.value === "video") {
-            if (n !== L.value && (v.value = !1, I.value = !1, L.value = n, i.value)) {
-              M.value = !0;
+      async (o) => {
+        if (!(!o || d.value)) {
+          if (t.value === "video") {
+            if (o !== b.value && (i.value = !1, w.value = !1, b.value = o, a.value)) {
+              p.value = !0;
               try {
-                await E(n);
+                await k(o);
               } catch {
               }
             }
-          } else if (n !== y.value && (T.value = !1, w.value = !1, y.value = n, i.value)) {
-            M.value = !0;
+          } else if (o !== m.value && (y.value = !1, h.value = !1, m.value = o, a.value)) {
+            p.value = !0;
             try {
-              await x(n);
+              await L(o);
             } catch {
             }
           }
         }
       }
-    ), ce(
-      () => u.isActive,
-      (n) => {
-        !$.value || !O.value || (n ? O.value.play() : O.value.pause());
+    ), te(
+      () => r.isActive,
+      (o) => {
+        !v.value || !s.value || (o ? s.value.play() : s.value.pause());
       }
-    ), (n, h) => (j(), R("div", {
+    ), (o, u) => (O(), R("div", {
       ref_key: "containerRef",
-      ref: N,
+      ref: M,
       class: "relative w-full h-full flex flex-col"
     }, [
-      n.headerHeight > 0 ? (j(), R("div", {
+      o.headerHeight > 0 ? (O(), R("div", {
         key: 0,
         class: "relative z-10",
-        style: Ee({ height: `${n.headerHeight}px` })
+        style: ge({ height: `${o.headerHeight}px` })
       }, [
-        ae(n.$slots, "header", {
-          item: n.item,
-          remove: n.remove,
-          imageLoaded: T.value,
-          imageError: w.value,
-          videoLoaded: v.value,
-          videoError: I.value,
-          showNotFound: l.value,
-          isLoading: M.value,
-          mediaType: m.value
+        _(o.$slots, "header", {
+          item: o.item,
+          remove: o.remove,
+          imageLoaded: y.value,
+          imageError: h.value,
+          videoLoaded: i.value,
+          videoError: w.value,
+          showNotFound: d.value,
+          isLoading: p.value,
+          mediaType: t.value
         })
-      ], 4)) : se("", !0),
-      V("div", ca, [
-        ae(n.$slots, "default", {
-          item: n.item,
-          remove: n.remove,
-          imageLoaded: T.value,
-          imageError: w.value,
-          videoLoaded: v.value,
-          videoError: I.value,
-          showNotFound: l.value,
-          isLoading: M.value,
-          mediaType: m.value,
-          imageSrc: y.value,
-          videoSrc: L.value,
-          showMedia: f.value
+      ], 4)) : ee("", !0),
+      V("div", la, [
+        _(o.$slots, "default", {
+          item: o.item,
+          remove: o.remove,
+          imageLoaded: y.value,
+          imageError: h.value,
+          videoLoaded: i.value,
+          videoError: w.value,
+          showNotFound: d.value,
+          isLoading: p.value,
+          mediaType: t.value,
+          imageSrc: m.value,
+          videoSrc: b.value,
+          showMedia: x.value
         }, () => [
-          V("div", va, [
-            l.value ? (j(), R("div", fa, h[3] || (h[3] = [
+          V("div", oa, [
+            d.value ? (O(), R("div", ra, u[3] || (u[3] = [
               V("i", { class: "fas fa-search text-3xl mb-3 opacity-50" }, null, -1),
               V("span", { class: "font-medium" }, "Not Found", -1),
               V("span", { class: "text-xs mt-1 opacity-75" }, "This item could not be located", -1)
-            ]))) : (j(), R("div", da, [
-              m.value === "image" && y.value ? (j(), R("img", {
+            ]))) : (O(), R("div", ia, [
+              t.value === "image" && m.value ? (O(), R("img", {
                 key: 0,
-                src: y.value,
-                class: he([
+                src: m.value,
+                class: re([
                   "w-full h-full object-cover transition-opacity duration-700 ease-in-out",
-                  T.value && f.value ? "opacity-100" : "opacity-0"
+                  y.value && x.value ? "opacity-100" : "opacity-0"
                 ]),
                 style: { position: "absolute", top: "0", left: "0" },
                 loading: "lazy",
                 decoding: "async",
                 alt: "",
-                onMouseenter: h[0] || (h[0] = (F) => g("image")),
-                onMouseleave: h[1] || (h[1] = (F) => b("image"))
-              }, null, 42, ma)) : se("", !0),
-              m.value === "video" && L.value ? (j(), R("video", {
+                onMouseenter: u[0] || (u[0] = (I) => T("image")),
+                onMouseleave: u[1] || (u[1] = (I) => S("image"))
+              }, null, 42, sa)) : ee("", !0),
+              t.value === "video" && b.value ? (O(), R("video", {
                 key: 1,
                 ref_key: "videoEl",
-                ref: O,
-                src: L.value,
-                class: he([
+                ref: s,
+                src: b.value,
+                class: re([
                   "w-full h-full object-cover transition-opacity duration-700 ease-in-out",
-                  v.value && f.value ? "opacity-100" : "opacity-0"
+                  i.value && x.value ? "opacity-100" : "opacity-0"
                 ]),
                 style: { position: "absolute", top: "0", left: "0" },
                 muted: "",
                 loop: "",
                 playsinline: "",
-                autoplay: $.value && u.isActive,
-                controls: $.value,
-                onClick: Je(H, ["stop"]),
-                onTouchend: Je(H, ["stop", "prevent"]),
-                onMouseenter: p,
-                onMouseleave: W,
-                onError: h[2] || (h[2] = (F) => I.value = !0)
-              }, null, 42, ha)) : se("", !0),
-              !T.value && !v.value && !w.value && !I.value ? (j(), R("div", {
+                autoplay: v.value && r.isActive,
+                controls: v.value,
+                onClick: Ce(E, ["stop"]),
+                onTouchend: Ce(E, ["stop", "prevent"]),
+                onMouseenter: f,
+                onMouseleave: P,
+                onError: u[2] || (u[2] = (I) => w.value = !0)
+              }, null, 42, ua)) : ee("", !0),
+              !y.value && !i.value && !h.value && !w.value ? (O(), R("div", {
                 key: 2,
-                class: he([
+                class: re([
                   "absolute inset-0 bg-slate-100 flex items-center justify-center transition-opacity duration-500",
-                  f.value ? "opacity-0 pointer-events-none" : "opacity-100"
+                  x.value ? "opacity-0 pointer-events-none" : "opacity-100"
                 ])
               }, [
-                V("div", ga, [
-                  V("i", {
-                    class: he(m.value === "video" ? "fas fa-video text-xl text-slate-400" : "fas fa-image text-xl text-slate-400")
-                  }, null, 2)
+                V("div", ca, [
+                  _(o.$slots, "placeholder-icon", { mediaType: t.value }, () => [
+                    V("i", {
+                      class: re(t.value === "video" ? "fas fa-video text-xl text-slate-400" : "fas fa-image text-xl text-slate-400")
+                    }, null, 2)
+                  ])
                 ])
-              ], 2)) : se("", !0),
-              M.value ? (j(), R("div", pa, h[4] || (h[4] = [
+              ], 2)) : ee("", !0),
+              p.value ? (O(), R("div", va, u[4] || (u[4] = [
                 V("div", { class: "bg-white/90 backdrop-blur-sm rounded-full px-3 py-1.5 shadow-sm" }, [
                   V("div", { class: "animate-spin rounded-full h-4 w-4 border-b-2 border-blue-500" })
                 ], -1)
-              ]))) : se("", !0),
-              m.value === "image" && w.value || m.value === "video" && I.value ? (j(), R("div", ya, [
+              ]))) : ee("", !0),
+              t.value === "image" && h.value || t.value === "video" && w.value ? (O(), R("div", fa, [
                 V("i", {
-                  class: he(m.value === "video" ? "fas fa-video text-2xl mb-2 opacity-50" : "fas fa-image text-2xl mb-2 opacity-50")
+                  class: re(t.value === "video" ? "fas fa-video text-2xl mb-2 opacity-50" : "fas fa-image text-2xl mb-2 opacity-50")
                 }, null, 2),
-                V("span", null, "Failed to load " + Ae(m.value), 1)
-              ])) : se("", !0)
+                V("span", null, "Failed to load " + He(t.value), 1)
+              ])) : ee("", !0)
             ]))
           ])
         ])
       ]),
-      n.footerHeight > 0 ? (j(), R("div", {
+      o.footerHeight > 0 ? (O(), R("div", {
         key: 1,
         class: "relative z-10",
-        style: Ee({ height: `${n.footerHeight}px` })
+        style: ge({ height: `${o.footerHeight}px` })
       }, [
-        ae(n.$slots, "footer", {
-          item: n.item,
-          remove: n.remove,
-          imageLoaded: T.value,
-          imageError: w.value,
-          videoLoaded: v.value,
-          videoError: I.value,
-          showNotFound: l.value,
-          isLoading: M.value,
-          mediaType: m.value
+        _(o.$slots, "footer", {
+          item: o.item,
+          remove: o.remove,
+          imageLoaded: y.value,
+          imageError: h.value,
+          videoLoaded: i.value,
+          videoError: w.value,
+          showNotFound: d.value,
+          isLoading: p.value,
+          mediaType: t.value
         })
-      ], 4)) : se("", !0)
+      ], 4)) : ee("", !0)
     ], 512));
   }
-}), wa = { class: "w-full h-full flex items-center justify-center p-4" }, xa = { class: "w-full h-full max-w-full max-h-full relative" }, ba = {
+}), da = { class: "w-full h-full flex items-center justify-center p-4" }, ma = { class: "w-full h-full max-w-full max-h-full relative" }, ha = {
   key: 0,
   class: "w-full py-8 text-center"
-}, Ma = {
+}, ga = {
   key: 1,
   class: "w-full py-8 text-center"
-}, Ea = { class: "text-red-500 dark:text-red-400" }, Ta = {
+}, pa = { class: "text-red-500 dark:text-red-400" }, ya = {
   key: 0,
   class: "w-full py-8 text-center"
-}, Ia = {
+}, wa = {
   key: 1,
   class: "w-full py-8 text-center"
-}, ka = { class: "text-red-500 dark:text-red-400" }, La = /* @__PURE__ */ rt({
+}, xa = { class: "text-red-500 dark:text-red-400" }, ba = /* @__PURE__ */ Je({
   __name: "Masonry",
   props: {
     getNextPage: {
@@ -659,7 +1198,7 @@ const ca = { class: "flex-1 relative min-h-0" }, va = { class: "w-full h-full ro
       type: String,
       default: "page",
       // or 'cursor'
-      validator: (t) => ["page", "cursor"].includes(t)
+      validator: (e) => ["page", "cursor"].includes(e)
     },
     skipInitialLoad: {
       type: Boolean,
@@ -729,7 +1268,7 @@ const ca = { class: "flex-1 relative min-h-0" }, va = { class: "w-full h-full ro
     layoutMode: {
       type: String,
       default: "auto",
-      validator: (t) => ["auto", "masonry", "swipe"].includes(t)
+      validator: (e) => ["auto", "masonry", "swipe"].includes(e)
     },
     // Breakpoint for switching to swipe mode (in pixels or Tailwind breakpoint name)
     mobileBreakpoint: {
@@ -754,8 +1293,8 @@ const ca = { class: "flex-1 relative min-h-0" }, va = { class: "w-full h-full ro
     "item:mouse-enter",
     "item:mouse-leave"
   ],
-  setup(t, { expose: c, emit: u }) {
-    const o = t, T = {
+  setup(e, { expose: l, emit: r }) {
+    const n = e, y = {
       sizes: { base: 1, sm: 2, md: 3, lg: 4, xl: 5, "2xl": 6 },
       gutterX: 10,
       gutterY: 10,
@@ -764,706 +1303,395 @@ const ca = { class: "flex-1 relative min-h-0" }, va = { class: "w-full h-full ro
       paddingLeft: 0,
       paddingRight: 0,
       placement: "masonry"
-    }, w = ne(() => {
-      var e;
+    }, h = Q(() => {
+      var c;
       return {
-        ...T,
-        ...o.layout,
+        ...y,
+        ...n.layout,
         sizes: {
-          ...T.sizes,
-          ...((e = o.layout) == null ? void 0 : e.sizes) || {}
+          ...y.sizes,
+          ...((c = n.layout) == null ? void 0 : c.sizes) || {}
         }
       };
-    }), y = k(null), v = k(typeof window < "u" ? window.innerWidth : 1024), I = k(typeof window < "u" ? window.innerHeight : 768), L = k(null);
-    let i = null;
-    function M(e) {
+    }), m = z(null), i = z(typeof window < "u" ? window.innerWidth : 1024), w = z(typeof window < "u" ? window.innerHeight : 768), b = z(null);
+    let a = null;
+    function p(c) {
       return {
         sm: 640,
         md: 768,
         lg: 1024,
         xl: 1280,
         "2xl": 1536
-      }[e] || 768;
-    }
-    const f = ne(() => {
-      if (o.layoutMode === "masonry") return !1;
-      if (o.layoutMode === "swipe") return !0;
-      const e = typeof o.mobileBreakpoint == "string" ? M(o.mobileBreakpoint) : o.mobileBreakpoint;
-      return v.value < e;
-    }), N = ne(() => {
-      if (!f.value || l.value.length === 0) return null;
-      const e = Math.max(0, Math.min(n.value, l.value.length - 1));
-      return l.value[e] || null;
-    }), O = ne(() => {
-      if (!f.value || !N.value) return null;
-      const e = n.value + 1;
-      return e >= l.value.length ? null : l.value[e] || null;
-    }), B = ne(() => {
-      if (!f.value || !N.value) return null;
-      const e = n.value - 1;
-      return e < 0 ? null : l.value[e] || null;
-    }), m = u, l = ne({
-      get: () => o.items,
-      set: (e) => m("update:items", e)
-    }), $ = k(7), g = k(null), b = k([]), H = k(null), p = k(!1), W = k(0), x = k(!1), E = k(null), Y = ne(() => la(v.value)), n = k(0), h = k(0), F = k(!1), q = k(0), J = k(0), U = k(null), A = k(/* @__PURE__ */ new Set());
-    function ve(e) {
-      return typeof e == "number" && Number.isFinite(e) && e > 0;
+      }[c] || 768;
     }
-    function fe(e, a) {
-      try {
-        if (!Array.isArray(e) || e.length === 0) return;
-        const r = e.filter((s) => !ve(s == null ? void 0 : s.width) || !ve(s == null ? void 0 : s.height));
-        if (r.length === 0) return;
-        const d = [];
-        for (const s of r) {
-          const D = (s == null ? void 0 : s.id) ?? `idx:${e.indexOf(s)}`;
-          A.value.has(D) || (A.value.add(D), d.push(D));
-        }
-        if (d.length > 0) {
-          const s = d.slice(0, 10);
-          console.warn(
-            "[Masonry] Items missing width/height detected:",
-            {
-              context: a,
-              count: d.length,
-              sampleIds: s,
-              hint: "Ensure each item has positive width and height. Consider providing fallbacks (e.g., 512x512) at the data layer."
-            }
-          );
-        }
-      } catch {
+    const x = Q(() => {
+      if (n.layoutMode === "masonry") return !1;
+      if (n.layoutMode === "swipe") return !0;
+      const c = typeof n.mobileBreakpoint == "string" ? p(n.mobileBreakpoint) : n.mobileBreakpoint;
+      return i.value < c;
+    }), M = r, s = Q({
+      get: () => n.items,
+      set: (c) => M("update:items", c)
+    }), g = z(7), t = z(null), d = z([]), v = z(null), T = z(!1), S = z(0), E = z(!1), f = z(null), P = Q(() => Ut(i.value)), L = na({
+      masonry: s
+    }), { checkItemDimensions: k, reset: W } = L, o = ta({
+      masonry: s,
+      useSwipeMode: x,
+      container: t,
+      columns: g,
+      containerWidth: i,
+      masonryContentHeight: S,
+      layout: h,
+      fixedDimensions: b,
+      checkItemDimensions: k
+    }), { refreshLayout: u, setFixedDimensions: I, onResize: $ } = o, C = aa({
+      masonry: s,
+      container: t,
+      columns: g,
+      virtualBufferPx: n.virtualBufferPx,
+      loadThresholdPx: n.loadThresholdPx,
+      handleScroll: () => {
       }
-    }
-    const P = k(0), C = k(0), Z = o.virtualBufferPx, K = k(!1), Q = k({
-      distanceToTrigger: 0,
-      isNearTrigger: !1
-    }), le = (e) => {
-      if (!g.value) return;
-      const { scrollTop: a, clientHeight: r } = g.value, d = a + r, s = e ?? Oe(l.value, $.value), D = s.length ? Math.max(...s) : 0, S = typeof o.loadThresholdPx == "number" ? o.loadThresholdPx : 200, z = S >= 0 ? Math.max(0, D - S) : Math.max(0, D + S), te = Math.max(0, z - d), ie = te <= 100;
-      Q.value = {
-        distanceToTrigger: Math.round(te),
-        isNearTrigger: ie
-      };
-    }, { onEnter: re, onBeforeEnter: ct, onBeforeLeave: vt, onLeave: ft } = sa(
-      { container: g },
-      { leaveDurationMs: o.leaveDurationMs }
-    );
-    function dt(e, a) {
-      if (K.value) {
-        const r = parseInt(e.dataset.left || "0", 10), d = parseInt(e.dataset.top || "0", 10);
-        e.style.transition = "none", e.style.opacity = "1", e.style.transform = `translate3d(${r}px, ${d}px, 0) scale(1)`, e.style.removeProperty("--masonry-opacity-delay"), requestAnimationFrame(() => {
-          e.style.transition = "", a();
-        });
-      } else
-        re(e, a);
-    }
-    function mt(e) {
-      if (K.value) {
-        const a = parseInt(e.dataset.left || "0", 10), r = parseInt(e.dataset.top || "0", 10);
-        e.style.transition = "none", e.style.opacity = "1", e.style.transform = `translate3d(${a}px, ${r}px, 0) scale(1)`, e.style.removeProperty("--masonry-opacity-delay");
-      } else
-        ct(e);
-    }
-    function ht(e) {
-      K.value || vt(e);
-    }
-    function gt(e, a) {
-      K.value ? a() : ft(e, a);
-    }
-    const pt = ne(() => {
-      const e = P.value - Z, a = P.value + C.value + Z, r = l.value;
-      return !r || r.length === 0 ? [] : r.filter((d) => {
-        const s = d.top;
-        return d.top + d.columnHeight >= e && s <= a;
-      });
-    }), { handleScroll: yt } = ua({
-      container: g,
-      masonry: l,
-      columns: $,
-      containerHeight: W,
-      isLoading: p,
-      pageSize: o.pageSize,
-      refreshLayout: ee,
-      setItemsRaw: (e) => {
-        l.value = e;
+      // Will be set after pagination is initialized
+    }), { viewportTop: F, viewportHeight: D, virtualizing: j, visibleMasonry: X, updateScrollProgress: B, updateViewport: Y, reset: G } = C, { onEnter: ne, onBeforeEnter: J, onBeforeLeave: ie, onLeave: Z } = Jt(
+      { container: t },
+      { leaveDurationMs: n.leaveDurationMs, virtualizing: j }
+    ), tt = ne, at = J, nt = ie, lt = Z, ot = Zt({
+      getNextPage: n.getNextPage,
+      masonry: s,
+      isLoading: T,
+      hasReachedEnd: E,
+      loadError: f,
+      currentPage: v,
+      paginationHistory: d,
+      refreshLayout: u,
+      retryMaxAttempts: n.retryMaxAttempts,
+      retryInitialDelayMs: n.retryInitialDelayMs,
+      retryBackoffStepMs: n.retryBackoffStepMs,
+      backfillEnabled: n.backfillEnabled,
+      backfillDelayMs: n.backfillDelayMs,
+      backfillMaxCalls: n.backfillMaxCalls,
+      pageSize: n.pageSize,
+      autoRefreshOnEmpty: n.autoRefreshOnEmpty,
+      emits: M
+    }), { loadPage: be, loadNext: pe, refreshCurrentPage: De, cancelLoad: Me, maybeBackfillToTarget: rt } = ot, K = Qt({
+      useSwipeMode: x,
+      masonry: s,
+      isLoading: T,
+      loadNext: pe,
+      loadPage: be,
+      paginationHistory: d
+    }), { handleScroll: it } = Kt({
+      container: t,
+      masonry: s,
+      columns: g,
+      containerHeight: S,
+      isLoading: T,
+      pageSize: n.pageSize,
+      refreshLayout: u,
+      setItemsRaw: (c) => {
+        s.value = c;
       },
-      loadNext: ge,
-      loadThresholdPx: o.loadThresholdPx
+      loadNext: pe,
+      loadThresholdPx: n.loadThresholdPx
     });
-    function wt(e) {
-      L.value = e, e ? (e.width !== void 0 && (v.value = e.width), e.height !== void 0 && (I.value = e.height), !f.value && g.value && l.value.length > 0 && G(() => {
-        $.value = pe(w.value, v.value), ee(l.value), le();
-      })) : y.value && (v.value = y.value.clientWidth, I.value = y.value.clientHeight);
+    C.handleScroll.value = it;
+    const st = ea({
+      masonry: s,
+      useSwipeMode: x,
+      refreshLayout: u,
+      refreshCurrentPage: De,
+      loadNext: pe,
+      maybeBackfillToTarget: rt,
+      autoRefreshOnEmpty: n.autoRefreshOnEmpty,
+      paginationHistory: d
+    }), { remove: ce, removeMany: ut, restore: ct, restoreMany: vt, removeAll: ft } = st;
+    function dt(c) {
+      I(c, B), !c && m.value && (i.value = m.value.clientWidth, w.value = m.value.clientHeight);
     }
-    c({
-      isLoading: p,
-      refreshLayout: ee,
+    l({
+      isLoading: T,
+      refreshLayout: u,
       // Container dimensions (wrapper element)
-      containerWidth: v,
-      containerHeight: I,
+      containerWidth: i,
+      containerHeight: w,
       // Masonry content height (for backward compatibility, old containerHeight)
-      contentHeight: W,
+      contentHeight: S,
       // Current page
-      currentPage: H,
+      currentPage: v,
       // End of list tracking
-      hasReachedEnd: x,
+      hasReachedEnd: E,
       // Load error tracking
-      loadError: E,
+      loadError: f,
       // Set fixed dimensions (overrides ResizeObserver)
-      setFixedDimensions: wt,
-      remove: ye,
-      removeMany: bt,
-      removeAll: Tt,
-      restore: Mt,
-      restoreMany: Et,
-      loadNext: ge,
-      loadPage: Pe,
-      refreshCurrentPage: Se,
-      reset: kt,
-      destroy: Lt,
-      init: Pt,
-      paginationHistory: b,
-      cancelLoad: $e,
-      scrollToTop: Re,
-      totalItems: ne(() => l.value.length),
-      currentBreakpoint: Y
+      setFixedDimensions: dt,
+      remove: ce,
+      removeMany: ut,
+      removeAll: ft,
+      restore: ct,
+      restoreMany: vt,
+      loadNext: pe,
+      loadPage: be,
+      refreshCurrentPage: De,
+      reset: pt,
+      destroy: yt,
+      init: Re,
+      restoreItems: Oe,
+      paginationHistory: d,
+      cancelLoad: Me,
+      scrollToTop: mt,
+      scrollTo: ht,
+      totalItems: Q(() => s.value.length),
+      currentBreakpoint: P
     });
-    function Le(e) {
-      const a = ra(e);
-      let r = 0;
-      if (g.value) {
-        const { scrollTop: d, clientHeight: s } = g.value;
-        r = d + s + 100;
-      }
-      W.value = Math.max(a, r);
-    }
-    let de = [];
-    function ee(e) {
-      var s, D;
-      if (f.value) {
-        l.value = e;
-        return;
-      }
-      if (!g.value) return;
-      if (fe(e, "refreshLayout"), e.length > 1e3 && de.length > e.length && de.length - e.length < 100) {
-        let S = !0;
-        for (let z = 0; z < e.length; z++)
-          if (((s = e[z]) == null ? void 0 : s.id) !== ((D = de[z]) == null ? void 0 : D.id)) {
-            S = !1;
-            break;
-          }
-        if (S) {
-          const z = e.map((te, ie) => ({
-            ...de[ie],
-            originalIndex: ie
-          }));
-          Le(z), l.value = z, de = z;
-          return;
-        }
-      }
-      const r = e.map((S, z) => ({
-        ...S,
-        originalIndex: z
-      })), d = g.value;
-      if (L.value && L.value.width !== void 0) {
-        const S = d.style.width, z = d.style.boxSizing;
-        d.style.boxSizing = "border-box", d.style.width = `${L.value.width}px`, d.offsetWidth;
-        const te = Ze(r, d, $.value, w.value);
-        d.style.width = S, d.style.boxSizing = z, Le(te), l.value = te, de = te;
-      } else {
-        const S = Ze(r, d, $.value, w.value);
-        Le(S), l.value = S, de = S;
-      }
-    }
-    function ze(e, a) {
-      return new Promise((r) => {
-        const d = Math.max(0, e | 0), s = Date.now();
-        a(d, d);
-        const D = setInterval(() => {
-          if (_.value) {
-            clearInterval(D), r();
-            return;
-          }
-          const S = Date.now() - s, z = Math.max(0, d - S);
-          a(z, d), z <= 0 && (clearInterval(D), r());
-        }, 100);
-      });
-    }
-    async function Te(e) {
-      try {
-        const a = await xt(() => o.getNextPage(e));
-        return ee([...l.value, ...a.items]), a;
-      } catch (a) {
-        throw console.error("Error in getContent:", a), a;
-      }
-    }
-    async function xt(e) {
-      let a = 0;
-      const r = o.retryMaxAttempts;
-      let d = o.retryInitialDelayMs;
-      for (; ; )
-        try {
-          const s = await e();
-          return a > 0 && m("retry:stop", { attempt: a, success: !0 }), s;
-        } catch (s) {
-          if (a++, a > r)
-            throw m("retry:stop", { attempt: a - 1, success: !1 }), s;
-          m("retry:start", { attempt: a, max: r, totalMs: d }), await ze(d, (D, S) => {
-            m("retry:tick", { attempt: a, remainingMs: D, totalMs: S });
-          }), d += o.retryBackoffStepMs;
-        }
-    }
-    async function Pe(e) {
-      if (!p.value) {
-        _.value = !1, p.value = !0, x.value = !1, E.value = null;
-        try {
-          const a = l.value.length;
-          if (_.value) return;
-          const r = await Te(e);
-          return _.value ? void 0 : (E.value = null, H.value = e, b.value.push(r.nextPage), r.nextPage == null && (x.value = !0), await we(a), r);
-        } catch (a) {
-          throw console.error("Error loading page:", a), E.value = a instanceof Error ? a : new Error(String(a)), a;
-        } finally {
-          p.value = !1;
-        }
-      }
-    }
-    async function ge() {
-      if (!p.value && !x.value) {
-        _.value = !1, p.value = !0, E.value = null;
-        try {
-          const e = l.value.length;
-          if (_.value) return;
-          const a = b.value[b.value.length - 1];
-          if (a == null) {
-            x.value = !0, p.value = !1;
-            return;
-          }
-          const r = await Te(a);
-          return _.value ? void 0 : (E.value = null, H.value = a, b.value.push(r.nextPage), r.nextPage == null && (x.value = !0), await we(e), r);
-        } catch (e) {
-          throw console.error("Error loading next page:", e), E.value = e instanceof Error ? e : new Error(String(e)), e;
-        } finally {
-          p.value = !1;
-        }
-      }
-    }
-    async function Se() {
-      if (!p.value) {
-        _.value = !1, p.value = !0;
-        try {
-          const e = H.value;
-          if (e == null) {
-            console.warn("[Masonry] No current page to refresh - currentPage:", H.value, "paginationHistory:", b.value);
-            return;
-          }
-          l.value = [], W.value = 0, x.value = !1, E.value = null, b.value = [e], await G();
-          const a = await Te(e);
-          if (_.value) return;
-          E.value = null, H.value = e, b.value.push(a.nextPage), a.nextPage == null && (x.value = !0);
-          const r = l.value.length;
-          return await we(r), a;
-        } catch (e) {
-          throw console.error("[Masonry] Error refreshing current page:", e), E.value = e instanceof Error ? e : new Error(String(e)), e;
-        } finally {
-          p.value = !1;
-        }
-      }
-    }
-    async function ye(e) {
-      const a = l.value.filter((r) => r.id !== e.id);
-      if (l.value = a, await G(), a.length === 0 && b.value.length > 0) {
-        if (o.autoRefreshOnEmpty)
-          await Se();
-        else
-          try {
-            await ge(), await we(0, !0);
-          } catch {
-          }
-        return;
-      }
-      await new Promise((r) => requestAnimationFrame(() => r())), requestAnimationFrame(() => {
-        ee(a);
-      });
-    }
-    async function bt(e) {
-      if (!e || e.length === 0) return;
-      const a = new Set(e.map((d) => d.id)), r = l.value.filter((d) => !a.has(d.id));
-      if (l.value = r, await G(), r.length === 0 && b.value.length > 0) {
-        if (o.autoRefreshOnEmpty)
-          await Se();
-        else
-          try {
-            await ge(), await we(0, !0);
-          } catch {
-          }
-        return;
-      }
-      await new Promise((d) => requestAnimationFrame(() => d())), requestAnimationFrame(() => {
-        ee(r);
-      });
-    }
-    async function Mt(e, a) {
-      if (!e) return;
-      const r = l.value;
-      if (r.findIndex((S) => S.id === e.id) !== -1) return;
-      const s = [...r], D = Math.min(a, s.length);
-      s.splice(D, 0, e), l.value = s, await G(), f.value || (await new Promise((S) => requestAnimationFrame(() => S())), requestAnimationFrame(() => {
-        ee(s);
-      }));
-    }
-    async function Et(e, a) {
-      var Ge;
-      if (!e || e.length === 0) return;
-      if (!a || a.length !== e.length) {
-        console.warn("[Masonry] restoreMany: items and indices arrays must have the same length");
-        return;
-      }
-      const r = l.value, d = new Set(r.map((X) => X.id)), s = [];
-      for (let X = 0; X < e.length; X++)
-        d.has((Ge = e[X]) == null ? void 0 : Ge.id) || s.push({ item: e[X], index: a[X] });
-      if (s.length === 0) return;
-      const D = /* @__PURE__ */ new Map();
-      for (const { item: X, index: St } of s)
-        D.set(St, X);
-      const S = s.length > 0 ? Math.max(...s.map(({ index: X }) => X)) : -1, z = Math.max(r.length - 1, S), te = [];
-      let ie = 0;
-      for (let X = 0; X <= z; X++)
-        D.has(X) ? te.push(D.get(X)) : ie < r.length && (te.push(r[ie]), ie++);
-      for (; ie < r.length; )
-        te.push(r[ie]), ie++;
-      l.value = te, await G(), f.value || (await new Promise((X) => requestAnimationFrame(() => X())), requestAnimationFrame(() => {
-        ee(te);
-      }));
-    }
-    function Re(e) {
-      g.value && g.value.scrollTo({
+    const se = K.currentSwipeIndex, ve = K.swipeOffset, ye = K.isDragging, le = K.swipeContainer, ze = K.handleTouchStart, Be = K.handleTouchMove, Ne = K.handleTouchEnd, Fe = K.handleMouseDown, Te = K.handleMouseMove, Ee = K.handleMouseUp, Ie = K.snapToCurrentItem;
+    function mt(c) {
+      t.value && t.value.scrollTo({
         top: 0,
-        behavior: (e == null ? void 0 : e.behavior) ?? "smooth",
-        ...e
+        behavior: (c == null ? void 0 : c.behavior) ?? "smooth",
+        ...c
       });
     }
-    async function Tt() {
-      Re({ behavior: "smooth" }), l.value = [], I.value = 0, await G(), m("remove-all:complete");
-    }
-    function It() {
-      $.value = pe(w.value, v.value), ee(l.value), g.value && (P.value = g.value.scrollTop, C.value = g.value.clientHeight);
-    }
-    let oe = !1;
-    const _ = k(!1);
-    async function we(e, a = !1) {
-      if (!a && !o.backfillEnabled || oe || _.value || x.value) return;
-      const r = (e || 0) + (o.pageSize || 0);
-      if (!o.pageSize || o.pageSize <= 0) return;
-      if (b.value[b.value.length - 1] == null) {
-        x.value = !0;
-        return;
-      }
-      if (!(l.value.length >= r)) {
-        oe = !0, p.value = !0;
-        try {
-          let s = 0;
-          for (m("backfill:start", { target: r, fetched: l.value.length, calls: s }); l.value.length < r && s < o.backfillMaxCalls && b.value[b.value.length - 1] != null && !_.value && !x.value && oe && (await ze(o.backfillDelayMs, (S, z) => {
-            m("backfill:tick", {
-              fetched: l.value.length,
-              target: r,
-              calls: s,
-              remainingMs: S,
-              totalMs: z
-            });
-          }), !(_.value || !oe)); ) {
-            const D = b.value[b.value.length - 1];
-            if (D == null) {
-              x.value = !0;
-              break;
-            }
-            try {
-              if (_.value || !oe) break;
-              const S = await Te(D);
-              if (_.value || !oe) break;
-              E.value = null, b.value.push(S.nextPage), S.nextPage == null && (x.value = !0);
-            } catch (S) {
-              if (_.value || !oe) break;
-              E.value = S instanceof Error ? S : new Error(String(S));
-            }
-            s++;
-          }
-          m("backfill:stop", { fetched: l.value.length, calls: s });
-        } finally {
-          oe = !1, p.value = !1;
-        }
-      }
+    function ht(c) {
+      t.value && (t.value.scrollTo({
+        top: c.top ?? t.value.scrollTop,
+        left: c.left ?? t.value.scrollLeft,
+        behavior: c.behavior ?? "auto"
+      }), t.value && (F.value = t.value.scrollTop, D.value = t.value.clientHeight || window.innerHeight));
     }
-    function $e() {
-      const e = oe;
-      _.value = !0, p.value = !1, oe = !1, e && m("backfill:stop", { fetched: l.value.length, calls: 0, cancelled: !0 });
+    function gt() {
+      $(), t.value && (F.value = t.value.scrollTop, D.value = t.value.clientHeight);
     }
-    function kt() {
-      $e(), _.value = !1, g.value && g.value.scrollTo({
+    function pt() {
+      Me(), t.value && t.value.scrollTo({
         top: 0,
         behavior: "smooth"
-      }), l.value = [], I.value = 0, H.value = o.loadAtPage, b.value = [o.loadAtPage], x.value = !1, E.value = null, Q.value = {
-        distanceToTrigger: 0,
-        isNearTrigger: !1
-      };
+      }), s.value = [], w.value = 0, v.value = n.loadAtPage, d.value = [n.loadAtPage], E.value = !1, f.value = null, G();
     }
-    function Lt() {
-      $e(), l.value = [], W.value = 0, H.value = null, b.value = [], x.value = !1, E.value = null, p.value = !1, oe = !1, _.value = !1, n.value = 0, h.value = 0, F.value = !1, P.value = 0, C.value = 0, K.value = !1, Q.value = {
-        distanceToTrigger: 0,
-        isNearTrigger: !1
-      }, A.value.clear(), g.value && g.value.scrollTo({
+    function yt() {
+      Me(), s.value = [], S.value = 0, v.value = null, d.value = [], E.value = !1, f.value = null, T.value = !1, se.value = 0, ve.value = 0, ye.value = !1, G(), W(), t.value && t.value.scrollTo({
         top: 0,
         behavior: "auto"
         // Instant scroll for destroy
       });
     }
-    const me = nt(async () => {
-      if (f.value) return;
-      g.value && (P.value = g.value.scrollTop, C.value = g.value.clientHeight), K.value = !0, await G(), await new Promise((a) => requestAnimationFrame(() => a())), K.value = !1;
-      const e = Oe(l.value, $.value);
-      yt(e), le(e);
-    }, 200), je = nt(It, 200);
-    function Ce(e) {
-      f.value && (F.value = !0, q.value = e.touches[0].clientY, J.value = h.value, e.preventDefault());
-    }
-    function qe(e) {
-      if (!f.value || !F.value) return;
-      const a = e.touches[0].clientY - q.value;
-      h.value = J.value + a, e.preventDefault();
-    }
-    function Ve(e) {
-      if (!f.value || !F.value) return;
-      F.value = !1;
-      const a = h.value - J.value;
-      Math.abs(a) > 100 ? a > 0 && B.value ? _e() : a < 0 && O.value ? Ue() : ue() : ue(), e.preventDefault();
-    }
-    function Ye(e) {
-      f.value && (F.value = !0, q.value = e.clientY, J.value = h.value, e.preventDefault());
+    const oe = Xe(async () => {
+      x.value || await Y();
+    }, 200), Ae = Xe(gt, 200);
+    function We() {
+      K.handleWindowResize();
     }
-    function He(e) {
-      if (!f.value || !F.value) return;
-      const a = e.clientY - q.value;
-      h.value = J.value + a, e.preventDefault();
-    }
-    function Ne(e) {
-      if (!f.value || !F.value) return;
-      F.value = !1;
-      const a = h.value - J.value;
-      Math.abs(a) > 100 ? a > 0 && B.value ? _e() : a < 0 && O.value ? Ue() : ue() : ue(), e.preventDefault();
+    function Re(c, H, N) {
+      v.value = H, d.value = [H], d.value.push(N), E.value = N == null, k(c, "init"), x.value ? (s.value = [...s.value, ...c], se.value === 0 && s.value.length > 0 && (ve.value = 0)) : (u([...s.value, ...c]), t.value && (F.value = t.value.scrollTop, D.value = t.value.clientHeight || window.innerHeight), q(() => {
+        t.value && (F.value = t.value.scrollTop, D.value = t.value.clientHeight || window.innerHeight, B());
+      }));
     }
-    function Ue() {
-      if (!O.value) {
-        ge();
+    async function Oe(c, H, N) {
+      if (!n.skipInitialLoad) {
+        Re(c, H, N);
         return;
       }
-      n.value++, ue(), n.value >= l.value.length - 5 && ge();
-    }
-    function _e() {
-      B.value && (n.value--, ue());
-    }
-    function ue() {
-      if (!U.value) return;
-      const e = U.value.clientHeight;
-      h.value = -n.value * e;
+      v.value = H, d.value = [H], N != null && d.value.push(N), E.value = N == null, f.value = null, k(c, "restoreItems"), x.value ? (s.value = c, se.value === 0 && s.value.length > 0 && (ve.value = 0)) : (u(c), t.value && (F.value = t.value.scrollTop, D.value = t.value.clientHeight || window.innerHeight), await q(), t.value && (F.value = t.value.scrollTop, D.value = t.value.clientHeight || window.innerHeight, B()));
     }
-    function Xe() {
-      !f.value && n.value > 0 && (n.value = 0, h.value = 0), f.value && l.value.length === 0 && !p.value && Pe(b.value[0]), f.value && ue();
-    }
-    function Pt(e, a, r) {
-      H.value = a, b.value = [a], b.value.push(r), x.value = r == null, fe(e, "init"), f.value ? (l.value = [...l.value, ...e], n.value === 0 && l.value.length > 0 && (h.value = 0)) : (ee([...l.value, ...e]), le());
-    }
-    return ce(
-      w,
+    return te(
+      h,
       () => {
-        f.value || g.value && ($.value = pe(w.value, v.value), ee(l.value));
+        x.value || t.value && (g.value = ue(h.value, i.value), u(s.value));
       },
       { deep: !0 }
-    ), ce(() => o.layoutMode, () => {
-      L.value && L.value.width !== void 0 ? v.value = L.value.width : y.value && (v.value = y.value.clientWidth);
-    }), ce(g, (e) => {
-      e && !f.value ? (e.removeEventListener("scroll", me), e.addEventListener("scroll", me, { passive: !0 })) : e && e.removeEventListener("scroll", me);
-    }, { immediate: !0 }), ce(f, (e, a) => {
-      a === void 0 && e === !1 || G(() => {
-        e ? (document.addEventListener("mousemove", He), document.addEventListener("mouseup", Ne), g.value && g.value.removeEventListener("scroll", me), n.value = 0, h.value = 0, l.value.length > 0 && ue()) : (document.removeEventListener("mousemove", He), document.removeEventListener("mouseup", Ne), g.value && y.value && (L.value && L.value.width !== void 0 ? v.value = L.value.width : v.value = y.value.clientWidth, g.value.removeEventListener("scroll", me), g.value.addEventListener("scroll", me, { passive: !0 }), l.value.length > 0 && ($.value = pe(w.value, v.value), ee(l.value), P.value = g.value.scrollTop, C.value = g.value.clientHeight, le())));
+    ), te(() => n.layoutMode, () => {
+      b.value && b.value.width !== void 0 ? i.value = b.value.width : m.value && (i.value = m.value.clientWidth);
+    }), te(t, (c) => {
+      c && !x.value ? (c.removeEventListener("scroll", oe), c.addEventListener("scroll", oe, { passive: !0 })) : c && c.removeEventListener("scroll", oe);
+    }, { immediate: !0 }), te(x, (c, H) => {
+      H === void 0 && c === !1 || q(() => {
+        c ? (document.addEventListener("mousemove", Te), document.addEventListener("mouseup", Ee), t.value && t.value.removeEventListener("scroll", oe), se.value = 0, ve.value = 0, s.value.length > 0 && Ie()) : (document.removeEventListener("mousemove", Te), document.removeEventListener("mouseup", Ee), t.value && m.value && (b.value && b.value.width !== void 0 ? i.value = b.value.width : i.value = m.value.clientWidth, t.value.removeEventListener("scroll", oe), t.value.addEventListener("scroll", oe, { passive: !0 }), s.value.length > 0 && (g.value = ue(h.value, i.value), u(s.value), F.value = t.value.scrollTop, D.value = t.value.clientHeight, B())));
       });
-    }, { immediate: !0 }), ce(U, (e) => {
-      e && (e.addEventListener("touchstart", Ce, { passive: !1 }), e.addEventListener("touchmove", qe, { passive: !1 }), e.addEventListener("touchend", Ve), e.addEventListener("mousedown", Ye));
-    }), ce(() => l.value.length, (e, a) => {
-      f.value && e > 0 && a === 0 && (n.value = 0, G(() => ue()));
-    }), ce(y, (e) => {
-      i && (i.disconnect(), i = null), e && typeof ResizeObserver < "u" ? (i = new ResizeObserver((a) => {
-        if (!L.value)
-          for (const r of a) {
-            const d = r.contentRect.width, s = r.contentRect.height;
-            v.value !== d && (v.value = d), I.value !== s && (I.value = s);
+    }, { immediate: !0 }), te(le, (c) => {
+      c && (c.addEventListener("touchstart", ze, { passive: !1 }), c.addEventListener("touchmove", Be, { passive: !1 }), c.addEventListener("touchend", Ne), c.addEventListener("mousedown", Fe));
+    }), te(() => s.value.length, (c, H) => {
+      x.value && c > 0 && H === 0 && (se.value = 0, q(() => Ie()));
+    }), te(m, (c) => {
+      a && (a.disconnect(), a = null), c && typeof ResizeObserver < "u" ? (a = new ResizeObserver((H) => {
+        if (!b.value)
+          for (const N of H) {
+            const ae = N.contentRect.width, A = N.contentRect.height;
+            i.value !== ae && (i.value = ae), w.value !== A && (w.value = A);
           }
-      }), i.observe(e), L.value || (v.value = e.clientWidth, I.value = e.clientHeight)) : e && (L.value || (v.value = e.clientWidth, I.value = e.clientHeight));
-    }, { immediate: !0 }), ce(v, (e, a) => {
-      e !== a && e > 0 && !f.value && g.value && l.value.length > 0 && G(() => {
-        $.value = pe(w.value, e), ee(l.value), le();
+      }), a.observe(c), b.value || (i.value = c.clientWidth, w.value = c.clientHeight)) : c && (b.value || (i.value = c.clientWidth, w.value = c.clientHeight));
+    }, { immediate: !0 }), te(i, (c, H) => {
+      c !== H && c > 0 && !x.value && t.value && s.value.length > 0 && q(() => {
+        g.value = ue(h.value, c), u(s.value), B();
       });
-    }), ot(async () => {
+    }), Ke(async () => {
       try {
-        await G(), y.value && !i && (v.value = y.value.clientWidth, I.value = y.value.clientHeight), f.value || ($.value = pe(w.value, v.value), g.value && (P.value = g.value.scrollTop, C.value = g.value.clientHeight));
-        const e = o.loadAtPage;
-        b.value = [e], o.skipInitialLoad || await Pe(b.value[0]), f.value ? G(() => ue()) : le();
-      } catch (e) {
-        console.error("Error during component initialization:", e), p.value = !1;
+        await q(), m.value && !a && (i.value = m.value.clientWidth, w.value = m.value.clientHeight), x.value || (g.value = ue(h.value, i.value), t.value && (F.value = t.value.scrollTop, D.value = t.value.clientHeight));
+        const c = n.loadAtPage;
+        if (d.value = [c], !n.skipInitialLoad)
+          await be(d.value[0]);
+        else if (n.items && n.items.length > 0) {
+          const H = n.items[0], N = n.items[n.items.length - 1], ae = (H == null ? void 0 : H.page) ?? c ?? 1, A = (N == null ? void 0 : N.next) ?? null;
+          await Oe(n.items, ae, A);
+        } else
+          v.value = c, d.value = [c];
+        x.value ? q(() => Ie()) : B();
+      } catch (c) {
+        f.value || (console.error("Error during component initialization:", c), f.value = he(c)), T.value = !1;
       }
-      window.addEventListener("resize", je), window.addEventListener("resize", Xe);
-    }), it(() => {
-      var e;
-      i && (i.disconnect(), i = null), (e = g.value) == null || e.removeEventListener("scroll", me), window.removeEventListener("resize", je), window.removeEventListener("resize", Xe), U.value && (U.value.removeEventListener("touchstart", Ce), U.value.removeEventListener("touchmove", qe), U.value.removeEventListener("touchend", Ve), U.value.removeEventListener("mousedown", Ye)), document.removeEventListener("mousemove", He), document.removeEventListener("mouseup", Ne);
-    }), (e, a) => (j(), R("div", {
+      window.addEventListener("resize", Ae), window.addEventListener("resize", We);
+    }), Qe(() => {
+      var c;
+      a && (a.disconnect(), a = null), (c = t.value) == null || c.removeEventListener("scroll", oe), window.removeEventListener("resize", Ae), window.removeEventListener("resize", We), le.value && (le.value.removeEventListener("touchstart", ze), le.value.removeEventListener("touchmove", Be), le.value.removeEventListener("touchend", Ne), le.value.removeEventListener("mousedown", Fe)), document.removeEventListener("mousemove", Te), document.removeEventListener("mouseup", Ee);
+    }), (c, H) => (O(), R("div", {
       ref_key: "wrapper",
-      ref: y,
+      ref: m,
       class: "w-full h-full flex flex-col relative"
     }, [
-      f.value ? (j(), R("div", {
+      x.value ? (O(), R("div", {
         key: 0,
-        class: he(["overflow-hidden w-full flex-1 swipe-container touch-none select-none", { "force-motion": o.forceMotion, "cursor-grab": !F.value, "cursor-grabbing": F.value }]),
+        class: re(["overflow-hidden w-full flex-1 swipe-container touch-none select-none", { "force-motion": n.forceMotion, "cursor-grab": !U(ye), "cursor-grabbing": U(ye) }]),
         ref_key: "swipeContainer",
-        ref: U,
+        ref: le,
         style: { height: "100%", "max-height": "100%", position: "relative" }
       }, [
         V("div", {
           class: "relative w-full",
-          style: Ee({
-            transform: `translateY(${h.value}px)`,
-            transition: F.value ? "none" : `transform ${t.transitionDurationMs}ms ${t.transitionEasing}`,
-            height: `${l.value.length * 100}%`
+          style: ge({
+            transform: `translateY(${U(ve)}px)`,
+            transition: U(ye) ? "none" : `transform ${e.transitionDurationMs}ms ${e.transitionEasing}`,
+            height: `${s.value.length * 100}%`
           })
         }, [
-          (j(!0), R(Ke, null, Qe(l.value, (r, d) => (j(), R("div", {
-            key: `${r.page}-${r.id}`,
+          (O(!0), R(je, null, Ve(s.value, (N, ae) => (O(), R("div", {
+            key: `${N.page}-${N.id}`,
             class: "absolute top-0 left-0 w-full",
-            style: Ee({
-              top: `${d * (100 / l.value.length)}%`,
-              height: `${100 / l.value.length}%`
+            style: ge({
+              top: `${ae * (100 / s.value.length)}%`,
+              height: `${100 / s.value.length}%`
             })
           }, [
-            V("div", wa, [
-              V("div", xa, [
-                ae(e.$slots, "default", {
-                  item: r,
-                  remove: ye,
-                  index: r.originalIndex ?? o.items.indexOf(r)
+            V("div", da, [
+              V("div", ma, [
+                _(c.$slots, "default", {
+                  item: N,
+                  remove: U(ce),
+                  index: N.originalIndex ?? s.value.indexOf(N)
                 }, () => [
-                  Fe(ke, {
-                    item: r,
-                    remove: ye,
-                    "header-height": w.value.header,
-                    "footer-height": w.value.footer,
+                  ke(xe, {
+                    item: N,
+                    remove: U(ce),
+                    "header-height": h.value.header,
+                    "footer-height": h.value.footer,
                     "in-swipe-mode": !0,
-                    "is-active": d === n.value,
-                    "onPreload:success": a[0] || (a[0] = (s) => m("item:preload:success", s)),
-                    "onPreload:error": a[1] || (a[1] = (s) => m("item:preload:error", s)),
-                    onMouseEnter: a[2] || (a[2] = (s) => m("item:mouse-enter", s)),
-                    onMouseLeave: a[3] || (a[3] = (s) => m("item:mouse-leave", s))
+                    "is-active": ae === U(se),
+                    "onPreload:success": H[0] || (H[0] = (A) => M("item:preload:success", A)),
+                    "onPreload:error": H[1] || (H[1] = (A) => M("item:preload:error", A)),
+                    onMouseEnter: H[2] || (H[2] = (A) => M("item:mouse-enter", A)),
+                    onMouseLeave: H[3] || (H[3] = (A) => M("item:mouse-leave", A))
                   }, {
-                    header: xe((s) => [
-                      ae(e.$slots, "item-header", be({ ref_for: !0 }, s), void 0, !0)
+                    header: fe((A) => [
+                      _(c.$slots, "item-header", de({ ref_for: !0 }, A), void 0, !0)
                     ]),
-                    footer: xe((s) => [
-                      ae(e.$slots, "item-footer", be({ ref_for: !0 }, s), void 0, !0)
+                    footer: fe((A) => [
+                      _(c.$slots, "item-footer", de({ ref_for: !0 }, A), void 0, !0)
                     ]),
                     _: 2
-                  }, 1032, ["item", "header-height", "footer-height", "is-active"])
+                  }, 1032, ["item", "remove", "header-height", "footer-height", "is-active"])
                 ], !0)
               ])
             ])
           ], 4))), 128))
         ], 4),
-        x.value && l.value.length > 0 ? (j(), R("div", ba, [
-          ae(e.$slots, "end-message", {}, () => [
-            a[8] || (a[8] = V("p", { class: "text-gray-500 dark:text-gray-400" }, "You've reached the end", -1))
+        E.value && s.value.length > 0 ? (O(), R("div", ha, [
+          _(c.$slots, "end-message", {}, () => [
+            H[8] || (H[8] = V("p", { class: "text-gray-500 dark:text-gray-400" }, "You've reached the end", -1))
           ], !0)
-        ])) : se("", !0),
-        E.value && l.value.length > 0 ? (j(), R("div", Ma, [
-          ae(e.$slots, "error-message", { error: E.value }, () => [
-            V("p", Ea, "Failed to load content: " + Ae(E.value.message), 1)
+        ])) : ee("", !0),
+        f.value && s.value.length > 0 ? (O(), R("div", ga, [
+          _(c.$slots, "error-message", { error: f.value }, () => [
+            V("p", pa, "Failed to load content: " + He(f.value.message), 1)
           ], !0)
-        ])) : se("", !0)
-      ], 2)) : (j(), R("div", {
+        ])) : ee("", !0)
+      ], 2)) : (O(), R("div", {
         key: 1,
-        class: he(["overflow-auto w-full flex-1 masonry-container", { "force-motion": o.forceMotion }]),
+        class: re(["overflow-auto w-full flex-1 masonry-container", { "force-motion": n.forceMotion }]),
         ref_key: "container",
-        ref: g
+        ref: t
       }, [
         V("div", {
           class: "relative",
-          style: Ee({ height: `${W.value}px`, "--masonry-duration": `${t.transitionDurationMs}ms`, "--masonry-leave-duration": `${t.leaveDurationMs}ms`, "--masonry-ease": t.transitionEasing })
+          style: ge({ height: `${S.value}px`, "--masonry-duration": `${e.transitionDurationMs}ms`, "--masonry-leave-duration": `${e.leaveDurationMs}ms`, "--masonry-ease": e.transitionEasing })
         }, [
-          Fe($t, {
+          ke(wt, {
             name: "masonry",
             css: !1,
-            onEnter: dt,
-            onBeforeEnter: mt,
-            onLeave: gt,
-            onBeforeLeave: ht
+            onEnter: U(tt),
+            onBeforeEnter: U(at),
+            onLeave: U(lt),
+            onBeforeLeave: U(nt)
           }, {
-            default: xe(() => [
-              (j(!0), R(Ke, null, Qe(pt.value, (r, d) => (j(), R("div", be({
-                key: `${r.page}-${r.id}`,
+            default: fe(() => [
+              (O(!0), R(je, null, Ve(U(X), (N, ae) => (O(), R("div", de({
+                key: `${N.page}-${N.id}`,
                 class: "absolute masonry-item",
                 ref_for: !0
-              }, Ht(ia)(r, d)), [
-                ae(e.$slots, "default", {
-                  item: r,
-                  remove: ye,
-                  index: r.originalIndex ?? t.items.indexOf(r)
+              }, U(Gt)(N, ae)), [
+                _(c.$slots, "default", {
+                  item: N,
+                  remove: U(ce),
+                  index: N.originalIndex ?? s.value.indexOf(N)
                 }, () => [
-                  Fe(ke, {
-                    item: r,
-                    remove: ye,
-                    "header-height": w.value.header,
-                    "footer-height": w.value.footer,
+                  ke(xe, {
+                    item: N,
+                    remove: U(ce),
+                    "header-height": h.value.header,
+                    "footer-height": h.value.footer,
                     "in-swipe-mode": !1,
                     "is-active": !1,
-                    "onPreload:success": a[4] || (a[4] = (s) => m("item:preload:success", s)),
-                    "onPreload:error": a[5] || (a[5] = (s) => m("item:preload:error", s)),
-                    onMouseEnter: a[6] || (a[6] = (s) => m("item:mouse-enter", s)),
-                    onMouseLeave: a[7] || (a[7] = (s) => m("item:mouse-leave", s))
+                    "onPreload:success": H[4] || (H[4] = (A) => M("item:preload:success", A)),
+                    "onPreload:error": H[5] || (H[5] = (A) => M("item:preload:error", A)),
+                    onMouseEnter: H[6] || (H[6] = (A) => M("item:mouse-enter", A)),
+                    onMouseLeave: H[7] || (H[7] = (A) => M("item:mouse-leave", A))
                   }, {
-                    header: xe((s) => [
-                      ae(e.$slots, "item-header", be({ ref_for: !0 }, s), void 0, !0)
+                    header: fe((A) => [
+                      _(c.$slots, "item-header", de({ ref_for: !0 }, A), void 0, !0)
                     ]),
-                    footer: xe((s) => [
-                      ae(e.$slots, "item-footer", be({ ref_for: !0 }, s), void 0, !0)
+                    footer: fe((A) => [
+                      _(c.$slots, "item-footer", de({ ref_for: !0 }, A), void 0, !0)
                     ]),
                     _: 2
-                  }, 1032, ["item", "header-height", "footer-height"])
+                  }, 1032, ["item", "remove", "header-height", "footer-height"])
                 ], !0)
               ], 16))), 128))
             ]),
             _: 3
-          })
+          }, 8, ["onEnter", "onBeforeEnter", "onLeave", "onBeforeLeave"])
         ], 4),
-        x.value && l.value.length > 0 ? (j(), R("div", Ta, [
-          ae(e.$slots, "end-message", {}, () => [
-            a[9] || (a[9] = V("p", { class: "text-gray-500 dark:text-gray-400" }, "You've reached the end", -1))
+        E.value && s.value.length > 0 ? (O(), R("div", ya, [
+          _(c.$slots, "end-message", {}, () => [
+            H[9] || (H[9] = V("p", { class: "text-gray-500 dark:text-gray-400" }, "You've reached the end", -1))
           ], !0)
-        ])) : se("", !0),
-        E.value && l.value.length > 0 ? (j(), R("div", Ia, [
-          ae(e.$slots, "error-message", { error: E.value }, () => [
-            V("p", ka, "Failed to load content: " + Ae(E.value.message), 1)
+        ])) : ee("", !0),
+        f.value && s.value.length > 0 ? (O(), R("div", wa, [
+          _(c.$slots, "error-message", { error: f.value }, () => [
+            V("p", xa, "Failed to load content: " + He(f.value.message), 1)
           ], !0)
-        ])) : se("", !0)
+        ])) : ee("", !0)
       ], 2))
     ], 512));
   }
-}), Pa = (t, c) => {
-  const u = t.__vccOpts || t;
-  for (const [o, T] of c)
-    u[o] = T;
-  return u;
-}, lt = /* @__PURE__ */ Pa(La, [["__scopeId", "data-v-c8dcbdca"]]), $a = {
-  install(t) {
-    t.component("WyxosMasonry", lt), t.component("WMasonry", lt), t.component("WyxosMasonryItem", ke), t.component("WMasonryItem", ke);
+}), Ma = (e, l) => {
+  const r = e.__vccOpts || e;
+  for (const [n, y] of l)
+    r[n] = y;
+  return r;
+}, Ge = /* @__PURE__ */ Ma(ba, [["__scopeId", "data-v-9de56a55"]]), Ea = {
+  install(e) {
+    e.component("WyxosMasonry", Ge), e.component("WMasonry", Ge), e.component("WyxosMasonryItem", xe), e.component("WMasonryItem", xe);
   }
 };
 export {
-  lt as Masonry,
-  ke as MasonryItem,
-  $a as default
+  Ge as Masonry,
+  xe as MasonryItem,
+  Ea as default
 };