@wyxos/vibe 2.1.6 → 2.1.8

package/lib/index.js

@@ -1,8 +1,9 @@
-import { defineComponent as we, ref as w, computed as I, onMounted as Ee, onUnmounted as Pt, createElementBlock as S, openBlock as k, normalizeStyle as $, createCommentVNode as j, createElementVNode as T, normalizeClass as ht, mergeDefaults as Wt, useAttrs as Ut, shallowRef as gt, provide as Gt, watch as J, mergeProps as Kt, renderSlot as Jt, toDisplayString as pt, Fragment as yt, renderList as wt, createVNode as X, unref as ie, nextTick as xt, inject as Qt } from "vue";
-const Zt = {
+import { defineComponent as Se, ref as p, computed as S, onMounted as He, onUnmounted as Pt, createElementBlock as I, openBlock as k, normalizeStyle as $, createCommentVNode as j, createElementVNode as T, normalizeClass as ht, mergeDefaults as Ut, useAttrs as Kt, shallowRef as gt, provide as Jt, watch as ne, mergeProps as Qt, renderSlot as Zt, toDisplayString as pt, Fragment as yt, renderList as wt, createVNode as X, unref as ce, nextTick as xt, inject as en } from "vue";
+const tn = {
   mode: "default",
   pageSize: 20,
   backfillRequestDelayMs: 2e3,
+  enterStaggerMs: 40,
   page: 1,
   itemWidth: 300,
   prefetchThresholdPx: 200,
@@ -11,41 +12,41 @@ const Zt = {
   headerHeight: 0,
   footerHeight: 0,
   overscanPx: 600
-}, en = {
+}, nn = {
   key: 0,
   "data-testid": "masonry-loader-spinner",
   class: "absolute inset-0 flex items-center justify-center"
-}, tn = {
+}, ln = {
   key: 1,
   "data-testid": "masonry-loader-error",
   class: "absolute inset-0 flex flex-col items-center justify-center gap-2 p-3"
-}, nn = ["src", "width", "height", "alt"], on = ["poster"], ln = ["src"], bt = /* @__PURE__ */ we({
+}, an = ["src", "width", "height", "alt"], on = ["poster"], sn = ["src"], bt = /* @__PURE__ */ Se({
   __name: "MasonryLoader",
   props: {
     item: {},
     timeoutMs: { default: 15e3 }
   },
   emits: ["success", "error"],
-  setup(o, { emit: g }) {
-    const u = o, s = g, i = w(null), f = w(!1), c = w(!1), r = w(!1), v = w(0), m = I(() => {
+  setup(l, { emit: y }) {
+    const u = l, s = y, i = p(null), m = p(!1), c = p(!1), r = p(!1), h = p(0), g = S(() => {
       const _ = u.item?.width, P = u.item?.height;
       return { aspectRatio: `${_} / ${P}` };
-    }), M = I(() => u.item?.type === "image");
-    let F = null, B = null;
+    }), M = S(() => u.item?.type === "image");
+    let F = null, A = null;
     function N() {
-      B != null && (window.clearTimeout(B), B = null);
+      A != null && (window.clearTimeout(A), A = null);
     }
-    function R() {
+    function E() {
       N();
       const _ = typeof u.timeoutMs == "number" && Number.isFinite(u.timeoutMs) ? u.timeoutMs : 0;
-      _ <= 0 || (B = window.setTimeout(() => {
-        f.value && (c.value || r.value || W(new Error("timeout")));
+      _ <= 0 || (A = window.setTimeout(() => {
+        m.value && (c.value || r.value || W(new Error("timeout")));
       }, _));
     }
     function L() {
-      f.value || (f.value = !0, c.value = !1, r.value = !1, R());
+      m.value || (m.value = !0, c.value = !1, r.value = !1, E());
     }
-    Ee(() => {
+    He(() => {
       if (typeof IntersectionObserver > "u") {
         L();
         return;
@@ -63,22 +64,22 @@ const Zt = {
     }), Pt(() => {
       F?.disconnect(), F = null, N();
     });
-    function A() {
+    function C() {
       c.value || (c.value = !0, r.value = !1, N(), s("success", u.item));
     }
     function W(_) {
       r.value || (c.value = !1, r.value = !0, N(), s("error", { item: u.item, error: _ }));
     }
     function O() {
-      f.value && (c.value = !1, r.value = !1, v.value += 1, R());
+      m.value && (c.value = !1, r.value = !1, h.value += 1, E());
     }
-    return (_, P) => (k(), S("div", {
+    return (_, P) => (k(), I("div", {
       ref_key: "rootEl",
       ref: i,
       class: "relative bg-slate-100",
-      style: $(m.value)
+      style: $(g.value)
     }, [
-      f.value && !c.value && !r.value ? (k(), S("div", en, P[2] || (P[2] = [
+      m.value && !c.value && !r.value ? (k(), I("div", nn, P[2] || (P[2] = [
         T("svg", {
           class: "h-5 w-5 animate-spin text-slate-500",
           viewBox: "0 0 24 24",
@@ -99,7 +100,7 @@ const Zt = {
             d: "M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"
           })
         ], -1)
-      ]))) : f.value && r.value ? (k(), S("div", tn, [
+      ]))) : m.value && r.value ? (k(), I("div", ln, [
         P[3] || (P[3] = T("p", { class: "text-center text-xs font-medium text-red-700" }, "Failed to load", -1)),
         T("button", {
           type: "button",
@@ -108,8 +109,8 @@ const Zt = {
           onClick: O
         }, " Retry ")
       ])) : j("", !0),
-      f.value && M.value && !r.value ? (k(), S("img", {
-        key: u.item.id + ":img:" + v.value,
+      m.value && M.value && !r.value ? (k(), I("img", {
+        key: u.item.id + ":img:" + h.value,
         class: ht([
           "h-full w-full object-cover transition-opacity duration-300",
           c.value ? "opacity-100" : "opacity-0"
@@ -119,10 +120,10 @@ const Zt = {
         height: u.item.height,
         loading: "lazy",
         alt: u.item.id,
-        onLoad: A,
+        onLoad: C,
         onError: P[0] || (P[0] = (q) => W(q))
-      }, null, 42, nn)) : f.value && !r.value ? (k(), S("video", {
-        key: u.item.id + ":vid:" + v.value,
+      }, null, 42, an)) : m.value && !r.value ? (k(), I("video", {
+        key: u.item.id + ":vid:" + h.value,
         class: ht([
           "h-full w-full object-cover transition-opacity duration-300",
           c.value ? "opacity-100" : "opacity-0"
@@ -130,62 +131,62 @@ const Zt = {
         poster: u.item.preview,
         controls: "",
         preload: "metadata",
-        onLoadedmetadata: A,
+        onLoadedmetadata: C,
         onError: P[1] || (P[1] = (q) => W(q))
       }, [
         T("source", {
           src: u.item.original,
           type: "video/mp4"
-        }, null, 8, ln)
+        }, null, 8, sn)
       ], 42, on)) : j("", !0)
     ], 4));
   }
 }), Tt = Symbol("masonryItemRegistry");
-function sn(o, g) {
-  return !o || o <= 0 || !g || g <= 0 ? 1 : Math.max(1, Math.floor(o / g));
+function rn(l, y) {
+  return !l || l <= 0 || !y || y <= 0 ? 1 : Math.max(1, Math.floor(l / y));
 }
-function an(o, g, u, s = 0) {
-  if (!o || o <= 0 || !g || g <= 0) return u;
-  const i = typeof s == "number" && s > 0 ? s : 0, f = Math.max(0, g - 1) * i, c = o - f;
-  return !c || c <= 0 ? u : c / g;
+function un(l, y, u, s = 0) {
+  if (!l || l <= 0 || !y || y <= 0) return u;
+  const i = typeof s == "number" && s > 0 ? s : 0, m = Math.max(0, y - 1) * i, c = l - m;
+  return !c || c <= 0 ? u : c / y;
 }
-function rn(o, g) {
-  const u = o?.width, s = o?.height;
-  return typeof u == "number" && typeof s == "number" && u > 0 && s > 0 ? s / u * g : g;
+function cn(l, y) {
+  const u = l?.width, s = l?.height;
+  return typeof u == "number" && typeof s == "number" && u > 0 && s > 0 ? s / u * y : y;
 }
-function _t(o) {
-  return Number.isFinite(o) && o > 0 ? Math.floor(o) : 1;
+function _t(l) {
+  return Number.isFinite(l) && l > 0 ? Math.floor(l) : 1;
 }
-function Ne(o) {
-  return Number.isFinite(o) && o > 0 ? Math.floor(o) : 0;
+function Le(l) {
+  return Number.isFinite(l) && l > 0 ? Math.floor(l) : 0;
 }
-function un(o) {
-  async function g(s) {
-    const i = Ne(s);
+function fn(l) {
+  async function y(s) {
+    const i = Le(s);
     if (i <= 0) return;
-    o.stats.value = {
-      ...o.stats.value,
+    l.stats.value = {
+      ...l.stats.value,
       cooldownMsTotal: i,
       cooldownMsRemaining: i
     };
-    const f = Date.now(), c = 100;
+    const m = Date.now(), c = 100;
     await new Promise((r) => {
-      const v = setInterval(() => {
-        const m = Date.now() - f, M = Math.max(0, i - m);
-        o.stats.value = {
-          ...o.stats.value,
+      const h = setInterval(() => {
+        const g = Date.now() - m, M = Math.max(0, i - g);
+        l.stats.value = {
+          ...l.stats.value,
           cooldownMsTotal: i,
           cooldownMsRemaining: M
-        }, M <= 0 && (clearInterval(v), r());
+        }, M <= 0 && (clearInterval(h), r());
       }, c);
     });
   }
   async function u(s) {
-    const i = _t(o.getPageSize()), f = o.isEnabled(), c = Ne(o.getRequestDelayMs()), r = [];
-    let v = 0;
-    o.buffer.value.length && (v = o.buffer.value.length, r.push(...o.buffer.value), o.buffer.value = []), o.stats.value = {
-      ...o.stats.value,
-      enabled: f,
+    const i = _t(l.getPageSize()), m = l.isEnabled(), c = Le(l.getRequestDelayMs()), r = [];
+    let h = 0;
+    l.buffer.value.length && (h = l.buffer.value.length, r.push(...l.buffer.value), l.buffer.value = []), l.stats.value = {
+      ...l.stats.value,
+      enabled: m,
       isBackfillActive: !1,
       isRequestInFlight: !1,
       requestPage: null,
@@ -198,13 +199,13 @@ function un(o) {
       pageSize: i,
       bufferSize: 0
     };
-    const m = [];
-    let M = s, F = 0, B = !1;
+    const g = [];
+    let M = s, F = 0, A = !1;
     for (; r.length < i && M != null; ) {
       const L = M;
-      B && (o.stats.value = {
-        ...o.stats.value,
-        enabled: f,
+      A && (l.stats.value = {
+        ...l.stats.value,
+        enabled: m,
         isBackfillActive: !0,
         isRequestInFlight: !0,
         requestPage: L,
@@ -216,16 +217,16 @@ function un(o) {
         cooldownMsRemaining: 0,
         pageSize: i
       });
-      const A = await o.getContent(L);
-      m.push(L), B && (o.stats.value = {
-        ...o.stats.value,
-        enabled: f,
+      const C = await l.getContent(L);
+      g.push(L), A && (l.stats.value = {
+        ...l.stats.value,
+        enabled: m,
         isBackfillActive: !0,
         isRequestInFlight: !1,
         requestPage: null
-      }), F += A.items.length, o.markEnterFromLeft(A.items), r.push(...A.items), M = A.nextPage, !B && r.length < i && M != null ? (B = !0, o.stats.value = {
-        ...o.stats.value,
-        enabled: f,
+      }), F += C.items.length, l.markEnterFromLeft(C.items), r.push(...C.items), M = C.nextPage, !A && r.length < i && M != null ? (A = !0, l.stats.value = {
+        ...l.stats.value,
+        enabled: m,
         isBackfillActive: !0,
         isRequestInFlight: !1,
         requestPage: null,
@@ -236,20 +237,20 @@ function un(o) {
         cooldownMsTotal: c,
         cooldownMsRemaining: 0,
         pageSize: i
-      }) : B && (o.stats.value = {
-        ...o.stats.value,
-        enabled: f,
+      }) : A && (l.stats.value = {
+        ...l.stats.value,
+        enabled: m,
         isBackfillActive: !0,
         progress: {
           collected: Math.min(r.length, i),
           target: i
         }
-      }), B && r.length < i && M != null && await g(c);
+      }), A && r.length < i && M != null && await y(c);
     }
-    const N = r.slice(0, i), R = r.slice(i);
-    return o.buffer.value = R, o.stats.value = {
-      ...o.stats.value,
-      enabled: f,
+    const N = r.slice(0, i), E = r.slice(i);
+    return l.buffer.value = E, l.stats.value = {
+      ...l.stats.value,
+      enabled: m,
       isBackfillActive: !1,
       isRequestInFlight: !1,
       requestPage: null,
@@ -260,82 +261,83 @@ function un(o) {
       cooldownMsTotal: c,
       cooldownMsRemaining: 0,
       pageSize: i,
-      bufferSize: R.length,
+      bufferSize: E.length,
       lastBatch: {
         startPage: s,
-        pages: m,
-        usedFromBuffer: v,
+        pages: g,
+        usedFromBuffer: h,
         fetchedFromNetwork: F,
         collectedTotal: r.length,
         emitted: N.length,
-        carried: R.length
+        carried: E.length
       },
       totals: {
-        pagesFetched: o.stats.value.totals.pagesFetched + m.length,
-        itemsFetchedFromNetwork: o.stats.value.totals.itemsFetchedFromNetwork + F
+        pagesFetched: l.stats.value.totals.pagesFetched + g.length,
+        itemsFetchedFromNetwork: l.stats.value.totals.itemsFetchedFromNetwork + F
       }
-    }, { batchItems: N, pages: m, nextPage: M };
+    }, { batchItems: N, pages: g, nextPage: M };
   }
   return { loadBackfillBatch: u };
 }
-function cn(o) {
-  const g = o.columnCount, u = o.columnWidth, s = o.gapX, i = o.gapY, f = o.headerHeight, c = o.footerHeight, r = o.bucketPx, v = Array.from({ length: g }, () => 0), m = new Array(o.items.length), M = new Array(o.items.length), F = /* @__PURE__ */ new Map(), B = /* @__PURE__ */ new Map();
+function dn(l) {
+  const y = l.columnCount, u = l.columnWidth, s = l.gapX, i = l.gapY, m = l.headerHeight, c = l.footerHeight, r = l.bucketPx, h = Array.from({ length: y }, () => 0), g = new Array(l.items.length), M = new Array(l.items.length), F = /* @__PURE__ */ new Map(), A = /* @__PURE__ */ new Map();
   let N = 0;
-  for (let R = 0; R < o.items.length; R += 1) {
-    const L = o.items[R];
-    L?.id && B.set(L.id, R);
-    let A = 0;
-    for (let H = 1; H < v.length; H += 1)
-      v[H] < v[A] && (A = H);
-    const W = A * (u + s), O = v[A], _ = rn(L, u) + f + c;
-    m[R] = { x: W, y: O }, M[R] = _, v[A] = O + _ + i, N = Math.max(N, O + _);
+  for (let E = 0; E < l.items.length; E += 1) {
+    const L = l.items[E];
+    L?.id && A.set(L.id, E);
+    let C = 0;
+    for (let H = 1; H < h.length; H += 1)
+      h[H] < h[C] && (C = H);
+    const W = C * (u + s), O = h[C], _ = cn(L, u) + m + c;
+    g[E] = { x: W, y: O }, M[E] = _, h[C] = O + _ + i, N = Math.max(N, O + _);
     const P = Math.floor(O / r), q = Math.floor((O + _) / r);
     for (let H = P; H <= q; H += 1) {
-      const Q = F.get(H);
-      Q ? Q.push(R) : F.set(H, [R]);
+      const le = F.get(H);
+      le ? le.push(E) : F.set(H, [E]);
     }
   }
-  return { positions: m, heights: M, buckets: F, contentHeight: N, indexById: B };
+  return { positions: g, heights: M, buckets: F, contentHeight: N, indexById: A };
 }
-function fn(o) {
-  const g = o.itemCount;
-  if (!g) return [];
-  if (o.viewportHeight <= 0) return Array.from({ length: g }, (v, m) => m);
-  const u = Math.max(0, o.scrollTop - o.overscanPx), s = o.scrollTop + o.viewportHeight + o.overscanPx, i = Math.floor(u / o.bucketPx), f = Math.floor(s / o.bucketPx), c = /* @__PURE__ */ new Set();
-  for (let v = i; v <= f; v += 1) {
-    const m = o.buckets.get(v);
-    if (m)
-      for (const M of m) c.add(M);
+function vn(l) {
+  const y = l.itemCount;
+  if (!y) return [];
+  if (l.viewportHeight <= 0) return Array.from({ length: y }, (h, g) => g);
+  const u = Math.max(0, l.scrollTop - l.overscanPx), s = l.scrollTop + l.viewportHeight + l.overscanPx, i = Math.floor(u / l.bucketPx), m = Math.floor(s / l.bucketPx), c = /* @__PURE__ */ new Set();
+  for (let h = i; h <= m; h += 1) {
+    const g = l.buckets.get(h);
+    if (g)
+      for (const M of g) c.add(M);
   }
   const r = Array.from(c);
-  return r.sort((v, m) => v - m), r;
+  return r.sort((h, g) => h - g), r;
 }
-const dn = { class: "hidden" }, vn = {
+const mn = { class: "hidden" }, hn = {
   key: 0,
   class: "flex h-full items-center justify-center"
-}, mn = {
+}, gn = {
   key: 1,
   class: "text-sm font-medium text-red-700"
-}, hn = { class: "relative" }, gn = {
+}, pn = { class: "relative" }, yn = {
   key: 0,
   class: "pointer-events-auto absolute inset-0"
-}, pn = { class: "relative" }, yn = {
+}, wn = { class: "relative" }, xn = {
   key: 0,
   class: "pointer-events-auto absolute inset-0"
-}, wn = { class: "mt-4 pb-2 text-center text-xs text-slate-600" }, xn = {
+}, bn = { class: "mt-4 pb-2 text-center text-xs text-slate-600" }, Mn = {
   key: 0,
   class: "inline-flex items-center justify-center gap-2"
-}, bn = { key: 1 }, Mn = { key: 2 }, Mt = 100, In = 200, It = 600, St = 300, kt = 600, Ft = 600, Sn = 5, kn = 1e3, Fn = /* @__PURE__ */ we({
+}, Sn = { key: 1 }, In = { key: 2 }, Mt = 100, kn = 200, St = 600, It = 300, kt = 600, Ft = 600, Fn = 400, Pn = 5, Tn = 1e3, _n = /* @__PURE__ */ Se({
   inheritAttrs: !1,
   __name: "Masonry",
-  props: /* @__PURE__ */ Wt({
+  props: /* @__PURE__ */ Ut({
     getContent: {},
     mode: {},
     pageSize: {},
     backfillRequestDelayMs: {},
+    enterStaggerMs: {},
     items: {},
     page: {},
-    restoredPagesLoaded: {},
+    restoredPages: {},
     itemWidth: {},
     prefetchThresholdPx: {},
     gapX: {},
@@ -343,10 +345,10 @@ const dn = { class: "hidden" }, vn = {
     headerHeight: {},
     footerHeight: {},
     overscanPx: {}
-  }, Zt),
+  }, tn),
   emits: ["update:items", "preloaded", "failures"],
-  setup(o, { expose: g, emit: u }) {
-    const s = o, i = u, f = Ut(), c = we({
+  setup(l, { expose: y, emit: u }) {
+    const s = l, i = u, m = Kt(), c = Se({
       name: "SlotRenderer",
       props: {
         slotFn: {
@@ -360,29 +362,29 @@ const dn = { class: "hidden" }, vn = {
       },
       setup(e) {
         return () => {
-          const n = e.slotFn;
-          return n ? n(e.slotProps) : null;
+          const t = e.slotFn;
+          return t ? t(e.slotProps) : null;
         };
       }
     }), r = gt(null);
-    Gt(Tt, (e) => {
+    Jt(Tt, (e) => {
       r.value || (r.value = e);
     });
-    const v = [], m = [];
+    const h = [], g = [];
     let M = null, F = null;
-    function B() {
-      if (!v.length) return;
-      const e = v.splice(0, v.length);
+    function A() {
+      if (!h.length) return;
+      const e = h.splice(0, h.length);
       i("preloaded", e);
     }
     function N() {
-      if (!m.length) return;
-      const e = m.splice(0, m.length);
+      if (!g.length) return;
+      const e = g.splice(0, g.length);
       i("failures", e);
     }
-    function R() {
+    function E() {
       M || (M = setTimeout(() => {
-        M = null, B();
+        M = null, A();
       }, Mt));
     }
     function L() {
@@ -390,241 +392,245 @@ const dn = { class: "hidden" }, vn = {
         F = null, N();
       }, Mt));
     }
-    function A(e) {
-      r.value?.onPreloaded?.(e), v.push(e), R();
+    function C(e) {
+      r.value?.onPreloaded?.(e), h.push(e), E();
     }
     function W(e) {
-      r.value?.onFailed?.(e), m.push(e), L();
+      r.value?.onFailed?.(e), g.push(e), L();
     }
-    Ee(() => {
+    He(() => {
       if (!r.value)
         throw new Error("[Masonry] Missing <MasonryItem> definition. Add <MasonryItem> as a child of <Masonry>.");
     });
-    const O = I(() => {
-      const { class: e, ...n } = f;
-      return n;
-    }), _ = w(null), P = w(0), q = w(0), H = w(0);
-    let Q;
-    const Z = I(() => s.gapX), Ce = I(() => s.gapY);
-    function He(e) {
+    const O = S(() => {
+      const { class: e, ...t } = m;
+      return t;
+    }), _ = p(null), P = p(0), q = p(0), H = p(0);
+    let le;
+    const ae = S(() => s.gapX), ze = S(() => s.gapY);
+    function qe(e) {
       if (!e) return 0;
-      const n = Math.max(0, Z.value);
-      return Math.max(0, e.clientWidth - n);
+      const t = Math.max(0, ae.value);
+      return Math.max(0, e.clientWidth - t);
     }
-    const ee = I(() => s.headerHeight), te = I(() => s.footerHeight), xe = I(() => r.value?.header), be = I(() => r.value?.footer), Me = I(() => r.value?.overlay), Le = I(() => !!xe.value), ze = I(() => !!be.value), qe = I(() => !!Me.value), Oe = I(() => {
-      if (ee.value > 0) return { height: `${ee.value}px` };
-    }), De = I(() => {
-      if (te.value > 0) return { height: `${te.value}px` };
-    }), ue = w([]), Ie = w([]), $e = w(/* @__PURE__ */ new Map()), Ve = w(0), he = w(/* @__PURE__ */ new Map());
-    function Ye(e) {
-      const n = typeof e == "number" && Number.isFinite(e) ? e : 0;
-      return rt.value + Math.max(0, n);
+    const oe = S(() => s.headerHeight), se = S(() => s.footerHeight), Ie = S(() => r.value?.header), ke = S(() => r.value?.footer), Fe = S(() => r.value?.overlay), De = S(() => !!Ie.value), Oe = S(() => !!ke.value), $e = S(() => !!Fe.value), Ve = S(() => {
+      if (oe.value > 0) return { height: `${oe.value}px` };
+    }), Ye = S(() => {
+      if (se.value > 0) return { height: `${se.value}px` };
+    }), fe = p([]), Pe = p([]), Xe = p(/* @__PURE__ */ new Map()), je = p(0), pe = p(/* @__PURE__ */ new Map());
+    function We(e) {
+      const t = typeof e == "number" && Number.isFinite(e) ? e : 0;
+      return rt.value + Math.max(0, t);
     }
-    const U = w(/* @__PURE__ */ new Set()), ne = w(/* @__PURE__ */ new Set()), ge = /* @__PURE__ */ new Set(), pe = w(/* @__PURE__ */ new Map()), V = w(/* @__PURE__ */ new Set()), Y = w([]);
+    const G = p(/* @__PURE__ */ new Set()), U = p(/* @__PURE__ */ new Set()), ye = /* @__PURE__ */ new Set(), de = p(/* @__PURE__ */ new Map());
     function Bt(e) {
-      const n = pe.value.get(e);
-      return n || { dx: 0, dy: 0 };
+      return Number.isFinite(e) ? Math.max(0, Math.min(250, e)) : 0;
+    }
+    function At(e) {
+      if (!U.value.has(e)) return;
+      const t = de.value.get(e) ?? 0;
+      if (!(t <= 0))
+        return `${t}ms`;
+    }
+    const we = p(/* @__PURE__ */ new Map()), V = p(/* @__PURE__ */ new Set()), Y = p([]);
+    function Et(e) {
+      const t = we.value.get(e);
+      return t || { dx: 0, dy: 0 };
     }
     function Rt(e) {
-      if (ne.value.has(e)) return `transform ${kt}ms ease-out`;
-      if (V.value.has(e)) return `transform ${St}ms ease-out`;
+      if (U.value.has(e)) return `transform ${kt}ms ease-out`;
+      if (V.value.has(e)) return `transform ${It}ms ease-out`;
     }
-    function At(e) {
-      const t = d.value[e]?.id, l = ue.value[e] ?? { x: 0, y: 0 }, a = Ie.value[e] ?? 0, h = a > 0 ? a : ve.value, p = l.x, x = t && U.value.has(t) ? Ye(h) : l.y, b = t ? Bt(t) : { dx: 0, dy: 0 };
-      return `translate3d(${p + b.dx}px,${x + b.dy}px,0)`;
+    function Ct(e) {
+      const n = d.value[e]?.id, a = fe.value[e] ?? { x: 0, y: 0 }, o = Pe.value[e] ?? 0, f = o > 0 ? o : he.value, v = a.x, x = n && G.value.has(n) ? We(f) : a.y, b = n ? Et(n) : { dx: 0, dy: 0 };
+      return `translate3d(${v + b.dx}px,${x + b.dy}px,0)`;
     }
-    function oe(e) {
-      (typeof requestAnimationFrame == "function" ? requestAnimationFrame : (t) => setTimeout(() => t(0), 0))(() => e());
+    function re(e) {
+      (typeof requestAnimationFrame == "function" ? requestAnimationFrame : (n) => setTimeout(() => n(0), 0))(() => e());
     }
-    function Et(e) {
-      oe(() => oe(e));
+    function Nt(e) {
+      re(() => re(e));
     }
-    const Xe = /* @__PURE__ */ new Set();
-    function je(e) {
+    const Ge = /* @__PURE__ */ new Set();
+    function Ue(e) {
       return typeof e == "number" && Number.isFinite(e) && e > 0;
     }
-    function Se(e) {
+    function Te(e) {
       if (!Array.isArray(e) || e.length === 0) return;
-      const n = new Set(U.value);
-      let t = !1;
-      for (const l of e) {
-        const a = l?.id;
-        if (a) {
-          if (!Xe.has(a)) {
-            const h = l?.width, p = l?.height;
-            (!je(h) || !je(p)) && (Xe.add(a), console.warn(
-              `[Masonry] Item "${a}" has invalid dimensions (width=${String(h)}, height=${String(
-                p
+      const t = new Set(G.value);
+      let n = !1;
+      for (const a of e) {
+        const o = a?.id;
+        if (o) {
+          if (!Ge.has(o)) {
+            const f = a?.width, v = a?.height;
+            (!Ue(f) || !Ue(v)) && (Ge.add(o), console.warn(
+              `[Masonry] Item "${o}" has invalid dimensions (width=${String(f)}, height=${String(
+                v
               )}); layout expects { id, width, height }.`
             ));
           }
-          n.has(a) || (n.add(a), t = !0);
+          t.has(o) || (t.add(o), n = !0);
         }
       }
-      t && (U.value = n);
+      n && (G.value = t);
     }
-    function We() {
+    function Ke() {
       const e = /* @__PURE__ */ new Map();
-      for (const n of Re.value) {
-        const l = d.value[n]?.id;
-        if (!l) continue;
-        const a = ue.value[n];
-        a && e.set(l, { x: a.x, y: a.y });
+      for (const t of Re.value) {
+        const a = d.value[t]?.id;
+        if (!a) continue;
+        const o = fe.value[t];
+        o && e.set(a, { x: o.x, y: o.y });
       }
       return e;
     }
-    function Ue(e, n) {
+    function Je(e, t) {
       if (!e.size) return;
-      const t = /* @__PURE__ */ new Map(), l = [];
-      for (const [h, p] of e.entries()) {
-        if (n?.has(h)) continue;
-        const x = he.value.get(h);
+      const n = /* @__PURE__ */ new Map(), a = [];
+      for (const [f, v] of e.entries()) {
+        if (t?.has(f)) continue;
+        const x = pe.value.get(f);
         if (x == null) continue;
-        const b = ue.value[x];
+        const b = fe.value[x];
         if (!b) continue;
-        const y = p.x - b.x, z = p.y - b.y;
-        (y || z) && (t.set(h, { dx: y, dy: z }), l.push(h));
+        const w = v.x - b.x, z = v.y - b.y;
+        (w || z) && (n.set(f, { dx: w, dy: z }), a.push(f));
       }
-      if (!t.size) return;
-      pe.value = t;
-      const a = new Set(V.value);
-      for (const h of l) a.delete(h);
-      V.value = a, oe(() => {
-        V.value = /* @__PURE__ */ new Set([...V.value, ...l]), oe(() => {
-          pe.value = /* @__PURE__ */ new Map();
+      if (!n.size) return;
+      we.value = n;
+      const o = new Set(V.value);
+      for (const f of a) o.delete(f);
+      V.value = o, re(() => {
+        V.value = /* @__PURE__ */ new Set([...V.value, ...a]), re(() => {
+          we.value = /* @__PURE__ */ new Map();
         });
       }), setTimeout(() => {
-        const h = new Set(V.value);
-        for (const p of l) h.delete(p);
-        V.value = h;
-      }, St);
+        const f = new Set(V.value);
+        for (const v of a) f.delete(v);
+        V.value = f;
+      }, It);
     }
-    const ce = w(!0), fe = w(!1), le = w("");
-    let E = 0;
-    function Ge(e) {
+    const K = p(!0), J = p(!1), ie = p("");
+    let R = 0;
+    function Qe(e) {
       return e instanceof Error && e.name === "AbortError";
     }
-    function Ke() {
+    function Ze() {
       const e = new Error("aborted");
       return e.name = "AbortError", e;
     }
-    function Nt(e) {
-      return new Promise((n) => setTimeout(n, e));
+    function Ht(e) {
+      return new Promise((t) => setTimeout(t, e));
     }
-    async function Je(e, n) {
-      let t = 0;
+    async function et(e, t) {
+      let n = 0;
       for (; ; ) {
-        if (n !== E) throw Ke();
+        if (t !== R) throw Ze();
         try {
           return await s.getContent(e);
-        } catch (l) {
-          if (n !== E) throw Ke();
-          if (t >= Sn) throw l;
-          t += 1, await Nt(t * kn);
+        } catch (a) {
+          if (t !== R) throw Ze();
+          if (n >= Pn) throw a;
+          n += 1, await Ht(n * Tn);
         }
       }
     }
-    const D = w([]), Qe = w([]), ke = w([]), C = w(s.page), Fe = w([]);
-    let se = null, ae = null, ye = 0;
-    function Ct(e) {
-      let n = -1;
-      for (const t of e) {
-        const l = t?.originalIndex;
-        de(l) && l > n && (n = l);
+    const D = p([]), tt = p([]), _e = p([]), B = p(s.page), xe = p([]);
+    let Q = null, Z = null, be = 0;
+    function Lt(e) {
+      let t = -1;
+      for (const n of e) {
+        const a = n?.originalIndex;
+        ve(a) && a > t && (t = a);
       }
-      ye = n + 1;
+      be = t + 1;
     }
-    function re(e) {
-      for (const n of e)
-        !n || typeof n != "object" || n.id && n.originalIndex == null && (n.originalIndex = ye, ye += 1);
+    function ue(e) {
+      for (const t of e)
+        !t || typeof t != "object" || t.id && t.originalIndex == null && (t.originalIndex = be, be += 1);
     }
-    const G = /* @__PURE__ */ new Map(), K = [];
-    function de(e) {
+    const ee = /* @__PURE__ */ new Map(), te = [];
+    function ve(e) {
       return typeof e == "number" && Number.isFinite(e);
     }
-    function Ht(e, n) {
-      if (!n.length) return e;
-      const t = /* @__PURE__ */ new Set();
-      for (const p of e) {
-        const x = p?.id;
-        x && t.add(x);
+    function zt(e, t) {
+      if (!t.length) return e;
+      const n = /* @__PURE__ */ new Set();
+      for (const v of e) {
+        const x = v?.id;
+        x && n.add(x);
       }
-      const l = [];
-      for (const p of n) {
-        const x = p?.id;
-        x && (t.has(x) || (l.push(p), t.add(x)));
+      const a = [];
+      for (const v of t) {
+        const x = v?.id;
+        x && (n.has(x) || (a.push(v), n.add(x)));
       }
-      if (!l.length) return e;
-      const a = l.slice().sort((p, x) => {
-        const b = de(p.originalIndex) ? p.originalIndex : Number.POSITIVE_INFINITY, y = de(x.originalIndex) ? x.originalIndex : Number.POSITIVE_INFINITY;
-        return b - y;
-      }), h = e.slice();
-      for (const p of a) {
-        const x = p.originalIndex;
-        if (!de(x)) {
-          h.push(p);
+      if (!a.length) return e;
+      const o = a.slice().sort((v, x) => {
+        const b = ve(v.originalIndex) ? v.originalIndex : Number.POSITIVE_INFINITY, w = ve(x.originalIndex) ? x.originalIndex : Number.POSITIVE_INFINITY;
+        return b - w;
+      }), f = e.slice();
+      for (const v of o) {
+        const x = v.originalIndex;
+        if (!ve(x)) {
+          f.push(v);
           continue;
         }
-        let b = 0, y = h.length;
-        for (; b < y; ) {
-          const z = b + y >> 1, me = h[z]?.originalIndex;
-          (de(me) ? me : Number.POSITIVE_INFINITY) <= x ? b = z + 1 : y = z;
+        let b = 0, w = f.length;
+        for (; b < w; ) {
+          const z = b + w >> 1, ge = f[z]?.originalIndex;
+          (ve(ge) ? ge : Number.POSITIVE_INFINITY) <= x ? b = z + 1 : w = z;
         }
-        h.splice(b, 0, p);
+        f.splice(b, 0, v);
       }
-      return h;
+      return f;
     }
-    async function Ze(e) {
+    async function nt(e) {
       if (!e.length) return;
-      Se(e);
-      const n = We();
-      d.value = Ht(d.value, e), await xt(), Ue(n);
+      Te(e);
+      const t = Ke();
+      d.value = zt(d.value, e), await xt(), Je(t);
     }
-    async function et(e) {
-      const t = (Array.isArray(e) ? e : [e]).map(_e).filter(Boolean);
-      if (!t.length) return;
-      const l = [];
-      for (const a of t) {
-        const h = G.get(a);
-        h && l.push(h);
+    async function qt(e) {
+      const n = (Array.isArray(e) ? e : [e]).map(Ae).filter(Boolean);
+      if (!n.length) return;
+      const a = [];
+      for (const o of n) {
+        const f = ee.get(o);
+        f && a.push(f);
       }
-      if (l.length) {
-        await Ze(l);
-        for (const a of l)
-          a?.id && G.delete(a.id);
+      if (a.length) {
+        await nt(a);
+        for (const o of a)
+          o?.id && ee.delete(o.id);
       }
     }
-    async function tt() {
-      const e = K.pop();
+    async function Dt() {
+      const e = te.pop();
       if (!e?.length) return;
-      const n = [];
-      for (const t of e) {
-        const l = G.get(t);
-        l && n.push(l);
+      const t = [];
+      for (const n of e) {
+        const a = ee.get(n);
+        a && t.push(a);
       }
-      if (n.length) {
-        await Ze(n);
-        for (const t of n)
-          t?.id && G.delete(t.id);
+      if (t.length) {
+        await nt(t);
+        for (const n of t)
+          n?.id && ee.delete(n.id);
       }
     }
-    async function Lt(e) {
-      return et(e);
-    }
-    async function zt() {
-      return tt();
-    }
-    function nt(e) {
-      const t = (Array.isArray(e) ? e : [e]).map(_e).filter(Boolean);
-      if (!t.length) return;
-      const l = new Set(t);
-      for (const a of l) G.delete(a);
-      for (let a = K.length - 1; a >= 0; a -= 1) {
-        const p = K[a].filter((x) => !l.has(x));
-        p.length ? K[a] = p : K.splice(a, 1);
+    function Ot(e) {
+      const n = (Array.isArray(e) ? e : [e]).map(Ae).filter(Boolean);
+      if (!n.length) return;
+      const a = new Set(n);
+      for (const o of a) ee.delete(o);
+      for (let o = te.length - 1; o >= 0; o -= 1) {
+        const v = te[o].filter((x) => !a.has(x));
+        v.length ? te[o] = v : te.splice(o, 1);
       }
     }
-    const Pe = gt({
+    const Be = gt({
       enabled: !1,
       isBackfillActive: !1,
       isRequestInFlight: !1,
@@ -642,187 +648,216 @@ const dn = { class: "hidden" }, vn = {
         pagesFetched: 0,
         itemsFetchedFromNetwork: 0
       }
-    }), ot = un({
-      getContent: (e) => Je(e, E),
-      markEnterFromLeft: Se,
-      buffer: Fe,
-      stats: Pe,
+    }), lt = fn({
+      getContent: (e) => et(e, R),
+      markEnterFromLeft: Te,
+      buffer: xe,
+      stats: Be,
       isEnabled: () => s.mode === "backfill",
       getPageSize: () => s.pageSize,
       getRequestDelayMs: () => s.backfillRequestDelayMs
-    }), Te = I(() => s.items !== void 0);
-    J(
+    }), Me = S(() => s.items !== void 0);
+    ne(
       () => s.items,
       (e) => {
-        Te.value && (ke.value = Array.isArray(e) ? e : []);
+        Me.value && (_e.value = Array.isArray(e) ? e : []);
       },
       { immediate: !0 }
     );
-    const d = I({
+    const d = S({
       get() {
-        return Te.value ? ke.value : Qe.value;
+        return Me.value ? _e.value : tt.value;
       },
       set(e) {
-        Te.value ? (ke.value = e, i("update:items", e)) : Qe.value = e;
+        Me.value ? (_e.value = e, i("update:items", e)) : tt.value = e;
       }
-    });
-    async function lt(e) {
-      const n = await Je(e, E);
-      return re(n.items), Se(n.items), { items: n.items, nextPage: n.nextPage };
+    }), me = p(!1);
+    async function at(e) {
+      const t = await et(e, R);
+      return ue(t.items), Te(t.items), { items: t.items, nextPage: t.nextPage };
     }
-    function _e(e) {
+    function Ae(e) {
       return e ? typeof e == "string" ? e : e?.id : null;
     }
-    async function st(e) {
-      const t = (Array.isArray(e) ? e : [e]).map(_e).filter(Boolean);
-      if (!t.length) return;
-      const l = new Set(t), a = [];
-      for (const b of l) {
-        const y = he.value.get(b);
-        if (y == null) continue;
-        const z = d.value[y];
-        z && (G.set(b, z), a.push(b));
+    async function ot(e) {
+      const n = (Array.isArray(e) ? e : [e]).map(Ae).filter(Boolean);
+      if (!n.length) return;
+      const a = new Set(n), o = [];
+      for (const b of a) {
+        const w = pe.value.get(b);
+        if (w == null) continue;
+        const z = d.value[w];
+        z && (ee.set(b, z), o.push(b));
       }
-      a.length && K.push(a);
-      const h = We(), p = ve.value, x = [];
-      for (const b of l) {
-        const y = he.value.get(b);
-        if (y == null) continue;
-        const z = d.value[y];
+      o.length && te.push(o);
+      const f = Ke(), v = he.value, x = [];
+      for (const b of a) {
+        const w = pe.value.get(b);
+        if (w == null) continue;
+        const z = d.value[w];
         if (!z) continue;
-        const me = ue.value[y] ?? { x: 0, y: 0 }, mt = Ie.value[y] ?? p;
+        const ge = fe.value[w] ?? { x: 0, y: 0 }, mt = Pe.value[w] ?? v;
         x.push({
           id: b,
           item: z,
-          fromX: me.x,
-          fromY: me.y,
-          width: p,
+          fromX: ge.x,
+          fromY: ge.y,
+          width: v,
           height: mt,
           leaving: !0
         });
       }
       if (x.length && (Y.value = [...Y.value, ...x]), d.value = d.value.filter((b) => {
-        const y = b?.id;
-        return !y || !l.has(y);
-      }), await xt(), Ue(h, l), x.length) {
-        const b = new Set(x.map((y) => y.id));
-        oe(() => {
+        const w = b?.id;
+        return !w || !a.has(w);
+      }), await xt(), Je(f, a), x.length) {
+        const b = new Set(x.map((w) => w.id));
+        re(() => {
           Y.value = Y.value.map(
-            (y) => b.has(y.id) ? { ...y, leaving: !1 } : y
+            (w) => b.has(w.id) ? { ...w, leaving: !1 } : w
           ), setTimeout(() => {
-            Y.value = Y.value.filter((y) => !b.has(y.id));
+            Y.value = Y.value.filter((w) => !b.has(w.id));
           }, Ft);
         });
       }
     }
-    async function Be(e) {
-      return st(e);
+    async function Ee(e) {
+      return ot(e);
     }
-    g({
-      remove: st,
-      restore: Lt,
-      undo: zt,
-      forget: nt,
-      pagesLoaded: D,
-      nextPage: C,
-      // Aliases (kept for now; can be removed if you want strictly short API only).
-      restoreRemoved: et,
-      undoLastRemoval: tt,
-      forgetRemoved: nt,
-      backfillStats: Pe
+    function $t() {
+      R += 1, Q = null, Z = null, K.value = !1, J.value = !1;
+    }
+    y({
+      remove: ot,
+      restore: qt,
+      undo: Dt,
+      forget: Ot,
+      loadNextPage: it,
+      cancel: $t,
+      get pagesLoaded() {
+        return D.value;
+      },
+      set pagesLoaded(e) {
+        D.value = e;
+      },
+      get nextPage() {
+        return B.value;
+      },
+      set nextPage(e) {
+        B.value = e;
+      },
+      get isLoading() {
+        return K.value || J.value;
+      },
+      get hasReachedEnd() {
+        return s.mode !== "backfill" ? B.value == null : B.value == null && xe.value.length === 0;
+      },
+      get backfillStats() {
+        return Be.value;
+      }
     });
-    function at() {
-      const e = cn({
+    function st() {
+      const e = dn({
         items: d.value,
-        columnCount: Ae.value,
-        columnWidth: ve.value,
-        gapX: Z.value,
-        gapY: Ce.value,
-        headerHeight: ee.value,
-        footerHeight: te.value,
-        bucketPx: It
+        columnCount: Ne.value,
+        columnWidth: he.value,
+        gapX: ae.value,
+        gapY: ze.value,
+        headerHeight: oe.value,
+        footerHeight: se.value,
+        bucketPx: St
       });
-      ue.value = e.positions, Ie.value = e.heights, $e.value = e.buckets, Ve.value = e.contentHeight, he.value = e.indexById;
+      fe.value = e.positions, Pe.value = e.heights, Xe.value = e.buckets, je.value = e.contentHeight, pe.value = e.indexById;
     }
-    const rt = I(() => Math.max(Ve.value, q.value) + In), Re = I(() => fn({
+    const rt = S(() => Math.max(je.value, q.value) + kn), Re = S(() => vn({
       itemCount: d.value.length,
       viewportHeight: q.value,
       scrollTop: H.value,
       overscanPx: s.overscanPx,
-      bucketPx: It,
-      buckets: $e.value
+      bucketPx: St,
+      buckets: Xe.value
     }));
-    J(
+    ne(
       Re,
       (e) => {
         if (!e?.length) return;
-        const n = [];
-        for (const t of e) {
-          const l = d.value[t]?.id;
-          l && U.value.has(l) && (ge.has(l) || (ge.add(l), n.push(l)));
+        const t = [];
+        for (const a of e) {
+          const o = d.value[a]?.id;
+          o && G.value.has(o) && (ye.has(o) || (ye.add(o), t.push(o)));
+        }
+        if (!t.length) return;
+        const n = t.length > 1 ? Bt(s.enterStaggerMs) : 0;
+        if (n > 0) {
+          const a = new Map(de.value);
+          for (let o = 0; o < t.length; o += 1) {
+            const f = t[o], v = Math.min(o * n, Fn);
+            a.set(f, v);
+          }
+          de.value = a;
         }
-        n.length && (oe(() => {
-          const t = new Set(ne.value);
-          for (const l of n) t.add(l);
-          ne.value = t;
-        }), Et(() => {
-          const t = new Set(U.value);
-          for (const l of n) t.delete(l);
-          U.value = t, setTimeout(() => {
-            const l = new Set(ne.value);
-            for (const a of n)
-              l.delete(a), ge.delete(a);
-            ne.value = l;
+        re(() => {
+          const a = new Set(U.value);
+          for (const o of t) a.add(o);
+          U.value = a;
+        }), Nt(() => {
+          const a = new Set(G.value);
+          for (const o of t) a.delete(o);
+          G.value = a, setTimeout(() => {
+            const o = new Set(U.value), f = new Map(de.value);
+            for (const v of t)
+              o.delete(v), ye.delete(v), f.delete(v);
+            U.value = o, de.value = f;
           }, kt);
-        }));
+        });
       },
       { flush: "post" }
     );
-    async function qt() {
-      if (se) return se;
-      if (ce.value || fe.value || s.mode !== "backfill" && C.value == null || s.mode === "backfill" && C.value == null && Fe.value.length === 0)
+    async function it() {
+      if (Q) return Q;
+      if (K.value || J.value || s.mode !== "backfill" && B.value == null || s.mode === "backfill" && B.value == null && xe.value.length === 0)
         return;
-      const e = E;
-      let n = null;
-      return n = (async () => {
+      const e = R;
+      let t = null;
+      return t = (async () => {
         try {
-          if (fe.value = !0, le.value = "", s.mode === "backfill") {
-            const a = await ot.loadBackfillBatch(C.value);
-            if (e !== E) return;
-            a.pages.length && (D.value = [...D.value, ...a.pages]), re(a.batchItems), d.value = [...d.value, ...a.batchItems], C.value = a.nextPage;
+          if (J.value = !0, ie.value = "", s.mode === "backfill") {
+            const o = await lt.loadBackfillBatch(B.value);
+            if (e !== R) return;
+            o.pages.length && (D.value = [...D.value, ...o.pages]), ue(o.batchItems), d.value = [...d.value, ...o.batchItems], B.value = o.nextPage;
             return;
           }
-          const t = C.value;
-          if (t == null) return;
-          const l = await lt(t);
-          if (e !== E) return;
-          D.value = [...D.value, t], re(l.items), d.value = [...d.value, ...l.items], C.value = l.nextPage;
-        } catch (t) {
-          if (e !== E || Ge(t)) return;
-          le.value = t instanceof Error ? t.message : String(t);
+          const n = B.value;
+          if (n == null) return;
+          const a = await at(n);
+          if (e !== R) return;
+          D.value = [...D.value, n], ue(a.items), d.value = [...d.value, ...a.items], B.value = a.nextPage;
+        } catch (n) {
+          if (e !== R || Qe(n)) return;
+          ie.value = n instanceof Error ? n.message : String(n);
         } finally {
-          e === E && (fe.value = !1), se === n && (se = null);
+          e === R && (J.value = !1), Q === t && (Q = null);
         }
-      })(), se = n, n;
+      })(), Q = t, t;
     }
-    function Ot() {
+    function Vt() {
       const e = _.value;
       if (!e) return;
-      H.value = e.scrollTop, q.value = e.clientHeight, e.scrollHeight - (e.scrollTop + e.clientHeight) <= s.prefetchThresholdPx && qt();
+      H.value = e.scrollTop, q.value = e.clientHeight, e.scrollHeight - (e.scrollTop + e.clientHeight) <= s.prefetchThresholdPx && it();
     }
-    function it() {
+    function ut() {
       return _.value;
     }
-    function ut(e) {
-      P.value = He(e), q.value = e.clientHeight;
+    function ct(e) {
+      P.value = qe(e), q.value = e.clientHeight;
     }
-    function Dt() {
-      typeof ResizeObserver > "u" || (Q = new ResizeObserver(() => {
-        const e = it();
-        e && ut(e);
+    function Yt() {
+      typeof ResizeObserver > "u" || (le = new ResizeObserver(() => {
+        const e = ut();
+        e && ct(e);
       }));
     }
-    function $t() {
+    function Xt() {
       return {
         enabled: s.mode === "backfill",
         isBackfillActive: !1,
@@ -833,7 +868,7 @@ const dn = { class: "hidden" }, vn = {
           target: 0
         },
         cooldownMsRemaining: 0,
-        cooldownMsTotal: Ne(s.backfillRequestDelayMs),
+        cooldownMsTotal: Le(s.backfillRequestDelayMs),
         pageSize: _t(s.pageSize),
         bufferSize: 0,
         lastBatch: null,
@@ -843,128 +878,120 @@ const dn = { class: "hidden" }, vn = {
         }
       };
     }
-    function ct() {
-      E += 1, se = null, ae = null, ye = 0, G.clear(), K.length = 0, U.value = /* @__PURE__ */ new Set(), ne.value = /* @__PURE__ */ new Set(), ge.clear(), pe.value = /* @__PURE__ */ new Map(), V.value = /* @__PURE__ */ new Set(), Y.value = [], D.value = [], C.value = null, Fe.value = [], Pe.value = $t(), ce.value = !0, fe.value = !1, le.value = "";
-    }
-    function ft(e) {
-      ct(), d.value = [], C.value = e;
+    function ft() {
+      R += 1, Q = null, Z = null, be = 0, ee.clear(), te.length = 0, G.value = /* @__PURE__ */ new Set(), U.value = /* @__PURE__ */ new Set(), ye.clear(), we.value = /* @__PURE__ */ new Map(), V.value = /* @__PURE__ */ new Set(), Y.value = [], D.value = [], B.value = null, xe.value = [], Be.value = Xt(), K.value = !0, J.value = !1, ie.value = "";
     }
-    function Vt(e) {
-      const n = Array.isArray(e) ? e : [e], t = [], l = /* @__PURE__ */ new Set();
-      for (const a of n) {
-        if (a == null) continue;
-        const h = typeof a == "string" ? `s:${a}` : `n:${String(a)}`;
-        l.has(h) || (l.add(h), t.push(a));
-      }
-      return t;
+    function dt(e) {
+      ft(), d.value = [], B.value = e;
     }
-    function Yt(e) {
-      const n = [];
-      for (const t of e) {
-        if (typeof t == "number" && Number.isFinite(t)) {
-          n.push(t);
-          continue;
-        }
-        if (typeof t == "string") {
-          const l = Number.parseInt(t, 10);
-          Number.isFinite(l) && n.push(l);
-        }
+    function jt(e) {
+      const t = Array.isArray(e) ? e : [e], n = [], a = /* @__PURE__ */ new Set();
+      for (const o of t) {
+        if (o == null) continue;
+        const f = typeof o == "string" ? `s:${o}` : `n:${String(o)}`;
+        a.has(f) || (a.add(f), n.push(o));
       }
-      return n.length ? Math.max(...n) + 1 : null;
+      return n;
     }
-    function dt(e) {
-      ct();
-      const n = Vt(e);
-      D.value = n, C.value = Yt(n), ce.value = !1, Ct(d.value), re(d.value);
+    function Ce(e) {
+      ft(), D.value = e ? jt(e) : [], B.value = s.page, K.value = !1, Lt(d.value), ue(d.value);
     }
     async function vt(e) {
-      if (ae) return ae;
-      const n = E;
-      let t = null;
-      return t = (async () => {
+      if (Z) return Z;
+      const t = R;
+      let n = null;
+      return n = (async () => {
         try {
           if (s.mode === "backfill") {
-            const l = await ot.loadBackfillBatch(e);
-            if (n !== E) return;
-            D.value = l.pages.length ? l.pages : [e], re(l.batchItems), d.value = l.batchItems, C.value = l.nextPage;
+            const a = await lt.loadBackfillBatch(e);
+            if (t !== R) return;
+            D.value = a.pages.length ? a.pages : [e], ue(a.batchItems), d.value = a.batchItems, B.value = a.nextPage;
           } else {
-            const l = await lt(e);
-            if (n !== E) return;
-            D.value = [e], re(l.items), d.value = l.items, C.value = l.nextPage;
+            const a = await at(e);
+            if (t !== R) return;
+            D.value = [e], ue(a.items), d.value = a.items, B.value = a.nextPage;
           }
-        } catch (l) {
-          if (n !== E || Ge(l)) return;
-          le.value = l instanceof Error ? l.message : String(l);
+        } catch (a) {
+          if (t !== R || Qe(a)) return;
+          ie.value = a instanceof Error ? a.message : String(a);
         } finally {
-          n === E && (ce.value = !1), ae === t && (ae = null);
+          t === R && (K.value = !1), Z === n && (Z = null);
         }
-      })(), ae = t, t;
+      })(), Z = n, n;
     }
-    function Xt() {
-      const e = it();
-      e && (ut(e), H.value = e.scrollTop, Q?.observe(e));
+    function Wt() {
+      const e = ut();
+      e && (ct(e), H.value = e.scrollTop, le?.observe(e));
     }
-    Ee(async () => {
-      if (Dt(), Xt(), s.restoredPagesLoaded != null) {
-        dt(s.restoredPagesLoaded);
+    He(async () => {
+      if (Yt(), Wt(), s.restoredPages != null) {
+        me.value = !0, Ce(s.restoredPages);
+        return;
+      }
+      if (Me.value && d.value.length > 0) {
+        me.value = !0, Ce();
         return;
       }
-      ft(s.page), await vt(s.page);
+      me.value = !1, dt(s.page), await vt(s.page);
     }), Pt(() => {
-      Q?.disconnect(), M && (clearTimeout(M), M = null), F && (clearTimeout(F), F = null), B(), N();
-    }), J(
+      le?.disconnect(), M && (clearTimeout(M), M = null), F && (clearTimeout(F), F = null), A(), N();
+    }), ne(
       () => s.page,
       async (e) => {
-        s.restoredPagesLoaded == null && (ft(e), await vt(e));
+        if (me.value) {
+          B.value = e;
+          return;
+        }
+        dt(e), await vt(e);
       }
-    ), J(
-      () => s.restoredPagesLoaded,
+    ), ne(
+      () => s.restoredPages,
       (e) => {
-        e && dt(e);
+        e && (me.value = !0, Ce(e));
       }
-    ), J(
-      Z,
+    ), ne(
+      ae,
       () => {
         const e = _.value;
-        e && (P.value = He(e));
+        e && (P.value = qe(e));
       },
       { immediate: !1 }
     );
-    const Ae = I(() => sn(P.value, s.itemWidth)), ve = I(
-      () => an(P.value, Ae.value, s.itemWidth, Z.value)
+    const Ne = S(() => rn(P.value, s.itemWidth)), he = S(
+      () => un(P.value, Ne.value, s.itemWidth, ae.value)
     );
-    J(
-      [Ae, ve, Z, Ce, ee, te],
+    ne(
+      [Ne, he, ae, ze, oe, se],
       () => {
-        at();
+        st();
       },
       { immediate: !0 }
-    ), J(
+    ), ne(
       // Performance note: this component targets very large arrays (e.g. 10k items).
       // Avoid deep watchers over items; rebuild layout only when the list structure
       // changes (new array reference or length change). This keeps metadata-only
       // updates (e.g. reactions) cheap.
       () => [d.value, d.value.length],
-      () => at(),
+      () => st(),
       { immediate: !0 }
     );
-    const jt = I(() => [
+    const Gt = S(() => [
       "mt-8 flex min-h-0 flex-1 flex-col rounded-2xl border border-slate-200/70 bg-white/70 p-5 shadow-sm backdrop-blur",
-      f.class
+      m.class
     ]);
-    return (e, n) => (k(), S("section", Kt(O.value, { class: jt.value }), [
-      T("div", dn, [
-        Jt(e.$slots, "default")
+    return (e, t) => (k(), I("section", Qt(O.value, { class: Gt.value }), [
+      T("div", mn, [
+        Zt(e.$slots, "default")
       ]),
       T("div", {
         ref_key: "scrollViewportRef",
         ref: _,
         "data-testid": "items-scroll-container",
         class: "mt-4 min-h-0 flex-1 overflow-auto",
-        style: $({ paddingRight: Z.value + "px" }),
-        onScroll: Ot
+        style: $({ paddingRight: ae.value + "px" }),
+        onScroll: Vt
       }, [
-        ce.value ? (k(), S("div", vn, n[0] || (n[0] = [
+        K.value ? (k(), I("div", hn, t[0] || (t[0] = [
           T("div", { class: "inline-flex items-center gap-3 text-sm text-slate-600" }, [
             T("svg", {
               class: "h-5 w-5 animate-spin text-slate-500",
@@ -988,107 +1015,108 @@ const dn = { class: "hidden" }, vn = {
             ]),
             T("span", null, "Loading…")
           ], -1)
-        ]))) : le.value ? (k(), S("p", mn, "Error: " + pt(le.value), 1)) : (k(), S("div", {
+        ]))) : ie.value ? (k(), I("p", gn, "Error: " + pt(ie.value), 1)) : (k(), I("div", {
           key: 2,
           class: "relative",
           style: $({ height: rt.value + "px" })
         }, [
-          (k(!0), S(yt, null, wt(Re.value, (t) => (k(), S("article", {
-            key: d.value[t].id,
+          (k(!0), I(yt, null, wt(Re.value, (n) => (k(), I("article", {
+            key: d.value[n].id,
             "data-testid": "item-card",
             class: "absolute overflow-hidden rounded-xl border border-slate-200/60 bg-white shadow-sm",
             style: $({
-              width: ve.value + "px",
-              transition: Rt(d.value[t].id),
-              transform: At(t)
+              width: he.value + "px",
+              transition: Rt(d.value[n].id),
+              transitionDelay: At(d.value[n].id),
+              transform: Ct(n)
             })
           }, [
-            Le.value || ee.value > 0 ? (k(), S("div", {
+            De.value || oe.value > 0 ? (k(), I("div", {
               key: 0,
               "data-testid": "item-header-container",
               class: "w-full",
-              style: $(Oe.value)
+              style: $(Ve.value)
             }, [
-              X(ie(c), {
-                "slot-fn": xe.value,
-                "slot-props": { item: d.value[t], remove: () => Be(d.value[t]) }
+              X(ce(c), {
+                "slot-fn": Ie.value,
+                "slot-props": { item: d.value[n], remove: () => Ee(d.value[n]) }
               }, null, 8, ["slot-fn", "slot-props"])
             ], 4)) : j("", !0),
-            T("div", hn, [
+            T("div", pn, [
               X(bt, {
-                item: d.value[t],
-                onSuccess: A,
+                item: d.value[n],
+                onSuccess: C,
                 onError: W
               }, null, 8, ["item"]),
-              qe.value ? (k(), S("div", gn, [
-                X(ie(c), {
-                  "slot-fn": Me.value,
-                  "slot-props": { item: d.value[t], remove: () => Be(d.value[t]) }
+              $e.value ? (k(), I("div", yn, [
+                X(ce(c), {
+                  "slot-fn": Fe.value,
+                  "slot-props": { item: d.value[n], remove: () => Ee(d.value[n]) }
                 }, null, 8, ["slot-fn", "slot-props"])
               ])) : j("", !0)
             ]),
-            ze.value || te.value > 0 ? (k(), S("div", {
+            Oe.value || se.value > 0 ? (k(), I("div", {
               key: 1,
               "data-testid": "item-footer-container",
               class: "w-full",
-              style: $(De.value)
+              style: $(Ye.value)
             }, [
-              X(ie(c), {
-                "slot-fn": be.value,
-                "slot-props": { item: d.value[t], remove: () => Be(d.value[t]) }
+              X(ce(c), {
+                "slot-fn": ke.value,
+                "slot-props": { item: d.value[n], remove: () => Ee(d.value[n]) }
               }, null, 8, ["slot-fn", "slot-props"])
             ], 4)) : j("", !0)
           ], 4))), 128)),
-          (k(!0), S(yt, null, wt(Y.value, (t) => (k(), S("article", {
-            key: t.id + ":leaving",
+          (k(!0), I(yt, null, wt(Y.value, (n) => (k(), I("article", {
+            key: n.id + ":leaving",
             "data-testid": "item-card-leaving",
             class: "pointer-events-none absolute overflow-hidden rounded-xl border border-slate-200/60 bg-white shadow-sm",
             style: $({
-              width: t.width + "px",
+              width: n.width + "px",
               transition: "transform " + Ft + "ms ease-out",
-              transform: t.leaving ? "translate3d(" + t.fromX + "px," + t.fromY + "px,0)" : "translate3d(" + t.fromX + "px," + Ye(t.height) + "px,0)"
+              transform: n.leaving ? "translate3d(" + n.fromX + "px," + n.fromY + "px,0)" : "translate3d(" + n.fromX + "px," + We(n.height) + "px,0)"
             })
           }, [
-            Le.value || ee.value > 0 ? (k(), S("div", {
+            De.value || oe.value > 0 ? (k(), I("div", {
               key: 0,
               "data-testid": "item-header-container",
               class: "w-full",
-              style: $(Oe.value)
+              style: $(Ve.value)
             }, [
-              X(ie(c), {
-                "slot-fn": xe.value,
-                "slot-props": { item: t.item, remove: () => {
+              X(ce(c), {
+                "slot-fn": Ie.value,
+                "slot-props": { item: n.item, remove: () => {
                 } }
               }, null, 8, ["slot-fn", "slot-props"])
             ], 4)) : j("", !0),
-            T("div", pn, [
+            T("div", wn, [
               X(bt, {
-                item: t.item
+                item: n.item
               }, null, 8, ["item"]),
-              qe.value ? (k(), S("div", yn, [
-                X(ie(c), {
-                  "slot-fn": Me.value,
-                  "slot-props": { item: t.item, remove: () => {
+              $e.value ? (k(), I("div", xn, [
+                X(ce(c), {
+                  "slot-fn": Fe.value,
+                  "slot-props": { item: n.item, remove: () => {
                   } }
                 }, null, 8, ["slot-fn", "slot-props"])
               ])) : j("", !0)
             ]),
-            ze.value || te.value > 0 ? (k(), S("div", {
+            Oe.value || se.value > 0 ? (k(), I("div", {
               key: 1,
               "data-testid": "item-footer-container",
               class: "w-full",
-              style: $(De.value)
+              style: $(Ye.value)
             }, [
-              X(ie(c), {
-                "slot-fn": be.value,
-                "slot-props": { item: t.item, remove: () => {
+              X(ce(c), {
+                "slot-fn": ke.value,
+                "slot-props": { item: n.item, remove: () => {
                 } }
               }, null, 8, ["slot-fn", "slot-props"])
             ], 4)) : j("", !0)
           ], 4))), 128))
         ], 4)),
-        T("div", wn, [
-          fe.value ? (k(), S("span", xn, n[1] || (n[1] = [
+        T("div", bn, [
+          J.value ? (k(), I("span", Mn, t[1] || (t[1] = [
             T("svg", {
               class: "h-4 w-4 animate-spin text-slate-500",
               viewBox: "0 0 24 24",
@@ -1110,40 +1138,40 @@ const dn = { class: "hidden" }, vn = {
               })
             ], -1),
             T("span", null, "Loading more…", -1)
-          ]))) : C.value == null ? (k(), S("span", bn, "End of list")) : (k(), S("span", Mn, "Scroll to load page " + pt(C.value), 1))
+          ]))) : B.value == null ? (k(), I("span", Sn, "End of list")) : (k(), I("span", In, "Scroll to load page " + pt(B.value), 1))
         ])
       ], 36)
     ], 16));
   }
-}), Pn = we({
+}), Bn = Se({
   name: "MasonryItem",
-  setup(o, { slots: g, attrs: u }) {
-    const s = Qt(Tt, null);
+  setup(l, { slots: y, attrs: u }) {
+    const s = en(Tt, null);
     if (!s)
       return () => null;
-    const i = u.onPreloaded, f = u.onFailed, c = g.overlay, r = g.default;
+    const i = u.onPreloaded, m = u.onFailed, c = y.overlay, r = y.default;
     return s({
-      header: g.header,
+      header: y.header,
       overlay: c ?? r,
-      footer: g.footer,
-      onPreloaded: typeof i == "function" ? i : Array.isArray(i) ? (v) => {
-        for (const m of i)
-          typeof m == "function" && m(v);
+      footer: y.footer,
+      onPreloaded: typeof i == "function" ? i : Array.isArray(i) ? (h) => {
+        for (const g of i)
+          typeof g == "function" && g(h);
       } : void 0,
-      onFailed: typeof f == "function" ? f : Array.isArray(f) ? (v) => {
-        for (const m of f)
-          typeof m == "function" && m(v);
+      onFailed: typeof m == "function" ? m : Array.isArray(m) ? (h) => {
+        for (const g of m)
+          typeof g == "function" && g(h);
       } : void 0
     }), () => null;
   }
-}), _n = {
-  install(o) {
-    o.component("Masonry", Fn), o.component("MasonryItem", Pn);
+}), En = {
+  install(l) {
+    l.component("Masonry", _n), l.component("MasonryItem", Bn);
   }
 };
 export {
-  Fn as Masonry,
-  Pn as MasonryItem,
-  _n as VibePlugin,
-  Zt as masonryDefaults
+  _n as Masonry,
+  Bn as MasonryItem,
+  En as VibePlugin,
+  tn as masonryDefaults
 };