vue-virtual-flow 0.0.2 → 0.0.4

package/dist/vue-virtual-flow.js

@@ -1,51 +1,51 @@
-import { watch as Z, defineComponent as ge, ref as P, computed as i, nextTick as k, onMounted as pe, onUpdated as ze, onBeforeUnmount as ye, openBlock as b, createElementBlock as S, normalizeStyle as A, createElementVNode as Be, renderSlot as le, createTextVNode as ve, createCommentVNode as he, Fragment as me, renderList as Me, unref as f, normalizeClass as $e, toDisplayString as ke } from "vue";
-function Ee(n) {
-  return typeof n == "string" || typeof n == "number" || typeof n == "symbol";
+import { watch as ee, defineComponent as be, ref as N, computed as i, nextTick as R, onMounted as Se, onUpdated as Ce, onBeforeUnmount as Ie, openBlock as x, createElementBlock as T, normalizeStyle as D, createElementVNode as De, renderSlot as ne, createTextVNode as Me, createCommentVNode as me, Fragment as we, renderList as ze, unref as r, normalizeClass as Ee, toDisplayString as Le } from "vue";
+function Ae(o) {
+  return typeof o == "string" || typeof o == "number" || typeof o == "symbol";
 }
-function Ie(n, _) {
-  const H = n[_];
-  return Ee(H) ? H : void 0;
+function Ke(o, X) {
+  const K = o[X];
+  return Ae(K) ? K : void 0;
 }
-function Ve(n) {
-  return Ie(n, "id") ?? Ie(n, "key");
+function We(o) {
+  return Ke(o, "id") ?? Ke(o, "key");
 }
-function xe(n) {
-  function _(e, I) {
-    const m = n.itemKey();
-    if (typeof m == "function")
-      return m(e, I);
+function $e(o) {
+  function X(e, $) {
+    const f = o.itemKey();
+    if (typeof f == "function")
+      return f(e, $);
     if (e !== null && typeof e == "object") {
-      if (m !== void 0) {
-        const u = Ie(e, m);
-        if (u !== void 0) return u;
+      if (f !== void 0) {
+        const s = Ke(e, f);
+        if (s !== void 0) return s;
       }
-      const w = Ve(e);
-      if (w !== void 0) return w;
+      const M = We(e);
+      if (M !== void 0) return M;
     }
-    return I;
+    return $;
   }
-  function H() {
+  function K() {
   }
-  return Z(
-    () => [n.itemKey(), n.items()],
-    H,
+  return ee(
+    () => [o.itemKey(), o.items()],
+    K,
     { immediate: !0 }
-  ), { getItemKey: _ };
+  ), { getItemKey: X };
 }
-function we(n) {
-  return n === "fill" ? "100%" : typeof n == "number" ? `${n}px` : n;
+function Be(o) {
+  return o === "fill" ? "100%" : typeof o == "number" ? `${o}px` : o;
 }
-function be(n) {
-  return (_, H) => {
-    typeof H == "string" && (H === "fill" || H.trim().endsWith("%"));
+function Re(o) {
+  return (X, K) => {
+    typeof K == "string" && (K === "fill" || K.trim().endsWith("%"));
   };
 }
-const Ke = ["aria-label"], De = {
+const Fe = ["aria-label"], Ye = {
   key: 0,
   class: "vue-chat-virtual-scroll__loading-older",
   role: "status",
   "aria-live": "polite"
-}, Ce = ["aria-posinset", "aria-setsize"], Ae = /* @__PURE__ */ ge({
+}, Ne = ["aria-posinset", "aria-setsize"], Ge = /* @__PURE__ */ be({
   name: "ChatVirtualScroll",
   __name: "ChatVirtualScroll",
   props: {
@@ -63,304 +63,301 @@ const Ke = ["aria-label"], De = {
     loadOlderThreshold: { default: 120 }
   },
   emits: ["scroll", "loadOlder", "bottomChange"],
-  setup(n, { expose: _, emit: H }) {
-    const e = n, I = H, m = P(), w = P(0), u = P(0), L = P(0), N = P(!0), R = /* @__PURE__ */ new Map(), C = /* @__PURE__ */ new Map();
-    let E, M, z = -1, T = !1;
-    const $ = be(), { getItemKey: F } = xe({
+  setup(o, { expose: X, emit: K }) {
+    const e = o, $ = K, f = N(), M = N(0), s = N(0), B = N(0), G = N(!0), F = /* @__PURE__ */ new Map(), U = /* @__PURE__ */ new Map();
+    let _, p, k = -1, S = !1;
+    const I = Re(), { getItemKey: A } = $e({
       componentName: "ChatVirtualScroll",
       items: () => e.items,
       itemKey: () => e.itemKey
-    }), Y = i(
+    }), W = i(
       () => Math.max(1, e.estimatedItemSize)
-    ), J = i(() => Math.max(0, Math.floor(e.overscan))), ae = i(() => u.value > 0 ? u.value : typeof e.height == "number" ? Math.max(0, e.height) : Y.value), V = i(() => {
-      L.value;
-      const o = new Array(e.items.length + 1), d = new Array(e.items.length);
-      o[0] = 0;
-      for (let r = 0; r < e.items.length; r += 1) {
-        const K = F(e.items[r], r), D = R.get(K) ?? Y.value;
-        d[r] = D, o[r + 1] = o[r] + D;
+    ), Z = i(() => Math.max(0, Math.floor(e.overscan))), te = i(() => s.value > 0 ? s.value : typeof e.height == "number" ? Math.max(0, e.height) : W.value), Y = i(() => {
+      B.value;
+      const l = new Array(e.items.length + 1), u = new Array(e.items.length);
+      l[0] = 0;
+      for (let c = 0; c < e.items.length; c += 1) {
+        const E = A(e.items[c], c), P = F.get(E) ?? W.value;
+        u[c] = P, l[c + 1] = l[c] + P;
       }
       return {
-        offsets: o,
-        sizes: d,
-        total: o[e.items.length] ?? 0
+        offsets: l,
+        sizes: u,
+        total: l[e.items.length] ?? 0
       };
-    }), x = i(() => {
-      const o = /* @__PURE__ */ new Map();
-      return e.items.forEach((d, r) => {
-        o.set(F(d, r), r);
-      }), o;
+    }), H = i(() => {
+      const l = /* @__PURE__ */ new Map();
+      return e.items.forEach((u, c) => {
+        l.set(A(u, c), c);
+      }), l;
     });
-    function j(o) {
+    function q(l) {
       if (e.items.length === 0) return 0;
-      const d = V.value.offsets;
-      let r = 0, K = e.items.length;
-      for (; r < K; ) {
-        const D = Math.floor((r + K) / 2);
-        d[D + 1] <= o ? r = D + 1 : K = D;
+      const u = Y.value.offsets;
+      let c = 0, E = e.items.length;
+      for (; c < E; ) {
+        const P = Math.floor((c + E) / 2);
+        u[P + 1] <= l ? c = P + 1 : E = P;
       }
-      return Math.min(r, e.items.length - 1);
+      return Math.min(c, e.items.length - 1);
     }
-    const q = i(
+    const O = i(
       () => Math.max(
         0,
-        j(w.value) - J.value
+        q(M.value) - Z.value
       )
-    ), Q = i(() => {
+    ), J = i(() => {
       if (e.items.length === 0) return 0;
-      const o = j(w.value + ae.value) + 1;
+      const l = q(M.value + te.value) + 1;
       return Math.min(
         e.items.length,
-        o + J.value
+        l + Z.value
       );
-    }), U = i(
-      () => e.items.slice(q.value, Q.value).map((o, d) => {
-        const r = q.value + d;
+    }), le = i(
+      () => e.items.slice(O.value, J.value).map((l, u) => {
+        const c = O.value + u;
         return {
-          item: o,
-          index: r,
-          key: F(o, r),
-          top: V.value.offsets[r]
+          item: l,
+          index: c,
+          key: A(l, c),
+          top: Y.value.offsets[c]
         };
       })
     ), ue = i(() => ({
-      height: we(e.height)
+      height: Be(e.height)
     }));
-    function O() {
-      const o = m.value;
-      if (!o) return;
-      const r = Math.max(
+    function j() {
+      const l = f.value;
+      if (!l) return;
+      const c = Math.max(
         0,
-        V.value.total - o.scrollTop - o.clientHeight
+        Y.value.total - l.scrollTop - l.clientHeight
       ) <= Math.max(0, e.bottomThreshold);
-      r !== N.value && (N.value = r, T && I("bottomChange", r));
+      c !== G.value && (G.value = c, S && $("bottomChange", c));
     }
-    function c() {
-      var o;
-      u.value = ((o = m.value) == null ? void 0 : o.clientHeight) ?? 0, $(m.value, e.height), k(() => {
-        O(), B();
+    function m() {
+      var l;
+      s.value = ((l = f.value) == null ? void 0 : l.clientHeight) ?? 0, I(f.value, e.height), R(() => {
+        j(), C();
       });
     }
-    function g(o) {
-      w.value = o.currentTarget.scrollTop, O(), I("scroll", {
-        scrollTop: w.value,
-        startIndex: q.value,
-        endIndex: Q.value
-      }), B();
-    }
-    function B() {
-      const o = m.value;
-      !T || !o || !e.hasOlder || e.loadingOlder || z === e.items.length || o.scrollTop <= Math.max(0, e.loadOlderThreshold) && (z = e.items.length, I("loadOlder"));
-    }
-    function oe(o) {
-      const d = o.borderBoxSize;
-      if (d) {
-        const r = Array.isArray(d) ? d[0] : d;
-        if (r != null && r.blockSize) return r.blockSize;
+    function g(l) {
+      M.value = l.currentTarget.scrollTop, j(), $("scroll", {
+        scrollTop: M.value,
+        startIndex: O.value,
+        endIndex: J.value
+      }), C();
+    }
+    function C() {
+      const l = f.value;
+      !S || !l || !e.hasOlder || e.loadingOlder || k === e.items.length || l.scrollTop <= Math.max(0, e.loadOlderThreshold) && (k = e.items.length, $("loadOlder"));
+    }
+    function se(l) {
+      const u = l.borderBoxSize;
+      if (u) {
+        const c = Array.isArray(u) ? u[0] : u;
+        if (c != null && c.blockSize) return c.blockSize;
       }
-      return o.contentRect.height;
-    }
-    function ne(o) {
-      const d = V.value, r = N.value && e.stickToBottom;
-      let K = 0, D = !1;
-      for (const W of o) {
-        const s = W.target, t = C.get(s), a = oe(W);
-        if (t === void 0 || a <= 0) continue;
-        const l = R.get(t) ?? Y.value;
-        if (Math.abs(l - a) < 0.5) continue;
-        const y = x.value.get(t);
-        y !== void 0 && d.offsets[y + 1] <= w.value && (K += a - l), R.set(t, a), D = !0;
+      return l.contentRect.height;
+    }
+    function ae(l) {
+      const u = Y.value, c = G.value && e.stickToBottom;
+      let E = 0, P = !1;
+      for (const b of l) {
+        const L = b.target, n = U.get(L), t = se(b);
+        if (n === void 0 || t <= 0) continue;
+        const a = F.get(n) ?? W.value;
+        if (Math.abs(a - t) < 0.5) continue;
+        const v = H.value.get(n);
+        v !== void 0 && u.offsets[v + 1] <= M.value && (E += t - a), F.set(n, t), P = !0;
       }
-      D && (L.value += 1, k(() => {
-        const W = m.value;
-        W && (r ? h("auto") : K !== 0 && (W.scrollTop += K, w.value = W.scrollTop, O()));
+      P && (B.value += 1, R(() => {
+        const b = f.value;
+        b && (c ? h("auto") : E !== 0 && (b.scrollTop += E, M.value = b.scrollTop, j()));
       }));
     }
-    function se(o, d) {
-      o instanceof HTMLElement && (C.set(o, d), M == null || M.observe(o));
-    }
-    function X() {
-      for (const [o] of C)
-        o.isConnected || (M == null || M.unobserve(o), C.delete(o));
-    }
-    function ie(o, d = {}) {
-      const r = m.value;
-      if (!r) return;
-      const K = Math.max(0, V.value.total - r.clientHeight), D = Math.min(
-        Math.max(0, Number.isFinite(o) ? o : 0),
-        K
-      ), W = d.behavior ?? "auto";
-      W === "auto" && (w.value = D), r.scrollTo({ ...d, top: D, behavior: W }), k(O);
-    }
-    function ee(o, d = {}) {
-      const r = m.value;
-      if (!r || e.items.length === 0) return;
-      const K = Math.min(
+    function fe(l, u) {
+      l instanceof HTMLElement && (U.set(l, u), p == null || p.observe(l));
+    }
+    function oe() {
+      for (const [l] of U)
+        l.isConnected || (p == null || p.unobserve(l), U.delete(l));
+    }
+    function ie(l, u = {}) {
+      const c = f.value;
+      if (!c) return;
+      const E = Math.max(0, Y.value.total - c.clientHeight), P = Math.min(
+        Math.max(0, Number.isFinite(l) ? l : 0),
+        E
+      ), b = u.behavior ?? "auto";
+      b === "auto" && (M.value = P), c.scrollTo({ ...u, top: P, behavior: b }), R(j);
+    }
+    function re(l, u = {}) {
+      const c = f.value;
+      if (!c || e.items.length === 0) return;
+      const E = Math.min(
         e.items.length - 1,
-        Math.max(0, Math.floor(o))
-      ), { align: D = "start", ...W } = d, s = V.value.sizes[K];
-      let t = V.value.offsets[K];
-      D === "center" ? t -= (r.clientHeight - s) / 2 : D === "end" && (t -= r.clientHeight - s);
-      const a = Math.max(
+        Math.max(0, Math.floor(l))
+      ), { align: P = "start", ...b } = u, L = Y.value.sizes[E];
+      let n = Y.value.offsets[E];
+      P === "center" ? n -= (c.clientHeight - L) / 2 : P === "end" && (n -= c.clientHeight - L);
+      const t = Math.max(
         0,
-        Math.min(t, V.value.total - r.clientHeight)
-      ), l = W.behavior ?? "auto", y = Math.max(
-        r.clientHeight * 3,
-        Y.value * 10
-      ), p = l === "smooth" && Math.abs(a - r.scrollTop) > y ? "auto" : l;
-      p === "auto" && (w.value = a), r.scrollTo({
-        ...W,
-        top: a,
-        behavior: p
-      }), k(O);
-    }
-    function de(o = "auto") {
-      const d = m.value;
-      d && (o === "auto" && (w.value = 0), d.scrollTo({ top: 0, behavior: o }), k(O));
-    }
-    function h(o = "auto") {
-      const d = m.value;
-      if (!d) return;
-      const r = Math.max(0, V.value.total - d.clientHeight);
-      o === "auto" ? (d.scrollTop = r, w.value = r) : d.scrollTo({ top: r, behavior: o }), k(O);
-    }
-    let v = e.items.map((o, d) => F(o, d));
-    return Z(
-      () => e.items.map((o, d) => F(o, d)),
-      async (o) => {
-        const d = v;
-        v = o;
-        const r = m.value, K = (r == null ? void 0 : r.scrollTop) ?? 0, D = N.value && e.stickToBottom, W = d[0], s = W === void 0 ? 0 : o.indexOf(W), t = s > 0 ? o.slice(0, s).reduce(
-          (l, y) => l + (R.get(y) ?? Y.value),
+        Math.min(n, Y.value.total - c.clientHeight)
+      ), a = b.behavior ?? "auto";
+      a === "auto" && (M.value = t), c.scrollTo({
+        ...b,
+        top: t,
+        behavior: a
+      }), R(j);
+    }
+    function de(l = "auto") {
+      const u = f.value;
+      u && (l === "auto" && (M.value = 0), u.scrollTo({ top: 0, behavior: l }), R(j));
+    }
+    function h(l = "auto") {
+      const u = f.value;
+      if (!u) return;
+      const c = Math.max(0, Y.value.total - u.clientHeight);
+      l === "auto" ? (u.scrollTop = c, M.value = c) : u.scrollTo({ top: c, behavior: l }), R(j);
+    }
+    let z = e.items.map((l, u) => A(l, u));
+    return ee(
+      () => e.items.map((l, u) => A(l, u)),
+      async (l) => {
+        const u = z;
+        z = l;
+        const c = f.value, E = (c == null ? void 0 : c.scrollTop) ?? 0, P = G.value && e.stickToBottom, b = u[0], L = b === void 0 ? 0 : l.indexOf(b), n = L > 0 ? l.slice(0, L).reduce(
+          (a, v) => a + (F.get(v) ?? W.value),
           0
-        ) : 0, a = new Set(o);
-        for (const l of R.keys())
-          a.has(l) || R.delete(l);
-        L.value += 1, await k(), r && (t > 0 ? (r.scrollTop = K + t, w.value = r.scrollTop) : o.length > d.length && D && h("auto"), O(), B());
+        ) : 0, t = new Set(l);
+        for (const a of F.keys())
+          t.has(a) || F.delete(a);
+        B.value += 1, await R(), c && (n > 0 ? (c.scrollTop = E + n, M.value = c.scrollTop) : l.length > u.length && P && h("auto"), j(), C());
       }
-    ), Z(
+    ), ee(
       () => [e.hasOlder, e.loadingOlder],
-      async ([o]) => {
-        o || (z = -1), await k(), B();
+      async ([l]) => {
+        l || (k = -1), await R(), C();
       }
-    ), pe(() => {
-      if (c(), typeof ResizeObserver < "u") {
-        E = new ResizeObserver(c), M = new ResizeObserver(ne), m.value && E.observe(m.value);
-        for (const [o] of C)
-          M.observe(o);
+    ), Se(() => {
+      if (m(), typeof ResizeObserver < "u") {
+        _ = new ResizeObserver(m), p = new ResizeObserver(ae), f.value && _.observe(f.value);
+        for (const [l] of U)
+          p.observe(l);
       }
-      k(() => {
-        e.initialScroll === "bottom" && h("auto"), T = !0, O(), B();
+      R(() => {
+        e.initialScroll === "bottom" && h("auto"), S = !0, j(), C();
       });
-    }), ze(X), ye(() => {
-      E == null || E.disconnect(), M == null || M.disconnect(), C.clear();
-    }), _({
-      isAtBottom: N,
+    }), Ce(oe), Ie(() => {
+      _ && (_.disconnect(), _ = void 0), p && (p.disconnect(), p = void 0), U.clear();
+    }), X({
+      isAtBottom: G,
       scrollTo: ie,
-      scrollToIndex: ee,
+      scrollToIndex: re,
       scrollToTop: de,
       scrollToBottom: h
-    }), (o, d) => (b(), S("div", {
+    }), (l, u) => (x(), T("div", {
       ref_key: "viewport",
-      ref: m,
+      ref: f,
       class: "vue-chat-virtual-scroll",
-      style: A(ue.value),
+      style: D(ue.value),
       role: "log",
-      "aria-label": n.ariaLabel,
+      "aria-label": o.ariaLabel,
       "aria-live": "polite",
       tabindex: "0",
       onScrollPassive: g
     }, [
-      n.loadingOlder ? (b(), S("div", De, [
-        Be("div", null, [
-          le(o.$slots, "loadingOlder", {}, () => [
-            d[0] || (d[0] = ve("Loading older messages…", -1))
+      o.loadingOlder ? (x(), T("div", Ye, [
+        De("div", null, [
+          ne(l.$slots, "loadingOlder", {}, () => [
+            u[0] || (u[0] = Me("Loading older messages…", -1))
           ])
         ])
-      ])) : he("", !0),
-      n.items.length ? (b(), S("div", {
+      ])) : me("", !0),
+      o.items.length ? (x(), T("div", {
         key: 1,
         class: "vue-chat-virtual-scroll__spacer",
-        style: A({ height: `${V.value.total}px` })
+        style: D({ height: `${Y.value.total}px` })
       }, [
-        (b(!0), S(me, null, Me(U.value, ({ item: r, index: K, key: D, top: W }) => (b(), S("div", {
-          key: D,
+        (x(!0), T(we, null, ze(le.value, ({ item: c, index: E, key: P, top: b }) => (x(), T("div", {
+          key: P,
           ref_for: !0,
-          ref: (s) => se(s, D),
+          ref: (L) => fe(L, P),
           class: "vue-chat-virtual-scroll__item",
-          style: A({ transform: `translateY(${W}px)` }),
+          style: D({ transform: `translateY(${b}px)` }),
           role: "article",
-          "aria-posinset": K + 1,
-          "aria-setsize": n.items.length
+          "aria-posinset": E + 1,
+          "aria-setsize": o.items.length
         }, [
-          le(o.$slots, "default", {
-            item: r,
-            index: K
+          ne(l.$slots, "default", {
+            item: c,
+            index: E
           })
-        ], 12, Ce))), 128))
-      ], 4)) : le(o.$slots, "empty", {}, void 0, void 0, 2)
-    ], 44, Ke));
+        ], 12, Ne))), 128))
+      ], 4)) : ne(l.$slots, "empty", {}, void 0, void 0, 2)
+    ], 44, Fe));
   }
 });
-function He(n) {
-  const _ = P(), H = P(0), e = P(!1), I = P(!1), m = i(() => Math.max(1, n.threshold())), w = i(
-    () => n.refreshing() || I.value ? m.value : H.value
-  ), u = i(
-    () => Math.min(1, H.value / m.value)
-  ), L = i(() => n.refreshing() || I.value ? "Refreshing…" : u.value >= 1 ? "Release to refresh" : "Pull to refresh");
-  function N() {
-    _.value = void 0, e.value = !1, H.value = 0;
+function Oe(o) {
+  const X = N(), K = N(0), e = N(!1), $ = N(!1), f = i(() => Math.max(1, o.threshold())), M = i(
+    () => o.refreshing() || $.value ? f.value : K.value
+  ), s = i(
+    () => Math.min(1, K.value / f.value)
+  ), B = i(() => o.refreshing() || $.value ? "Refreshing…" : s.value >= 1 ? "Release to refresh" : "Pull to refresh");
+  function G() {
+    X.value = void 0, e.value = !1, K.value = 0;
   }
-  function R(M) {
-    var $;
-    const z = M.currentTarget, T = (($ = n.scrollTop) == null ? void 0 : $.call(n)) ?? z.scrollTop;
-    !n.enabled() || n.refreshing() || T > 0 || M.touches.length !== 1 || (_.value = M.touches[0].clientY, e.value = !0);
+  function F(p) {
+    var I;
+    const k = p.currentTarget, S = ((I = o.scrollTop) == null ? void 0 : I.call(o)) ?? k.scrollTop;
+    !o.enabled() || o.refreshing() || S > 0 || p.touches.length !== 1 || (X.value = p.touches[0].clientY, e.value = !0);
   }
-  function C(M) {
-    var F;
-    if (_.value === void 0 || !e.value) return;
-    const z = M.currentTarget;
-    if ((((F = n.scrollTop) == null ? void 0 : F.call(n)) ?? z.scrollTop) > 0 || M.touches.length !== 1) {
-      N();
+  function U(p) {
+    var A;
+    if (X.value === void 0 || !e.value) return;
+    const k = p.currentTarget;
+    if ((((A = o.scrollTop) == null ? void 0 : A.call(o)) ?? k.scrollTop) > 0 || p.touches.length !== 1) {
+      G();
       return;
     }
-    const $ = M.touches[0].clientY - _.value;
-    if ($ <= 0) {
-      H.value = 0;
+    const I = p.touches[0].clientY - X.value;
+    if (I <= 0) {
+      K.value = 0;
       return;
     }
-    M.preventDefault(), H.value = Math.min($ * 0.5, m.value * 2);
+    p.preventDefault(), K.value = Math.min(I * 0.5, f.value * 2);
   }
-  function E() {
-    if (_.value === void 0) return;
-    const M = H.value >= m.value && n.enabled() && !n.refreshing();
-    if (_.value = void 0, e.value = !1, !M) {
-      H.value = 0;
+  function _() {
+    if (X.value === void 0) return;
+    const p = K.value >= f.value && o.enabled() && !o.refreshing();
+    if (X.value = void 0, e.value = !1, !p) {
+      K.value = 0;
       return;
     }
-    H.value = m.value, I.value = !0, n.onRefresh(), k(() => {
-      n.refreshing() || (I.value = !1, H.value = 0);
+    K.value = f.value, $.value = !0, o.onRefresh(), R(() => {
+      o.refreshing() || ($.value = !1, K.value = 0);
     });
   }
-  return Z(
-    () => n.refreshing(),
-    (M, z) => {
-      M ? (I.value = !1, H.value = m.value) : z && (I.value = !1, H.value = 0);
+  return ee(
+    () => o.refreshing(),
+    (p, k) => {
+      p ? ($.value = !1, K.value = f.value) : k && ($.value = !1, K.value = 0);
     }
   ), {
     pulling: e,
-    pullDistance: H,
-    pullOffset: w,
-    pullProgress: u,
-    refreshMessage: L,
-    refreshThreshold: m,
-    handleTouchStart: R,
-    handleTouchMove: C,
-    handleTouchEnd: E,
-    handleTouchCancel: N
+    pullDistance: K,
+    pullOffset: M,
+    pullProgress: s,
+    refreshMessage: B,
+    refreshThreshold: f,
+    handleTouchStart: F,
+    handleTouchMove: U,
+    handleTouchEnd: _,
+    handleTouchCancel: G
   };
 }
-const Re = ["aria-label"], Pe = ["aria-posinset", "aria-setsize"], Le = /* @__PURE__ */ ge({
+const Ue = ["aria-label"], je = ["aria-posinset", "aria-setsize"], Pe = /* @__PURE__ */ be({
   name: "DynamicVirtualScroll",
   __name: "DynamicVirtualScroll",
   props: {
@@ -379,297 +376,294 @@ const Re = ["aria-label"], Pe = ["aria-posinset", "aria-setsize"], Le = /* @__PU
     pullRefreshThreshold: { default: 64 }
   },
   emits: ["scroll", "loadMore", "refresh"],
-  setup(n, { expose: _, emit: H }) {
-    const e = n, I = H, {
-      pulling: m,
-      pullDistance: w,
-      pullOffset: u,
-      pullProgress: L,
-      refreshMessage: N,
-      refreshThreshold: R,
-      handleTouchStart: C,
-      handleTouchMove: E,
-      handleTouchEnd: M,
-      handleTouchCancel: z
-    } = He({
+  setup(o, { expose: X, emit: K }) {
+    const e = o, $ = K, {
+      pulling: f,
+      pullDistance: M,
+      pullOffset: s,
+      pullProgress: B,
+      refreshMessage: G,
+      refreshThreshold: F,
+      handleTouchStart: U,
+      handleTouchMove: _,
+      handleTouchEnd: p,
+      handleTouchCancel: k
+    } = Oe({
       enabled: () => e.pullToRefresh,
       refreshing: () => e.refreshing,
       threshold: () => e.pullRefreshThreshold,
-      onRefresh: () => I("refresh")
-    }), T = P(), $ = P(0), F = P(0), Y = P(0), J = /* @__PURE__ */ new Map(), ae = /* @__PURE__ */ new Map();
-    let V, x, j = -1;
-    const q = be(), { getItemKey: Q } = xe({
+      onRefresh: () => $("refresh")
+    }), S = N(), I = N(0), A = N(0), W = N(0), Z = /* @__PURE__ */ new Map(), te = /* @__PURE__ */ new Map();
+    let Y, H, q = -1;
+    const O = Re(), { getItemKey: J } = $e({
       componentName: "DynamicVirtualScroll",
       items: () => e.items,
       itemKey: () => e.itemKey
-    }), U = i(
+    }), le = i(
       () => Math.max(1, e.estimatedItemSize)
     ), ue = i(
-      () => Math.max(1, e.loadingItemSize ?? U.value)
-    ), O = i(() => Math.max(0, Math.floor(e.overscan))), c = i(() => F.value > 0 ? F.value : typeof e.height == "number" ? Math.max(0, e.height) : U.value), g = i(() => {
-      Y.value;
-      const t = new Array(e.items.length + 1), a = new Array(e.items.length);
-      t[0] = 0;
-      for (let l = 0; l < e.items.length; l += 1) {
-        const y = Q(e.items[l], l), p = J.get(y) ?? U.value;
-        a[l] = p, t[l + 1] = t[l] + p;
+      () => Math.max(1, e.loadingItemSize ?? le.value)
+    ), j = i(() => Math.max(0, Math.floor(e.overscan))), m = i(() => A.value > 0 ? A.value : typeof e.height == "number" ? Math.max(0, e.height) : le.value), g = i(() => {
+      W.value;
+      const n = new Array(e.items.length + 1), t = new Array(e.items.length);
+      n[0] = 0;
+      for (let a = 0; a < e.items.length; a += 1) {
+        const v = J(e.items[a], a), V = Z.get(v) ?? le.value;
+        t[a] = V, n[a + 1] = n[a] + V;
       }
       return {
-        offsets: t,
-        sizes: a,
-        total: t[e.items.length] ?? 0
+        offsets: n,
+        sizes: t,
+        total: n[e.items.length] ?? 0
       };
-    }), B = i(
+    }), C = i(
       () => g.value.total + (e.loading ? ue.value : 0)
-    ), oe = i(() => {
-      const t = /* @__PURE__ */ new Map();
-      return e.items.forEach((a, l) => {
-        t.set(Q(a, l), l);
-      }), t;
+    ), se = i(() => {
+      const n = /* @__PURE__ */ new Map();
+      return e.items.forEach((t, a) => {
+        n.set(J(t, a), a);
+      }), n;
     });
-    function ne(t) {
+    function ae(n) {
       if (e.items.length === 0) return 0;
-      const a = g.value.offsets;
-      let l = 0, y = e.items.length;
-      for (; l < y; ) {
-        const p = Math.floor((l + y) / 2);
-        a[p + 1] <= t ? l = p + 1 : y = p;
+      const t = g.value.offsets;
+      let a = 0, v = e.items.length;
+      for (; a < v; ) {
+        const V = Math.floor((a + v) / 2);
+        t[V + 1] <= n ? a = V + 1 : v = V;
       }
-      return Math.min(l, e.items.length - 1);
+      return Math.min(a, e.items.length - 1);
     }
-    const se = i(
+    const fe = i(
       () => Math.max(
         0,
-        ne($.value) - O.value
+        ae(I.value) - j.value
       )
-    ), X = i(() => {
+    ), oe = i(() => {
       if (e.items.length === 0) return 0;
-      const t = ne($.value + c.value) + 1;
+      const n = ae(I.value + m.value) + 1;
       return Math.min(
         e.items.length,
-        t + O.value
+        n + j.value
       );
     }), ie = i(
-      () => e.items.slice(se.value, X.value).map((t, a) => {
-        const l = se.value + a;
+      () => e.items.slice(fe.value, oe.value).map((n, t) => {
+        const a = fe.value + t;
         return {
-          item: t,
-          index: l,
-          key: Q(t, l),
-          top: g.value.offsets[l]
+          item: n,
+          index: a,
+          key: J(n, a),
+          top: g.value.offsets[a]
         };
       })
-    ), ee = i(() => ({
-      height: we(e.height)
+    ), re = i(() => ({
+      height: Be(e.height)
     }));
     function de() {
-      var t;
-      F.value = ((t = T.value) == null ? void 0 : t.clientHeight) ?? 0, q(T.value, e.height), k(v);
-    }
-    function h(t) {
-      $.value = t.currentTarget.scrollTop, I("scroll", {
-        scrollTop: $.value,
-        startIndex: se.value,
-        endIndex: X.value
-      }), v();
-    }
-    function v() {
-      const t = T.value;
-      if (!t || !e.hasMore || e.loading || j === e.items.length)
+      var n;
+      A.value = ((n = S.value) == null ? void 0 : n.clientHeight) ?? 0, O(S.value, e.height), R(z);
+    }
+    function h(n) {
+      I.value = n.currentTarget.scrollTop, $("scroll", {
+        scrollTop: I.value,
+        startIndex: fe.value,
+        endIndex: oe.value
+      }), z();
+    }
+    function z() {
+      const n = S.value;
+      if (!n || !e.hasMore || e.loading || q === e.items.length)
         return;
-      const a = Math.max(0, e.loadMoreThreshold);
-      B.value - t.scrollTop - t.clientHeight <= a && (j = e.items.length, I("loadMore"));
-    }
-    function o(t) {
-      const a = t.borderBoxSize;
-      if (a) {
-        const l = Array.isArray(a) ? a[0] : a;
-        if (l != null && l.blockSize) return l.blockSize;
+      const t = Math.max(0, e.loadMoreThreshold);
+      C.value - n.scrollTop - n.clientHeight <= t && (q = e.items.length, $("loadMore"));
+    }
+    function l(n) {
+      const t = n.borderBoxSize;
+      if (t) {
+        const a = Array.isArray(t) ? t[0] : t;
+        if (a != null && a.blockSize) return a.blockSize;
       }
-      return t.contentRect.height;
-    }
-    function d(t) {
-      const a = g.value;
-      let l = 0, y = !1;
-      for (const p of t) {
-        const te = p.target, G = ae.get(te), re = o(p);
-        if (G === void 0 || re <= 0) continue;
-        const ce = J.get(G) ?? U.value;
-        if (Math.abs(ce - re) < 0.5) continue;
-        const fe = oe.value.get(G);
-        fe !== void 0 && a.offsets[fe + 1] <= $.value && (l += re - ce), J.set(G, re), y = !0;
+      return n.contentRect.height;
+    }
+    function u(n) {
+      const t = g.value;
+      let a = 0, v = !1;
+      for (const V of n) {
+        const he = V.target, ve = te.get(he), ge = l(V);
+        if (ve === void 0 || ge <= 0) continue;
+        const xe = Z.get(ve) ?? le.value;
+        if (Math.abs(xe - ge) < 0.5) continue;
+        const Te = se.value.get(ve);
+        Te !== void 0 && t.offsets[Te + 1] <= I.value && (a += ge - xe), Z.set(ve, ge), v = !0;
       }
-      y && (Y.value += 1, k(v), l !== 0 && k(() => {
-        const p = T.value;
-        p && (p.scrollTop += l, $.value = p.scrollTop);
+      v && (W.value += 1, R(z), a !== 0 && R(() => {
+        const V = S.value;
+        V && (V.scrollTop += a, I.value = V.scrollTop);
       }));
     }
-    function r(t, a) {
-      t instanceof HTMLElement && (ae.set(t, a), x == null || x.observe(t));
-    }
-    function K() {
-      for (const [t] of ae)
-        t.isConnected || (x == null || x.unobserve(t), ae.delete(t));
-    }
-    function D(t, a = {}) {
-      const l = T.value;
-      if (!l) return;
-      const y = Math.max(0, B.value - l.clientHeight), p = Math.min(
-        Math.max(0, Number.isFinite(t) ? t : 0),
-        y
-      ), te = a.behavior ?? "auto";
-      te === "auto" && ($.value = p), l.scrollTo({ ...a, top: p, behavior: te });
-    }
-    function W(t, a = {}) {
-      const l = T.value;
-      if (!l || e.items.length === 0) return;
-      const y = Math.min(
+    function c(n, t) {
+      n instanceof HTMLElement && (te.set(n, t), H == null || H.observe(n));
+    }
+    function E() {
+      for (const [n] of te)
+        n.isConnected || (H == null || H.unobserve(n), te.delete(n));
+    }
+    function P(n, t = {}) {
+      const a = S.value;
+      if (!a) return;
+      const v = Math.max(0, C.value - a.clientHeight), V = Math.min(
+        Math.max(0, Number.isFinite(n) ? n : 0),
+        v
+      ), he = t.behavior ?? "auto";
+      he === "auto" && (I.value = V), a.scrollTo({ ...t, top: V, behavior: he });
+    }
+    function b(n, t = {}) {
+      const a = S.value;
+      if (!a || e.items.length === 0) return;
+      const v = Math.min(
         e.items.length - 1,
-        Math.max(0, Math.floor(t))
-      ), { align: p = "start", ...te } = a;
-      let G = g.value.offsets[y];
-      const re = g.value.sizes[y];
-      p === "center" ? G -= (l.clientHeight - re) / 2 : p === "end" && (G -= l.clientHeight - re);
-      const ce = Math.max(
+        Math.max(0, Math.floor(n))
+      ), { align: V = "start", ...he } = t;
+      let ve = g.value.offsets[v];
+      const ge = g.value.sizes[v];
+      V === "center" ? ve -= (a.clientHeight - ge) / 2 : V === "end" && (ve -= a.clientHeight - ge);
+      const xe = Math.max(
         0,
-        Math.min(G, B.value - l.clientHeight)
-      ), fe = te.behavior ?? "auto", Se = Math.max(
-        l.clientHeight * 3,
-        U.value * 10
-      ), Te = fe === "smooth" && Math.abs(ce - l.scrollTop) > Se ? "auto" : fe;
-      Te === "auto" && ($.value = ce), l.scrollTo({
-        ...te,
-        top: ce,
+        Math.min(ve, C.value - a.clientHeight)
+      ), Te = he.behavior ?? "auto";
+      Te === "auto" && (I.value = xe), a.scrollTo({
+        ...he,
+        top: xe,
         behavior: Te
       });
     }
-    function s(t = "auto") {
-      var a;
-      (a = T.value) == null || a.scrollTo({ top: 0, behavior: t });
+    function L(n = "auto") {
+      var t;
+      (t = S.value) == null || t.scrollTo({ top: 0, behavior: n });
     }
-    return Z(
+    return ee(
       () => e.itemKey,
       () => {
-        J.clear(), Y.value += 1;
+        Z.clear(), W.value += 1;
       }
-    ), Z(
+    ), ee(
       () => e.items.length,
       async () => {
-        const t = new Set(
-          e.items.map((y, p) => Q(y, p))
+        const n = new Set(
+          e.items.map((v, V) => J(v, V))
         );
-        for (const y of J.keys())
-          t.has(y) || J.delete(y);
-        Y.value += 1, await k();
-        const a = T.value;
-        if (!a) return;
-        const l = Math.max(0, B.value - a.clientHeight);
-        a.scrollTop > l && (a.scrollTop = l, $.value = l), v();
+        for (const v of Z.keys())
+          n.has(v) || Z.delete(v);
+        W.value += 1, await R();
+        const t = S.value;
+        if (!t) return;
+        const a = Math.max(0, C.value - t.clientHeight);
+        t.scrollTop > a && (t.scrollTop = a, I.value = a), z();
       }
-    ), Z(
+    ), ee(
       () => [e.hasMore, e.loading],
-      async ([t]) => {
-        t || (j = -1), await k(), v();
+      async ([n]) => {
+        n || (q = -1), await R(), z();
       }
-    ), pe(() => {
+    ), Se(() => {
       if (de(), typeof ResizeObserver < "u") {
-        V = new ResizeObserver(de), x = new ResizeObserver(d), T.value && V.observe(T.value);
-        for (const [t] of ae)
-          x.observe(t);
+        Y = new ResizeObserver(de), H = new ResizeObserver(u), S.value && Y.observe(S.value);
+        for (const [n] of te)
+          H.observe(n);
       }
-      k(v);
-    }), ze(K), ye(() => {
-      V == null || V.disconnect(), x == null || x.disconnect(), ae.clear();
-    }), _({
-      scrollTo: D,
-      scrollToIndex: W,
-      scrollToTop: s
-    }), (t, a) => (b(), S("div", {
+      R(z);
+    }), Ce(E), Ie(() => {
+      Y && (Y.disconnect(), Y = void 0), H && (H.disconnect(), H = void 0), te.clear();
+    }), X({
+      scrollTo: P,
+      scrollToIndex: b,
+      scrollToTop: L
+    }), (n, t) => (x(), T("div", {
       ref_key: "viewport",
-      ref: T,
-      class: $e(["vue-dynamic-virtual-scroll", { "vue-dynamic-virtual-scroll--pulling": f(m) }]),
-      style: A(ee.value),
+      ref: S,
+      class: Ee(["vue-dynamic-virtual-scroll", { "vue-dynamic-virtual-scroll--pulling": r(f) }]),
+      style: D(re.value),
       role: "list",
-      "aria-label": n.ariaLabel,
+      "aria-label": o.ariaLabel,
       tabindex: "0",
       onScrollPassive: h,
-      onTouchstartPassive: a[0] || (a[0] = //@ts-ignore
-      (...l) => f(C) && f(C)(...l)),
-      onTouchmove: a[1] || (a[1] = //@ts-ignore
-      (...l) => f(E) && f(E)(...l)),
-      onTouchend: a[2] || (a[2] = //@ts-ignore
-      (...l) => f(M) && f(M)(...l)),
-      onTouchcancel: a[3] || (a[3] = //@ts-ignore
-      (...l) => f(z) && f(z)(...l))
+      onTouchstartPassive: t[0] || (t[0] = //@ts-ignore
+      (...a) => r(U) && r(U)(...a)),
+      onTouchmove: t[1] || (t[1] = //@ts-ignore
+      (...a) => r(_) && r(_)(...a)),
+      onTouchend: t[2] || (t[2] = //@ts-ignore
+      (...a) => r(p) && r(p)(...a)),
+      onTouchcancel: t[3] || (t[3] = //@ts-ignore
+      (...a) => r(k) && r(k)(...a))
     }, [
-      n.pullToRefresh || n.refreshing ? (b(), S("div", {
+      o.pullToRefresh || o.refreshing ? (x(), T("div", {
         key: 0,
         class: "vue-dynamic-virtual-scroll__refresh",
-        style: A({
-          height: `${f(R)}px`,
-          transform: `translateY(${f(u) - f(R)}px)`
+        style: D({
+          height: `${r(F)}px`,
+          transform: `translateY(${r(s) - r(F)}px)`
         }),
         role: "status",
         "aria-live": "polite"
       }, [
-        le(t.$slots, "refresh", {
-          pullDistance: f(w),
-          progress: f(L),
-          refreshing: n.refreshing
+        ne(n.$slots, "refresh", {
+          pullDistance: r(M),
+          progress: r(B),
+          refreshing: o.refreshing
         }, () => [
-          ve(ke(f(N)), 1)
+          Me(Le(r(G)), 1)
         ])
-      ], 4)) : he("", !0),
-      n.items.length || n.loading ? (b(), S("div", {
+      ], 4)) : me("", !0),
+      o.items.length || o.loading ? (x(), T("div", {
         key: 1,
         class: "vue-dynamic-virtual-scroll__spacer",
-        style: A({
-          height: `${B.value}px`,
-          transform: `translateY(${f(u)}px)`
+        style: D({
+          height: `${C.value}px`,
+          transform: `translateY(${r(s)}px)`
         })
       }, [
-        (b(!0), S(me, null, Me(ie.value, ({ item: l, index: y, key: p, top: te }) => (b(), S("div", {
-          key: p,
+        (x(!0), T(we, null, ze(ie.value, ({ item: a, index: v, key: V, top: he }) => (x(), T("div", {
+          key: V,
           ref_for: !0,
-          ref: (G) => r(G, p),
+          ref: (ve) => c(ve, V),
           class: "vue-dynamic-virtual-scroll__item",
-          style: A({ transform: `translateY(${te}px)` }),
+          style: D({ transform: `translateY(${he}px)` }),
           role: "listitem",
-          "aria-posinset": y + 1,
-          "aria-setsize": n.items.length
+          "aria-posinset": v + 1,
+          "aria-setsize": o.items.length
         }, [
-          le(t.$slots, "default", {
-            item: l,
-            index: y
+          ne(n.$slots, "default", {
+            item: a,
+            index: v
           })
-        ], 12, Pe))), 128)),
-        n.loading ? (b(), S("div", {
+        ], 12, je))), 128)),
+        o.loading ? (x(), T("div", {
           key: 0,
           class: "vue-dynamic-virtual-scroll__loading",
-          style: A({
+          style: D({
             height: `${ue.value}px`,
             transform: `translateY(${g.value.total}px)`
           }),
           role: "status",
           "aria-live": "polite"
         }, [
-          le(t.$slots, "loading", {}, () => [
-            a[4] || (a[4] = ve("Loading more…", -1))
+          ne(n.$slots, "loading", {}, () => [
+            t[4] || (t[4] = Me("Loading more…", -1))
           ])
-        ], 4)) : he("", !0)
-      ], 4)) : (b(), S("div", {
+        ], 4)) : me("", !0)
+      ], 4)) : (x(), T("div", {
         key: 2,
         class: "vue-dynamic-virtual-scroll__empty",
-        style: A({ transform: `translateY(${f(u)}px)` })
+        style: D({ transform: `translateY(${r(s)}px)` })
       }, [
-        le(t.$slots, "empty")
+        ne(n.$slots, "empty")
       ], 4))
-    ], 46, Re));
+    ], 46, Ue));
   }
-}), Oe = ["aria-label"], Ne = ["aria-current", "aria-posinset", "aria-setsize"], Ye = {
+}), Ze = ["aria-label"], _e = ["aria-current", "aria-posinset", "aria-setsize"], qe = {
   key: 1,
   class: "vue-short-media-feed__empty"
-}, Fe = /* @__PURE__ */ ge({
+}, Je = /* @__PURE__ */ be({
   name: "ShortMediaFeed",
   __name: "ShortMediaFeed",
   props: {
@@ -684,162 +678,162 @@ const Re = ["aria-label"], Pe = ["aria-posinset", "aria-setsize"], Le = /* @__PU
     loadMoreThreshold: { default: 2 }
   },
   emits: ["update:activeIndex", "change", "reachStart", "reachEnd", "loadMore"],
-  setup(n, { expose: _, emit: H }) {
-    const e = n, I = H, m = P(), w = P(0), u = P(V(e.activeIndex));
-    let L, N = -1;
-    const R = be(), { getItemKey: C } = xe({
+  setup(o, { expose: X, emit: K }) {
+    const e = o, $ = K, f = N(), M = N(0), s = N(Y(e.activeIndex));
+    let B, G = -1;
+    const F = Re(), { getItemKey: U } = $e({
       componentName: "ShortMediaFeed",
       items: () => e.items,
       itemKey: () => e.itemKey
-    }), E = i(
+    }), _ = i(
       () => Math.max(0, Math.floor(e.buffer))
-    ), M = i(
+    ), p = i(
       () => Math.max(
         0,
         Math.floor(
           Number.isFinite(e.loadMoreThreshold) ? e.loadMoreThreshold : 0
         )
       )
-    ), z = i(() => w.value > 0 ? w.value : typeof e.height == "number" ? Math.max(1, e.height) : 0), T = i(
-      () => Math.max(0, u.value - E.value)
-    ), $ = i(
+    ), k = i(() => M.value > 0 ? M.value : typeof e.height == "number" ? Math.max(1, e.height) : 0), S = i(
+      () => Math.max(0, s.value - _.value)
+    ), I = i(
       () => Math.min(
         e.items.length,
-        u.value + E.value + 1
+        s.value + _.value + 1
       )
-    ), F = i(
-      () => e.items.slice(T.value, $.value).map((c, g) => ({
-        item: c,
-        index: T.value + g
+    ), A = i(
+      () => e.items.slice(S.value, I.value).map((m, g) => ({
+        item: m,
+        index: S.value + g
       }))
-    ), Y = i(() => T.value * z.value), J = i(
-      () => (e.items.length - $.value) * z.value
-    ), ae = i(() => ({
-      height: we(e.height)
+    ), W = i(() => S.value * k.value), Z = i(
+      () => (e.items.length - I.value) * k.value
+    ), te = i(() => ({
+      height: Be(e.height)
     }));
-    function V(c) {
+    function Y(m) {
       return e.items.length === 0 ? 0 : Math.min(
         e.items.length - 1,
-        Math.max(0, Math.floor(Number.isFinite(c) ? c : 0))
+        Math.max(0, Math.floor(Number.isFinite(m) ? m : 0))
       );
     }
-    function x() {
-      if (!e.hasMore || e.loading || N === e.items.length)
+    function H() {
+      if (!e.hasMore || e.loading || G === e.items.length)
         return;
-      (e.items.length === 0 ? 0 : e.items.length - 1 - u.value) <= M.value && (N = e.items.length, I("loadMore"));
+      (e.items.length === 0 ? 0 : e.items.length - 1 - s.value) <= p.value && (G = e.items.length, $("loadMore"));
     }
-    function j(c) {
-      const g = V(c);
-      g === u.value || e.items.length === 0 || (u.value = g, I("update:activeIndex", g), I("change", {
+    function q(m) {
+      const g = Y(m);
+      g === s.value || e.items.length === 0 || (s.value = g, $("update:activeIndex", g), $("change", {
         index: g,
         item: e.items[g]
-      }), g === 0 && I("reachStart"), g === e.items.length - 1 && I("reachEnd"), x());
+      }), g === 0 && $("reachStart"), g === e.items.length - 1 && $("reachEnd"), H());
     }
-    function q(c, g = {}) {
-      const B = m.value;
-      B && (typeof B.scrollTo == "function" ? B.scrollTo({ ...g, top: c }) : B.scrollTop = c);
+    function O(m, g = {}) {
+      const C = f.value;
+      C && (typeof C.scrollTo == "function" ? C.scrollTo({ ...g, top: m }) : C.scrollTop = m);
     }
-    function Q(c, g = {}) {
+    function J(m, g = {}) {
       if (e.items.length === 0) return;
-      const B = V(c);
-      j(B), q(B * z.value, g);
+      const C = Y(m);
+      q(C), O(C * k.value, g);
     }
-    function U(c) {
-      if (z.value <= 0) return;
-      const g = c.currentTarget.scrollTop;
-      j(Math.round(g / z.value));
+    function le(m) {
+      if (k.value <= 0) return;
+      const g = m.currentTarget.scrollTop;
+      q(Math.round(g / k.value));
     }
-    function ue(c) {
+    function ue(m) {
       let g;
-      c.key === "ArrowDown" || c.key === "PageDown" ? g = u.value + 1 : c.key === "ArrowUp" || c.key === "PageUp" ? g = u.value - 1 : c.key === "Home" ? g = 0 : c.key === "End" && (g = e.items.length - 1), g !== void 0 && (c.preventDefault(), Q(g, { behavior: "smooth" }));
+      m.key === "ArrowDown" || m.key === "PageDown" ? g = s.value + 1 : m.key === "ArrowUp" || m.key === "PageUp" ? g = s.value - 1 : m.key === "Home" ? g = 0 : m.key === "End" && (g = e.items.length - 1), g !== void 0 && (m.preventDefault(), J(g, { behavior: "smooth" }));
     }
-    function O() {
+    function j() {
       var g;
-      const c = ((g = m.value) == null ? void 0 : g.clientHeight) ?? 0;
-      R(m.value, e.height), !(c <= 0 || c === w.value) && (w.value = c, k(() => {
-        q(u.value * c);
+      const m = ((g = f.value) == null ? void 0 : g.clientHeight) ?? 0;
+      F(f.value, e.height), !(m <= 0 || m === M.value) && (M.value = m, R(() => {
+        O(s.value * m);
       }));
     }
-    return Z(
+    return ee(
       () => e.activeIndex,
-      async (c) => {
-        const g = V(c);
-        g !== u.value && (u.value = g, await k(), q(g * z.value), x());
+      async (m) => {
+        const g = Y(m);
+        g !== s.value && (s.value = g, await R(), O(g * k.value), H());
       }
-    ), Z(
+    ), ee(
       () => [
         e.hasMore,
         e.loading,
         e.loadMoreThreshold
       ],
-      async ([c]) => {
-        c || (N = -1), await k(), x();
+      async ([m]) => {
+        m || (G = -1), await R(), H();
       }
-    ), Z(
+    ), ee(
       () => e.items.length,
       async () => {
-        const c = V(u.value);
-        e.items.length === 0 ? u.value !== 0 && (u.value = 0, I("update:activeIndex", 0)) : j(c), await k(), q(c * z.value), x();
+        const m = Y(s.value);
+        e.items.length === 0 ? s.value !== 0 && (s.value = 0, $("update:activeIndex", 0)) : q(m), await R(), O(m * k.value), H();
       }
-    ), pe(async () => {
-      O(), typeof ResizeObserver < "u" && m.value && (L = new ResizeObserver(O), L.observe(m.value)), await k(), q(u.value * z.value), x();
-    }), ye(() => {
-      L == null || L.disconnect();
-    }), _({
-      scrollToIndex: Q
-    }), (c, g) => (b(), S("div", {
+    ), Se(async () => {
+      j(), typeof ResizeObserver < "u" && f.value && (B = new ResizeObserver(j), B.observe(f.value)), await R(), O(s.value * k.value), H();
+    }), Ie(() => {
+      B && (B.disconnect(), B = void 0);
+    }), X({
+      scrollToIndex: J
+    }), (m, g) => (x(), T("div", {
       ref_key: "viewport",
-      ref: m,
+      ref: f,
       class: "vue-short-media-feed",
-      style: A(ae.value),
+      style: D(te.value),
       role: "list",
       "aria-orientation": "vertical",
-      "aria-label": n.ariaLabel,
+      "aria-label": o.ariaLabel,
       tabindex: "0",
-      onScrollPassive: U,
+      onScrollPassive: le,
       onKeydown: ue
     }, [
-      n.items.length ? (b(), S(me, { key: 0 }, [
-        Y.value > 0 ? (b(), S("div", {
+      o.items.length ? (x(), T(we, { key: 0 }, [
+        W.value > 0 ? (x(), T("div", {
           key: 0,
           class: "vue-short-media-feed__spacer",
-          style: A({ height: `${Y.value}px` }),
+          style: D({ height: `${W.value}px` }),
           "aria-hidden": "true"
-        }, null, 4)) : he("", !0),
-        (b(!0), S(me, null, Me(F.value, ({ item: B, index: oe }) => (b(), S("div", {
-          key: f(C)(B, oe),
+        }, null, 4)) : me("", !0),
+        (x(!0), T(we, null, ze(A.value, ({ item: C, index: se }) => (x(), T("div", {
+          key: r(U)(C, se),
           class: "vue-short-media-feed__item",
-          style: A({ height: `${z.value}px` }),
+          style: D({ height: `${k.value}px` }),
           role: "listitem",
-          "aria-current": oe === u.value ? "true" : void 0,
-          "aria-posinset": oe + 1,
-          "aria-setsize": n.items.length
+          "aria-current": se === s.value ? "true" : void 0,
+          "aria-posinset": se + 1,
+          "aria-setsize": o.items.length
         }, [
-          le(c.$slots, "default", {
-            item: B,
-            index: oe,
-            active: oe === u.value
+          ne(m.$slots, "default", {
+            item: C,
+            index: se,
+            active: se === s.value
           })
-        ], 12, Ne))), 128)),
-        J.value > 0 ? (b(), S("div", {
+        ], 12, _e))), 128)),
+        Z.value > 0 ? (x(), T("div", {
           key: 1,
           class: "vue-short-media-feed__spacer",
-          style: A({ height: `${J.value}px` }),
+          style: D({ height: `${Z.value}px` }),
           "aria-hidden": "true"
-        }, null, 4)) : he("", !0)
-      ], 64)) : (b(), S("div", Ye, [
-        le(c.$slots, "empty")
+        }, null, 4)) : me("", !0)
+      ], 64)) : (x(), T("div", qe, [
+        ne(m.$slots, "empty")
       ]))
-    ], 44, Oe));
+    ], 44, Ze));
   }
-}), We = ["aria-label"], _e = {
+}), Qe = ["aria-label"], Xe = {
   key: 0,
   class: "vue-virtual-carousel__track",
   role: "list"
-}, Ue = ["aria-label", "aria-current"], je = {
+}, et = ["aria-label", "aria-current"], tt = {
   key: 1,
   class: "vue-virtual-carousel__empty"
-}, Ze = /* @__PURE__ */ ge({
+}, lt = /* @__PURE__ */ be({
   name: "VirtualCarousel",
   __name: "VirtualCarousel",
   props: {
@@ -858,33 +852,56 @@ const Re = ["aria-label"], Pe = ["aria-posinset", "aria-setsize"], Le = /* @__PU
     autoplay: { type: Boolean, default: !1 },
     autoplayDelay: { default: 3e3 },
     autoplayLoop: { type: Boolean, default: !0 },
-    pauseOnHover: { type: Boolean, default: !0 }
+    pauseOnHover: { type: Boolean, default: !0 },
+    responsive: { default: void 0 }
   },
   emits: ["update:activeIndex", "change", "reachStart", "reachEnd", "loadMore"],
-  setup(n, { expose: _, emit: H }) {
-    const e = n, I = H, m = P(), w = P(0), u = P(0);
-    let L, N = -1, R, C;
-    const E = P(!1), { getItemKey: M } = xe({
+  setup(o, { expose: X, emit: K }) {
+    const e = o, $ = K, f = N(), M = N(0), s = N(0);
+    let B, G = -1, F, U, _ = !1;
+    const p = N(!1), { getItemKey: k } = $e({
       componentName: "VirtualCarousel",
       items: () => e.items,
       itemKey: () => e.itemKey
-    }), z = i(
+    }), S = i(() => Math.max(0, M.value)), I = i(() => {
+      if (!e.responsive || e.responsive.length === 0)
+        return {
+          slidesPerView: e.slidesPerView,
+          slidesToScroll: e.slidesToScroll,
+          gap: e.gap
+        };
+      const t = S.value, a = [...e.responsive].sort(
+        (v, V) => V.breakpoint - v.breakpoint
+      );
+      for (const v of a)
+        if (t >= v.breakpoint)
+          return {
+            slidesPerView: v.slidesPerView ?? e.slidesPerView,
+            slidesToScroll: v.slidesToScroll ?? e.slidesToScroll,
+            gap: v.gap ?? e.gap
+          };
+      return {
+        slidesPerView: e.slidesPerView,
+        slidesToScroll: e.slidesToScroll,
+        gap: e.gap
+      };
+    }), A = i(
       () => Math.max(
         1,
         Math.floor(
-          Number.isFinite(e.slidesPerView) ? e.slidesPerView : 1
+          Number.isFinite(I.value.slidesPerView) ? I.value.slidesPerView : 1
         )
       )
-    ), T = i(
+    ), W = i(
       () => Math.max(
         1,
         Math.floor(
-          Number.isFinite(e.slidesToScroll) ? e.slidesToScroll : 1
+          Number.isFinite(I.value.slidesToScroll) ? I.value.slidesToScroll : 1
         )
       )
-    ), $ = i(
-      () => Math.max(0, Number.isFinite(e.gap) ? e.gap : 0)
-    ), F = i(
+    ), Z = i(
+      () => Math.max(0, Number.isFinite(I.value.gap) ? I.value.gap : 0)
+    ), te = i(
       () => Math.max(
         0,
         Math.floor(Number.isFinite(e.buffer) ? e.buffer : 0)
@@ -896,239 +913,250 @@ const Re = ["aria-label"], Pe = ["aria-posinset", "aria-setsize"], Le = /* @__PU
           Number.isFinite(e.loadMoreThreshold) ? e.loadMoreThreshold : 0
         )
       )
-    ), J = i(() => Number.isFinite(e.autoplayDelay) ? Math.max(1, e.autoplayDelay) : 3e3), ae = i(() => Math.max(0, w.value)), V = i(() => {
-      if (ae.value <= 0) return 0;
-      const s = (z.value - 1) * $.value;
+    ), H = i(() => Number.isFinite(e.autoplayDelay) ? Math.max(1, e.autoplayDelay) : 3e3), q = i(() => {
+      if (S.value <= 0) return 0;
+      const t = (A.value - 1) * Z.value;
       return Math.max(
         1,
-        (ae.value - s) / z.value
+        (S.value - t) / A.value
       );
-    }), x = i(() => V.value + $.value), j = i(
+    }), O = i(() => q.value + Z.value), J = i(
       () => Math.max(
         0,
-        e.items.length - z.value
+        e.items.length - A.value
       )
-    ), q = i(
-      () => Math.max(0, u.value - F.value)
-    ), Q = i(
+    ), le = i(
+      () => Math.max(0, s.value - te.value)
+    ), ue = i(
       () => Math.min(
         e.items.length,
-        u.value + z.value + F.value
+        s.value + A.value + te.value
       )
-    ), U = i(
-      () => e.items.slice(q.value, Q.value).map((s, t) => ({
-        item: s,
-        index: q.value + t
+    ), j = i(
+      () => e.items.slice(le.value, ue.value).map((t, a) => ({
+        item: t,
+        index: le.value + a
       }))
-    ), ue = i(() => e.items.length === 0 ? 0 : e.items.length * V.value + (e.items.length - 1) * $.value), O = i(
-      () => q.value * x.value
-    ), c = i(
+    ), m = i(() => e.items.length === 0 ? 0 : e.items.length * q.value + (e.items.length - 1) * Z.value), g = i(
+      () => le.value * O.value
+    ), C = i(
       () => Math.max(
         0,
-        ue.value - Q.value * x.value
+        m.value - ue.value * O.value
       )
-    ), g = i(() => ({
-      height: we(e.height)
+    ), se = i(() => ({
+      height: Be(e.height)
     }));
-    function B(s) {
+    function ae(t) {
       return Math.min(
-        j.value,
-        Math.max(0, Math.floor(Number.isFinite(s) ? s : 0))
+        J.value,
+        Math.max(0, Math.floor(Number.isFinite(t) ? t : 0))
       );
     }
-    u.value = B(e.activeIndex);
-    function oe(s) {
-      return s >= u.value && s < Math.min(
+    s.value = ae(e.activeIndex);
+    function fe(t) {
+      return t >= s.value && t < Math.min(
         e.items.length,
-        u.value + z.value
+        s.value + A.value
       );
     }
-    function ne() {
-      if (!e.hasMore || e.loading || N === e.items.length)
+    function oe() {
+      if (!e.hasMore || e.loading || G === e.items.length)
         return;
-      const s = e.items.length === 0 ? -1 : Math.min(
+      const t = e.items.length === 0 ? -1 : Math.min(
         e.items.length - 1,
-        u.value + z.value - 1
+        s.value + A.value - 1
       );
-      e.items.length - 1 - s <= Y.value && (N = e.items.length, I("loadMore"));
-    }
-    function se(s) {
-      const t = B(s);
-      t === u.value || e.items.length === 0 || (u.value = t, I("update:activeIndex", t), I("change", {
-        index: t,
-        item: e.items[t]
-      }), t === 0 && I("reachStart"), t === j.value && I("reachEnd"), ne(), e.autoplay && !E.value && h());
-    }
-    function X(s, t = {}) {
-      const a = m.value;
-      a && (typeof a.scrollTo == "function" ? a.scrollTo({ ...t, left: s }) : a.scrollLeft = s);
-    }
-    function ie(s, t = {}) {
-      if (e.items.length === 0 || x.value <= 0) return;
-      const a = B(s), l = Math.abs(a - u.value), y = t.behavior === "smooth" && l > F.value ? "auto" : t.behavior;
-      C = y === "smooth" ? a : void 0, se(a), X(a * x.value, {
-        ...t,
-        behavior: y
+      e.items.length - 1 - t <= Y.value && (G = e.items.length, $("loadMore"));
+    }
+    function ie(t) {
+      const a = ae(t);
+      a === s.value || e.items.length === 0 || (s.value = a, $("update:activeIndex", a), $("change", {
+        index: a,
+        item: e.items[a]
+      }), a === 0 && $("reachStart"), a === J.value && $("reachEnd"), oe(), e.autoplay && !p.value && l());
+    }
+    function re(t, a = {}) {
+      const v = f.value;
+      v && (typeof v.scrollTo == "function" ? v.scrollTo({ ...a, left: t }) : v.scrollLeft = t);
+    }
+    function de(t, a = {}) {
+      if (e.items.length === 0 || O.value <= 0) return;
+      const v = ae(t);
+      U = a.behavior === "smooth" ? v : void 0, ie(v), re(v * O.value, {
+        ...a,
+        behavior: a.behavior
       });
     }
-    function ee(s = "smooth") {
-      ie(
-        u.value + T.value,
-        { behavior: s }
+    function h(t = "smooth") {
+      de(
+        s.value + W.value,
+        { behavior: t }
       );
     }
-    function de(s = "smooth") {
-      ie(
-        u.value - T.value,
-        { behavior: s }
+    function z(t = "smooth") {
+      de(
+        s.value - W.value,
+        { behavior: t }
       );
     }
-    function h() {
-      v(), !(!e.autoplay || e.items.length === 0) && (R = setTimeout(() => {
-        u.value >= j.value ? e.autoplayLoop ? ie(0, { behavior: "smooth" }) : v() : ee("smooth");
-      }, J.value));
+    function l() {
+      u(), !(!e.autoplay || e.items.length === 0) && (F = setTimeout(() => {
+        s.value >= J.value ? e.autoplayLoop ? de(0, { behavior: "smooth" }) : u() : h("smooth");
+      }, H.value));
     }
-    function v() {
-      R !== void 0 && (clearTimeout(R), R = void 0);
+    function u() {
+      F !== void 0 && (clearTimeout(F), F = void 0);
     }
-    function o() {
-      E.value = !0, e.pauseOnHover && v();
+    function c() {
+      p.value = !0, e.pauseOnHover && u();
     }
-    function d() {
-      E.value = !1, e.autoplay && h();
+    function E() {
+      p.value = !1, e.autoplay && l();
     }
-    function r() {
-      C = void 0;
+    function P() {
+      U = void 0;
     }
-    function K(s) {
-      if (x.value <= 0) return;
-      const t = s.currentTarget.scrollLeft;
-      if (C !== void 0) {
-        const a = C * x.value;
-        if (Math.abs(t - a) > 1) return;
-        C = void 0;
+    function b(t) {
+      if (O.value <= 0 || _) return;
+      const a = t.currentTarget.scrollLeft;
+      if (U !== void 0) {
+        const v = U * O.value;
+        if (Math.abs(a - v) > 1) return;
+        U = void 0;
       }
-      se(Math.round(t / x.value));
+      ie(Math.round(a / O.value));
     }
-    function D(s) {
-      s.key === "ArrowRight" || s.key === "PageDown" ? (s.preventDefault(), ee()) : s.key === "ArrowLeft" || s.key === "PageUp" ? (s.preventDefault(), de()) : s.key === "Home" ? (s.preventDefault(), ie(0, { behavior: "smooth" })) : s.key === "End" && (s.preventDefault(), ie(j.value, { behavior: "auto" }));
+    function L(t) {
+      t.key === "ArrowRight" || t.key === "PageDown" ? (t.preventDefault(), h()) : t.key === "ArrowLeft" || t.key === "PageUp" ? (t.preventDefault(), z()) : t.key === "Home" ? (t.preventDefault(), de(0, { behavior: "smooth" })) : t.key === "End" && (t.preventDefault(), de(J.value, { behavior: "auto" }));
     }
-    function W() {
-      var t;
-      const s = ((t = m.value) == null ? void 0 : t.clientWidth) ?? 0;
-      s <= 0 || s === w.value || (w.value = s, k(() => {
-        X(u.value * x.value);
+    function n() {
+      var a;
+      const t = ((a = f.value) == null ? void 0 : a.clientWidth) ?? 0;
+      t <= 0 || t === M.value || (_ = !0, M.value = t, R(() => {
+        const v = ae(s.value);
+        re(v * O.value), _ = !1;
       }));
     }
-    return Z(
+    return ee(
       () => e.activeIndex,
-      async (s) => {
-        const t = B(s);
-        t !== u.value && (r(), u.value = t, await k(), X(t * x.value), ne());
+      async (t) => {
+        const a = ae(t);
+        a !== s.value && (P(), s.value = a, await R(), re(a * O.value), oe());
       }
-    ), Z(
+    ), ee(
       () => [
         e.items.length,
-        e.slidesPerView,
-        e.gap
+        I.value.slidesPerView,
+        I.value.gap,
+        I.value.slidesToScroll
       ],
       async () => {
-        const s = B(u.value);
-        e.items.length === 0 ? u.value !== 0 && (u.value = 0, I("update:activeIndex", 0)) : se(s), await k(), X(s * x.value), ne(), e.autoplay && e.items.length > 0 && !E.value && h();
+        const t = ae(s.value);
+        e.items.length === 0 ? s.value !== 0 && (s.value = 0, $("update:activeIndex", 0)) : ie(t), await R(), re(t * O.value), oe(), e.autoplay && e.items.length > 0 && !p.value && l();
       }
-    ), Z(
+    ), ee(
+      () => e.responsive,
+      () => {
+        R(() => {
+          const t = ae(s.value);
+          re(t * O.value);
+        });
+      },
+      { deep: !0 }
+    ), ee(
       () => [
         e.hasMore,
         e.loading,
         e.loadMoreThreshold
       ],
-      async ([s]) => {
-        s || (N = -1), await k(), ne();
+      async ([t]) => {
+        t || (G = -1), await R(), oe();
       }
-    ), Z(
+    ), ee(
       () => e.autoplay,
-      (s) => {
-        s && !E.value ? h() : v();
+      (t) => {
+        t && !p.value ? l() : u();
       }
-    ), Z(
+    ), ee(
       () => e.autoplayDelay,
       () => {
-        e.autoplay && !E.value && h();
+        e.autoplay && !p.value && l();
       }
-    ), Z(
+    ), ee(
       () => e.autoplayLoop,
-      (s) => {
-        !e.autoplay || E.value || (!s && u.value >= j.value ? v() : h());
+      (t) => {
+        !e.autoplay || p.value || (!t && s.value >= J.value ? u() : l());
       }
-    ), Z(
+    ), ee(
       () => e.pauseOnHover,
-      (s) => {
-        s && E.value ? v() : !s && e.autoplay && h();
+      (t) => {
+        t && p.value ? u() : !t && e.autoplay && l();
       }
-    ), pe(async () => {
-      W(), typeof ResizeObserver < "u" && m.value && (L = new ResizeObserver(W), L.observe(m.value)), await k(), X(u.value * x.value), ne(), e.autoplay && h();
-    }), ye(() => {
-      L == null || L.disconnect(), v();
-    }), _({
-      next: ee,
-      previous: de,
-      scrollToIndex: ie,
-      startAutoplay: h,
-      stopAutoplay: v
-    }), (s, t) => (b(), S("div", {
+    ), Se(async () => {
+      n(), typeof ResizeObserver < "u" && f.value && (B = new ResizeObserver(n), B.observe(f.value)), await R(), re(s.value * O.value), oe(), e.autoplay && l();
+    }), Ie(() => {
+      B && (B.disconnect(), B = void 0), u();
+    }), X({
+      next: h,
+      previous: z,
+      scrollToIndex: de,
+      startAutoplay: l,
+      stopAutoplay: u
+    }), (t, a) => (x(), T("div", {
       ref_key: "viewport",
-      ref: m,
+      ref: f,
       class: "vue-virtual-carousel",
-      style: A(g.value),
+      style: D(se.value),
       role: "region",
       "aria-roledescription": "carousel",
-      "aria-label": n.ariaLabel,
+      "aria-label": o.ariaLabel,
       tabindex: "0",
-      onScrollPassive: K,
-      onPointerdown: r,
-      onWheelPassive: r,
-      onKeydown: D,
-      onMouseenter: o,
-      onMouseleave: d
+      onScrollPassive: b,
+      onPointerdown: P,
+      onWheelPassive: P,
+      onKeydown: L,
+      onMouseenter: c,
+      onMouseleave: E
     }, [
-      n.items.length ? (b(), S("div", _e, [
-        O.value > 0 ? (b(), S("div", {
+      o.items.length ? (x(), T("div", Xe, [
+        g.value > 0 ? (x(), T("div", {
           key: 0,
           class: "vue-virtual-carousel__spacer",
-          style: A({ flexBasis: `${O.value}px` }),
+          style: D({ flexBasis: `${g.value}px` }),
           "aria-hidden": "true"
-        }, null, 4)) : he("", !0),
-        (b(!0), S(me, null, Me(U.value, ({ item: a, index: l }) => (b(), S("div", {
-          key: f(M)(a, l),
+        }, null, 4)) : me("", !0),
+        (x(!0), T(we, null, ze(j.value, ({ item: v, index: V }) => (x(), T("div", {
+          key: r(k)(v, V),
           class: "vue-virtual-carousel__item",
-          style: A({
-            flexBasis: `${V.value}px`,
-            marginRight: l < n.items.length - 1 ? `${$.value}px` : "0px"
+          style: D({
+            flexBasis: `${q.value}px`,
+            marginRight: V < o.items.length - 1 ? `${Z.value}px` : "0px"
           }),
           role: "listitem",
           "aria-roledescription": "slide",
-          "aria-label": `${l + 1} of ${n.items.length}`,
-          "aria-current": l === u.value ? "true" : void 0
+          "aria-label": `${V + 1} of ${o.items.length}`,
+          "aria-current": V === s.value ? "true" : void 0
         }, [
-          le(s.$slots, "default", {
-            item: a,
-            index: l,
-            active: l === u.value,
-            visible: oe(l)
+          ne(t.$slots, "default", {
+            item: v,
+            index: V,
+            active: V === s.value,
+            visible: fe(V)
           })
-        ], 12, Ue))), 128)),
-        c.value > 0 ? (b(), S("div", {
+        ], 12, et))), 128)),
+        C.value > 0 ? (x(), T("div", {
           key: 1,
           class: "vue-virtual-carousel__spacer",
-          style: A({ flexBasis: `${c.value}px` }),
+          style: D({ flexBasis: `${C.value}px` }),
           "aria-hidden": "true"
-        }, null, 4)) : he("", !0)
-      ])) : (b(), S("div", je, [
-        le(s.$slots, "empty")
+        }, null, 4)) : me("", !0)
+      ])) : (x(), T("div", tt, [
+        ne(t.$slots, "empty")
       ]))
-    ], 44, We));
+    ], 44, Qe));
   }
-}), qe = ["aria-label"], Ge = ["aria-posinset", "aria-setsize"], Je = /* @__PURE__ */ ge({
+}), at = ["aria-label"], ot = ["aria-posinset", "aria-setsize"], nt = /* @__PURE__ */ be({
   name: "VirtualScroll",
   __name: "VirtualScroll",
   props: {
@@ -1147,210 +1175,210 @@ const Re = ["aria-label"], Pe = ["aria-posinset", "aria-setsize"], Le = /* @__PU
     pullRefreshThreshold: { default: 64 }
   },
   emits: ["scroll", "loadMore", "refresh"],
-  setup(n, { expose: _, emit: H }) {
-    const e = n, I = H, {
-      pulling: m,
-      pullDistance: w,
-      pullOffset: u,
-      pullProgress: L,
-      refreshMessage: N,
-      refreshThreshold: R,
-      handleTouchStart: C,
-      handleTouchMove: E,
-      handleTouchEnd: M,
-      handleTouchCancel: z
-    } = He({
+  setup(o, { expose: X, emit: K }) {
+    const e = o, $ = K, {
+      pulling: f,
+      pullDistance: M,
+      pullOffset: s,
+      pullProgress: B,
+      refreshMessage: G,
+      refreshThreshold: F,
+      handleTouchStart: U,
+      handleTouchMove: _,
+      handleTouchEnd: p,
+      handleTouchCancel: k
+    } = Oe({
       enabled: () => e.pullToRefresh,
       refreshing: () => e.refreshing,
       threshold: () => e.pullRefreshThreshold,
-      onRefresh: () => I("refresh")
-    }), T = P(), $ = P(0), F = P(0);
-    let Y, J = -1;
-    const ae = be(), { getItemKey: V } = xe({
+      onRefresh: () => $("refresh")
+    }), S = N(), I = N(0), A = N(0);
+    let W, Z = -1;
+    const te = Re(), { getItemKey: Y } = $e({
       componentName: "VirtualScroll",
       items: () => e.items,
       itemKey: () => e.itemKey
-    }), x = i(() => Math.max(1, e.itemSize)), j = i(() => Math.max(0, Math.floor(e.overscan))), q = i(
-      () => e.items.length * x.value
-    ), Q = i(
-      () => Math.max(1, e.loadingItemSize ?? x.value)
-    ), U = i(
-      () => q.value + (e.loading ? Q.value : 0)
-    ), ue = i(() => F.value > 0 ? F.value : typeof e.height == "number" ? e.height : 0), O = i(
+    }), H = i(() => Math.max(1, e.itemSize)), q = i(() => Math.max(0, Math.floor(e.overscan))), O = i(
+      () => e.items.length * H.value
+    ), J = i(
+      () => Math.max(1, e.loadingItemSize ?? H.value)
+    ), le = i(
+      () => O.value + (e.loading ? J.value : 0)
+    ), ue = i(() => A.value > 0 ? A.value : typeof e.height == "number" ? e.height : 0), j = i(
       () => Math.max(
         0,
-        Math.floor($.value / x.value) - j.value
+        Math.floor(I.value / H.value) - q.value
       )
-    ), c = i(() => {
+    ), m = i(() => {
       const h = Math.ceil(
-        ($.value + ue.value) / x.value
+        (I.value + ue.value) / H.value
       );
       return Math.min(
         e.items.length,
-        h + j.value
+        h + q.value
       );
     }), g = i(
-      () => e.items.slice(O.value, c.value).map((h, v) => ({
+      () => e.items.slice(j.value, m.value).map((h, z) => ({
         item: h,
-        index: O.value + v
+        index: j.value + z
       }))
-    ), B = i(() => ({
-      height: we(e.height)
-    })), oe = i(() => ({
-      transform: `translateY(${O.value * x.value}px)`
+    ), C = i(() => ({
+      height: Be(e.height)
+    })), se = i(() => ({
+      transform: `translateY(${j.value * H.value}px)`
     }));
-    function ne() {
+    function ae() {
       var h;
-      F.value = ((h = T.value) == null ? void 0 : h.clientHeight) ?? 0, ae(T.value, e.height), k(X);
-    }
-    function se(h) {
-      $.value = h.currentTarget.scrollTop, I("scroll", {
-        scrollTop: $.value,
-        startIndex: O.value,
-        endIndex: c.value
-      }), X();
-    }
-    function X() {
-      const h = T.value;
-      if (!h || !e.hasMore || e.loading || J === e.items.length)
+      A.value = ((h = S.value) == null ? void 0 : h.clientHeight) ?? 0, te(S.value, e.height), R(oe);
+    }
+    function fe(h) {
+      I.value = h.currentTarget.scrollTop, $("scroll", {
+        scrollTop: I.value,
+        startIndex: j.value,
+        endIndex: m.value
+      }), oe();
+    }
+    function oe() {
+      const h = S.value;
+      if (!h || !e.hasMore || e.loading || Z === e.items.length)
         return;
-      const v = Math.max(0, e.loadMoreThreshold);
-      U.value - h.scrollTop - h.clientHeight <= v && (J = e.items.length, I("loadMore"));
+      const z = Math.max(0, e.loadMoreThreshold);
+      le.value - h.scrollTop - h.clientHeight <= z && (Z = e.items.length, $("loadMore"));
     }
-    function ie(h, v = {}) {
-      const o = T.value;
-      if (!o) return;
-      const d = Math.max(0, U.value - o.clientHeight), r = Math.min(
+    function ie(h, z = {}) {
+      const l = S.value;
+      if (!l) return;
+      const u = Math.max(0, le.value - l.clientHeight), c = Math.min(
         Math.max(0, Number.isFinite(h) ? h : 0),
-        d
-      ), K = v.behavior ?? "auto";
-      K === "auto" && ($.value = r), o.scrollTo({ ...v, top: r, behavior: K });
+        u
+      ), E = z.behavior ?? "auto";
+      E === "auto" && (I.value = c), l.scrollTo({ ...z, top: c, behavior: E });
     }
-    function ee(h, v = {}) {
-      const o = T.value;
-      if (!o || e.items.length === 0) return;
-      const d = Math.min(
+    function re(h, z = {}) {
+      const l = S.value;
+      if (!l || e.items.length === 0) return;
+      const u = Math.min(
         e.items.length - 1,
         Math.max(0, Math.floor(h))
-      ), { align: r = "start", ...K } = v;
-      let D = d * x.value;
-      r === "center" ? D -= (o.clientHeight - x.value) / 2 : r === "end" && (D -= o.clientHeight - x.value), o.scrollTo({
-        ...K,
-        top: Math.max(0, Math.min(D, U.value - o.clientHeight))
+      ), { align: c = "start", ...E } = z;
+      let P = u * H.value;
+      c === "center" ? P -= (l.clientHeight - H.value) / 2 : c === "end" && (P -= l.clientHeight - H.value), l.scrollTo({
+        ...E,
+        top: Math.max(0, Math.min(P, le.value - l.clientHeight))
       });
     }
     function de(h = "auto") {
-      var v;
-      (v = T.value) == null || v.scrollTo({ top: 0, behavior: h });
+      var z;
+      (z = S.value) == null || z.scrollTo({ top: 0, behavior: h });
     }
-    return Z(
+    return ee(
       () => [e.items.length, e.itemSize],
       async () => {
-        await k();
-        const h = T.value;
+        await R();
+        const h = S.value;
         if (!h) return;
-        const v = Math.max(0, U.value - h.clientHeight);
-        h.scrollTop > v && (h.scrollTop = v, $.value = v), X();
+        const z = Math.max(0, le.value - h.clientHeight);
+        h.scrollTop > z && (h.scrollTop = z, I.value = z), oe();
       }
-    ), Z(
+    ), ee(
       () => [e.hasMore, e.loading],
       async ([h]) => {
-        h || (J = -1), await k(), X();
+        h || (Z = -1), await R(), oe();
       }
-    ), pe(() => {
-      ne(), typeof ResizeObserver < "u" && T.value && (Y = new ResizeObserver(ne), Y.observe(T.value)), k(X);
-    }), ye(() => {
-      Y == null || Y.disconnect();
-    }), _({
+    ), Se(() => {
+      ae(), typeof ResizeObserver < "u" && S.value && (W = new ResizeObserver(ae), W.observe(S.value)), R(oe);
+    }), Ie(() => {
+      W && (W.disconnect(), W = void 0);
+    }), X({
       scrollTo: ie,
-      scrollToIndex: ee,
+      scrollToIndex: re,
       scrollToTop: de
-    }), (h, v) => (b(), S("div", {
+    }), (h, z) => (x(), T("div", {
       ref_key: "viewport",
-      ref: T,
-      class: $e(["vue-virtual-scroll", { "vue-virtual-scroll--pulling": f(m) }]),
-      style: A(B.value),
+      ref: S,
+      class: Ee(["vue-virtual-scroll", { "vue-virtual-scroll--pulling": r(f) }]),
+      style: D(C.value),
       role: "list",
-      "aria-label": n.ariaLabel,
+      "aria-label": o.ariaLabel,
       tabindex: "0",
-      onScrollPassive: se,
-      onTouchstartPassive: v[0] || (v[0] = //@ts-ignore
-      (...o) => f(C) && f(C)(...o)),
-      onTouchmove: v[1] || (v[1] = //@ts-ignore
-      (...o) => f(E) && f(E)(...o)),
-      onTouchend: v[2] || (v[2] = //@ts-ignore
-      (...o) => f(M) && f(M)(...o)),
-      onTouchcancel: v[3] || (v[3] = //@ts-ignore
-      (...o) => f(z) && f(z)(...o))
+      onScrollPassive: fe,
+      onTouchstartPassive: z[0] || (z[0] = //@ts-ignore
+      (...l) => r(U) && r(U)(...l)),
+      onTouchmove: z[1] || (z[1] = //@ts-ignore
+      (...l) => r(_) && r(_)(...l)),
+      onTouchend: z[2] || (z[2] = //@ts-ignore
+      (...l) => r(p) && r(p)(...l)),
+      onTouchcancel: z[3] || (z[3] = //@ts-ignore
+      (...l) => r(k) && r(k)(...l))
     }, [
-      n.pullToRefresh || n.refreshing ? (b(), S("div", {
+      o.pullToRefresh || o.refreshing ? (x(), T("div", {
         key: 0,
         class: "vue-virtual-scroll__refresh",
-        style: A({
-          height: `${f(R)}px`,
-          transform: `translateY(${f(u) - f(R)}px)`
+        style: D({
+          height: `${r(F)}px`,
+          transform: `translateY(${r(s) - r(F)}px)`
         }),
         role: "status",
         "aria-live": "polite"
       }, [
-        le(h.$slots, "refresh", {
-          pullDistance: f(w),
-          progress: f(L),
-          refreshing: n.refreshing
+        ne(h.$slots, "refresh", {
+          pullDistance: r(M),
+          progress: r(B),
+          refreshing: o.refreshing
         }, () => [
-          ve(ke(f(N)), 1)
+          Me(Le(r(G)), 1)
         ])
-      ], 4)) : he("", !0),
-      n.items.length || n.loading ? (b(), S("div", {
+      ], 4)) : me("", !0),
+      o.items.length || o.loading ? (x(), T("div", {
         key: 1,
         class: "vue-virtual-scroll__spacer",
-        style: A({
-          height: `${U.value}px`,
-          transform: `translateY(${f(u)}px)`
+        style: D({
+          height: `${le.value}px`,
+          transform: `translateY(${r(s)}px)`
         })
       }, [
-        Be("div", {
+        De("div", {
           class: "vue-virtual-scroll__content",
-          style: A(oe.value)
+          style: D(se.value)
         }, [
-          (b(!0), S(me, null, Me(g.value, ({ item: o, index: d }) => (b(), S("div", {
-            key: f(V)(o, d),
+          (x(!0), T(we, null, ze(g.value, ({ item: l, index: u }) => (x(), T("div", {
+            key: r(Y)(l, u),
             class: "vue-virtual-scroll__item",
-            style: A({ height: `${x.value}px` }),
+            style: D({ height: `${H.value}px` }),
             role: "listitem",
-            "aria-posinset": d + 1,
-            "aria-setsize": n.items.length
+            "aria-posinset": u + 1,
+            "aria-setsize": o.items.length
           }, [
-            le(h.$slots, "default", {
-              item: o,
-              index: d
+            ne(h.$slots, "default", {
+              item: l,
+              index: u
             })
-          ], 12, Ge))), 128))
+          ], 12, ot))), 128))
         ], 4),
-        n.loading ? (b(), S("div", {
+        o.loading ? (x(), T("div", {
           key: 0,
           class: "vue-virtual-scroll__loading",
-          style: A({
-            height: `${Q.value}px`,
-            transform: `translateY(${q.value}px)`
+          style: D({
+            height: `${J.value}px`,
+            transform: `translateY(${O.value}px)`
           }),
           role: "status",
           "aria-live": "polite"
         }, [
-          le(h.$slots, "loading", {}, () => [
-            v[4] || (v[4] = ve("Loading more…", -1))
+          ne(h.$slots, "loading", {}, () => [
+            z[4] || (z[4] = Me("Loading more…", -1))
           ])
-        ], 4)) : he("", !0)
-      ], 4)) : (b(), S("div", {
+        ], 4)) : me("", !0)
+      ], 4)) : (x(), T("div", {
         key: 2,
         class: "vue-virtual-scroll__empty",
-        style: A({ transform: `translateY(${f(u)}px)` })
+        style: D({ transform: `translateY(${r(s)}px)` })
       }, [
-        le(h.$slots, "empty")
+        ne(h.$slots, "empty")
       ], 4))
-    ], 46, qe));
+    ], 46, at));
   }
-}), Qe = ["aria-label"], Xe = ["aria-posinset", "aria-setsize"], et = /* @__PURE__ */ ge({
+}), it = ["aria-label"], st = ["aria-posinset", "aria-setsize"], rt = /* @__PURE__ */ be({
   name: "WindowDynamicVirtualScroll",
   __name: "WindowDynamicVirtualScroll",
   props: {
@@ -1368,313 +1396,603 @@ const Re = ["aria-label"], Pe = ["aria-posinset", "aria-setsize"], Le = /* @__PU
     pullRefreshThreshold: { default: 64 }
   },
   emits: ["scroll", "loadMore", "refresh"],
-  setup(n, { expose: _, emit: H }) {
-    const e = n, I = H, m = P(), w = P(0), u = P(0), L = P(0), N = P(0), R = /* @__PURE__ */ new Map(), C = /* @__PURE__ */ new Map();
-    let E, M, z = -1;
-    const { getItemKey: T } = xe({
+  setup(o, { expose: X, emit: K }) {
+    const e = o, $ = K, f = N(), M = N(0), s = N(0), B = N(0), G = N(0), F = /* @__PURE__ */ new Map(), U = /* @__PURE__ */ new Map(), _ = /* @__PURE__ */ new Map();
+    let p, k, S, I, A = !1, W = !1, Z = -1;
+    const { getItemKey: te } = $e({
       componentName: "WindowDynamicVirtualScroll",
       items: () => e.items,
       itemKey: () => e.itemKey
-    }), {
-      pulling: $,
-      pullDistance: F,
-      pullOffset: Y,
-      pullProgress: J,
-      refreshMessage: ae,
-      refreshThreshold: V,
-      handleTouchStart: x,
-      handleTouchMove: j,
-      handleTouchEnd: q,
-      handleTouchCancel: Q
-    } = He({
+    });
+    function Y(d) {
+      return typeof window.requestAnimationFrame == "function" ? {
+        id: window.requestAnimationFrame(d),
+        type: "animation"
+      } : {
+        id: window.setTimeout(d, 0),
+        type: "timeout"
+      };
+    }
+    function H(d) {
+      d && (d.type === "animation" ? window.cancelAnimationFrame(d.id) : window.clearTimeout(d.id));
+    }
+    const {
+      pulling: q,
+      pullDistance: O,
+      pullOffset: J,
+      pullProgress: le,
+      refreshMessage: ue,
+      refreshThreshold: j,
+      handleTouchStart: m,
+      handleTouchMove: g,
+      handleTouchEnd: C,
+      handleTouchCancel: se
+    } = Oe({
       enabled: () => e.pullToRefresh,
       refreshing: () => e.refreshing,
       threshold: () => e.pullRefreshThreshold,
-      onRefresh: () => I("refresh"),
+      onRefresh: () => $("refresh"),
       scrollTop: () => typeof window > "u" ? 0 : Math.max(0, window.scrollY)
-    }), U = i(
+    }), ae = i(
       () => Math.max(1, e.estimatedItemSize)
-    ), ue = i(
-      () => Math.max(1, e.loadingItemSize ?? U.value)
-    ), O = i(() => Math.max(0, Math.floor(e.overscan))), c = i(() => {
-      N.value;
-      const t = new Array(e.items.length + 1), a = new Array(e.items.length);
-      t[0] = 0;
-      for (let l = 0; l < e.items.length; l += 1) {
-        const y = T(e.items[l], l), p = R.get(y) ?? U.value;
-        a[l] = p, t[l + 1] = t[l] + p;
+    ), fe = i(
+      () => Math.max(1, e.loadingItemSize ?? ae.value)
+    ), oe = i(() => Math.max(0, Math.floor(e.overscan))), ie = i(() => {
+      G.value;
+      const d = new Array(e.items.length + 1), w = new Array(e.items.length);
+      d[0] = 0;
+      for (let y = 0; y < e.items.length; y += 1) {
+        const ce = te(e.items[y], y), Q = F.get(ce) ?? ae.value;
+        w[y] = Q, d[y + 1] = d[y] + Q;
       }
       return {
-        offsets: t,
-        sizes: a,
-        total: t[e.items.length] ?? 0
+        offsets: d,
+        sizes: w,
+        total: d[e.items.length] ?? 0
       };
-    }), g = i(
-      () => c.value.total + (e.loading ? ue.value : 0)
-    ), B = i(() => {
-      const t = /* @__PURE__ */ new Map();
-      return e.items.forEach((a, l) => {
-        t.set(T(a, l), l);
-      }), t;
-    }), oe = i(
-      () => Math.max(0, w.value - L.value)
+    }), re = i(
+      () => ie.value.total + (e.loading ? fe.value : 0)
+    ), de = i(() => {
+      const d = /* @__PURE__ */ new Map();
+      return e.items.forEach((w, y) => {
+        d.set(te(w, y), y);
+      }), d;
+    }), h = i(
+      () => Math.max(0, M.value - B.value)
     );
-    function ne(t) {
+    function z(d) {
       if (e.items.length === 0) return 0;
-      const a = c.value.offsets;
-      let l = 0, y = e.items.length;
-      for (; l < y; ) {
-        const p = Math.floor((l + y) / 2);
-        a[p + 1] <= t ? l = p + 1 : y = p;
+      const w = ie.value.offsets;
+      let y = 0, ce = e.items.length;
+      for (; y < ce; ) {
+        const Q = Math.floor((y + ce) / 2);
+        w[Q + 1] <= d ? y = Q + 1 : ce = Q;
       }
-      return Math.min(l, e.items.length - 1);
+      return Math.min(y, e.items.length - 1);
     }
-    const se = i(
+    const l = i(
       () => Math.max(
         0,
-        ne(oe.value) - O.value
+        z(h.value) - oe.value
       )
-    ), X = i(() => {
+    ), u = i(() => {
       if (e.items.length === 0) return 0;
-      const t = w.value + u.value - L.value, a = Math.max(
-        U.value,
-        t
-      ), l = ne(a) + 1;
+      const d = M.value + s.value - B.value, w = Math.max(
+        ae.value,
+        d
+      ), y = z(w) + 1;
       return Math.min(
         e.items.length,
-        l + O.value
+        y + oe.value
       );
-    }), ie = i(
-      () => e.items.slice(se.value, X.value).map((t, a) => {
-        const l = se.value + a;
+    }), c = i(
+      () => e.items.slice(l.value, u.value).map((d, w) => {
+        const y = l.value + w;
         return {
-          item: t,
-          index: l,
-          key: T(t, l),
-          top: c.value.offsets[l]
+          item: d,
+          index: y,
+          key: te(d, y),
+          top: ie.value.offsets[y]
         };
       })
     );
-    function ee() {
-      typeof window > "u" || (w.value = Math.max(0, window.scrollY), u.value = window.innerHeight, m.value && (L.value = m.value.getBoundingClientRect().top + w.value));
-    }
-    function de() {
-      I("scroll", {
-        scrollTop: oe.value,
-        startIndex: se.value,
-        endIndex: X.value
+    function E() {
+      typeof window > "u" || (M.value = Math.max(0, window.scrollY), s.value = window.innerHeight, f.value && (B.value = f.value.getBoundingClientRect().top + M.value));
+    }
+    function P() {
+      $("scroll", {
+        scrollTop: h.value,
+        startIndex: l.value,
+        endIndex: u.value
       });
     }
-    function h() {
-      ee(), de(), v();
+    function b(d = !1) {
+      W && (A || (A = d), !S && (S = Y(() => {
+        S = void 0, E(), A && (A = !1, P()), t();
+      })));
+    }
+    function L() {
+      b(!0);
+    }
+    function n() {
+      b();
     }
-    function v() {
-      if (typeof window > "u" || !e.hasMore || e.loading || z === e.items.length)
+    function t() {
+      if (typeof window > "u" || !e.hasMore || e.loading || Z === e.items.length)
         return;
-      const t = Math.max(0, e.loadMoreThreshold), a = L.value + g.value, l = w.value + u.value;
-      a - l <= t && (z = e.items.length, I("loadMore"));
-    }
-    function o(t) {
-      const a = t.borderBoxSize;
-      if (a) {
-        const l = Array.isArray(a) ? a[0] : a;
-        if (l != null && l.blockSize) return l.blockSize;
+      const d = Math.max(0, e.loadMoreThreshold), w = B.value + re.value, y = M.value + s.value;
+      w - y <= d && (Z = e.items.length, $("loadMore"));
+    }
+    function a(d) {
+      const w = d.borderBoxSize;
+      if (w) {
+        const y = Array.isArray(w) ? w[0] : w;
+        if (y != null && y.blockSize) return y.blockSize;
       }
-      return t.contentRect.height;
-    }
-    function d(t) {
-      const a = c.value;
-      let l = 0, y = !1;
-      for (const p of t) {
-        const te = p.target, G = C.get(te), re = o(p);
-        if (G === void 0 || re <= 0) continue;
-        const ce = R.get(G) ?? U.value;
-        if (Math.abs(ce - re) < 0.5) continue;
-        const fe = B.value.get(G);
-        fe !== void 0 && a.offsets[fe + 1] <= oe.value && (l += re - ce), R.set(G, re), y = !0;
+      return d.contentRect.height;
+    }
+    function v(d) {
+      const w = ie.value;
+      let y = 0, ce = !1;
+      for (const Q of d) {
+        const pe = Q.target, ye = U.get(pe), ke = a(Q);
+        if (ye === void 0 || ke <= 0) continue;
+        const He = F.get(ye) ?? ae.value;
+        if (Math.abs(He - ke) < 0.5) continue;
+        const Ve = de.value.get(ye);
+        Ve !== void 0 && w.offsets[Ve + 1] <= h.value && (y += ke - He), F.set(ye, ke), ce = !0;
       }
-      y && (N.value += 1, k(() => {
-        if (l !== 0 && typeof window < "u") {
-          const p = Math.max(
-            0,
-            w.value + l
-          );
-          w.value = p, window.scrollTo({ top: p, behavior: "auto" });
+      ce && (G.value += 1, R(() => {
+        if (W) {
+          if (y !== 0 && typeof window < "u") {
+            const Q = Math.max(
+              0,
+              M.value + y
+            );
+            M.value = Q, window.scrollTo({ top: Q, behavior: "auto" });
+          }
+          E(), t();
         }
-        ee(), v();
       }));
     }
-    function r(t, a) {
-      t instanceof HTMLElement && (C.set(t, a), M == null || M.observe(t));
+    function V(d) {
+      if (W) {
+        for (const w of d)
+          _.set(w.target, w);
+        I || (I = Y(() => {
+          I = void 0;
+          const w = Array.from(_.values());
+          _.clear(), v(w);
+        }));
+      }
+    }
+    function he(d, w) {
+      d instanceof HTMLElement && (U.set(d, w), k == null || k.observe(d));
     }
-    function K() {
-      for (const [t] of C)
-        t.isConnected || (M == null || M.unobserve(t), C.delete(t));
+    function ve() {
+      for (const [d] of U)
+        d.isConnected || (k == null || k.unobserve(d), U.delete(d));
     }
-    function D(t, a = {}) {
+    function ge(d, w = {}) {
       if (typeof window > "u") return;
-      ee();
-      const l = Math.max(0, g.value - u.value), y = Math.min(
-        Math.max(0, Number.isFinite(t) ? t : 0),
-        l
-      ), p = Math.max(0, L.value + y), te = a.behavior ?? "auto";
-      te === "auto" && (w.value = p), window.scrollTo({ ...a, top: p, behavior: te });
-    }
-    function W(t, a = {}) {
+      E();
+      const y = Math.max(0, re.value - s.value), ce = Math.min(
+        Math.max(0, Number.isFinite(d) ? d : 0),
+        y
+      ), Q = Math.max(0, B.value + ce), pe = w.behavior ?? "auto";
+      pe === "auto" && (M.value = Q), window.scrollTo({ ...w, top: Q, behavior: pe });
+    }
+    function xe(d, w = {}) {
       if (typeof window > "u" || e.items.length === 0) return;
-      ee();
-      const l = Math.min(
+      E();
+      const y = Math.min(
         e.items.length - 1,
-        Math.max(0, Math.floor(t))
-      ), { align: y = "start", ...p } = a, te = c.value.sizes[l];
-      let G = L.value + c.value.offsets[l];
-      y === "center" ? G -= (u.value - te) / 2 : y === "end" && (G -= u.value - te);
-      const re = Math.max(
-        L.value,
-        L.value + g.value - u.value
-      ), ce = Math.max(0, Math.min(G, re)), fe = p.behavior ?? "auto", Se = Math.max(
-        u.value * 3,
-        U.value * 10
-      ), Te = fe === "smooth" && Math.abs(ce - w.value) > Se ? "auto" : fe;
-      Te === "auto" && (w.value = ce), window.scrollTo({
-        ...p,
-        top: ce,
-        behavior: Te
+        Math.max(0, Math.floor(d))
+      ), { align: ce = "start", ...Q } = w, pe = ie.value.sizes[y];
+      let ye = B.value + ie.value.offsets[y];
+      ce === "center" ? ye -= (s.value - pe) / 2 : ce === "end" && (ye -= s.value - pe);
+      const ke = Math.max(
+        B.value,
+        B.value + re.value - s.value
+      ), He = Math.max(0, Math.min(ye, ke)), Ve = Q.behavior ?? "auto";
+      Ve === "auto" && (M.value = He), window.scrollTo({
+        ...Q,
+        top: He,
+        behavior: Ve
       });
     }
-    function s(t = "auto") {
-      typeof window > "u" || (ee(), window.scrollTo({ top: Math.max(0, L.value), behavior: t }));
+    function Te(d = "auto") {
+      typeof window > "u" || (E(), window.scrollTo({ top: Math.max(0, B.value), behavior: d }));
     }
-    return Z(
+    return ee(
       () => e.itemKey,
       () => {
-        R.clear(), N.value += 1;
+        F.clear(), G.value += 1, Z = -1;
       }
-    ), Z(
-      () => e.items.length,
-      async () => {
-        const t = new Set(
-          e.items.map((a, l) => T(a, l))
-        );
-        for (const a of R.keys())
-          t.has(a) || R.delete(a);
-        N.value += 1, await k(), ee(), v();
+    ), ee(
+      () => e.items.map((d, w) => te(d, w)),
+      async (d, w) => {
+        const y = d.length !== w.length || d.some((Q, pe) => Q !== w[pe]), ce = new Set(d);
+        for (const Q of F.keys())
+          ce.has(Q) || F.delete(Q);
+        y && (Z = -1), G.value += 1, await R(), W && (E(), t());
       }
-    ), Z(
+    ), ee(
       () => [e.hasMore, e.loading],
-      async ([t]) => {
-        t || (z = -1), await k(), ee(), v();
+      async ([d]) => {
+        d || (Z = -1), await R(), W && (E(), t());
       }
-    ), pe(() => {
-      if (ee(), window.addEventListener("scroll", h, { passive: !0 }), window.addEventListener("resize", h, { passive: !0 }), typeof ResizeObserver < "u") {
-        E = new ResizeObserver(() => {
-          ee(), v();
-        }), M = new ResizeObserver(d), m.value && E.observe(m.value);
-        for (const [t] of C)
-          M.observe(t);
+    ), Se(() => {
+      if (W = !0, E(), window.addEventListener("scroll", L, { passive: !0 }), window.addEventListener("resize", n, { passive: !0 }), typeof ResizeObserver < "u") {
+        p = new ResizeObserver(() => {
+          b();
+        }), k = new ResizeObserver(V), f.value && p.observe(f.value);
+        for (const [d] of U)
+          k.observe(d);
       }
-      k(v);
-    }), ze(K), ye(() => {
-      window.removeEventListener("scroll", h), window.removeEventListener("resize", h), E == null || E.disconnect(), M == null || M.disconnect(), C.clear();
-    }), _({
-      scrollTo: D,
-      scrollToIndex: W,
-      scrollToTop: s
-    }), (t, a) => (b(), S("div", {
+      R(() => {
+        W && t();
+      });
+    }), Ce(ve), Ie(() => {
+      W = !1, window.removeEventListener("scroll", L), window.removeEventListener("resize", n), H(S), H(I), S = void 0, I = void 0, A = !1, _.clear(), p && (p.disconnect(), p = void 0), k && (k.disconnect(), k = void 0), U.clear();
+    }), X({
+      scrollTo: ge,
+      scrollToIndex: xe,
+      scrollToTop: Te
+    }), (d, w) => (x(), T("div", {
       ref_key: "root",
-      ref: m,
-      class: $e(["vue-window-dynamic-virtual-scroll", { "vue-window-dynamic-virtual-scroll--pulling": f($) }]),
+      ref: f,
+      class: Ee(["vue-window-dynamic-virtual-scroll", { "vue-window-dynamic-virtual-scroll--pulling": r(q) }]),
       role: "list",
-      "aria-label": n.ariaLabel,
-      onTouchstartPassive: a[0] || (a[0] = //@ts-ignore
-      (...l) => f(x) && f(x)(...l)),
-      onTouchmove: a[1] || (a[1] = //@ts-ignore
-      (...l) => f(j) && f(j)(...l)),
-      onTouchend: a[2] || (a[2] = //@ts-ignore
-      (...l) => f(q) && f(q)(...l)),
-      onTouchcancel: a[3] || (a[3] = //@ts-ignore
-      (...l) => f(Q) && f(Q)(...l))
+      "aria-label": o.ariaLabel,
+      onTouchstartPassive: w[0] || (w[0] = //@ts-ignore
+      (...y) => r(m) && r(m)(...y)),
+      onTouchmove: w[1] || (w[1] = //@ts-ignore
+      (...y) => r(g) && r(g)(...y)),
+      onTouchend: w[2] || (w[2] = //@ts-ignore
+      (...y) => r(C) && r(C)(...y)),
+      onTouchcancel: w[3] || (w[3] = //@ts-ignore
+      (...y) => r(se) && r(se)(...y))
     }, [
-      n.pullToRefresh || n.refreshing ? (b(), S("div", {
+      o.pullToRefresh || o.refreshing ? (x(), T("div", {
         key: 0,
         class: "vue-window-dynamic-virtual-scroll__refresh",
-        style: A({
-          height: `${f(V)}px`,
-          transform: `translateY(${f(Y) - f(V)}px)`
+        style: D({
+          height: `${r(j)}px`,
+          transform: `translateY(${r(J) - r(j)}px)`
         }),
         role: "status",
         "aria-live": "polite"
       }, [
-        le(t.$slots, "refresh", {
-          pullDistance: f(F),
-          progress: f(J),
-          refreshing: n.refreshing
+        ne(d.$slots, "refresh", {
+          pullDistance: r(O),
+          progress: r(le),
+          refreshing: o.refreshing
         }, () => [
-          ve(ke(f(ae)), 1)
+          Me(Le(r(ue)), 1)
         ])
-      ], 4)) : he("", !0),
-      n.items.length || n.loading ? (b(), S("div", {
+      ], 4)) : me("", !0),
+      o.items.length || o.loading ? (x(), T("div", {
         key: 1,
         class: "vue-window-dynamic-virtual-scroll__spacer",
-        style: A({
-          height: `${g.value}px`,
-          transform: `translateY(${f(Y)}px)`
+        style: D({
+          height: `${re.value}px`,
+          transform: `translateY(${r(J)}px)`
         })
       }, [
-        (b(!0), S(me, null, Me(ie.value, ({ item: l, index: y, key: p, top: te }) => (b(), S("div", {
-          key: p,
+        (x(!0), T(we, null, ze(c.value, ({ item: y, index: ce, key: Q, top: pe }) => (x(), T("div", {
+          key: Q,
           ref_for: !0,
-          ref: (G) => r(G, p),
+          ref: (ye) => he(ye, Q),
           class: "vue-window-dynamic-virtual-scroll__item",
-          style: A({ transform: `translateY(${te}px)` }),
+          style: D({ transform: `translateY(${pe}px)` }),
           role: "listitem",
-          "aria-posinset": y + 1,
-          "aria-setsize": n.items.length
+          "aria-posinset": ce + 1,
+          "aria-setsize": o.items.length
         }, [
-          le(t.$slots, "default", {
-            item: l,
-            index: y
+          ne(d.$slots, "default", {
+            item: y,
+            index: ce
           })
-        ], 12, Xe))), 128)),
-        n.loading ? (b(), S("div", {
+        ], 12, st))), 128)),
+        o.loading ? (x(), T("div", {
           key: 0,
           class: "vue-window-dynamic-virtual-scroll__loading",
-          style: A({
-            height: `${ue.value}px`,
-            transform: `translateY(${c.value.total}px)`
+          style: D({
+            height: `${fe.value}px`,
+            transform: `translateY(${ie.value.total}px)`
           }),
           role: "status",
           "aria-live": "polite"
         }, [
-          le(t.$slots, "loading", {}, () => [
-            a[4] || (a[4] = ve("Loading more…", -1))
+          ne(d.$slots, "loading", {}, () => [
+            w[4] || (w[4] = Me("Loading more…", -1))
           ])
-        ], 4)) : he("", !0)
-      ], 4)) : (b(), S("div", {
+        ], 4)) : me("", !0)
+      ], 4)) : (x(), T("div", {
         key: 2,
         class: "vue-window-dynamic-virtual-scroll__empty",
-        style: A({ transform: `translateY(${f(Y)}px)` })
+        style: D({ transform: `translateY(${r(J)}px)` })
+      }, [
+        ne(d.$slots, "empty")
+      ], 4))
+    ], 42, it));
+  }
+}), ut = ["aria-label"], ct = ["aria-posinset", "aria-setsize"], dt = /* @__PURE__ */ be({
+  name: "WindowGirdVirtualScroll",
+  __name: "WindowGirdVirtualScroll",
+  props: {
+    items: {},
+    itemSize: {},
+    columns: { default: 2 },
+    gap: { default: 0 },
+    overscan: { default: 1 },
+    itemKey: { default: void 0 },
+    ariaLabel: { default: "Window virtual grid" },
+    hasMore: { type: Boolean, default: !1 },
+    loading: { type: Boolean, default: !1 },
+    loadingItemSize: { default: void 0 },
+    loadMoreThreshold: { default: 200 },
+    pullToRefresh: { type: Boolean, default: !1 },
+    refreshing: { type: Boolean, default: !1 },
+    pullRefreshThreshold: { default: 64 }
+  },
+  emits: ["scroll", "loadMore", "refresh"],
+  setup(o, { expose: X, emit: K }) {
+    const e = o, $ = K, f = N(), M = N(0), s = N(0), B = N(0);
+    let G, F = -1;
+    const { getItemKey: U } = $e({
+      componentName: "WindowGirdVirtualScroll",
+      items: () => e.items,
+      itemKey: () => e.itemKey
+    }), {
+      pulling: _,
+      pullDistance: p,
+      pullOffset: k,
+      pullProgress: S,
+      refreshMessage: I,
+      refreshThreshold: A,
+      handleTouchStart: W,
+      handleTouchMove: Z,
+      handleTouchEnd: te,
+      handleTouchCancel: Y
+    } = Oe({
+      enabled: () => e.pullToRefresh,
+      refreshing: () => e.refreshing,
+      threshold: () => e.pullRefreshThreshold,
+      onRefresh: () => $("refresh"),
+      scrollTop: () => typeof window > "u" ? 0 : Math.max(0, window.scrollY)
+    }), H = i(() => Math.max(1, e.itemSize)), q = i(
+      () => Math.max(1, Math.floor(e.columns))
+    ), O = i(() => Math.max(0, e.gap)), J = i(() => Math.max(0, Math.floor(e.overscan))), le = i(
+      () => Math.max(1, e.loadingItemSize ?? H.value)
+    ), ue = i(
+      () => H.value + O.value
+    ), j = i(
+      () => Math.ceil(e.items.length / q.value)
+    ), m = i(() => j.value === 0 ? 0 : j.value * H.value + (j.value - 1) * O.value), g = i(
+      () => m.value + (e.items.length ? O.value : 0)
+    ), C = i(
+      () => m.value + (e.loading ? le.value + (e.items.length ? O.value : 0) : 0)
+    ), se = i(
+      () => Math.max(0, M.value - B.value)
+    ), ae = i(
+      () => Math.max(
+        0,
+        Math.floor(se.value / ue.value) - J.value
+      )
+    ), fe = i(() => {
+      if (j.value === 0) return 0;
+      const b = Math.max(
+        H.value,
+        M.value + s.value - B.value
+      ), L = Math.ceil(
+        (b + O.value) / ue.value
+      );
+      return Math.min(
+        j.value,
+        L + J.value
+      );
+    }), oe = i(
+      () => Math.min(e.items.length, ae.value * q.value)
+    ), ie = i(
+      () => Math.min(e.items.length, fe.value * q.value)
+    ), re = i(
+      () => e.items.slice(oe.value, ie.value).map((b, L) => {
+        const n = oe.value + L;
+        return {
+          item: b,
+          index: n,
+          key: U(b, n),
+          rowIndex: Math.floor(n / q.value),
+          columnIndex: n % q.value
+        };
+      })
+    ), de = i(() => ({
+      gridTemplateColumns: `repeat(${q.value}, minmax(0, 1fr))`,
+      columnGap: `${O.value}px`,
+      rowGap: `${O.value}px`,
+      transform: `translateY(${ae.value * ue.value}px)`
+    }));
+    function h() {
+      typeof window > "u" || (M.value = Math.max(0, window.scrollY), s.value = window.innerHeight, f.value && (B.value = f.value.getBoundingClientRect().top + M.value));
+    }
+    function z() {
+      $("scroll", {
+        scrollTop: se.value,
+        startIndex: oe.value,
+        endIndex: ie.value
+      });
+    }
+    function l() {
+      h(), z(), u();
+    }
+    function u() {
+      if (typeof window > "u" || !e.hasMore || e.loading || F === e.items.length)
+        return;
+      const b = Math.max(0, e.loadMoreThreshold), L = B.value + C.value, n = M.value + s.value;
+      L - n <= b && (F = e.items.length, $("loadMore"));
+    }
+    function c(b, L = {}) {
+      if (typeof window > "u") return;
+      h();
+      const n = Math.max(0, C.value - s.value), t = Math.min(
+        Math.max(0, Number.isFinite(b) ? b : 0),
+        n
+      ), a = Math.max(0, B.value + t), v = L.behavior ?? "auto";
+      v === "auto" && (M.value = a), window.scrollTo({ ...L, top: a, behavior: v });
+    }
+    function E(b, L = {}) {
+      if (typeof window > "u" || e.items.length === 0) return;
+      h();
+      const n = Math.min(
+        e.items.length - 1,
+        Math.max(0, Math.floor(b))
+      ), t = Math.floor(n / q.value), { align: a = "start", ...v } = L;
+      let V = B.value + t * ue.value;
+      a === "center" ? V -= (s.value - H.value) / 2 : a === "end" && (V -= s.value - H.value);
+      const he = Math.max(
+        B.value,
+        B.value + C.value - s.value
+      ), ve = Math.max(0, Math.min(V, he)), ge = v.behavior ?? "auto";
+      ge === "auto" && (M.value = ve), window.scrollTo({
+        ...v,
+        top: ve,
+        behavior: ge
+      });
+    }
+    function P(b = "auto") {
+      typeof window > "u" || (h(), window.scrollTo({ top: Math.max(0, B.value), behavior: b }));
+    }
+    return ee(
+      () => [
+        e.items.length,
+        e.itemSize,
+        e.columns,
+        e.gap
+      ],
+      async () => {
+        await R(), h(), u();
+      }
+    ), ee(
+      () => [e.hasMore, e.loading],
+      async ([b]) => {
+        b || (F = -1), await R(), h(), u();
+      }
+    ), Se(() => {
+      h(), window.addEventListener("scroll", l, { passive: !0 }), window.addEventListener("resize", l, { passive: !0 }), typeof ResizeObserver < "u" && (G = new ResizeObserver(() => {
+        h(), u();
+      }), f.value && G.observe(f.value)), R(u);
+    }), Ie(() => {
+      window.removeEventListener("scroll", l), window.removeEventListener("resize", l), G && (G.disconnect(), G = void 0);
+    }), X({
+      scrollTo: c,
+      scrollToIndex: E,
+      scrollToTop: P
+    }), (b, L) => (x(), T("div", {
+      ref_key: "root",
+      ref: f,
+      class: Ee(["vue-window-gird-virtual-scroll", { "vue-window-gird-virtual-scroll--pulling": r(_) }]),
+      role: "list",
+      "aria-label": o.ariaLabel,
+      onTouchstartPassive: L[0] || (L[0] = //@ts-ignore
+      (...n) => r(W) && r(W)(...n)),
+      onTouchmove: L[1] || (L[1] = //@ts-ignore
+      (...n) => r(Z) && r(Z)(...n)),
+      onTouchend: L[2] || (L[2] = //@ts-ignore
+      (...n) => r(te) && r(te)(...n)),
+      onTouchcancel: L[3] || (L[3] = //@ts-ignore
+      (...n) => r(Y) && r(Y)(...n))
+    }, [
+      o.pullToRefresh || o.refreshing ? (x(), T("div", {
+        key: 0,
+        class: "vue-window-gird-virtual-scroll__refresh",
+        style: D({
+          height: `${r(A)}px`,
+          transform: `translateY(${r(k) - r(A)}px)`
+        }),
+        role: "status",
+        "aria-live": "polite"
+      }, [
+        ne(b.$slots, "refresh", {
+          pullDistance: r(p),
+          progress: r(S),
+          refreshing: o.refreshing
+        }, () => [
+          Me(Le(r(I)), 1)
+        ])
+      ], 4)) : me("", !0),
+      o.items.length || o.loading ? (x(), T("div", {
+        key: 1,
+        class: "vue-window-gird-virtual-scroll__spacer",
+        style: D({
+          height: `${C.value}px`,
+          transform: `translateY(${r(k)}px)`
+        })
+      }, [
+        De("div", {
+          class: "vue-window-gird-virtual-scroll__content",
+          style: D(de.value)
+        }, [
+          (x(!0), T(we, null, ze(re.value, ({ item: n, index: t, key: a, rowIndex: v, columnIndex: V }) => (x(), T("div", {
+            key: a,
+            class: "vue-window-gird-virtual-scroll__item",
+            style: D({ height: `${H.value}px` }),
+            role: "listitem",
+            "aria-posinset": t + 1,
+            "aria-setsize": o.items.length
+          }, [
+            ne(b.$slots, "default", {
+              item: n,
+              index: t,
+              rowIndex: v,
+              columnIndex: V
+            })
+          ], 12, ct))), 128))
+        ], 4),
+        o.loading ? (x(), T("div", {
+          key: 0,
+          class: "vue-window-gird-virtual-scroll__loading",
+          style: D({
+            height: `${le.value}px`,
+            transform: `translateY(${g.value}px)`
+          }),
+          role: "status",
+          "aria-live": "polite"
+        }, [
+          ne(b.$slots, "loading", {}, () => [
+            L[4] || (L[4] = Me("Loading more…", -1))
+          ])
+        ], 4)) : me("", !0)
+      ], 4)) : (x(), T("div", {
+        key: 2,
+        class: "vue-window-gird-virtual-scroll__empty",
+        style: D({ transform: `translateY(${r(k)}px)` })
       }, [
-        le(t.$slots, "empty")
+        ne(b.$slots, "empty")
       ], 4))
-    ], 42, Qe));
+    ], 42, ut));
   }
-}), tt = Le, at = {
-  install(n) {
-    n.component("ChatVirtualScroll", Ae), n.component("DynamicVirtualScroll", Le), n.component("ShortMediaFeed", Fe), n.component("VirtualCarousel", Ze), n.component("VirtualList", tt), n.component("VirtualScroll", Je), n.component(
+}), vt = Pe, ht = {
+  install(o) {
+    o.component("ChatVirtualScroll", Ge), o.component("DynamicVirtualScroll", Pe), o.component("ShortMediaFeed", Je), o.component("VirtualCarousel", lt), o.component("VirtualList", vt), o.component("VirtualScroll", nt), o.component(
       "WindowDynamicVirtualScroll",
-      et
+      rt
+    ), o.component(
+      "WindowGirdVirtualScroll",
+      dt
     );
   }
 };
 export {
-  Ae as ChatVirtualScroll,
-  Le as DynamicVirtualScroll,
-  Fe as ShortMediaFeed,
-  Ze as VirtualCarousel,
-  tt as VirtualList,
-  Je as VirtualScroll,
-  at as VueVirtualScroll,
-  et as WindowDynamicVirtualScroll,
-  at as default
+  Ge as ChatVirtualScroll,
+  Pe as DynamicVirtualScroll,
+  Je as ShortMediaFeed,
+  lt as VirtualCarousel,
+  vt as VirtualList,
+  nt as VirtualScroll,
+  ht as VueVirtualScroll,
+  rt as WindowDynamicVirtualScroll,
+  dt as WindowGirdVirtualScroll,
+  ht as default
 };