@wyxos/vibe 1.6.6 → 1.6.7

package/lib/index.js

@@ -1,23 +1,23 @@
-import { nextTick as Q, defineComponent as Le, ref as L, onMounted as He, watch as Ne, createElementBlock as q, openBlock as V, renderSlot as $e, createElementVNode as O, createCommentVNode as oe, withModifiers as ze, toDisplayString as de, computed as se, onUnmounted as Re, normalizeClass as we, normalizeStyle as Ce, createVNode as Me, TransitionGroup as _e, withCtx as qe, Fragment as Ve, renderList as Ge, mergeProps as Te, unref as Ue } from "vue";
-let ue = null;
+import { nextTick as Q, defineComponent as Se, ref as k, computed as Z, onMounted as Le, watch as Ne, createElementBlock as V, openBlock as G, renderSlot as He, createElementVNode as A, createCommentVNode as le, normalizeClass as ve, toDisplayString as ie, withModifiers as je, onUnmounted as ze, normalizeStyle as Re, createVNode as Te, TransitionGroup as Ce, withCtx as qe, Fragment as _e, renderList as Ve, mergeProps as Ge, unref as Ue } from "vue";
+let ce = null;
 function Xe() {
-  if (ue != null) return ue;
+  if (ce != null) return ce;
   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 o = document.createElement("div");
-  o.style.width = "100%", e.appendChild(o);
-  const l = e.offsetWidth - o.offsetWidth;
-  return document.body.removeChild(e), ue = l, l;
+  const l = document.createElement("div");
+  l.style.width = "100%", e.appendChild(l);
+  const s = e.offsetWidth - l.offsetWidth;
+  return document.body.removeChild(e), ce = s, s;
 }
-function Ye(e, o, l, s = {}) {
+function Ye(e, l, s, i = {}) {
   const {
     gutterX: h = 0,
-    gutterY: v = 0,
+    gutterY: m = 0,
     header: a = 0,
     footer: n = 0,
-    paddingLeft: d = 0,
-    paddingRight: u = 0,
-    sizes: c = {
+    paddingLeft: v = 0,
+    paddingRight: f = 0,
+    sizes: d = {
       base: 1,
       sm: 2,
       md: 3,
@@ -26,94 +26,94 @@ function Ye(e, o, l, s = {}) {
       "2xl": 6
     },
     placement: b = "masonry"
-  } = s;
-  let m = 0, x = 0;
+  } = i;
+  let r = 0, c = 0;
   try {
-    if (o && o.nodeType === 1 && typeof window < "u" && window.getComputedStyle) {
-      const w = window.getComputedStyle(o);
-      m = parseFloat(w.paddingLeft) || 0, x = parseFloat(w.paddingRight) || 0;
+    if (l && l.nodeType === 1 && typeof window < "u" && window.getComputedStyle) {
+      const T = window.getComputedStyle(l);
+      r = parseFloat(T.paddingLeft) || 0, c = parseFloat(T.paddingRight) || 0;
     }
   } catch {
   }
-  const F = (d || 0) + m, _ = (u || 0) + x, H = o.offsetWidth - o.clientWidth, M = H > 0 ? H + 2 : Xe() + 2, P = o.offsetWidth - M - F - _, U = h * (l - 1), S = Math.floor((P - U) / l), T = e.map((w) => {
-    const N = w.width, I = w.height;
-    return Math.round(S * I / N) + n + a;
+  const w = (v || 0) + r, I = (f || 0) + c, E = l.offsetWidth - l.clientWidth, M = E > 0 ? E + 2 : Xe() + 2, P = l.offsetWidth - M - w - I, j = h * (s - 1), N = Math.floor((P - j) / s), S = e.map((T) => {
+    const F = T.width, L = T.height;
+    return Math.round(N * L / F) + n + a;
   });
   if (b === "sequential-balanced") {
-    const w = T.length;
-    if (w === 0) return [];
-    const N = (p, k, B) => p + (k > 0 ? v : 0) + B;
-    let I = Math.max(...T), D = T.reduce((p, k) => p + k, 0) + v * Math.max(0, w - 1);
-    const Z = (p) => {
-      let k = 1, B = 0, z = 0;
-      for (let $ = 0; $ < w; $++) {
-        const G = T[$], R = N(B, z, G);
-        if (R <= p)
-          B = R, z++;
-        else if (k++, B = G, z = 1, G > p || k > l) return !1;
+    const T = S.length;
+    if (T === 0) return [];
+    const F = (y, H, O) => y + (H > 0 ? m : 0) + O;
+    let L = Math.max(...S), z = S.reduce((y, H) => y + H, 0) + m * Math.max(0, T - 1);
+    const ee = (y) => {
+      let H = 1, O = 0, C = 0;
+      for (let W = 0; W < T; W++) {
+        const U = S[W], q = F(O, C, U);
+        if (q <= y)
+          O = q, C++;
+        else if (H++, O = U, C = 1, U > y || H > s) return !1;
       }
-      return k <= l;
+      return H <= s;
     };
-    for (; I < D; ) {
-      const p = Math.floor((I + D) / 2);
-      Z(p) ? D = p : I = p + 1;
+    for (; L < z; ) {
+      const y = Math.floor((L + z) / 2);
+      ee(y) ? z = y : L = y + 1;
     }
-    const ee = D, X = new Array(l).fill(0);
-    let te = l - 1, Y = 0, J = 0;
-    for (let p = w - 1; p >= 0; p--) {
-      const k = T[p], B = p < te;
-      !(N(Y, J, k) <= ee) || B ? (X[te] = p + 1, te--, Y = k, J = 1) : (Y = N(Y, J, k), J++);
+    const te = z, X = new Array(s).fill(0);
+    let ae = s - 1, Y = 0, J = 0;
+    for (let y = T - 1; y >= 0; y--) {
+      const H = S[y], O = y < ae;
+      !(F(Y, J, H) <= te) || O ? (X[ae] = y + 1, ae--, Y = H, J = 1) : (Y = F(Y, J, H), J++);
     }
     X[0] = 0;
-    const j = [], ae = new Array(l).fill(0);
-    for (let p = 0; p < l; p++) {
-      const k = X[p], B = p + 1 < l ? X[p + 1] : w, z = p * (S + h);
-      for (let $ = k; $ < B; $++) {
-        const R = {
-          ...e[$],
-          columnWidth: S,
+    const R = [], ne = new Array(s).fill(0);
+    for (let y = 0; y < s; y++) {
+      const H = X[y], O = y + 1 < s ? X[y + 1] : T, C = y * (N + h);
+      for (let W = H; W < O; W++) {
+        const q = {
+          ...e[W],
+          columnWidth: N,
           imageHeight: 0,
           columnHeight: 0,
           left: 0,
           top: 0
         };
-        R.imageHeight = T[$] - (n + a), R.columnHeight = T[$], R.left = z, R.top = ae[p], ae[p] += R.columnHeight + ($ + 1 < B ? v : 0), j.push(R);
+        q.imageHeight = S[W] - (n + a), q.columnHeight = S[W], q.left = C, q.top = ne[y], ne[y] += q.columnHeight + (W + 1 < O ? m : 0), R.push(q);
       }
     }
-    return j;
+    return R;
   }
-  const y = new Array(l).fill(0), W = [];
-  for (let w = 0; w < e.length; w++) {
-    const N = e[w], I = {
-      ...N,
+  const x = new Array(s).fill(0), D = [];
+  for (let T = 0; T < e.length; T++) {
+    const F = e[T], L = {
+      ...F,
       columnWidth: 0,
       imageHeight: 0,
       columnHeight: 0,
       left: 0,
       top: 0
-    }, D = y.indexOf(Math.min(...y)), Z = N.width, ee = N.height;
-    I.columnWidth = S, I.left = D * (S + h), I.imageHeight = Math.round(S * ee / Z), I.columnHeight = I.imageHeight + n + a, I.top = y[D], y[D] += I.columnHeight + v, W.push(I);
+    }, z = x.indexOf(Math.min(...x)), ee = F.width, te = F.height;
+    L.columnWidth = N, L.left = z * (N + h), L.imageHeight = Math.round(N * te / ee), L.columnHeight = L.imageHeight + n + a, L.top = x[z], x[z] += L.columnHeight + m, D.push(L);
   }
-  return W;
+  return D;
 }
-var Je = typeof global == "object" && global && global.Object === Object && global, Ke = typeof self == "object" && self && self.Object === Object && self, Ae = Je || Ke || Function("return this")(), ie = Ae.Symbol, We = Object.prototype, Qe = We.hasOwnProperty, Ze = We.toString, re = ie ? ie.toStringTag : void 0;
+var Je = typeof global == "object" && global && global.Object === Object && global, Ke = typeof self == "object" && self && self.Object === Object && self, $e = Je || Ke || Function("return this")(), ue = $e.Symbol, Ae = Object.prototype, Qe = Ae.hasOwnProperty, Ze = Ae.toString, oe = ue ? ue.toStringTag : void 0;
 function et(e) {
-  var o = Qe.call(e, re), l = e[re];
+  var l = Qe.call(e, oe), s = e[oe];
   try {
-    e[re] = void 0;
-    var s = !0;
+    e[oe] = void 0;
+    var i = !0;
   } catch {
   }
   var h = Ze.call(e);
-  return s && (o ? e[re] = l : delete e[re]), h;
+  return i && (l ? e[oe] = s : delete e[oe]), h;
 }
 var tt = Object.prototype, at = tt.toString;
 function nt(e) {
   return at.call(e);
 }
-var rt = "[object Null]", ot = "[object Undefined]", Ie = ie ? ie.toStringTag : void 0;
+var rt = "[object Null]", ot = "[object Undefined]", Me = ue ? ue.toStringTag : void 0;
 function lt(e) {
-  return e == null ? e === void 0 ? ot : rt : Ie && Ie in Object(e) ? et(e) : nt(e);
+  return e == null ? e === void 0 ? ot : rt : Me && Me in Object(e) ? et(e) : nt(e);
 }
 function st(e) {
   return e != null && typeof e == "object";
@@ -124,92 +124,92 @@ function ut(e) {
 }
 var ct = /\s/;
 function ft(e) {
-  for (var o = e.length; o-- && ct.test(e.charAt(o)); )
+  for (var l = e.length; l-- && ct.test(e.charAt(l)); )
     ;
-  return o;
+  return l;
 }
 var dt = /^\s+/;
-function gt(e) {
+function vt(e) {
   return e && e.slice(0, ft(e) + 1).replace(dt, "");
 }
-function ge(e) {
-  var o = typeof e;
-  return e != null && (o == "object" || o == "function");
+function me(e) {
+  var l = typeof e;
+  return e != null && (l == "object" || l == "function");
 }
-var Pe = NaN, mt = /^[-+]0x[0-9a-f]+$/i, vt = /^0b[01]+$/i, pt = /^0o[0-7]+$/i, ht = parseInt;
-function Se(e) {
+var Ie = NaN, mt = /^[-+]0x[0-9a-f]+$/i, gt = /^0b[01]+$/i, pt = /^0o[0-7]+$/i, yt = parseInt;
+function Pe(e) {
   if (typeof e == "number")
     return e;
   if (ut(e))
-    return Pe;
-  if (ge(e)) {
-    var o = typeof e.valueOf == "function" ? e.valueOf() : e;
-    e = ge(o) ? o + "" : o;
+    return Ie;
+  if (me(e)) {
+    var l = typeof e.valueOf == "function" ? e.valueOf() : e;
+    e = me(l) ? l + "" : l;
   }
   if (typeof e != "string")
     return e === 0 ? e : +e;
-  e = gt(e);
-  var l = vt.test(e);
-  return l || pt.test(e) ? ht(e.slice(2), l ? 2 : 8) : mt.test(e) ? Pe : +e;
+  e = vt(e);
+  var s = gt.test(e);
+  return s || pt.test(e) ? yt(e.slice(2), s ? 2 : 8) : mt.test(e) ? Ie : +e;
 }
-var ce = function() {
-  return Ae.Date.now();
-}, yt = "Expected a function", bt = Math.max, xt = Math.min;
-function ke(e, o, l) {
-  var s, h, v, a, n, d, u = 0, c = !1, b = !1, m = !0;
+var fe = function() {
+  return $e.Date.now();
+}, ht = "Expected a function", bt = Math.max, xt = Math.min;
+function Ee(e, l, s) {
+  var i, h, m, a, n, v, f = 0, d = !1, b = !1, r = !0;
   if (typeof e != "function")
-    throw new TypeError(yt);
-  o = Se(o) || 0, ge(l) && (c = !!l.leading, b = "maxWait" in l, v = b ? bt(Se(l.maxWait) || 0, o) : v, m = "trailing" in l ? !!l.trailing : m);
-  function x(y) {
-    var W = s, w = h;
-    return s = h = void 0, u = y, a = e.apply(w, W), a;
+    throw new TypeError(ht);
+  l = Pe(l) || 0, me(s) && (d = !!s.leading, b = "maxWait" in s, m = b ? bt(Pe(s.maxWait) || 0, l) : m, r = "trailing" in s ? !!s.trailing : r);
+  function c(x) {
+    var D = i, T = h;
+    return i = h = void 0, f = x, a = e.apply(T, D), a;
   }
-  function F(y) {
-    return u = y, n = setTimeout(M, o), c ? x(y) : a;
+  function w(x) {
+    return f = x, n = setTimeout(M, l), d ? c(x) : a;
   }
-  function _(y) {
-    var W = y - d, w = y - u, N = o - W;
-    return b ? xt(N, v - w) : N;
+  function I(x) {
+    var D = x - v, T = x - f, F = l - D;
+    return b ? xt(F, m - T) : F;
   }
-  function H(y) {
-    var W = y - d, w = y - u;
-    return d === void 0 || W >= o || W < 0 || b && w >= v;
+  function E(x) {
+    var D = x - v, T = x - f;
+    return v === void 0 || D >= l || D < 0 || b && T >= m;
   }
   function M() {
-    var y = ce();
-    if (H(y))
-      return P(y);
-    n = setTimeout(M, _(y));
+    var x = fe();
+    if (E(x))
+      return P(x);
+    n = setTimeout(M, I(x));
   }
-  function P(y) {
-    return n = void 0, m && s ? x(y) : (s = h = void 0, a);
+  function P(x) {
+    return n = void 0, r && i ? c(x) : (i = h = void 0, a);
   }
-  function U() {
-    n !== void 0 && clearTimeout(n), u = 0, s = d = h = n = void 0;
+  function j() {
+    n !== void 0 && clearTimeout(n), f = 0, i = v = h = n = void 0;
   }
-  function S() {
-    return n === void 0 ? a : P(ce());
+  function N() {
+    return n === void 0 ? a : P(fe());
   }
-  function T() {
-    var y = ce(), W = H(y);
-    if (s = arguments, h = this, d = y, W) {
+  function S() {
+    var x = fe(), D = E(x);
+    if (i = arguments, h = this, v = x, D) {
       if (n === void 0)
-        return F(d);
+        return w(v);
       if (b)
-        return clearTimeout(n), n = setTimeout(M, o), x(d);
+        return clearTimeout(n), n = setTimeout(M, l), c(v);
     }
-    return n === void 0 && (n = setTimeout(M, o)), a;
+    return n === void 0 && (n = setTimeout(M, l)), a;
   }
-  return T.cancel = U, T.flush = S, T;
+  return S.cancel = j, S.flush = N, S;
 }
-function fe(e) {
-  const o = window.innerWidth, l = e.sizes;
-  return o >= 1536 && l["2xl"] ? l["2xl"] : o >= 1280 && l.xl ? l.xl : o >= 1024 && l.lg ? l.lg : o >= 768 && l.md ? l.md : o >= 640 && l.sm ? l.sm : l.base;
+function de(e) {
+  const l = window.innerWidth, s = e.sizes;
+  return l >= 1536 && s["2xl"] ? s["2xl"] : l >= 1280 && s.xl ? s.xl : l >= 1024 && s.lg ? s.lg : l >= 768 && s.md ? s.md : l >= 640 && s.sm ? s.sm : s.base;
 }
 function wt(e) {
-  return e.reduce((l, s) => Math.max(l, s.top + s.columnHeight), 0) + 500;
+  return e.reduce((s, i) => Math.max(s, i.top + i.columnHeight), 0) + 500;
 }
-function Mt(e) {
+function Tt(e) {
   return {
     transform: `translate3d(${e.left}px, ${e.top}px, 0)`,
     top: "0px",
@@ -218,94 +218,94 @@ function Mt(e) {
     height: `${e.columnHeight}px`
   };
 }
-function Tt(e, o = 0) {
+function Mt(e, l = 0) {
   return {
-    style: Mt(e),
+    style: Tt(e),
     "data-top": e.top,
     "data-left": e.left,
     "data-id": `${e.page}-${e.id}`,
-    "data-index": o
+    "data-index": l
   };
 }
-function me(e, o) {
-  if (!e.length || o <= 0)
-    return new Array(Math.max(1, o)).fill(0);
-  const s = Array.from(new Set(e.map((a) => a.left))).sort((a, n) => a - n).slice(0, o), h = /* @__PURE__ */ new Map();
-  for (let a = 0; a < s.length; a++) h.set(s[a], a);
-  const v = new Array(s.length).fill(0);
+function ge(e, l) {
+  if (!e.length || l <= 0)
+    return new Array(Math.max(1, l)).fill(0);
+  const i = Array.from(new Set(e.map((a) => a.left))).sort((a, n) => a - n).slice(0, l), h = /* @__PURE__ */ new Map();
+  for (let a = 0; a < i.length; a++) h.set(i[a], a);
+  const m = new Array(i.length).fill(0);
   for (const a of e) {
     const n = h.get(a.left);
-    n != null && (v[n] = Math.max(v[n], a.top + a.columnHeight));
+    n != null && (m[n] = Math.max(m[n], a.top + a.columnHeight));
   }
-  for (; v.length < o; ) v.push(0);
-  return v;
+  for (; m.length < l; ) m.push(0);
+  return m;
 }
-function It(e, o) {
-  function l(a, n) {
-    const d = parseInt(a.dataset.left || "0", 10), u = parseInt(a.dataset.top || "0", 10), c = parseInt(a.dataset.index || "0", 10), b = Math.min(c * 20, 160), m = a.style.getPropertyValue("--masonry-opacity-delay");
+function It(e, l) {
+  function s(a, n) {
+    const v = parseInt(a.dataset.left || "0", 10), f = parseInt(a.dataset.top || "0", 10), d = parseInt(a.dataset.index || "0", 10), b = Math.min(d * 20, 160), r = a.style.getPropertyValue("--masonry-opacity-delay");
     a.style.setProperty("--masonry-opacity-delay", `${b}ms`), requestAnimationFrame(() => {
-      a.style.opacity = "1", a.style.transform = `translate3d(${d}px, ${u}px, 0) scale(1)`;
-      const x = () => {
-        m ? a.style.setProperty("--masonry-opacity-delay", m) : a.style.removeProperty("--masonry-opacity-delay"), a.removeEventListener("transitionend", x), n();
+      a.style.opacity = "1", a.style.transform = `translate3d(${v}px, ${f}px, 0) scale(1)`;
+      const c = () => {
+        r ? a.style.setProperty("--masonry-opacity-delay", r) : a.style.removeProperty("--masonry-opacity-delay"), a.removeEventListener("transitionend", c), n();
       };
-      a.addEventListener("transitionend", x);
+      a.addEventListener("transitionend", c);
     });
   }
-  function s(a) {
-    const n = parseInt(a.dataset.left || "0", 10), d = parseInt(a.dataset.top || "0", 10);
-    a.style.opacity = "0", a.style.transform = `translate3d(${n}px, ${d + 10}px, 0) scale(0.985)`;
+  function i(a) {
+    const n = parseInt(a.dataset.left || "0", 10), v = parseInt(a.dataset.top || "0", 10);
+    a.style.opacity = "0", a.style.transform = `translate3d(${n}px, ${v + 10}px, 0) scale(0.985)`;
   }
   function h(a) {
-    const n = parseInt(a.dataset.left || "0", 10), d = parseInt(a.dataset.top || "0", 10);
-    a.style.transition = "none", a.style.opacity = "1", a.style.transform = `translate3d(${n}px, ${d}px, 0) scale(1)`, a.style.removeProperty("--masonry-opacity-delay"), requestAnimationFrame(() => {
+    const n = parseInt(a.dataset.left || "0", 10), v = parseInt(a.dataset.top || "0", 10);
+    a.style.transition = "none", a.style.opacity = "1", a.style.transform = `translate3d(${n}px, ${v}px, 0) scale(1)`, a.style.removeProperty("--masonry-opacity-delay"), requestAnimationFrame(() => {
       a.style.transition = "";
     });
   }
-  function v(a, n) {
-    const d = parseInt(a.dataset.left || "0", 10), u = parseInt(a.dataset.top || "0", 10), c = typeof (o == null ? void 0 : o.leaveDurationMs) == "number" ? o.leaveDurationMs : NaN;
-    let b = Number.isFinite(c) && c > 0 ? c : NaN;
+  function m(a, n) {
+    const v = parseInt(a.dataset.left || "0", 10), f = parseInt(a.dataset.top || "0", 10), d = typeof (l == null ? void 0 : l.leaveDurationMs) == "number" ? l.leaveDurationMs : NaN;
+    let b = Number.isFinite(d) && d > 0 ? d : NaN;
     if (!Number.isFinite(b)) {
       const M = getComputedStyle(a).getPropertyValue("--masonry-leave-duration") || "", P = parseFloat(M);
       b = Number.isFinite(P) && P > 0 ? P : 200;
     }
-    const m = a.style.transitionDuration, x = () => {
-      a.removeEventListener("transitionend", F), clearTimeout(_), a.style.transitionDuration = m || "";
-    }, F = (H) => {
-      (!H || H.target === a) && (x(), n());
-    }, _ = setTimeout(() => {
-      x(), n();
+    const r = a.style.transitionDuration, c = () => {
+      a.removeEventListener("transitionend", w), clearTimeout(I), a.style.transitionDuration = r || "";
+    }, w = (E) => {
+      (!E || E.target === a) && (c(), n());
+    }, I = setTimeout(() => {
+      c(), n();
     }, b + 100);
     requestAnimationFrame(() => {
-      a.style.transitionDuration = `${b}ms`, a.style.opacity = "0", a.style.transform = `translate3d(${d}px, ${u + 10}px, 0) scale(0.985)`, a.addEventListener("transitionend", F);
+      a.style.transitionDuration = `${b}ms`, a.style.opacity = "0", a.style.transform = `translate3d(${v}px, ${f + 10}px, 0) scale(0.985)`, a.addEventListener("transitionend", w);
     });
   }
   return {
-    onEnter: l,
-    onBeforeEnter: s,
+    onEnter: s,
+    onBeforeEnter: i,
     onBeforeLeave: h,
-    onLeave: v
+    onLeave: m
   };
 }
 function Pt({
   container: e,
-  masonry: o,
-  columns: l,
-  containerHeight: s,
+  masonry: l,
+  columns: s,
+  containerHeight: i,
   isLoading: h,
-  pageSize: v,
+  pageSize: m,
   refreshLayout: a,
   setItemsRaw: n,
-  loadNext: d,
-  loadThresholdPx: u
+  loadNext: v,
+  loadThresholdPx: f
 }) {
-  let c = 0;
-  async function b(m) {
+  let d = 0;
+  async function b(r) {
     if (!e.value) return;
-    const x = m ?? me(o.value, l.value), F = x.length ? Math.max(...x) : 0, _ = e.value.scrollTop + e.value.clientHeight, H = e.value.scrollTop > c + 1;
-    c = e.value.scrollTop;
-    const M = typeof u == "number" ? u : 200, P = M >= 0 ? Math.max(0, F - M) : Math.max(0, F + M);
-    if (_ >= P && H && !h.value) {
-      await d(), await Q();
+    const c = r ?? ge(l.value, s.value), w = c.length ? Math.max(...c) : 0, I = e.value.scrollTop + e.value.clientHeight, E = e.value.scrollTop > d + 1;
+    d = e.value.scrollTop;
+    const M = typeof f == "number" ? f : 200, P = M >= 0 ? Math.max(0, w - M) : Math.max(0, w + M);
+    if (I >= P && E && !h.value) {
+      await v(), await Q();
       return;
     }
   }
@@ -313,101 +313,166 @@ function Pt({
     handleScroll: b
   };
 }
-const St = { class: "relative w-full h-full group" }, kt = { class: "w-full h-full rounded-xl overflow-hidden shadow-sm hover:shadow-md transition-all duration-300 bg-white relative" }, Et = {
+const Et = { class: "relative w-full h-full group" }, kt = { class: "w-full h-full rounded-xl overflow-hidden shadow-sm hover:shadow-md transition-all duration-300 bg-white relative" }, St = {
   key: 0,
-  class: "absolute inset-0 flex items-center justify-center bg-slate-100"
+  class: "absolute inset-0 flex flex-col items-center justify-center bg-slate-100 text-slate-400 text-sm p-4 text-center"
 }, Lt = {
   key: 1,
+  class: "absolute inset-0 flex items-center justify-center bg-slate-100"
+}, Nt = {
+  key: 2,
   class: "absolute inset-0 flex flex-col items-center justify-center bg-slate-50 text-slate-400 text-sm p-4 text-center"
-}, Ht = ["src"], Nt = { class: "absolute bottom-0 left-0 right-0 p-3 opacity-0 group-hover:opacity-100 transform translate-y-2 group-hover:translate-y-0 transition-all duration-300 delay-75" }, $t = { class: "text-white text-xs font-medium truncate drop-shadow-md" }, ve = /* @__PURE__ */ Le({
+}, Ht = ["src"], $t = ["src"], At = { class: "absolute bottom-0 left-0 right-0 p-3 opacity-0 group-hover:opacity-100 transform translate-y-2 group-hover:translate-y-0 transition-all duration-300 delay-75 pointer-events-none" }, Ft = { class: "text-white text-xs font-medium truncate drop-shadow-md" }, pe = /* @__PURE__ */ Se({
   __name: "MasonryItem",
   props: {
     item: {},
-    remove: { type: Function }
+    remove: {},
+    type: { default: void 0 },
+    notFound: { type: Boolean, default: void 0 }
   },
   setup(e) {
-    const o = e, l = L(!1), s = L(!1), h = L(null);
-    function v(a) {
-      return new Promise((n, d) => {
-        if (!a) {
-          d(new Error("No image source provided"));
+    const l = e, s = k(!1), i = k(!1), h = k(null), m = k(!1), a = k(!1), n = k(null), v = Z(() => {
+      var r;
+      return l.type ?? ((r = l.item) == null ? void 0 : r.type) ?? "image";
+    }), f = Z(() => {
+      var r;
+      return l.notFound ?? ((r = l.item) == null ? void 0 : r.notFound) ?? !1;
+    });
+    function d(r) {
+      return new Promise((c, w) => {
+        if (!r) {
+          w(new Error("No image source provided"));
           return;
         }
-        const u = new Image(), c = Date.now(), b = 300;
-        u.onload = () => {
-          const m = Date.now() - c, x = Math.max(0, b - m);
+        const I = new Image(), E = Date.now(), M = 300;
+        I.onload = () => {
+          const P = Date.now() - E, j = Math.max(0, M - P);
           setTimeout(() => {
-            l.value = !0, s.value = !1, n();
-          }, x);
-        }, u.onerror = () => {
-          s.value = !0, l.value = !1, d(new Error("Failed to load image"));
-        }, u.src = a;
+            s.value = !0, i.value = !1, c();
+          }, j);
+        }, I.onerror = () => {
+          i.value = !0, s.value = !1, w(new Error("Failed to load image"));
+        }, I.src = r;
       });
     }
-    return He(async () => {
-      var n, d;
-      console.log("[MasonryItem] Component mounted", (n = o.item) == null ? void 0 : n.id);
-      const a = (d = o.item) == null ? void 0 : d.src;
-      if (a) {
-        h.value = a, l.value = !1, s.value = !1;
-        try {
-          await v(a);
-        } catch {
+    function b(r) {
+      return new Promise((c, w) => {
+        if (!r) {
+          w(new Error("No video source provided"));
+          return;
+        }
+        const I = document.createElement("video"), E = Date.now(), M = 300;
+        I.preload = "metadata", I.muted = !0, I.onloadedmetadata = () => {
+          const P = Date.now() - E, j = Math.max(0, M - P);
+          setTimeout(() => {
+            m.value = !0, a.value = !1, c();
+          }, j);
+        }, I.onerror = () => {
+          a.value = !0, m.value = !1, w(new Error("Failed to load video"));
+        }, I.src = r;
+      });
+    }
+    return Le(async () => {
+      var c, w;
+      if (console.log("[MasonryItem] Component mounted", (c = l.item) == null ? void 0 : c.id), f.value)
+        return;
+      const r = (w = l.item) == null ? void 0 : w.src;
+      if (r)
+        if (v.value === "video") {
+          n.value = r, m.value = !1, a.value = !1;
+          try {
+            await b(r);
+          } catch {
+          }
+        } else {
+          h.value = r, s.value = !1, i.value = !1;
+          try {
+            await d(r);
+          } catch {
+          }
         }
-      }
     }), Ne(
       () => {
-        var a;
-        return (a = o.item) == null ? void 0 : a.src;
+        var r;
+        return (r = l.item) == null ? void 0 : r.src;
       },
-      async (a) => {
-        if (a && a !== h.value) {
-          l.value = !1, s.value = !1, h.value = a;
-          try {
-            await v(a);
-          } catch {
+      async (r) => {
+        if (!(!r || f.value)) {
+          if (v.value === "video") {
+            if (r !== n.value) {
+              m.value = !1, a.value = !1, n.value = r;
+              try {
+                await b(r);
+              } catch {
+              }
+            }
+          } else if (r !== h.value) {
+            s.value = !1, i.value = !1, h.value = r;
+            try {
+              await d(r);
+            } catch {
+            }
           }
         }
       }
-    ), (a, n) => (V(), q("div", St, [
-      $e(a.$slots, "default", {
-        item: a.item,
-        remove: a.remove,
-        imageLoaded: l.value,
-        imageError: s.value
+    ), (r, c) => (G(), V("div", Et, [
+      He(r.$slots, "default", {
+        item: r.item,
+        remove: r.remove,
+        imageLoaded: s.value,
+        imageError: i.value,
+        videoLoaded: m.value,
+        videoError: a.value,
+        showNotFound: f.value
       }, () => [
-        O("div", kt, [
-          !l.value && !s.value ? (V(), q("div", Et, n[1] || (n[1] = [
-            O("div", { class: "animate-spin rounded-full h-8 w-8 border-b-2 border-blue-500" }, null, -1)
-          ]))) : oe("", !0),
-          s.value ? (V(), q("div", Lt, n[2] || (n[2] = [
-            O("i", { class: "fas fa-image text-2xl mb-2 opacity-50" }, null, -1),
-            O("span", null, "Failed to load image", -1)
-          ]))) : oe("", !0),
-          l.value && h.value ? (V(), q("img", {
-            key: 2,
+        A("div", kt, [
+          f.value ? (G(), V("div", St, c[4] || (c[4] = [
+            A("i", { class: "fas fa-search text-3xl mb-3 opacity-50" }, null, -1),
+            A("span", { class: "font-medium" }, "Not Found", -1),
+            A("span", { class: "text-xs mt-1 opacity-75" }, "This item could not be located", -1)
+          ]))) : v.value === "image" && !s.value && !i.value || v.value === "video" && !m.value && !a.value ? (G(), V("div", Lt, c[5] || (c[5] = [
+            A("div", { class: "animate-spin rounded-full h-8 w-8 border-b-2 border-blue-500" }, null, -1)
+          ]))) : v.value === "image" && i.value || v.value === "video" && a.value ? (G(), V("div", Nt, [
+            A("i", {
+              class: ve(v.value === "video" ? "fas fa-video text-2xl mb-2 opacity-50" : "fas fa-image text-2xl mb-2 opacity-50")
+            }, null, 2),
+            A("span", null, "Failed to load " + ie(v.value), 1)
+          ])) : le("", !0),
+          v.value === "image" && s.value && h.value && !f.value ? (G(), V("img", {
+            key: 3,
             src: h.value,
             class: "w-full h-full object-cover transition-transform duration-500 group-hover:scale-105",
             loading: "lazy",
             decoding: "async"
-          }, null, 8, Ht)) : oe("", !0),
-          n[4] || (n[4] = O("div", { class: "absolute inset-0 bg-gradient-to-t from-black/50 via-transparent to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300" }, null, -1)),
-          a.remove ? (V(), q("button", {
-            key: 3,
+          }, null, 8, Ht)) : le("", !0),
+          v.value === "video" && m.value && n.value && !f.value ? (G(), V("video", {
+            key: 4,
+            src: n.value,
+            class: "w-full h-full object-cover transition-transform duration-500 group-hover:scale-105",
+            muted: "",
+            loop: "",
+            playsinline: "",
+            onMouseenter: c[0] || (c[0] = (w) => w.target.play()),
+            onMouseleave: c[1] || (c[1] = (w) => w.target.pause()),
+            onError: c[2] || (c[2] = (w) => a.value = !0)
+          }, null, 40, $t)) : le("", !0),
+          c[7] || (c[7] = A("div", { class: "absolute inset-0 bg-gradient-to-t from-black/50 via-transparent to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 pointer-events-none" }, null, -1)),
+          r.remove ? (G(), V("button", {
+            key: 5,
             class: "absolute top-2 right-2 w-8 h-8 flex items-center justify-center bg-white/90 backdrop-blur-sm text-slate-700 rounded-full shadow-sm opacity-0 group-hover:opacity-100 transform translate-y-2 group-hover:translate-y-0 transition-all duration-300 hover:bg-red-500 hover:text-white cursor-pointer",
-            onClick: n[0] || (n[0] = ze((d) => a.remove(a.item), ["stop"])),
+            onClick: c[3] || (c[3] = je((w) => r.remove(r.item), ["stop"])),
             "aria-label": "Remove item"
-          }, n[3] || (n[3] = [
-            O("i", { class: "fas fa-times text-sm" }, null, -1)
-          ]))) : oe("", !0),
-          O("div", Nt, [
-            O("p", $t, "Item #" + de(String(a.item.id).split("-")[0]), 1)
+          }, c[6] || (c[6] = [
+            A("i", { class: "fas fa-times text-sm" }, null, -1)
+          ]))) : le("", !0),
+          A("div", At, [
+            A("p", Ft, "Item #" + ie(String(r.item.id).split("-")[0]), 1)
           ])
         ])
       ])
     ]));
   }
-}), At = /* @__PURE__ */ Le({
+}), Wt = /* @__PURE__ */ Se({
   __name: "Masonry",
   props: {
     getNextPage: {
@@ -507,8 +572,8 @@ const St = { class: "relative w-full h-full group" }, kt = { class: "w-full h-fu
     "retry:stop",
     "remove-all:complete"
   ],
-  setup(e, { expose: o, emit: l }) {
-    const s = e, h = {
+  setup(e, { expose: l, emit: s }) {
+    const i = e, h = {
       sizes: { base: 1, sm: 2, md: 3, lg: 4, xl: 5, "2xl": 6 },
       gutterX: 10,
       gutterY: 10,
@@ -517,41 +582,41 @@ const St = { class: "relative w-full h-full group" }, kt = { class: "w-full h-fu
       paddingLeft: 0,
       paddingRight: 0,
       placement: "masonry"
-    }, v = se(() => {
+    }, m = Z(() => {
       var t;
       return {
         ...h,
-        ...s.layout,
+        ...i.layout,
         sizes: {
           ...h.sizes,
-          ...((t = s.layout) == null ? void 0 : t.sizes) || {}
+          ...((t = i.layout) == null ? void 0 : t.sizes) || {}
         }
       };
-    }), a = l, n = se({
-      get: () => s.items,
+    }), a = s, n = Z({
+      get: () => i.items,
       set: (t) => a("update:items", t)
-    }), d = L(7), u = L(null), c = L([]), b = L(null), m = L(!1), x = L(0), F = L(/* @__PURE__ */ new Set());
-    function _(t) {
+    }), v = k(7), f = k(null), d = k([]), b = k(null), r = k(!1), c = k(0), w = k(/* @__PURE__ */ new Set());
+    function I(t) {
       return typeof t == "number" && Number.isFinite(t) && t > 0;
     }
-    function H(t, r) {
+    function E(t, o) {
       try {
         if (!Array.isArray(t) || t.length === 0) return;
-        const i = t.filter((g) => !_(g == null ? void 0 : g.width) || !_(g == null ? void 0 : g.height));
-        if (i.length === 0) return;
-        const f = [];
-        for (const g of i) {
-          const A = (g == null ? void 0 : g.id) ?? `idx:${t.indexOf(g)}`;
-          F.value.has(A) || (F.value.add(A), f.push(A));
+        const u = t.filter((p) => !I(p == null ? void 0 : p.width) || !I(p == null ? void 0 : p.height));
+        if (u.length === 0) return;
+        const g = [];
+        for (const p of u) {
+          const B = (p == null ? void 0 : p.id) ?? `idx:${t.indexOf(p)}`;
+          w.value.has(B) || (w.value.add(B), g.push(B));
         }
-        if (f.length > 0) {
-          const g = f.slice(0, 10);
+        if (g.length > 0) {
+          const p = g.slice(0, 10);
           console.warn(
             "[Masonry] Items missing width/height detected:",
             {
-              context: r,
-              count: f.length,
-              sampleIds: g,
+              context: o,
+              count: g.length,
+              sampleIds: p,
               hint: "Ensure each item has positive width and height. Consider providing fallbacks (e.g., 512x512) at the data layer."
             }
           );
@@ -559,364 +624,367 @@ const St = { class: "relative w-full h-full group" }, kt = { class: "w-full h-fu
       } catch {
       }
     }
-    const M = L(0), P = L(0), U = s.virtualBufferPx, S = L(!1), T = L({
+    const M = k(0), P = k(0), j = i.virtualBufferPx, N = k(!1), S = k({
       distanceToTrigger: 0,
       isNearTrigger: !1
-    }), y = (t) => {
-      if (!u.value) return;
-      const { scrollTop: r, clientHeight: i } = u.value, f = r + i, g = t ?? me(n.value, d.value), A = g.length ? Math.max(...g) : 0, C = typeof s.loadThresholdPx == "number" ? s.loadThresholdPx : 200, K = C >= 0 ? Math.max(0, A - C) : Math.max(0, A + C), xe = Math.max(0, K - f), je = xe <= 100;
-      T.value = {
-        distanceToTrigger: Math.round(xe),
-        isNearTrigger: je
+    }), x = (t) => {
+      if (!f.value) return;
+      const { scrollTop: o, clientHeight: u } = f.value, g = o + u, p = t ?? ge(n.value, v.value), B = p.length ? Math.max(...p) : 0, _ = typeof i.loadThresholdPx == "number" ? i.loadThresholdPx : 200, K = _ >= 0 ? Math.max(0, B - _) : Math.max(0, B + _), we = Math.max(0, K - g), Oe = we <= 100;
+      S.value = {
+        distanceToTrigger: Math.round(we),
+        isNearTrigger: Oe
       };
-    }, { onEnter: W, onBeforeEnter: w, onBeforeLeave: N, onLeave: I } = It(n, { leaveDurationMs: s.leaveDurationMs });
-    function D(t, r) {
-      if (S.value) {
-        const i = parseInt(t.dataset.left || "0", 10), f = parseInt(t.dataset.top || "0", 10);
-        t.style.transition = "none", t.style.opacity = "1", t.style.transform = `translate3d(${i}px, ${f}px, 0) scale(1)`, t.style.removeProperty("--masonry-opacity-delay"), requestAnimationFrame(() => {
-          t.style.transition = "", r();
+    }, { onEnter: D, onBeforeEnter: T, onBeforeLeave: F, onLeave: L } = It(n, { leaveDurationMs: i.leaveDurationMs });
+    function z(t, o) {
+      if (N.value) {
+        const u = parseInt(t.dataset.left || "0", 10), g = parseInt(t.dataset.top || "0", 10);
+        t.style.transition = "none", t.style.opacity = "1", t.style.transform = `translate3d(${u}px, ${g}px, 0) scale(1)`, t.style.removeProperty("--masonry-opacity-delay"), requestAnimationFrame(() => {
+          t.style.transition = "", o();
         });
       } else
-        W(t, r);
+        D(t, o);
     }
-    function Z(t) {
-      if (S.value) {
-        const r = parseInt(t.dataset.left || "0", 10), i = parseInt(t.dataset.top || "0", 10);
-        t.style.transition = "none", t.style.opacity = "1", t.style.transform = `translate3d(${r}px, ${i}px, 0) scale(1)`, t.style.removeProperty("--masonry-opacity-delay");
+    function ee(t) {
+      if (N.value) {
+        const o = parseInt(t.dataset.left || "0", 10), u = parseInt(t.dataset.top || "0", 10);
+        t.style.transition = "none", t.style.opacity = "1", t.style.transform = `translate3d(${o}px, ${u}px, 0) scale(1)`, t.style.removeProperty("--masonry-opacity-delay");
       } else
-        w(t);
+        T(t);
     }
-    function ee(t) {
-      S.value || N(t);
+    function te(t) {
+      N.value || F(t);
     }
-    function X(t, r) {
-      S.value ? r() : I(t, r);
+    function X(t, o) {
+      N.value ? o() : L(t, o);
     }
-    const te = se(() => {
-      const t = M.value - U, r = M.value + P.value + U, i = n.value;
-      return !i || i.length === 0 ? [] : i.filter((f) => {
-        const g = f.top;
-        return f.top + f.columnHeight >= t && g <= r;
+    const ae = Z(() => {
+      const t = M.value - j, o = M.value + P.value + j, u = n.value;
+      return !u || u.length === 0 ? [] : u.filter((g) => {
+        const p = g.top;
+        return g.top + g.columnHeight >= t && p <= o;
       });
     }), { handleScroll: Y } = Pt({
-      container: u,
+      container: f,
       masonry: n,
-      columns: d,
-      containerHeight: x,
-      isLoading: m,
-      pageSize: s.pageSize,
-      refreshLayout: j,
+      columns: v,
+      containerHeight: c,
+      isLoading: r,
+      pageSize: i.pageSize,
+      refreshLayout: R,
       setItemsRaw: (t) => {
         n.value = t;
       },
-      loadNext: z,
-      loadThresholdPx: s.loadThresholdPx
+      loadNext: C,
+      loadThresholdPx: i.loadThresholdPx
     });
-    o({
-      isLoading: m,
-      refreshLayout: j,
-      containerHeight: x,
-      remove: G,
-      removeMany: R,
-      removeAll: Be,
-      loadNext: z,
-      loadPage: B,
-      refreshCurrentPage: $,
-      reset: Oe,
+    l({
+      isLoading: r,
+      refreshLayout: R,
+      containerHeight: c,
+      remove: U,
+      removeMany: q,
+      removeAll: Fe,
+      loadNext: C,
+      loadPage: O,
+      refreshCurrentPage: W,
+      reset: Be,
       init: De,
-      paginationHistory: c,
+      paginationHistory: d,
       cancelLoad: he,
-      scrollToTop: pe,
-      totalItems: se(() => n.value.length)
+      scrollToTop: ye,
+      totalItems: Z(() => n.value.length)
     });
     function J(t) {
-      const r = wt(t);
-      let i = 0;
-      if (u.value) {
-        const { scrollTop: f, clientHeight: g } = u.value;
-        i = f + g + 100;
+      const o = wt(t);
+      let u = 0;
+      if (f.value) {
+        const { scrollTop: g, clientHeight: p } = f.value;
+        u = g + p + 100;
       }
-      x.value = Math.max(r, i);
-    }
-    function j(t) {
-      if (!u.value) return;
-      H(t, "refreshLayout");
-      const r = t.map((f, g) => ({
-        ...f,
-        originalIndex: f.originalIndex ?? g
-      })), i = Ye(r, u.value, d.value, v.value);
-      J(i), n.value = i;
-    }
-    function ae(t, r) {
-      return new Promise((i) => {
-        const f = Math.max(0, t | 0), g = Date.now();
-        r(f, f);
-        const A = setInterval(() => {
-          if (E.value) {
-            clearInterval(A), i();
+      c.value = Math.max(o, u);
+    }
+    function R(t) {
+      if (!f.value) return;
+      E(t, "refreshLayout");
+      const o = t.map((g, p) => ({
+        ...g,
+        originalIndex: g.originalIndex ?? p
+      })), u = Ye(o, f.value, v.value, m.value);
+      J(u), n.value = u;
+    }
+    function ne(t, o) {
+      return new Promise((u) => {
+        const g = Math.max(0, t | 0), p = Date.now();
+        o(g, g);
+        const B = setInterval(() => {
+          if ($.value) {
+            clearInterval(B), u();
             return;
           }
-          const C = Date.now() - g, K = Math.max(0, f - C);
-          r(K, f), K <= 0 && (clearInterval(A), i());
+          const _ = Date.now() - p, K = Math.max(0, g - _);
+          o(K, g), K <= 0 && (clearInterval(B), u());
         }, 100);
       });
     }
-    async function p(t) {
+    async function y(t) {
       try {
-        const r = await k(() => s.getNextPage(t));
-        return j([...n.value, ...r.items]), r;
-      } catch (r) {
-        throw console.error("Error in getContent:", r), r;
+        const o = await H(() => i.getNextPage(t));
+        return R([...n.value, ...o.items]), o;
+      } catch (o) {
+        throw console.error("Error in getContent:", o), o;
       }
     }
-    async function k(t) {
-      let r = 0;
-      const i = s.retryMaxAttempts;
-      let f = s.retryInitialDelayMs;
+    async function H(t) {
+      let o = 0;
+      const u = i.retryMaxAttempts;
+      let g = i.retryInitialDelayMs;
       for (; ; )
         try {
-          const g = await t();
-          return r > 0 && a("retry:stop", { attempt: r, success: !0 }), g;
-        } catch (g) {
-          if (r++, r > i)
-            throw a("retry:stop", { attempt: r - 1, success: !1 }), g;
-          a("retry:start", { attempt: r, max: i, totalMs: f }), await ae(f, (A, C) => {
-            a("retry:tick", { attempt: r, remainingMs: A, totalMs: C });
-          }), f += s.retryBackoffStepMs;
+          const p = await t();
+          return o > 0 && a("retry:stop", { attempt: o, success: !0 }), p;
+        } catch (p) {
+          if (o++, o > u)
+            throw a("retry:stop", { attempt: o - 1, success: !1 }), p;
+          a("retry:start", { attempt: o, max: u, totalMs: g }), await ne(g, (B, _) => {
+            a("retry:tick", { attempt: o, remainingMs: B, totalMs: _ });
+          }), g += i.retryBackoffStepMs;
         }
     }
-    async function B(t) {
-      if (!m.value) {
-        E.value = !1, m.value = !0;
+    async function O(t) {
+      if (!r.value) {
+        $.value = !1, r.value = !0;
         try {
-          const r = n.value.length;
-          if (E.value) return;
-          const i = await p(t);
-          return E.value ? void 0 : (b.value = t, c.value.push(i.nextPage), await ne(r), i);
-        } catch (r) {
-          throw console.error("Error loading page:", r), r;
+          const o = n.value.length;
+          if ($.value) return;
+          const u = await y(t);
+          return $.value ? void 0 : (b.value = t, d.value.push(u.nextPage), await re(o), u);
+        } catch (o) {
+          throw console.error("Error loading page:", o), o;
         } finally {
-          m.value = !1;
+          r.value = !1;
         }
       }
     }
-    async function z() {
-      if (!m.value) {
-        E.value = !1, m.value = !0;
+    async function C() {
+      if (!r.value) {
+        $.value = !1, r.value = !0;
         try {
           const t = n.value.length;
-          if (E.value) return;
-          const r = c.value[c.value.length - 1], i = await p(r);
-          return E.value ? void 0 : (b.value = r, c.value.push(i.nextPage), await ne(t), i);
+          if ($.value) return;
+          const o = d.value[d.value.length - 1], u = await y(o);
+          return $.value ? void 0 : (b.value = o, d.value.push(u.nextPage), await re(t), u);
         } catch (t) {
           throw console.error("Error loading next page:", t), t;
         } finally {
-          m.value = !1;
+          r.value = !1;
         }
       }
     }
-    async function $() {
-      if (console.log("[Masonry] refreshCurrentPage called, isLoading:", m.value, "currentPage:", b.value), !m.value) {
-        E.value = !1, m.value = !0;
+    async function W() {
+      if (console.log("[Masonry] refreshCurrentPage called, isLoading:", r.value, "currentPage:", b.value), !r.value) {
+        $.value = !1, r.value = !0;
         try {
           const t = b.value;
           if (console.log("[Masonry] pageToRefresh:", t), t == null) {
-            console.warn("[Masonry] No current page to refresh - currentPage:", b.value, "paginationHistory:", c.value);
+            console.warn("[Masonry] No current page to refresh - currentPage:", b.value, "paginationHistory:", d.value);
             return;
           }
-          n.value = [], x.value = 0, c.value = [t], await Q();
-          const r = await p(t);
-          if (E.value) return;
-          b.value = t, c.value.push(r.nextPage);
-          const i = n.value.length;
-          return await ne(i), r;
+          n.value = [], c.value = 0, d.value = [t], await Q();
+          const o = await y(t);
+          if ($.value) return;
+          b.value = t, d.value.push(o.nextPage);
+          const u = n.value.length;
+          return await re(u), o;
         } catch (t) {
           throw console.error("[Masonry] Error refreshing current page:", t), t;
         } finally {
-          m.value = !1;
+          r.value = !1;
         }
       }
     }
-    async function G(t) {
-      const r = n.value.filter((i) => i.id !== t.id);
-      if (n.value = r, await Q(), console.log("[Masonry] remove - next.length:", r.length, "paginationHistory.length:", c.value.length), r.length === 0 && c.value.length > 0) {
-        if (s.autoRefreshOnEmpty)
-          console.log("[Masonry] All items removed, calling refreshCurrentPage"), await $();
+    async function U(t) {
+      const o = n.value.filter((u) => u.id !== t.id);
+      if (n.value = o, await Q(), console.log("[Masonry] remove - next.length:", o.length, "paginationHistory.length:", d.value.length), o.length === 0 && d.value.length > 0) {
+        if (i.autoRefreshOnEmpty)
+          console.log("[Masonry] All items removed, calling refreshCurrentPage"), await W();
         else {
           console.log("[Masonry] All items removed, calling loadNext and forcing backfill");
           try {
-            await z(), await ne(0, !0);
+            await C(), await re(0, !0);
           } catch {
           }
         }
         return;
       }
-      await new Promise((i) => requestAnimationFrame(() => i())), requestAnimationFrame(() => {
-        j(r);
+      await new Promise((u) => requestAnimationFrame(() => u())), requestAnimationFrame(() => {
+        R(o);
       });
     }
-    async function R(t) {
+    async function q(t) {
       if (!t || t.length === 0) return;
-      const r = new Set(t.map((f) => f.id)), i = n.value.filter((f) => !r.has(f.id));
-      if (n.value = i, await Q(), i.length === 0 && c.value.length > 0) {
-        if (s.autoRefreshOnEmpty)
-          await $();
+      const o = new Set(t.map((g) => g.id)), u = n.value.filter((g) => !o.has(g.id));
+      if (n.value = u, await Q(), u.length === 0 && d.value.length > 0) {
+        if (i.autoRefreshOnEmpty)
+          await W();
         else
           try {
-            await z(), await ne(0, !0);
+            await C(), await re(0, !0);
           } catch {
           }
         return;
       }
-      await new Promise((f) => requestAnimationFrame(() => f())), requestAnimationFrame(() => {
-        j(i);
+      await new Promise((g) => requestAnimationFrame(() => g())), requestAnimationFrame(() => {
+        R(u);
       });
     }
-    function pe(t) {
-      u.value && u.value.scrollTo({
+    function ye(t) {
+      f.value && f.value.scrollTo({
         top: 0,
         behavior: (t == null ? void 0 : t.behavior) ?? "smooth",
         ...t
       });
     }
-    async function Be() {
-      pe({ behavior: "smooth" }), n.value = [], x.value = 0, await Q(), a("remove-all:complete");
+    async function Fe() {
+      ye({ behavior: "smooth" }), n.value = [], c.value = 0, await Q(), a("remove-all:complete");
     }
-    function Fe() {
-      d.value = fe(v.value), j(n.value), u.value && (M.value = u.value.scrollTop, P.value = u.value.clientHeight);
+    function We() {
+      v.value = de(m.value), R(n.value), f.value && (M.value = f.value.scrollTop, P.value = f.value.clientHeight);
     }
-    let le = !1;
-    const E = L(!1);
-    async function ne(t, r = !1) {
-      if (!r && !s.backfillEnabled || le || E.value) return;
-      const i = (t || 0) + (s.pageSize || 0);
-      if (!(!s.pageSize || s.pageSize <= 0 || c.value[c.value.length - 1] == null) && !(n.value.length >= i)) {
-        le = !0;
+    let se = !1;
+    const $ = k(!1);
+    async function re(t, o = !1) {
+      if (!o && !i.backfillEnabled || se || $.value) return;
+      const u = (t || 0) + (i.pageSize || 0);
+      if (!(!i.pageSize || i.pageSize <= 0 || d.value[d.value.length - 1] == null) && !(n.value.length >= u)) {
+        se = !0;
         try {
-          let g = 0;
-          for (a("backfill:start", { target: i, fetched: n.value.length, calls: g }); n.value.length < i && g < s.backfillMaxCalls && c.value[c.value.length - 1] != null && !E.value && (await ae(s.backfillDelayMs, (C, K) => {
+          let p = 0;
+          for (a("backfill:start", { target: u, fetched: n.value.length, calls: p }); n.value.length < u && p < i.backfillMaxCalls && d.value[d.value.length - 1] != null && !$.value && (await ne(i.backfillDelayMs, (_, K) => {
             a("backfill:tick", {
               fetched: n.value.length,
-              target: i,
-              calls: g,
-              remainingMs: C,
+              target: u,
+              calls: p,
+              remainingMs: _,
               totalMs: K
             });
-          }), !E.value); ) {
-            const A = c.value[c.value.length - 1];
+          }), !$.value); ) {
+            const B = d.value[d.value.length - 1];
             try {
-              m.value = !0;
-              const C = await p(A);
-              if (E.value) break;
-              c.value.push(C.nextPage);
+              r.value = !0;
+              const _ = await y(B);
+              if ($.value) break;
+              d.value.push(_.nextPage);
             } finally {
-              m.value = !1;
+              r.value = !1;
             }
-            g++;
+            p++;
           }
-          a("backfill:stop", { fetched: n.value.length, calls: g });
+          a("backfill:stop", { fetched: n.value.length, calls: p });
         } finally {
-          le = !1;
+          se = !1;
         }
       }
     }
     function he() {
-      E.value = !0, m.value = !1, le = !1;
+      $.value = !0, r.value = !1, se = !1;
     }
-    function Oe() {
-      he(), E.value = !1, u.value && u.value.scrollTo({
+    function Be() {
+      he(), $.value = !1, f.value && f.value.scrollTo({
         top: 0,
         behavior: "smooth"
-      }), n.value = [], x.value = 0, b.value = s.loadAtPage, c.value = [s.loadAtPage], T.value = {
+      }), n.value = [], c.value = 0, b.value = i.loadAtPage, d.value = [i.loadAtPage], S.value = {
         distanceToTrigger: 0,
         isNearTrigger: !1
       };
     }
-    const ye = ke(async () => {
-      u.value && (M.value = u.value.scrollTop, P.value = u.value.clientHeight), S.value = !0, await Q(), await new Promise((r) => requestAnimationFrame(() => r())), S.value = !1;
-      const t = me(n.value, d.value);
-      Y(t), y(t);
-    }, 200), be = ke(Fe, 200);
-    function De(t, r, i) {
-      b.value = r, c.value = [r], c.value.push(i), H(t, "init"), j([...n.value, ...t]), y();
+    const be = Ee(async () => {
+      f.value && (M.value = f.value.scrollTop, P.value = f.value.clientHeight), N.value = !0, await Q(), await new Promise((o) => requestAnimationFrame(() => o())), N.value = !1;
+      const t = ge(n.value, v.value);
+      Y(t), x(t);
+    }, 200), xe = Ee(We, 200);
+    function De(t, o, u) {
+      b.value = o, d.value = [o], d.value.push(u), E(t, "init"), R([...n.value, ...t]), x();
     }
     return Ne(
-      v,
+      m,
       () => {
-        u.value && (d.value = fe(v.value), j(n.value));
+        f.value && (v.value = de(m.value), R(n.value));
       },
       { deep: !0 }
-    ), He(async () => {
+    ), Le(async () => {
       var t;
       try {
-        d.value = fe(v.value), u.value && (M.value = u.value.scrollTop, P.value = u.value.clientHeight);
-        const r = s.loadAtPage;
-        c.value = [r], s.skipInitialLoad || await B(c.value[0]), y();
-      } catch (r) {
-        console.error("Error during component initialization:", r), m.value = !1;
+        v.value = de(m.value), f.value && (M.value = f.value.scrollTop, P.value = f.value.clientHeight);
+        const o = i.loadAtPage;
+        d.value = [o], i.skipInitialLoad || await O(d.value[0]), x();
+      } catch (o) {
+        console.error("Error during component initialization:", o), r.value = !1;
       }
-      (t = u.value) == null || t.addEventListener("scroll", ye, { passive: !0 }), window.addEventListener("resize", be);
-    }), Re(() => {
+      (t = f.value) == null || t.addEventListener("scroll", be, { passive: !0 }), window.addEventListener("resize", xe);
+    }), ze(() => {
       var t;
-      (t = u.value) == null || t.removeEventListener("scroll", ye), window.removeEventListener("resize", be);
-    }), (t, r) => (V(), q("div", {
-      class: we(["overflow-auto w-full flex-1 masonry-container", { "force-motion": s.forceMotion }]),
+      (t = f.value) == null || t.removeEventListener("scroll", be), window.removeEventListener("resize", xe);
+    }), (t, o) => (G(), V("div", {
+      class: ve(["overflow-auto w-full flex-1 masonry-container", { "force-motion": i.forceMotion }]),
       ref_key: "container",
-      ref: u
+      ref: f
     }, [
-      O("div", {
+      A("div", {
         class: "relative",
-        style: Ce({ height: `${x.value}px`, "--masonry-duration": `${e.transitionDurationMs}ms`, "--masonry-leave-duration": `${e.leaveDurationMs}ms`, "--masonry-ease": e.transitionEasing })
+        style: Re({ height: `${c.value}px`, "--masonry-duration": `${e.transitionDurationMs}ms`, "--masonry-leave-duration": `${e.leaveDurationMs}ms`, "--masonry-ease": e.transitionEasing })
       }, [
-        Me(_e, {
+        Te(Ce, {
           name: "masonry",
           css: !1,
-          onEnter: D,
-          onBeforeEnter: Z,
+          onEnter: z,
+          onBeforeEnter: ee,
           onLeave: X,
-          onBeforeLeave: ee
+          onBeforeLeave: te
         }, {
           default: qe(() => [
-            (V(!0), q(Ve, null, Ge(te.value, (i, f) => (V(), q("div", Te({
-              key: `${i.page}-${i.id}`,
+            (G(!0), V(_e, null, Ve(ae.value, (u, g) => (G(), V("div", Ge({
+              key: `${u.page}-${u.id}`,
               class: "absolute masonry-item",
               ref_for: !0
-            }, Ue(Tt)(i, f), {
-              style: { paddingTop: `${v.value.header}px`, paddingBottom: `${v.value.footer}px` }
+            }, Ue(Mt)(u, g), {
+              style: { paddingTop: `${m.value.header}px`, paddingBottom: `${m.value.footer}px` }
             }), [
-              $e(t.$slots, "item", Te({ ref_for: !0 }, { item: i, remove: G }), () => [
-                Me(ve, {
-                  item: i,
-                  remove: G
+              He(t.$slots, "default", {
+                item: u,
+                remove: U
+              }, () => [
+                Te(pe, {
+                  item: u,
+                  remove: U
                 }, null, 8, ["item"])
               ], !0)
             ], 16))), 128))
           ]),
           _: 3
         }),
-        x.value > 0 ? (V(), q("div", {
+        c.value > 0 ? (G(), V("div", {
           key: 0,
-          class: we(["fixed bottom-4 right-4 bg-gray-800 text-white text-xs rounded-full px-3 py-1.5 shadow-lg z-10 transition-opacity duration-300", { "opacity-50 hover:opacity-100": !T.value.isNearTrigger, "opacity-100": T.value.isNearTrigger }])
+          class: ve(["fixed bottom-4 right-4 bg-gray-800 text-white text-xs rounded-full px-3 py-1.5 shadow-lg z-10 transition-opacity duration-300", { "opacity-50 hover:opacity-100": !S.value.isNearTrigger, "opacity-100": S.value.isNearTrigger }])
         }, [
-          O("span", null, de(n.value.length) + " items", 1),
-          r[0] || (r[0] = O("span", { class: "mx-2" }, "|", -1)),
-          O("span", null, de(T.value.distanceToTrigger) + "px to load", 1)
-        ], 2)) : oe("", !0)
+          A("span", null, ie(n.value.length) + " items", 1),
+          o[0] || (o[0] = A("span", { class: "mx-2" }, "|", -1)),
+          A("span", null, ie(S.value.distanceToTrigger) + "px to load", 1)
+        ], 2)) : le("", !0)
       ], 4)
     ], 2));
   }
-}), Wt = (e, o) => {
-  const l = e.__vccOpts || e;
-  for (const [s, h] of o)
-    l[s] = h;
-  return l;
-}, Ee = /* @__PURE__ */ Wt(At, [["__scopeId", "data-v-08b0e6d9"]]), Ft = {
+}), Bt = (e, l) => {
+  const s = e.__vccOpts || e;
+  for (const [i, h] of l)
+    s[i] = h;
+  return s;
+}, ke = /* @__PURE__ */ Bt(Wt, [["__scopeId", "data-v-110c3294"]]), Ot = {
   install(e) {
-    e.component("WyxosMasonry", Ee), e.component("WMasonry", Ee), e.component("WyxosMasonryItem", ve), e.component("WMasonryItem", ve);
+    e.component("WyxosMasonry", ke), e.component("WMasonry", ke), e.component("WyxosMasonryItem", pe), e.component("WMasonryItem", pe);
   }
 };
 export {
-  Ee as Masonry,
-  ve as MasonryItem,
-  Ft as default
+  ke as Masonry,
+  pe as MasonryItem,
+  Ot as default
 };