@wyxos/vibe 1.6.23 → 1.6.24

package/lib/index.js

@@ -1,15 +1,15 @@
-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;
+import { nextTick as q, ref as D, computed as Q, defineComponent as Ke, onMounted as Qe, onUnmounted as Ze, watch as ee, createElementBlock as R, openBlock as O, createCommentVNode as te, createElementVNode as V, normalizeStyle as ge, renderSlot as _, normalizeClass as re, withModifiers as je, toDisplayString as $e, unref as U, Fragment as Ve, renderList as qe, createVNode as Pe, withCtx as fe, mergeProps as de, TransitionGroup as xt } from "vue";
+let Se = null;
+function bt() {
+  if (Se != null) return Se;
   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;
+  return document.body.removeChild(e), Se = r, r;
 }
-function qe(e, l, r, n = {}) {
+function Ye(e, l, r, t = {}) {
   const {
     gutterX: y = 0,
     gutterY: h = 0,
@@ -17,7 +17,7 @@ function qe(e, l, r, n = {}) {
     footer: i = 0,
     paddingLeft: w = 0,
     paddingRight: b = 0,
-    sizes: a = {
+    sizes: n = {
       base: 1,
       sm: 2,
       md: 3,
@@ -26,7 +26,7 @@ function qe(e, l, r, n = {}) {
       "2xl": 6
     },
     placement: p = "masonry"
-  } = n;
+  } = t;
   let x = 0, M = 0;
   try {
     if (l && l.nodeType === 1 && typeof window < "u" && window.getComputedStyle) {
@@ -35,54 +35,54 @@ function qe(e, l, r, n = {}) {
     }
   } catch {
   }
-  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 s = (w || 0) + x, g = (b || 0) + M, a = l.offsetWidth - l.clientWidth, d = a > 0 ? a + 2 : bt() + 2, v = l.offsetWidth - d - s - g, T = y * (r - 1), P = Math.floor((v - T) / r), I = e.map((L) => {
     const k = L.width, W = L.height;
-    return Math.round(S * W / k) + i + m;
+    return Math.round(P * W / k) + i + m;
   });
   if (p === "sequential-balanced") {
-    const L = E.length;
+    const L = I.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) => {
+    const k = (z, Y, G) => z + (Y > 0 ? h : 0) + G;
+    let W = Math.max(...I), o = I.reduce((z, Y) => z + Y, 0) + h * Math.max(0, L - 1);
+    const u = (z) => {
       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)
+        const ie = I[J], Z = k(G, ne, ie);
+        if (Z <= z)
           G = Z, ne++;
-        else if (Y++, G = ie, ne = 1, ie > B || Y > r) return !1;
+        else if (Y++, G = ie, ne = 1, ie > z || Y > r) return !1;
       }
       return Y <= r;
     };
     for (; W < o; ) {
-      const B = Math.floor((W + o) / 2);
-      u(B) ? o = B : W = B + 1;
+      const z = Math.floor((W + o) / 2);
+      u(z) ? o = z : W = z + 1;
     }
-    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++);
+    const E = o, $ = new Array(r).fill(0);
+    let C = r - 1, F = 0, N = 0;
+    for (let z = L - 1; z >= 0; z--) {
+      const Y = I[z], G = z < C;
+      !(k(F, N, Y) <= E) || G ? ($[C] = z + 1, C--, F = Y, N = 1) : (F = k(F, N, Y), N++);
     }
     $[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 z = 0; z < r; z++) {
+      const Y = $[z], G = z + 1 < r ? $[z + 1] : L, ne = z * (P + y);
       for (let J = Y; J < G; J++) {
         const Z = {
           ...e[J],
-          columnWidth: S,
+          columnWidth: P,
           imageHeight: 0,
           columnHeight: 0,
           left: 0,
           top: 0
         };
-        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);
+        Z.imageHeight = I[J] - (i + m), Z.columnHeight = I[J], Z.left = ne, Z.top = X[z], X[z] += Z.columnHeight + (J + 1 < G ? h : 0), j.push(Z);
       }
     }
     return j;
   }
-  const f = new Array(r).fill(0), P = [];
+  const f = new Array(r).fill(0), H = [];
   for (let L = 0; L < e.length; L++) {
     const k = e[L], W = {
       ...k,
@@ -91,108 +91,108 @@ function qe(e, l, r, n = {}) {
       columnHeight: 0,
       left: 0,
       top: 0
-    }, 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);
+    }, o = f.indexOf(Math.min(...f)), u = k.width, E = k.height;
+    W.columnWidth = P, W.left = o * (P + y), W.imageHeight = Math.round(P * E / u), W.columnHeight = W.imageHeight + i + m, W.top = f[o], f[o] += W.columnHeight + h, H.push(W);
   }
-  return P;
+  return H;
 }
-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];
+var Mt = typeof global == "object" && global && global.Object === Object && global, Tt = typeof self == "object" && self && self.Object === Object && self, et = Mt || Tt || Function("return this")(), xe = et.Symbol, tt = Object.prototype, It = tt.hasOwnProperty, Et = tt.toString, me = xe ? xe.toStringTag : void 0;
+function kt(e) {
+  var l = It.call(e, me), r = e[me];
   try {
     e[me] = void 0;
-    var n = !0;
+    var t = !0;
   } catch {
   }
   var y = Et.call(e);
-  return n && (l ? e[me] = r : delete e[me]), y;
+  return t && (l ? e[me] = r : delete e[me]), y;
 }
-var kt = Object.prototype, Lt = kt.toString;
+var Lt = Object.prototype, Pt = Lt.toString;
 function St(e) {
-  return Lt.call(e);
+  return Pt.call(e);
 }
-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);
+var Ht = "[object Null]", $t = "[object Undefined]", Ue = xe ? xe.toStringTag : void 0;
+function Nt(e) {
+  return e == null ? e === void 0 ? $t : Ht : Ue && Ue in Object(e) ? kt(e) : St(e);
 }
 function Dt(e) {
   return e != null && typeof e == "object";
 }
 var zt = "[object Symbol]";
 function Bt(e) {
-  return typeof e == "symbol" || Dt(e) && $t(e) == zt;
+  return typeof e == "symbol" || Dt(e) && Nt(e) == zt;
 }
-var Nt = /\s/;
-function Ft(e) {
-  for (var l = e.length; l-- && Nt.test(e.charAt(l)); )
+var Ft = /\s/;
+function At(e) {
+  for (var l = e.length; l-- && Ft.test(e.charAt(l)); )
     ;
   return l;
 }
-var At = /^\s+/;
-function Wt(e) {
-  return e && e.slice(0, Ft(e) + 1).replace(At, "");
+var Wt = /^\s+/;
+function Rt(e) {
+  return e && e.slice(0, At(e) + 1).replace(Wt, "");
 }
-function Pe(e) {
+function Ne(e) {
   var l = typeof e;
   return e != null && (l == "object" || l == "function");
 }
-var Ue = NaN, Rt = /^[-+]0x[0-9a-f]+$/i, Ot = /^0b[01]+$/i, Ct = /^0o[0-7]+$/i, jt = parseInt;
-function _e(e) {
+var _e = NaN, Ot = /^[-+]0x[0-9a-f]+$/i, Ct = /^0b[01]+$/i, jt = /^0o[0-7]+$/i, Vt = parseInt;
+function Xe(e) {
   if (typeof e == "number")
     return e;
   if (Bt(e))
-    return Ue;
-  if (Pe(e)) {
+    return _e;
+  if (Ne(e)) {
     var l = typeof e.valueOf == "function" ? e.valueOf() : e;
-    e = Pe(l) ? l + "" : l;
+    e = Ne(l) ? l + "" : l;
   }
   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;
+  e = Rt(e);
+  var r = Ct.test(e);
+  return r || jt.test(e) ? Vt(e.slice(2), r ? 2 : 8) : Ot.test(e) ? _e : +e;
 }
-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;
+var He = function() {
+  return et.Date.now();
+}, qt = "Expected a function", Yt = Math.max, Ut = Math.min;
+function Ge(e, l, r) {
+  var t, y, h, m, i, w, b = 0, n = !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);
+    throw new TypeError(qt);
+  l = Xe(l) || 0, Ne(r) && (n = !!r.leading, p = "maxWait" in r, h = p ? Yt(Xe(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;
+    var H = t, L = y;
+    return t = y = void 0, b = f, m = e.apply(L, H), m;
   }
   function s(f) {
-    return b = f, i = setTimeout(d, l), a ? M(f) : m;
+    return b = f, i = setTimeout(d, l), n ? M(f) : m;
   }
   function g(f) {
-    var P = f - w, L = f - b, k = l - P;
-    return p ? Yt(k, h - L) : k;
+    var H = f - w, L = f - b, k = l - H;
+    return p ? Ut(k, h - L) : k;
   }
-  function t(f) {
-    var P = f - w, L = f - b;
-    return w === void 0 || P >= l || P < 0 || p && L >= h;
+  function a(f) {
+    var H = f - w, L = f - b;
+    return w === void 0 || H >= l || H < 0 || p && L >= h;
   }
   function d() {
-    var f = Se();
-    if (t(f))
+    var f = He();
+    if (a(f))
       return v(f);
     i = setTimeout(d, g(f));
   }
   function v(f) {
-    return i = void 0, x && n ? M(f) : (n = y = void 0, m);
+    return i = void 0, x && t ? M(f) : (t = y = void 0, m);
   }
   function T() {
-    i !== void 0 && clearTimeout(i), b = 0, n = w = y = i = void 0;
+    i !== void 0 && clearTimeout(i), b = 0, t = w = y = i = void 0;
   }
-  function S() {
-    return i === void 0 ? m : v(Se());
+  function P() {
+    return i === void 0 ? m : v(He());
   }
-  function E() {
-    var f = Se(), P = t(f);
-    if (n = arguments, y = this, w = f, P) {
+  function I() {
+    var f = He(), H = a(f);
+    if (t = arguments, y = this, w = f, H) {
       if (i === void 0)
         return s(w);
       if (p)
@@ -200,20 +200,20 @@ function Xe(e, l, r) {
     }
     return i === void 0 && (i = setTimeout(d, l)), m;
   }
-  return E.cancel = T, E.flush = S, E;
+  return I.cancel = T, I.flush = P, I;
 }
 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;
+  const r = l ?? (typeof window < "u" ? window.innerWidth : 1024), t = e.sizes;
+  return r >= 1536 && t["2xl"] ? t["2xl"] : r >= 1280 && t.xl ? t.xl : r >= 1024 && t.lg ? t.lg : r >= 768 && t.md ? t.md : r >= 640 && t.sm ? t.sm : t.base;
 }
-function Ut(e) {
+function _t(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 _t(e) {
-  return e.reduce((r, n) => Math.max(r, n.top + n.columnHeight), 0) + 500;
-}
 function Xt(e) {
+  return e.reduce((r, t) => Math.max(r, t.top + t.columnHeight), 0) + 500;
+}
+function Gt(e) {
   return {
     transform: `translate3d(${e.left}px, ${e.top}px, 0)`,
     top: "0px",
@@ -222,21 +222,21 @@ function Xt(e) {
     height: `${e.columnHeight}px`
   };
 }
-function Gt(e, l = 0) {
+function Jt(e, l = 0) {
   return {
-    style: Xt(e),
+    style: Gt(e),
     "data-top": e.top,
     "data-left": e.left,
     "data-id": `${e.page}-${e.id}`,
     "data-index": l
   };
 }
-function $e(e, l) {
+function De(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);
+  const t = 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 < t.length; m++) y.set(t[m], m);
+  const h = new Array(t.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));
@@ -244,88 +244,88 @@ function $e(e, l) {
   for (; h.length < l; ) h.push(0);
   return h;
 }
-function Jt(e, l) {
-  let r = 0, n = 0;
+function Kt(e, l) {
+  let r = 0, t = 0;
   const y = 1e3;
-  function h(a, p) {
+  function h(n, 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;
+      const g = x.scrollTop, a = x.clientHeight;
+      r = g - y, t = g + a + y;
     }
-    return a + p >= r && a <= n;
+    return n + p >= r && n <= t;
   }
-  function m(a, p) {
+  function m(n, 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;
+    const x = parseInt(n.dataset.left || "0", 10), M = parseInt(n.dataset.top || "0", 10), s = parseInt(n.dataset.index || "0", 10), g = n.offsetHeight || parseInt(getComputedStyle(n).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();
+      n.style.transition = "none", n.style.opacity = "1", n.style.transform = `translate3d(${x}px, ${M}px, 0) scale(1)`, n.style.removeProperty("--masonry-opacity-delay"), requestAnimationFrame(() => {
+        n.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();
+      n.style.opacity = "1", n.style.transform = `translate3d(${x}px, ${M}px, 0) scale(1)`, n.style.transition = "none", p();
       return;
     }
-    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 a = Math.min(s * 20, 160), d = n.style.getPropertyValue("--masonry-opacity-delay");
+    n.style.setProperty("--masonry-opacity-delay", `${a}ms`), requestAnimationFrame(() => {
+      n.style.opacity = "1", n.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();
+        d ? n.style.setProperty("--masonry-opacity-delay", d) : n.style.removeProperty("--masonry-opacity-delay"), n.removeEventListener("transitionend", T), p();
       };
-      a.addEventListener("transitionend", T);
+      n.addEventListener("transitionend", T);
     });
   }
-  function i(a) {
+  function i(n) {
     var M;
-    const p = parseInt(a.dataset.left || "0", 10), x = parseInt(a.dataset.top || "0", 10);
+    const p = parseInt(n.dataset.left || "0", 10), x = parseInt(n.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");
+      n.style.transition = "none", n.style.opacity = "1", n.style.transform = `translate3d(${p}px, ${x}px, 0) scale(1)`, n.style.removeProperty("--masonry-opacity-delay");
       return;
     }
-    a.style.opacity = "0", a.style.transform = `translate3d(${p}px, ${x + 10}px, 0) scale(0.985)`;
+    n.style.opacity = "0", n.style.transform = `translate3d(${p}px, ${x + 10}px, 0) scale(0.985)`;
   }
-  function w(a) {
+  function w(n) {
     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;
+    const p = parseInt(n.dataset.left || "0", 10), x = parseInt(n.dataset.top || "0", 10), M = n.offsetHeight || parseInt(getComputedStyle(n).height || "200", 10) || 200;
     if (!((s = l == null ? void 0 : l.virtualizing) != null && s.value)) {
       if (!h(x, M)) {
-        a.style.transition = "none";
+        n.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 = "";
+      n.style.transition = "none", n.style.opacity = "1", n.style.transform = `translate3d(${p}px, ${x}px, 0) scale(1)`, n.style.removeProperty("--masonry-opacity-delay"), requestAnimationFrame(() => {
+        n.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) {
+  function b(n, p) {
+    var I;
+    const x = parseInt(n.dataset.left || "0", 10), M = parseInt(n.dataset.top || "0", 10), s = n.offsetHeight || parseInt(getComputedStyle(n).height || "200", 10) || 200;
+    if ((I = l == null ? void 0 : l.virtualizing) != null && I.value) {
       p();
       return;
     }
     if (!h(M, s)) {
-      a.style.transition = "none", a.style.opacity = "0", p();
+      n.style.transition = "none", n.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;
+    let a = Number.isFinite(g) && g > 0 ? g : NaN;
+    if (!Number.isFinite(a)) {
+      const H = getComputedStyle(n).getPropertyValue("--masonry-leave-duration") || "", L = parseFloat(H);
+      a = Number.isFinite(L) && L > 0 ? L : 200;
     }
-    const d = a.style.transitionDuration, v = () => {
-      a.removeEventListener("transitionend", T), clearTimeout(S), a.style.transitionDuration = d || "";
+    const d = n.style.transitionDuration, v = () => {
+      n.removeEventListener("transitionend", T), clearTimeout(P), n.style.transitionDuration = d || "";
     }, T = (f) => {
-      (!f || f.target === a) && (v(), p());
-    }, S = setTimeout(() => {
+      (!f || f.target === n) && (v(), p());
+    }, P = setTimeout(() => {
       v(), p();
-    }, t + 100);
+    }, a + 100);
     requestAnimationFrame(() => {
-      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);
+      n.style.transitionDuration = `${a}ms`, n.style.opacity = "0", n.style.transform = `translate3d(${x}px, ${M + 10}px, 0) scale(0.985)`, n.addEventListener("transitionend", T);
     });
   }
   return {
@@ -335,11 +335,11 @@ function Jt(e, l) {
     onLeave: b
   };
 }
-function Kt({
+function Qt({
   container: e,
   masonry: l,
   columns: r,
-  containerHeight: n,
+  containerHeight: t,
   isLoading: y,
   pageSize: h,
   refreshLayout: m,
@@ -347,13 +347,13 @@ function Kt({
   loadNext: w,
   loadThresholdPx: b
 }) {
-  let a = 0;
+  let n = 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 M = x ?? De(l.value, r.value), s = M.length ? Math.max(...M) : 0, g = e.value.scrollTop + e.value.clientHeight, a = e.value.scrollTop > n + 1;
+    n = 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) {
+    if (g >= v && a && !y.value) {
       await w(), await q();
       return;
     }
@@ -362,8 +362,8 @@ function Kt({
     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(() => {
+function Zt(e) {
+  const { useSwipeMode: l, masonry: r, isLoading: t, loadNext: y, loadPage: h, paginationHistory: m } = e, i = D(0), w = D(0), b = D(!1), n = D(0), p = D(0), x = D(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;
@@ -376,7 +376,7 @@ function Qt(e) {
     const o = i.value - 1;
     return o < 0 ? null : r.value[o] || null;
   });
-  function t() {
+  function a() {
     if (!x.value) return;
     const o = x.value.clientHeight;
     w.value = -i.value * o;
@@ -386,41 +386,41 @@ function Qt(e) {
       y();
       return;
     }
-    i.value++, t(), i.value >= r.value.length - 5 && y();
+    i.value++, a(), i.value >= r.value.length - 5 && y();
   }
   function v() {
-    g.value && (i.value--, t());
+    g.value && (i.value--, a());
   }
   function T(o) {
-    l.value && (b.value = !0, a.value = o.touches[0].clientY, p.value = w.value, o.preventDefault());
+    l.value && (b.value = !0, n.value = o.touches[0].clientY, p.value = w.value, o.preventDefault());
   }
-  function S(o) {
+  function P(o) {
     if (!l.value || !b.value) return;
-    const u = o.touches[0].clientY - a.value;
+    const u = o.touches[0].clientY - n.value;
     w.value = p.value + u, o.preventDefault();
   }
-  function E(o) {
+  function I(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();
+    Math.abs(u) > 100 ? u > 0 && g.value ? v() : u < 0 && s.value ? d() : a() : a(), o.preventDefault();
   }
   function f(o) {
-    l.value && (b.value = !0, a.value = o.clientY, p.value = w.value, o.preventDefault());
+    l.value && (b.value = !0, n.value = o.clientY, p.value = w.value, o.preventDefault());
   }
-  function P(o) {
+  function H(o) {
     if (!l.value || !b.value) return;
-    const u = o.clientY - a.value;
+    const u = o.clientY - n.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();
+    Math.abs(u) > 100 ? u > 0 && g.value ? v() : u < 0 && s.value ? d() : a() : a(), 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();
+    !l.value && i.value > 0 && (i.value = 0, w.value = 0), l.value && r.value.length === 0 && !t.value && h(m.value[0]), l.value && a();
   }
   function W() {
     i.value = 0, w.value = 0, b.value = !1;
@@ -437,14 +437,14 @@ function Qt(e) {
     previousItem: g,
     // Functions
     handleTouchStart: T,
-    handleTouchMove: S,
-    handleTouchEnd: E,
+    handleTouchMove: P,
+    handleTouchEnd: I,
     handleMouseDown: f,
-    handleMouseMove: P,
+    handleMouseMove: H,
     handleMouseUp: L,
     goToNextItem: d,
     goToPreviousItem: v,
-    snapToCurrentItem: t,
+    snapToCurrentItem: a,
     handleWindowResize: k,
     reset: W
   };
@@ -452,67 +452,67 @@ function Qt(e) {
 function he(e) {
   return e instanceof Error ? e : new Error(String(e));
 }
-function Zt(e) {
+function ea(e) {
   const {
     getNextPage: l,
     masonry: r,
-    isLoading: n,
+    isLoading: t,
     hasReachedEnd: y,
     loadError: h,
     currentPage: m,
     paginationHistory: i,
     refreshLayout: w,
     retryMaxAttempts: b,
-    retryInitialDelayMs: a,
+    retryInitialDelayMs: n,
     retryBackoffStepMs: p,
     backfillEnabled: x,
     backfillDelayMs: M,
     backfillMaxCalls: s,
     pageSize: g,
-    autoRefreshOnEmpty: t,
+    autoRefreshOnEmpty: a,
     emits: d
-  } = e, v = z(!1);
+  } = e, v = D(!1);
   let T = !1;
-  function S(u, I) {
+  function P(u, E) {
     return new Promise(($) => {
       const C = Math.max(0, u | 0), F = Date.now();
-      I(C, C);
-      const D = setInterval(() => {
+      E(C, C);
+      const N = setInterval(() => {
         if (v.value) {
-          clearInterval(D), $();
+          clearInterval(N), $();
           return;
         }
         const j = Date.now() - F, X = Math.max(0, C - j);
-        I(X, C), X <= 0 && (clearInterval(D), $());
+        E(X, C), X <= 0 && (clearInterval(N), $());
       }, 100);
     });
   }
-  async function E(u) {
-    let I = 0;
+  async function I(u) {
+    let E = 0;
     const $ = b;
-    let C = a;
+    let C = n;
     for (; ; )
       try {
         const F = await u();
-        return I > 0 && d("retry:stop", { attempt: I, success: !0 }), F;
+        return E > 0 && d("retry:stop", { attempt: E, 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 });
+        if (E++, E > $)
+          throw d("retry:stop", { attempt: E - 1, success: !1 }), F;
+        d("retry:start", { attempt: E, max: $, totalMs: C }), await P(C, (N, j) => {
+          d("retry:tick", { attempt: E, remainingMs: N, 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;
+      const E = await I(() => l(u));
+      return w([...r.value, ...E.items]), E;
+    } catch (E) {
+      throw E;
     }
   }
-  async function P(u, I = !1) {
-    if (!I && !x || T || v.value || y.value) return;
+  async function H(u, E = !1) {
+    if (!E && !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) {
@@ -520,10 +520,10 @@ function Zt(e) {
       return;
     }
     if (!(r.value.length >= $)) {
-      T = !0, n.value = !0;
+      T = !0, t.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) => {
+        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 P(M, (j, X) => {
           d("backfill:tick", {
             fetched: r.value.length,
             target: $,
@@ -532,14 +532,14 @@ function Zt(e) {
             totalMs: X
           });
         }), !(v.value || !T)); ) {
-          const D = i.value[i.value.length - 1];
-          if (D == null) {
+          const N = i.value[i.value.length - 1];
+          if (N == null) {
             y.value = !0;
             break;
           }
           try {
             if (v.value || !T) break;
-            const j = await f(D);
+            const j = await f(N);
             if (v.value || !T) break;
             h.value = null, i.value.push(j.nextPage), j.nextPage == null && (y.value = !0);
           } catch (j) {
@@ -550,48 +550,48 @@ function Zt(e) {
         }
         d("backfill:stop", { fetched: r.value.length, calls: F });
       } finally {
-        T = !1, n.value = !1;
+        T = !1, t.value = !1;
       }
     }
   }
   async function L(u) {
-    if (!n.value) {
-      v.value = !1, n.value = !0, y.value = !1, h.value = null;
+    if (!t.value) {
+      v.value = !1, t.value = !0, y.value = !1, h.value = null;
       try {
-        const I = r.value.length;
+        const E = 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;
+        return v.value ? void 0 : (h.value = null, m.value = u, i.value.push($.nextPage), $.nextPage == null && (y.value = !0), await H(E), $);
+      } catch (E) {
+        throw h.value = he(E), E;
       } finally {
-        n.value = !1;
+        t.value = !1;
       }
     }
   }
   async function k() {
-    if (!n.value && !y.value) {
-      v.value = !1, n.value = !0, h.value = null;
+    if (!t.value && !y.value) {
+      v.value = !1, t.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;
+        const E = i.value[i.value.length - 1];
+        if (E == null) {
+          y.value = !0, t.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), $);
+        const $ = await f(E);
+        return v.value ? void 0 : (h.value = null, m.value = E, i.value.push($.nextPage), $.nextPage == null && (y.value = !0), await H(u), $);
       } catch (u) {
         throw h.value = he(u), u;
       } finally {
-        n.value = !1;
+        t.value = !1;
       }
     }
   }
   async function W() {
-    if (!n.value) {
-      v.value = !1, n.value = !0;
+    if (!t.value) {
+      v.value = !1, t.value = !0;
       try {
         const u = m.value;
         if (u == null) {
@@ -599,36 +599,36 @@ function Zt(e) {
           return;
         }
         r.value = [], y.value = !1, h.value = null, i.value = [u];
-        const I = await f(u);
+        const E = await f(u);
         if (v.value) return;
-        h.value = null, m.value = u, i.value.push(I.nextPage), I.nextPage == null && (y.value = !0);
+        h.value = null, m.value = u, i.value.push(E.nextPage), E.nextPage == null && (y.value = !0);
         const $ = r.value.length;
-        return await P($), I;
+        return await H($), E;
       } catch (u) {
         throw h.value = he(u), u;
       } finally {
-        n.value = !1;
+        t.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 });
+    v.value = !0, t.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,
+    maybeBackfillToTarget: H,
     getContent: f
   };
 }
-function ea(e) {
+function ta(e) {
   const {
     masonry: l,
     useSwipeMode: r,
-    refreshLayout: n,
+    refreshLayout: t,
     refreshCurrentPage: y,
     loadNext: h,
     maybeBackfillToTarget: m,
@@ -636,7 +636,7 @@ function ea(e) {
     paginationHistory: w
   } = e;
   async function b(s) {
-    const g = l.value.filter((t) => t.id !== s.id);
+    const g = l.value.filter((a) => a.id !== s.id);
     if (l.value = g, await q(), g.length === 0 && w.value.length > 0) {
       if (i)
         await y();
@@ -647,14 +647,14 @@ function ea(e) {
         }
       return;
     }
-    await new Promise((t) => requestAnimationFrame(() => t())), requestAnimationFrame(() => {
-      n(g);
+    await new Promise((a) => requestAnimationFrame(() => a())), requestAnimationFrame(() => {
+      t(g);
     });
   }
-  async function a(s) {
+  async function n(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) {
+    const g = new Set(s.map((d) => d.id)), a = l.value.filter((d) => !g.has(d.id));
+    if (l.value = a, await q(), a.length === 0 && w.value.length > 0) {
       if (i)
         await y();
       else
@@ -665,16 +665,16 @@ function ea(e) {
       return;
     }
     await new Promise((d) => requestAnimationFrame(() => d())), requestAnimationFrame(() => {
-      n(t);
+      t(a);
     });
   }
   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);
+    const a = l.value;
+    if (a.findIndex((P) => P.id === s.id) !== -1) return;
+    const v = [...a], T = Math.min(g, v.length);
+    v.splice(T, 0, s), l.value = v, await q(), r.value || (await new Promise((P) => requestAnimationFrame(() => P())), requestAnimationFrame(() => {
+      t(v);
     }));
   }
   async function x(s, g) {
@@ -684,21 +684,21 @@ function ea(e) {
       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 = [];
+    const a = l.value, d = new Set(a.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++;
+    const P = v.length > 0 ? Math.max(...v.map(({ index: k }) => k)) : -1, I = Math.max(a.length - 1, P), f = [];
+    let H = 0;
+    for (let k = 0; k <= I; k++)
+      T.has(k) ? f.push(T.get(k)) : H < a.length && (f.push(a[H]), H++);
+    for (; H < a.length; )
+      f.push(a[H]), H++;
     l.value = f, await q(), r.value || (await new Promise((k) => requestAnimationFrame(() => k())), requestAnimationFrame(() => {
-      n(f);
+      t(f);
     }));
   }
   async function M() {
@@ -706,17 +706,17 @@ function ea(e) {
   }
   return {
     remove: b,
-    removeMany: a,
+    removeMany: n,
     restore: p,
     restoreMany: x,
     removeAll: M
   };
 }
-function ta(e) {
+function aa(e) {
   const {
     masonry: l,
     useSwipeMode: r,
-    container: n,
+    container: t,
     columns: y,
     containerWidth: h,
     masonryContentHeight: m,
@@ -724,56 +724,56 @@ function ta(e) {
     fixedDimensions: w,
     checkItemDimensions: b
   } = e;
-  let a = [];
+  let n = [];
   function p(g) {
-    const t = _t(g);
+    const a = Xt(g);
     let d = 0;
-    if (n.value) {
-      const { scrollTop: v, clientHeight: T } = n.value;
+    if (t.value) {
+      const { scrollTop: v, clientHeight: T } = t.value;
       d = v + T + 100;
     }
-    m.value = Math.max(t, d);
+    m.value = Math.max(a, d);
   }
   function x(g) {
-    var T, S;
+    var T, P;
     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;
+    if (!t.value) return;
+    if (b(g, "refreshLayout"), g.length > 1e3 && n.length > g.length && n.length - g.length < 100) {
+      let I = !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;
+        if (((T = g[f]) == null ? void 0 : T.id) !== ((P = n[f]) == null ? void 0 : P.id)) {
+          I = !1;
           break;
         }
-      if (E) {
-        const f = g.map((P, L) => ({
-          ...a[L],
+      if (I) {
+        const f = g.map((H, L) => ({
+          ...n[L],
           originalIndex: L
         }));
-        p(f), l.value = f, a = f;
+        p(f), l.value = f, n = f;
         return;
       }
     }
-    const d = g.map((E, f) => ({
-      ...E,
+    const d = g.map((I, f) => ({
+      ...I,
       originalIndex: f
-    })), v = n.value;
+    })), v = t.value;
     if (w.value && w.value.width !== void 0) {
-      const E = v.style.width, f = v.style.boxSizing;
+      const I = 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;
+      const H = Ye(d, v, y.value, i.value);
+      v.style.width = I, v.style.boxSizing = f, p(H), l.value = H, n = H;
     } else {
-      const E = qe(d, v, y.value, i.value);
-      p(E), l.value = E, a = E;
+      const I = Ye(d, v, y.value, i.value);
+      p(I), l.value = I, n = I;
     }
   }
-  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 M(g, a) {
+    w.value = g, g && (g.width !== void 0 && (h.value = g.width), !r.value && t.value && l.value.length > 0 && q(() => {
+      y.value = ue(i.value, h.value), x(l.value), a && a();
     }));
   }
   function s() {
@@ -786,28 +786,28 @@ function ta(e) {
     calculateHeight: p
   };
 }
-function aa(e) {
+function na(e) {
   const {
     masonry: l,
     container: r,
-    columns: n,
+    columns: t,
     virtualBufferPx: y,
     loadThresholdPx: h
-  } = e, m = z(e.handleScroll), i = z(0), w = z(0), b = y, a = z(!1), p = z({
+  } = e, m = D(e.handleScroll), i = D(0), w = D(0), b = y, n = D(!1), p = D({
     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")
+    const a = i.value - b, d = i.value + w.value + b, v = l.value;
+    return !v || v.length === 0 ? [] : v.filter((P) => {
+      if (typeof P.top != "number" || typeof P.columnHeight != "number")
         return !0;
-      const E = S.top;
-      return S.top + S.columnHeight >= t && E <= d;
+      const I = P.top;
+      return P.top + P.columnHeight >= a && I <= d;
     });
   });
-  function M(t) {
+  function M(a) {
     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;
+    const { scrollTop: d, clientHeight: v } = r.value, T = d + v, P = a ?? De(l.value, t.value), I = P.length ? Math.max(...P) : 0, f = typeof h == "number" ? h : 200, H = f >= 0 ? Math.max(0, I - f) : Math.max(0, I + f), L = Math.max(0, H - T), k = L <= 100;
     p.value = {
       distanceToTrigger: Math.round(L),
       isNearTrigger: k
@@ -818,12 +818,12 @@ function aa(e) {
       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);
+    n.value = !0, await q(), await new Promise((d) => requestAnimationFrame(() => d())), n.value = !1;
+    const a = De(l.value, t.value);
+    m.value(a), M(a);
   }
   function g() {
-    i.value = 0, w.value = 0, a.value = !1, p.value = {
+    i.value = 0, w.value = 0, n.value = !1, p.value = {
       distanceToTrigger: 0,
       isNearTrigger: !1
     };
@@ -831,7 +831,7 @@ function aa(e) {
   return {
     viewportTop: i,
     viewportHeight: w,
-    virtualizing: a,
+    virtualizing: n,
     scrollProgress: p,
     visibleMasonry: x,
     updateScrollProgress: M,
@@ -840,29 +840,29 @@ function aa(e) {
     handleScroll: m
   };
 }
-function na(e) {
-  const { masonry: l } = e, r = z(/* @__PURE__ */ new Set());
-  function n(m) {
+function la(e) {
+  const { masonry: l } = e, r = D(/* @__PURE__ */ new Set());
+  function t(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));
+      const w = m.filter((n) => !t(n == null ? void 0 : n.width) || !t(n == null ? void 0 : n.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)}`;
+      for (const n of w) {
+        const p = (n == null ? void 0 : n.id) ?? `idx:${l.value.indexOf(n)}`;
         r.value.has(p) || (r.value.add(p), b.push(p));
       }
       if (b.length > 0) {
-        const a = b.slice(0, 10);
+        const n = b.slice(0, 10);
         console.warn(
           "[Masonry] Items missing width/height detected:",
           {
             context: i,
             count: b.length,
-            sampleIds: a,
+            sampleIds: n,
             hint: "Ensure each item has positive width and height. Consider providing fallbacks (e.g., 512x512) at the data layer."
           }
         );
@@ -879,19 +879,19 @@ function na(e) {
     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 = {
+const oa = { class: "flex-1 relative min-h-0" }, ra = { class: "w-full h-full rounded-xl overflow-hidden shadow-sm transition-all duration-300 bg-white relative" }, ia = {
   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"
-}, ia = {
+}, sa = {
   key: 1,
   class: "relative w-full h-full"
-}, 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 = {
+}, ua = ["src"], ca = ["src", "autoplay", "controls"], va = { class: "w-12 h-12 rounded-full bg-white/80 backdrop-blur-sm flex items-center justify-center shadow-sm" }, fa = {
   key: 3,
   class: "absolute bottom-2 left-1/2 transform -translate-x-1/2 flex items-center justify-center z-10"
-}, fa = {
+}, da = {
   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"
-}, xe = /* @__PURE__ */ Je({
+}, be = /* @__PURE__ */ Ke({
   __name: "MasonryItem",
   props: {
     item: {},
@@ -905,9 +905,9 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
   },
   emits: ["preload:success", "preload:error", "mouse-enter", "mouse-leave"],
   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);
+    const r = e, t = l, y = D(!1), h = D(!1), m = D(null), i = D(!1), w = D(!1), b = D(null), n = D(!1), p = D(!1), x = D(!1), M = D(null), s = D(null);
     let g = null;
-    const t = Q(() => {
+    const a = Q(() => {
       var o;
       return r.type ?? ((o = r.item) == null ? void 0 : o.type) ?? "image";
     }), d = Q(() => {
@@ -915,12 +915,12 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
       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 });
+      t("mouse-enter", { item: r.item, type: o });
     }
-    function S(o) {
-      n("mouse-leave", { item: r.item, type: o });
+    function P(o) {
+      t("mouse-leave", { item: r.item, type: o });
     }
-    function E(o) {
+    function I(o) {
       if (v.value) return;
       const u = o.target;
       u && (u.paused ? u.play() : u.pause());
@@ -929,57 +929,57 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
       const u = o.target;
       u && (v.value || u.play(), T("video"));
     }
-    function P(o) {
+    function H(o) {
       const u = o.target;
-      u && (v.value || u.pause(), S("video"));
+      u && (v.value || u.pause(), P("video"));
     }
     function L(o) {
-      return new Promise((u, I) => {
+      return new Promise((u, E) => {
         if (!o) {
-          const D = new Error("No image source provided");
-          n("preload:error", { item: r.item, type: "image", src: o, error: D }), I(D);
+          const N = new Error("No image source provided");
+          t("preload:error", { item: r.item, type: "image", src: o, error: N }), E(N);
           return;
         }
         const $ = new Image(), C = Date.now(), F = 300;
         $.onload = () => {
-          const D = Date.now() - C, j = Math.max(0, F - D);
+          const N = Date.now() - C, j = Math.max(0, F - N);
           setTimeout(async () => {
-            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();
+            y.value = !0, h.value = !1, p.value = !1, await q(), await new Promise((X) => setTimeout(X, 100)), x.value = !0, t("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);
+          const N = new Error("Failed to load image");
+          t("preload:error", { item: r.item, type: "image", src: o, error: N }), E(N);
         }, $.src = o;
       });
     }
     function k(o) {
-      return new Promise((u, I) => {
+      return new Promise((u, E) => {
         if (!o) {
-          const D = new Error("No video source provided");
-          n("preload:error", { item: r.item, type: "video", src: o, error: D }), I(D);
+          const N = new Error("No video source provided");
+          t("preload:error", { item: r.item, type: "video", src: o, error: N }), E(N);
           return;
         }
         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);
+          const N = Date.now() - C, j = Math.max(0, F - N);
           setTimeout(async () => {
-            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();
+            i.value = !0, w.value = !1, p.value = !1, await q(), await new Promise((X) => setTimeout(X, 100)), x.value = !0, t("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);
+          const N = new Error("Failed to load video");
+          t("preload:error", { item: r.item, type: "video", src: o, error: N }), E(N);
         }, $.src = o;
       });
     }
     async function W() {
       var u;
-      if (!a.value || p.value || d.value || t.value === "video" && i.value || t.value === "image" && y.value)
+      if (!n.value || p.value || d.value || a.value === "video" && i.value || a.value === "image" && y.value)
         return;
       const o = (u = r.item) == null ? void 0 : u.src;
       if (o)
-        if (p.value = !0, x.value = !1, t.value === "video") {
+        if (p.value = !0, x.value = !1, a.value === "video") {
           b.value = o, i.value = !1, w.value = !1;
           try {
             await k(o);
@@ -993,11 +993,11 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
           }
         }
     }
-    return Ke(() => {
+    return Qe(() => {
       M.value && (g = new IntersectionObserver(
         (o) => {
           o.forEach((u) => {
-            u.isIntersecting && u.intersectionRatio >= 1 ? a.value || (a.value = !0, W()) : u.isIntersecting;
+            u.isIntersecting && u.intersectionRatio >= 1 ? n.value || (n.value = !0, W()) : u.isIntersecting;
           });
         },
         {
@@ -1005,24 +1005,24 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
           threshold: [1]
         }
       ), g.observe(M.value));
-    }), Qe(() => {
+    }), Ze(() => {
       g && (g.disconnect(), g = null);
-    }), te(
+    }), ee(
       () => {
         var o;
         return (o = r.item) == null ? void 0 : o.src;
       },
       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)) {
+          if (a.value === "video") {
+            if (o !== b.value && (i.value = !1, w.value = !1, b.value = o, n.value)) {
               p.value = !0;
               try {
                 await k(o);
               } catch {
               }
             }
-          } else if (o !== m.value && (y.value = !1, h.value = !1, m.value = o, a.value)) {
+          } else if (o !== m.value && (y.value = !1, h.value = !1, m.value = o, n.value)) {
             p.value = !0;
             try {
               await L(o);
@@ -1031,7 +1031,7 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
           }
         }
       }
-    ), te(
+    ), ee(
       () => r.isActive,
       (o) => {
         !v.value || !s.value || (o ? s.value.play() : s.value.pause());
@@ -1055,10 +1055,10 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
           videoError: w.value,
           showNotFound: d.value,
           isLoading: p.value,
-          mediaType: t.value
+          mediaType: a.value
         })
-      ], 4)) : ee("", !0),
-      V("div", la, [
+      ], 4)) : te("", !0),
+      V("div", oa, [
         _(o.$slots, "default", {
           item: o.item,
           remove: o.remove,
@@ -1068,18 +1068,18 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
           videoError: w.value,
           showNotFound: d.value,
           isLoading: p.value,
-          mediaType: t.value,
+          mediaType: a.value,
           imageSrc: m.value,
           videoSrc: b.value,
           showMedia: x.value
         }, () => [
-          V("div", oa, [
-            d.value ? (O(), R("div", ra, u[3] || (u[3] = [
+          V("div", ra, [
+            d.value ? (O(), R("div", ia, 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)
-            ]))) : (O(), R("div", ia, [
-              t.value === "image" && m.value ? (O(), R("img", {
+            ]))) : (O(), R("div", sa, [
+              a.value === "image" && m.value ? (O(), R("img", {
                 key: 0,
                 src: m.value,
                 class: re([
@@ -1090,10 +1090,10 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
                 loading: "lazy",
                 decoding: "async",
                 alt: "",
-                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", {
+                onMouseenter: u[0] || (u[0] = (E) => T("image")),
+                onMouseleave: u[1] || (u[1] = (E) => P("image"))
+              }, null, 42, ua)) : te("", !0),
+              a.value === "video" && b.value ? (O(), R("video", {
                 key: 1,
                 ref_key: "videoEl",
                 ref: s,
@@ -1108,12 +1108,12 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
                 playsinline: "",
                 autoplay: v.value && r.isActive,
                 controls: v.value,
-                onClick: Ce(E, ["stop"]),
-                onTouchend: Ce(E, ["stop", "prevent"]),
+                onClick: je(I, ["stop"]),
+                onTouchend: je(I, ["stop", "prevent"]),
                 onMouseenter: f,
-                onMouseleave: P,
-                onError: u[2] || (u[2] = (I) => w.value = !0)
-              }, null, 42, ua)) : ee("", !0),
+                onMouseleave: H,
+                onError: u[2] || (u[2] = (E) => w.value = !0)
+              }, null, 42, ca)) : te("", !0),
               !y.value && !i.value && !h.value && !w.value ? (O(), R("div", {
                 key: 2,
                 class: re([
@@ -1121,25 +1121,25 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
                   x.value ? "opacity-0 pointer-events-none" : "opacity-100"
                 ])
               }, [
-                V("div", ca, [
-                  _(o.$slots, "placeholder-icon", { mediaType: t.value }, () => [
+                V("div", va, [
+                  _(o.$slots, "placeholder-icon", { mediaType: a.value }, () => [
                     V("i", {
-                      class: re(t.value === "video" ? "fas fa-video text-xl text-slate-400" : "fas fa-image text-xl text-slate-400")
+                      class: re(a.value === "video" ? "fas fa-video text-xl text-slate-400" : "fas fa-image text-xl text-slate-400")
                     }, null, 2)
                   ])
                 ])
-              ], 2)) : ee("", !0),
-              p.value ? (O(), R("div", va, u[4] || (u[4] = [
+              ], 2)) : te("", !0),
+              p.value ? (O(), R("div", fa, 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)
-              ]))) : ee("", !0),
-              t.value === "image" && h.value || t.value === "video" && w.value ? (O(), R("div", fa, [
+              ]))) : te("", !0),
+              a.value === "image" && h.value || a.value === "video" && w.value ? (O(), R("div", da, [
                 V("i", {
-                  class: re(t.value === "video" ? "fas fa-video text-2xl mb-2 opacity-50" : "fas fa-image text-2xl mb-2 opacity-50")
+                  class: re(a.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 " + He(t.value), 1)
-              ])) : ee("", !0)
+                V("span", null, "Failed to load " + $e(a.value), 1)
+              ])) : te("", !0)
             ]))
           ])
         ])
@@ -1158,24 +1158,24 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
           videoError: w.value,
           showNotFound: d.value,
           isLoading: p.value,
-          mediaType: t.value
+          mediaType: a.value
         })
-      ], 4)) : ee("", !0)
+      ], 4)) : te("", !0)
     ], 512));
   }
-}), 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 = {
+}), ma = { class: "w-full h-full flex items-center justify-center p-4" }, ha = { class: "w-full h-full max-w-full max-h-full relative" }, ga = {
   key: 0,
   class: "w-full py-8 text-center"
-}, ga = {
+}, pa = {
   key: 1,
   class: "w-full py-8 text-center"
-}, pa = { class: "text-red-500 dark:text-red-400" }, ya = {
+}, ya = { class: "text-red-500 dark:text-red-400" }, wa = {
   key: 0,
   class: "w-full py-8 text-center"
-}, wa = {
+}, xa = {
   key: 1,
   class: "w-full py-8 text-center"
-}, xa = { class: "text-red-500 dark:text-red-400" }, ba = /* @__PURE__ */ Je({
+}, ba = { class: "text-red-500 dark:text-red-400" }, Ma = /* @__PURE__ */ Ke({
   __name: "Masonry",
   props: {
     getNextPage: {
@@ -1204,6 +1204,15 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
       type: Boolean,
       default: !1
     },
+    // Initial pagination state when skipInitialLoad is true and items are provided
+    initialPage: {
+      type: [Number, String],
+      default: null
+    },
+    initialNextPage: {
+      type: [Number, String],
+      default: null
+    },
     pageSize: {
       type: Number,
       default: 40
@@ -1294,7 +1303,7 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
     "item:mouse-leave"
   ],
   setup(e, { expose: l, emit: r }) {
-    const n = e, y = {
+    const t = e, y = {
       sizes: { base: 1, sm: 2, md: 3, lg: 4, xl: 5, "2xl": 6 },
       gutterX: 10,
       gutterY: 10,
@@ -1307,14 +1316,14 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
       var c;
       return {
         ...y,
-        ...n.layout,
+        ...t.layout,
         sizes: {
           ...y.sizes,
-          ...((c = n.layout) == null ? void 0 : c.sizes) || {}
+          ...((c = t.layout) == null ? void 0 : c.sizes) || {}
         }
       };
-    }), 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;
+    }), m = D(null), i = D(typeof window < "u" ? window.innerWidth : 1024), w = D(typeof window < "u" ? window.innerHeight : 768), b = D(null);
+    let n = null;
     function p(c) {
       return {
         sm: 640,
@@ -1325,89 +1334,89 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
       }[c] || 768;
     }
     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;
+      if (t.layoutMode === "masonry") return !1;
+      if (t.layoutMode === "swipe") return !0;
+      const c = typeof t.mobileBreakpoint == "string" ? p(t.mobileBreakpoint) : t.mobileBreakpoint;
       return i.value < c;
     }), M = r, s = Q({
-      get: () => n.items,
+      get: () => t.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({
+    }), g = D(7), a = D(null), d = D([]), v = D(null), T = D(!1), P = D(0), I = D(!1), f = D(null), H = Q(() => _t(i.value)), L = la({
       masonry: s
-    }), { checkItemDimensions: k, reset: W } = L, o = ta({
+    }), { checkItemDimensions: k, reset: W } = L, o = aa({
       masonry: s,
       useSwipeMode: x,
-      container: t,
+      container: a,
       columns: g,
       containerWidth: i,
-      masonryContentHeight: S,
+      masonryContentHeight: P,
       layout: h,
       fixedDimensions: b,
       checkItemDimensions: k
-    }), { refreshLayout: u, setFixedDimensions: I, onResize: $ } = o, C = aa({
+    }), { refreshLayout: u, setFixedDimensions: E, onResize: $ } = o, C = na({
       masonry: s,
-      container: t,
+      container: a,
       columns: g,
-      virtualBufferPx: n.virtualBufferPx,
-      loadThresholdPx: n.loadThresholdPx,
+      virtualBufferPx: t.virtualBufferPx,
+      loadThresholdPx: t.loadThresholdPx,
       handleScroll: () => {
       }
       // 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,
+    }), { viewportTop: F, viewportHeight: N, virtualizing: j, visibleMasonry: X, updateScrollProgress: z, updateViewport: Y, reset: G } = C, { onEnter: ne, onBeforeEnter: J, onBeforeLeave: ie, onLeave: Z } = Kt(
+      { container: a },
+      { leaveDurationMs: t.leaveDurationMs, virtualizing: j }
+    ), at = ne, nt = J, lt = ie, ot = Z, rt = ea({
+      getNextPage: t.getNextPage,
       masonry: s,
       isLoading: T,
-      hasReachedEnd: E,
+      hasReachedEnd: I,
       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,
+      retryMaxAttempts: t.retryMaxAttempts,
+      retryInitialDelayMs: t.retryInitialDelayMs,
+      retryBackoffStepMs: t.retryBackoffStepMs,
+      backfillEnabled: t.backfillEnabled,
+      backfillDelayMs: t.backfillDelayMs,
+      backfillMaxCalls: t.backfillMaxCalls,
+      pageSize: t.pageSize,
+      autoRefreshOnEmpty: t.autoRefreshOnEmpty,
       emits: M
-    }), { loadPage: be, loadNext: pe, refreshCurrentPage: De, cancelLoad: Me, maybeBackfillToTarget: rt } = ot, K = Qt({
+    }), { loadPage: Me, loadNext: pe, refreshCurrentPage: ze, cancelLoad: Te, maybeBackfillToTarget: it } = rt, K = Zt({
       useSwipeMode: x,
       masonry: s,
       isLoading: T,
       loadNext: pe,
-      loadPage: be,
+      loadPage: Me,
       paginationHistory: d
-    }), { handleScroll: it } = Kt({
-      container: t,
+    }), { handleScroll: st } = Qt({
+      container: a,
       masonry: s,
       columns: g,
-      containerHeight: S,
+      containerHeight: P,
       isLoading: T,
-      pageSize: n.pageSize,
+      pageSize: t.pageSize,
       refreshLayout: u,
       setItemsRaw: (c) => {
         s.value = c;
       },
       loadNext: pe,
-      loadThresholdPx: n.loadThresholdPx
+      loadThresholdPx: t.loadThresholdPx
     });
-    C.handleScroll.value = it;
-    const st = ea({
+    C.handleScroll.value = st;
+    const ut = ta({
       masonry: s,
       useSwipeMode: x,
       refreshLayout: u,
-      refreshCurrentPage: De,
+      refreshCurrentPage: ze,
       loadNext: pe,
-      maybeBackfillToTarget: rt,
-      autoRefreshOnEmpty: n.autoRefreshOnEmpty,
+      maybeBackfillToTarget: it,
+      autoRefreshOnEmpty: t.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);
+    }), { remove: ce, removeMany: ct, restore: vt, restoreMany: ft, removeAll: dt } = ut;
+    function mt(c) {
+      E(c, z), !c && m.value && (i.value = m.value.clientWidth, w.value = m.value.clientHeight);
     }
     l({
       isLoading: T,
@@ -1416,140 +1425,151 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
       containerWidth: i,
       containerHeight: w,
       // Masonry content height (for backward compatibility, old containerHeight)
-      contentHeight: S,
+      contentHeight: P,
       // Current page
       currentPage: v,
       // End of list tracking
-      hasReachedEnd: E,
+      hasReachedEnd: I,
       // Load error tracking
       loadError: f,
       // Set fixed dimensions (overrides ResizeObserver)
-      setFixedDimensions: dt,
+      setFixedDimensions: mt,
       remove: ce,
-      removeMany: ut,
-      removeAll: ft,
-      restore: ct,
-      restoreMany: vt,
+      removeMany: ct,
+      removeAll: dt,
+      restore: vt,
+      restoreMany: ft,
       loadNext: pe,
-      loadPage: be,
-      refreshCurrentPage: De,
-      reset: pt,
-      destroy: yt,
-      init: Re,
-      restoreItems: Oe,
+      loadPage: Me,
+      refreshCurrentPage: ze,
+      reset: yt,
+      destroy: wt,
+      init: Ce,
+      restoreItems: Le,
       paginationHistory: d,
-      cancelLoad: Me,
-      scrollToTop: mt,
-      scrollTo: ht,
+      cancelLoad: Te,
+      scrollToTop: ht,
+      scrollTo: gt,
       totalItems: Q(() => s.value.length),
-      currentBreakpoint: P
+      currentBreakpoint: H
     });
-    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({
+    const se = K.currentSwipeIndex, ve = K.swipeOffset, ye = K.isDragging, le = K.swipeContainer, Be = K.handleTouchStart, Fe = K.handleTouchMove, Ae = K.handleTouchEnd, We = K.handleMouseDown, Ie = K.handleMouseMove, Ee = K.handleMouseUp, ke = K.snapToCurrentItem;
+    function ht(c) {
+      a.value && a.value.scrollTo({
         top: 0,
         behavior: (c == null ? void 0 : c.behavior) ?? "smooth",
         ...c
       });
     }
-    function ht(c) {
-      t.value && (t.value.scrollTo({
-        top: c.top ?? t.value.scrollTop,
-        left: c.left ?? t.value.scrollLeft,
+    function gt(c) {
+      a.value && (a.value.scrollTo({
+        top: c.top ?? a.value.scrollTop,
+        left: c.left ?? a.value.scrollLeft,
         behavior: c.behavior ?? "auto"
-      }), t.value && (F.value = t.value.scrollTop, D.value = t.value.clientHeight || window.innerHeight));
-    }
-    function gt() {
-      $(), t.value && (F.value = t.value.scrollTop, D.value = t.value.clientHeight);
+      }), a.value && (F.value = a.value.scrollTop, N.value = a.value.clientHeight || window.innerHeight));
     }
     function pt() {
-      Me(), t.value && t.value.scrollTo({
+      $(), a.value && (F.value = a.value.scrollTop, N.value = a.value.clientHeight);
+    }
+    function yt() {
+      Te(), a.value && a.value.scrollTo({
         top: 0,
         behavior: "smooth"
-      }), s.value = [], w.value = 0, v.value = n.loadAtPage, d.value = [n.loadAtPage], E.value = !1, f.value = null, G();
+      }), s.value = [], w.value = 0, v.value = t.loadAtPage, d.value = [t.loadAtPage], I.value = !1, f.value = null, G(), we = !1;
     }
-    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({
+    function wt() {
+      Te(), s.value = [], P.value = 0, v.value = null, d.value = [], I.value = !1, f.value = null, T.value = !1, se.value = 0, ve.value = 0, ye.value = !1, G(), W(), a.value && a.value.scrollTo({
         top: 0,
         behavior: "auto"
         // Instant scroll for destroy
       });
     }
-    const oe = Xe(async () => {
+    const oe = Ge(async () => {
       x.value || await Y();
-    }, 200), Ae = Xe(gt, 200);
-    function We() {
+    }, 200), Re = Ge(pt, 200);
+    function Oe() {
       K.handleWindowResize();
     }
-    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 Ce(c, S, B) {
+      v.value = S, d.value = [S], d.value.push(B), I.value = B == 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]), a.value && (F.value = a.value.scrollTop, N.value = a.value.clientHeight || window.innerHeight), q(() => {
+        a.value && (F.value = a.value.scrollTop, N.value = a.value.clientHeight || window.innerHeight, z());
       }));
     }
-    async function Oe(c, H, N) {
-      if (!n.skipInitialLoad) {
-        Re(c, H, N);
+    async function Le(c, S, B) {
+      if (!t.skipInitialLoad) {
+        Ce(c, S, B);
         return;
       }
-      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()));
+      v.value = S, d.value = [S], B != null && d.value.push(B), I.value = B === null, f.value = null, k(c, "restoreItems"), x.value ? (s.value = c, se.value === 0 && s.value.length > 0 && (ve.value = 0)) : (u(c), a.value && (F.value = a.value.scrollTop, N.value = a.value.clientHeight || window.innerHeight), await q(), a.value && (F.value = a.value.scrollTop, N.value = a.value.clientHeight || window.innerHeight, z()));
     }
-    return te(
+    ee(
       h,
       () => {
-        x.value || t.value && (g.value = ue(h.value, i.value), u(s.value));
+        x.value || a.value && (g.value = ue(h.value, i.value), u(s.value));
       },
       { deep: !0 }
-    ), te(() => n.layoutMode, () => {
+    ), ee(() => t.layoutMode, () => {
       b.value && b.value.width !== void 0 ? i.value = b.value.width : m.value && (i.value = m.value.clientWidth);
-    }), te(t, (c) => {
+    }), ee(a, (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 });
+    let we = !1;
+    return ee(
+      () => [t.items, t.skipInitialLoad, t.initialPage, t.initialNextPage],
+      ([c, S, B, ae]) => {
+        if (S && c && c.length > 0 && !we) {
+          we = !0;
+          const A = B ?? t.loadAtPage;
+          Le(c, A, ae !== void 0 ? ae : void 0);
+        }
+      },
+      { immediate: !1 }
+    ), ee(x, (c, S) => {
+      S === void 0 && c === !1 || q(() => {
+        c ? (document.addEventListener("mousemove", Ie), document.addEventListener("mouseup", Ee), a.value && a.value.removeEventListener("scroll", oe), se.value = 0, ve.value = 0, s.value.length > 0 && ke()) : (document.removeEventListener("mousemove", Ie), document.removeEventListener("mouseup", Ee), a.value && m.value && (b.value && b.value.width !== void 0 ? i.value = b.value.width : i.value = m.value.clientWidth, a.value.removeEventListener("scroll", oe), a.value.addEventListener("scroll", oe, { passive: !0 }), s.value.length > 0 && (g.value = ue(h.value, i.value), u(s.value), F.value = a.value.scrollTop, N.value = a.value.clientHeight, z())));
       });
-    }, { 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) => {
+    }, { immediate: !0 }), ee(le, (c) => {
+      c && (c.addEventListener("touchstart", Be, { passive: !1 }), c.addEventListener("touchmove", Fe, { passive: !1 }), c.addEventListener("touchend", Ae), c.addEventListener("mousedown", We));
+    }), ee(() => s.value.length, (c, S) => {
+      x.value && c > 0 && S === 0 && (se.value = 0, q(() => ke()));
+    }), ee(m, (c) => {
+      n && (n.disconnect(), n = null), c && typeof ResizeObserver < "u" ? (n = new ResizeObserver((S) => {
         if (!b.value)
-          for (const N of H) {
-            const ae = N.contentRect.width, A = N.contentRect.height;
+          for (const B of S) {
+            const ae = B.contentRect.width, A = B.contentRect.height;
             i.value !== ae && (i.value = ae), w.value !== A && (w.value = A);
           }
-      }), 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();
+      }), n.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 }), ee(i, (c, S) => {
+      c !== S && c > 0 && !x.value && a.value && s.value.length > 0 && q(() => {
+        g.value = ue(h.value, c), u(s.value), z();
       });
-    }), Ke(async () => {
+    }), Qe(async () => {
       try {
-        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();
+        await q(), m.value && !n && (i.value = m.value.clientWidth, w.value = m.value.clientHeight), x.value || (g.value = ue(h.value, i.value), a.value && (F.value = a.value.scrollTop, N.value = a.value.clientHeight));
+        const c = t.loadAtPage;
+        if (d.value = [c], !t.skipInitialLoad)
+          await Me(d.value[0]);
+        else if (t.items && t.items.length > 0) {
+          const S = t.initialPage !== null && t.initialPage !== void 0 ? t.initialPage : t.loadAtPage, B = t.initialNextPage !== void 0 ? t.initialNextPage : void 0;
+          await Le(t.items, S, B), we = !0;
+        }
+        x.value ? q(() => ke()) : z();
       } catch (c) {
         f.value || (console.error("Error during component initialization:", c), f.value = he(c)), T.value = !1;
       }
-      window.addEventListener("resize", Ae), window.addEventListener("resize", We);
-    }), Qe(() => {
+      window.addEventListener("resize", Re), window.addEventListener("resize", Oe);
+    }), Ze(() => {
       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", {
+      n && (n.disconnect(), n = null), (c = a.value) == null || c.removeEventListener("scroll", oe), window.removeEventListener("resize", Re), window.removeEventListener("resize", Oe), le.value && (le.value.removeEventListener("touchstart", Be), le.value.removeEventListener("touchmove", Fe), le.value.removeEventListener("touchend", Ae), le.value.removeEventListener("mousedown", We)), document.removeEventListener("mousemove", Ie), document.removeEventListener("mouseup", Ee);
+    }), (c, S) => (O(), R("div", {
       ref_key: "wrapper",
       ref: m,
       class: "w-full h-full flex flex-col relative"
     }, [
       x.value ? (O(), R("div", {
         key: 0,
-        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) }]),
+        class: re(["overflow-hidden w-full flex-1 swipe-container touch-none select-none", { "force-motion": t.forceMotion, "cursor-grab": !U(ye), "cursor-grabbing": U(ye) }]),
         ref_key: "swipeContainer",
         ref: le,
         style: { height: "100%", "max-height": "100%", position: "relative" }
@@ -1562,32 +1582,32 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
             height: `${s.value.length * 100}%`
           })
         }, [
-          (O(!0), R(je, null, Ve(s.value, (N, ae) => (O(), R("div", {
-            key: `${N.page}-${N.id}`,
+          (O(!0), R(Ve, null, qe(s.value, (B, ae) => (O(), R("div", {
+            key: `${B.page}-${B.id}`,
             class: "absolute top-0 left-0 w-full",
             style: ge({
               top: `${ae * (100 / s.value.length)}%`,
               height: `${100 / s.value.length}%`
             })
           }, [
-            V("div", da, [
-              V("div", ma, [
+            V("div", ma, [
+              V("div", ha, [
                 _(c.$slots, "default", {
-                  item: N,
+                  item: B,
                   remove: U(ce),
-                  index: N.originalIndex ?? s.value.indexOf(N)
+                  index: B.originalIndex ?? s.value.indexOf(B)
                 }, () => [
-                  ke(xe, {
-                    item: N,
+                  Pe(be, {
+                    item: B,
                     remove: U(ce),
                     "header-height": h.value.header,
                     "footer-height": h.value.footer,
                     "in-swipe-mode": !0,
                     "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))
+                    "onPreload:success": S[0] || (S[0] = (A) => M("item:preload:success", A)),
+                    "onPreload:error": S[1] || (S[1] = (A) => M("item:preload:error", A)),
+                    onMouseEnter: S[2] || (S[2] = (A) => M("item:mouse-enter", A)),
+                    onMouseLeave: S[3] || (S[3] = (A) => M("item:mouse-leave", A))
                   }, {
                     header: fe((A) => [
                       _(c.$slots, "item-header", de({ ref_for: !0 }, A), void 0, !0)
@@ -1602,56 +1622,56 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
             ])
           ], 4))), 128))
         ], 4),
-        E.value && s.value.length > 0 ? (O(), R("div", ha, [
+        I.value && s.value.length > 0 ? (O(), R("div", ga, [
           _(c.$slots, "end-message", {}, () => [
-            H[8] || (H[8] = V("p", { class: "text-gray-500 dark:text-gray-400" }, "You've reached the end", -1))
+            S[8] || (S[8] = V("p", { class: "text-gray-500 dark:text-gray-400" }, "You've reached the end", -1))
           ], !0)
-        ])) : ee("", !0),
-        f.value && s.value.length > 0 ? (O(), R("div", ga, [
+        ])) : te("", !0),
+        f.value && s.value.length > 0 ? (O(), R("div", pa, [
           _(c.$slots, "error-message", { error: f.value }, () => [
-            V("p", pa, "Failed to load content: " + He(f.value.message), 1)
+            V("p", ya, "Failed to load content: " + $e(f.value.message), 1)
           ], !0)
-        ])) : ee("", !0)
+        ])) : te("", !0)
       ], 2)) : (O(), R("div", {
         key: 1,
-        class: re(["overflow-auto w-full flex-1 masonry-container", { "force-motion": n.forceMotion }]),
+        class: re(["overflow-auto w-full flex-1 masonry-container", { "force-motion": t.forceMotion }]),
         ref_key: "container",
-        ref: t
+        ref: a
       }, [
         V("div", {
           class: "relative",
-          style: ge({ height: `${S.value}px`, "--masonry-duration": `${e.transitionDurationMs}ms`, "--masonry-leave-duration": `${e.leaveDurationMs}ms`, "--masonry-ease": e.transitionEasing })
+          style: ge({ height: `${P.value}px`, "--masonry-duration": `${e.transitionDurationMs}ms`, "--masonry-leave-duration": `${e.leaveDurationMs}ms`, "--masonry-ease": e.transitionEasing })
         }, [
-          ke(wt, {
+          Pe(xt, {
             name: "masonry",
             css: !1,
-            onEnter: U(tt),
-            onBeforeEnter: U(at),
-            onLeave: U(lt),
-            onBeforeLeave: U(nt)
+            onEnter: U(at),
+            onBeforeEnter: U(nt),
+            onLeave: U(ot),
+            onBeforeLeave: U(lt)
           }, {
             default: fe(() => [
-              (O(!0), R(je, null, Ve(U(X), (N, ae) => (O(), R("div", de({
-                key: `${N.page}-${N.id}`,
+              (O(!0), R(Ve, null, qe(U(X), (B, ae) => (O(), R("div", de({
+                key: `${B.page}-${B.id}`,
                 class: "absolute masonry-item",
                 ref_for: !0
-              }, U(Gt)(N, ae)), [
+              }, U(Jt)(B, ae)), [
                 _(c.$slots, "default", {
-                  item: N,
+                  item: B,
                   remove: U(ce),
-                  index: N.originalIndex ?? s.value.indexOf(N)
+                  index: B.originalIndex ?? s.value.indexOf(B)
                 }, () => [
-                  ke(xe, {
-                    item: N,
+                  Pe(be, {
+                    item: B,
                     remove: U(ce),
                     "header-height": h.value.header,
                     "footer-height": h.value.footer,
                     "in-swipe-mode": !1,
                     "is-active": !1,
-                    "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))
+                    "onPreload:success": S[4] || (S[4] = (A) => M("item:preload:success", A)),
+                    "onPreload:error": S[5] || (S[5] = (A) => M("item:preload:error", A)),
+                    onMouseEnter: S[6] || (S[6] = (A) => M("item:mouse-enter", A)),
+                    onMouseLeave: S[7] || (S[7] = (A) => M("item:mouse-leave", A))
                   }, {
                     header: fe((A) => [
                       _(c.$slots, "item-header", de({ ref_for: !0 }, A), void 0, !0)
@@ -1667,31 +1687,31 @@ const la = { class: "flex-1 relative min-h-0" }, oa = { class: "w-full h-full ro
             _: 3
           }, 8, ["onEnter", "onBeforeEnter", "onLeave", "onBeforeLeave"])
         ], 4),
-        E.value && s.value.length > 0 ? (O(), R("div", ya, [
+        I.value && s.value.length > 0 ? (O(), R("div", wa, [
           _(c.$slots, "end-message", {}, () => [
-            H[9] || (H[9] = V("p", { class: "text-gray-500 dark:text-gray-400" }, "You've reached the end", -1))
+            S[9] || (S[9] = V("p", { class: "text-gray-500 dark:text-gray-400" }, "You've reached the end", -1))
           ], !0)
-        ])) : ee("", !0),
-        f.value && s.value.length > 0 ? (O(), R("div", wa, [
+        ])) : te("", !0),
+        f.value && s.value.length > 0 ? (O(), R("div", xa, [
           _(c.$slots, "error-message", { error: f.value }, () => [
-            V("p", xa, "Failed to load content: " + He(f.value.message), 1)
+            V("p", ba, "Failed to load content: " + $e(f.value.message), 1)
           ], !0)
-        ])) : ee("", !0)
+        ])) : te("", !0)
       ], 2))
     ], 512));
   }
-}), Ma = (e, l) => {
+}), Ta = (e, l) => {
   const r = e.__vccOpts || e;
-  for (const [n, y] of l)
-    r[n] = y;
+  for (const [t, y] of l)
+    r[t] = y;
   return r;
-}, Ge = /* @__PURE__ */ Ma(ba, [["__scopeId", "data-v-9de56a55"]]), Ea = {
+}, Je = /* @__PURE__ */ Ta(Ma, [["__scopeId", "data-v-c6a3147d"]]), ka = {
   install(e) {
-    e.component("WyxosMasonry", Ge), e.component("WMasonry", Ge), e.component("WyxosMasonryItem", xe), e.component("WMasonryItem", xe);
+    e.component("WyxosMasonry", Je), e.component("WMasonry", Je), e.component("WyxosMasonryItem", be), e.component("WMasonryItem", be);
   }
 };
 export {
-  Ge as Masonry,
-  xe as MasonryItem,
-  Ea as default
+  Je as Masonry,
+  be as MasonryItem,
+  ka as default
 };